﻿/*Telerik CSS over-rides*/

/*.k-panelbar > .k-panelbar-header > .k-link {*/
/*color: white;*/ /*#ff6358;*/
/*background-color: cornflowerblue;*/ /*#ffffff;*/
/*color: white;*/ /*#ff6358;*/
/*background-color: darkblue;*/ /*#ffffff;*/
/*}*/

/* Overwrite colours as below for all variables: */
/*--kendo-color-primary-subtle
--kendo-color-primary-subtle-hover
--kendo-color-primary-subtle-active
--kendo-color-primary
--kendo-color-primary-hover
--kendo-color-primary-active
--kendo-color-primary-emphasis
--kendo-color-primary-on-subtle
--kendo-color-on-primary
--kendo-color-primary-on-surface*/

:root {
    --background-color: #F7F9FC;
    /*--text-color: #2d2d2d;*/
    --kendo-color-surface: #FCFCFD;
    --kendo-color-on-app-surface: #6c757d;
    /*--section-background-color: #FCFCFD;*/
    --kendo-color-base: #FCFCFD;
    --kendo-color-on-base: #6c757d;
    --kendo-color-primary: #3f80ea;
    --kendo-color-primary-hover: #0056b3;
    --kendo-color-secondary: #495057;
    --kendo-color-secondary-hover: #3E454C;
    --kendo-color-success: #4bbf73;
    --kendo-color-success-hover: #3FA767;
    --kendo-color-error: #d9534f;
    --kendo-color-error-hover: #C04B47;
    --kendo-color-warning: #e5a54b;
    --kendo-color-warning-hover: #CC9343;
    --kendo-color-info: #1FABBA;
    --kendo-color-info-hover: #199FAD;
    --kendo-color-light: #F5F7FA;
    --kendo-color-light-hover: #E2E6EA;
    --kendo-color-dark: #1C2237;
    --kendo-color-dark-hover: #12161F;
    --kendo-button-disabled-bg: #D3D3D3;
    --kendo-button-solid-primary-disabled-bg: #D3D3D3;
    --kendo-button-solid-secondary-disabled-bg: #D3D3D3;
    --kendo-button-solid-info-disabled-bg: #D3D3D3;
    --kendo-button-solid-success-disabled-bg: #D3D3D3;
    --kendo-button-solid-warning-disabled-bg: #D3D3D3;
    --kendo-button-solid-error-disabled-bg: #D3D3D3;
    --kendo-notification-primary-bg: color-mix(in srgb, var(--kendo-color-primary) 25%, #ffffff);
    --kendo-notification-success-bg: color-mix(in srgb, var(--kendo-color-success) 25%, #ffffff);
    --kendo-notification-info-bg: color-mix(in srgb, var(--kendo-color-info) 25%, #ffffff);
    --kendo-notification-warning-bg: color-mix(in srgb, var(--kendo-color-warning) 25%, #ffffff);
    --kendo-notification-error-bg: color-mix(in srgb, var(--kendo-color-error) 25%, #ffffff);
    --kendo-notification-text: var(--kendo-color-secondary);
    --kendo-notification-primary-border: color-mix(in srgb, var(--kendo-color-primary) 45%, transparent);
    --kendo-notification-success-border: color-mix(in srgb, var(--kendo-color-success) 45%, transparent);
    --kendo-notification-info-border: color-mix(in srgb, var(--kendo-color-info) 45%, transparent);
    --kendo-notification-warning-border: color-mix(in srgb, var(--kendo-color-warning) 45%, transparent);
    --kendo-notification-error-border: color-mix(in srgb, var(--kendo-color-error) 45%, transparent);
    --grid-row-odd-bg: #f7f9fc;
    --grid-row-even-bg: #ffff;
    --grid-row-hover-bg: #e7efff;
    --grid-row-selected-bg: #cfe0ff;
    --kendo-font-family: "Poppins", "Segoe UI", "Helvetica Neue", Arial, sans-serif !important;
    /*--color-disabled: #D3D3D3;*/
}

.k-appbar {
    background-color: #283042 !important;
}

.trv-page-container {
    background-color: var(--background-color);
}

.k-pane {
    background-color: var(--background-color);
}

.k-floating-label {
    font-weight: 400 !important;
}

.k-grid a {
    color: var(--bs-link-color);
    text-decoration: underline;
}

    .k-grid a:hover {
        color: var(--bs-link-hover-color);
        text-decoration: underline;
    }

    .k-grid a.gridcolumn-hyperlink {
        color: #3f80ea;
    }

        .k-grid a.gridcolumn-hyperlink:hover {
            color: #3266bb;
            text-decoration: underline;
        }

/* BP050924 should be in a telerik override file */
.k-grid-header {
    font-weight: 700;
}

.k-grid {
    /*  Limites the display width of the grid on mobile, adds scroll bar instead */
    max-width: 100vw;
}

    .k-grid .k-table-tbody > tr.k-master-row:nth-of-type(odd) .k-table-td,
    .k-grid .k-table-tbody > tr.k-master-row.k-alt .k-table-td {
        background-color: var(--grid-row-odd-bg) !important;
    }

    .k-grid .k-table-tbody > tr.k-master-row:nth-of-type(even) .k-table-td {
        background-color: var(--grid-row-even-bg) !important;
    }

    .k-grid .k-table-tbody > tr.k-grouping-row .k-table-td,
    .k-grid .k-table-tbody > tr.k-detail-row .k-table-td {
        background-color: transparent !important;
    }

    .k-grid .k-table-tbody > tr:not(.k-selected):not(.k-grouping-row):not(.k-detail-row):hover > .k-table-td,
    .k-grid .k-table-tbody > tr.k-hover:not(.k-selected):not(.k-grouping-row):not(.k-detail-row) > .k-table-td {
        background-color: var(--grid-row-hover-bg) !important;
    }

    .k-grid .k-table-tbody > tr.k-master-row.k-selected .k-table-td {
        background-color: var(--grid-row-selected-bg) !important;
    }

.k-drawer, .k-panelbar-item, .k-panelbar {
    background-color: var(--background-color);
}

    .k-panelbar > .k-panelbar-header > .k-link {
        background-color: var(--background-color);
    }

/*.k-input-solid:disabled, .k-input-solid[disabled], .k-input-solid.k-disabled {
    color:color-mix(in srgb, var(--kendo-color-on-app-surface, rgb(0 0 0)) 40%, transparent);
}*/

.k-grid .k-table-tbody > tr.k-master-row.k-highlighted > .k-table-td,
.k-grid .k-table-tbody > tr.k-master-row.k-highlighted > td {
    background-color: var(--grid-row-selected-bg) !important;
}

.k-window {
    border-radius: 16px !important;
    overflow: hidden;
    border: 1px solid #1e1c2237 !important;
}

.k-window-titlebar {
    padding: 16px 18px !important;
    min-height: 58px;
    background: linear-gradient(180deg, #F2F4F9 0%, var(--kendo-color-surface) 100%) !important;
    position: relative;
    border-bottom: none !important;
}

.k-window-title {
    font-family: var(--kendo-font-family) !important;
    font-size: 16px !important;
    font-weight: 650 !important;
    letter-spacing: 0.2px;
    color: var(--kendo-color-on-base) !important;
}

.k-window-titlebar::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 8px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient( to right, rgba(63, 128, 234, 1) 0%, rgba(63, 128, 234, 0.55) 60%, rgba(63, 128, 234, 0.0) 100% );
}

.k-window-content {
    background-color: var(--kendo-color-surface);
    padding: 18px !important;
}

/* Telerik TabStrip – Lift + Underline (Improved Visibility) */
.k-tabstrip-items-wrapper {
    margin-top: 6px;
    /*margin-bottom: 6px;*/
    /*border: 1px solid red !important;*/
}

.k-tabstrip-content {
    overflow: visible;
    padding-inline: 0px;
    border-radius: 0px 8px 8px 8px;
    background-color: transparent;
    border:2px solid #e1e1e1!important;
    /*border-top: 2px solid #e1e1e1 !important;*/
    /*border: 2px solid #e1e1e1 !important;*/
}

    /* Remove borders from nested tabstrips to connect them */
    .k-tabstrip-content .k-tabstrip-content {
        border-radius: 0px;
        border: none !important;
        border-top:2px solid #e1e1e1!important;
    }

.k-tabstrip-items{
    gap: 1px;
}

.k-tabstrip-items .k-tabstrip-item {
    border: 1px solid #dfdfdf;
    background-color: white;
    border-radius: 8px 8px 0px 0px;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
    z-index: 1;
}

    .k-tabstrip-items .k-tabstrip-item {
        color: var(--kendo-color-on-app-surface);
        font-weight: 600;
        min-width: 120px;
        text-align: center;
        position:relative;
    }

/*@media (max-width: 768px) {
    .k-tabstrip-items .k-tabstrip-item {
        min-width: 70px;
    }
}*/

        .k-tabstrip-items .k-tabstrip-item:hover {
            transition: transform 150ms ease;
            margin-top: -2px;
            /*transform: translateY(-2px);*/
            cursor: pointer;
            z-index: 1;
        }

        .k-tabstrip-items .k-tabstrip-item.k-active {
            background-color: var(--kendo-color-primary);
            color: white;
            /*margin-top: -2px;*/
            /*transform: translateY(-4px);*/
        }
    .k-tabstrip-items .k-tabstrip-item.k-active:hover {
        background-color: var(--kendo-color-primary);
        color: white;
        margin-top: 0px;
            margin-top: -2px;
        /*transform: none;*/
            /*transform: translateY(-4px);*/
    }
    .k-tabstrip-items .k-tabstrip-item.k-disabled {
        background-color: var(--kendo-button-disabled-bg);
    }

        .k-tabstrip-items .k-tabstrip-item .k-link {
            padding: 6px 6px 6px 6px;
            position: relative;
        }

/* Add spacing when TabStrip is inside m-section-area */
.m-section-area .k-tabstrip-content {
    padding: 12px;
}

/* Or add margin to the wrapper for external spacing */
.m-section-area .k-tabstrip {
    margin-bottom: 12px;
}

        .k-tabstrip-items .k-tabstrip-item::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            bottom: -6px;
            height: 3px;
            border-radius: 999px;
            opacity: 0;
            transform: scaleX(0.45);
            transition: opacity 300ms ease, transform 300ms ease !important;
            background: linear-gradient( to right, rgba(63, 128, 234, 1) 0%, rgba(63, 128, 234, 0.55) 60%, rgba(63, 128, 234, 0.0) 100% );
            z-index: 1;
        }

    .k-tabstrip-items .k-tabstrip-item:hover::after {
        opacity: 0.85;
        transform: scaleX(1);
    }

    .k-tabstrip-items .k-tabstrip-item.k-active::after {
        opacity: 1;
        transform: scaleX(1);
    }

/*// grid stop make rows auto height change if length text long*/
.k-grid tr {
    height: auto; /* Allow rows to adjust height automatically */
}

.k-grid td {
    white-space: normal; /* Allow text to wrap */
    word-wrap: break-word; /* Break long words */
    overflow: visible; /* Ensure content is visible */
    padding: 8px; /* Adjust padding as needed */
}

/*.k-breadcrumb {
    background-color: var(--background-color);
}*/

.k-breadcrumb-container {
    background: linear-gradient(to top, var(--kendo-color-primary-hover), var(--kendo-color-primary));
    width: 100%;
    color: white;
}

.k-breadcrumb-link.k-disabled {
    color: var(--color-disabled) !important;
}

.k-animation-container-shown {
    overflow: hidden !important;
}

.k-menu-link-text {
    color: var(--kendo-color-on-app-surface) !important;
}



.k-menu-link {
    padding-top: 0px;
    padding-bottom: 0px;
}
/*// old*/
/*.t-wireframeLink {*/
/*    background-color: darkred;
    color: white;*/
/*background-color: darkblue;
    color: white;
}

.t-row-pad {
    padding-top: 5px;
    padding-bottom: 5px;
}

.t-row-heading {
    padding-bottom: 10px;
}

.t-row-title {
    text-align: right;
}

.t-save-button .t-submit-button {
    text-align: center;
}*/
/* Limit white text to solid intent buttons only */
.k-button.k-button-solid-primary,
.k-button.k-button-solid-secondary,
.k-button.k-button-solid-success,
.k-button.k-button-solid-error,
.k-button.k-button-solid-warning {
    color: white;
}

    .k-button.k-button-solid-primary:hover,
    .k-button.k-button-solid-secondary:hover,
    .k-button.k-button-solid-success:hover,
    .k-button.k-button-solid-error:hover,
    .k-button.k-button-solid-warning:hover {
        color: white;
    }
/* Align checkbox label to top, setup for filters, may mess with inline */
.k-checkbox-wrap {
    align-items: start !important;
    vertical-align: top !important;
}

.no-headers-grid .k-grid-header {
    display: none;
}

/* ensure pager pagesize width is minimum to support 3 numbers e.g. 100+ */
.k-pager-sizes .k-dropdown-list, .k-pager-sizes .k-dropdown, .k-pager-sizes .k-dropdownlist, .k-pager-sizes > select {
    width: var(--kendo-pager-dropdown-width, 6em);
}

.dropdown-with-reset {
    position: relative;
    display: inline-block; /* or block if you want full width */
    width: 100%;
}

    .dropdown-with-reset .reset-button {
        position: absolute;
        right: 2em; /* adjust to taste */
        top: 50%;
        transform: translateY(-50%);
        z-index: 10; /* sit above dropdown */
    }