/* /Components/Layout/AppLayout.razor.rz.scp.css */
body[b-4rpesc1j19] {
    display: flex;
    flex-direction: column;
    margin: 0;
    background-color: red;
    overflow: auto;
    border: solid 4px purple;
}

.components-reconnect-dialog p[b-4rpesc1j19] {
    color: black;
}

.button-theme-toggle .k-button[b-4rpesc1j19] {
    width: 32px;
    padding: 0px;
    padding-inline-start: 0px !important;
    padding-inline-end: 0px !important;
    padding-block-start: 0px !important;
    padding-block-end: 0px !important;
}

.pct-notification-adornment[b-4rpesc1j19] {
}

.pct-footer-visible[b-4rpesc1j19] {
    display: block;
}

.pct-app-title[b-4rpesc1j19] {
    display: flex;
    gap: 0.2em;
    align-items: center;
    font-size: 1.2em;
    font-weight: 400;
    text-decoration: none !important;
    text-decoration-line: none !important;
    padding-left: var(--kendo-spacing-2);
}

    .pct-app-title a[b-4rpesc1j19],
    .pct-app-title a:link[b-4rpesc1j19],
    .pct-app-title a:active[b-4rpesc1j19],
    .pct-app-title a:hover[b-4rpesc1j19],
    .pct-app-title a:focus[b-4rpesc1j19],
    .pct-app-title a:visited[b-4rpesc1j19],
    .pct-app-title a:-webkit-any-link[b-4rpesc1j19] {
        text-decoration: none !important;
        text-decoration-line: none !important;
        text-decoration-style: none !important;
        text-decoration-color: transparent !important;
        text-underline-offset: 0 !important;
        -webkit-text-decoration: none !important;
        -webkit-text-decoration-line: none !important;
        -webkit-text-decoration-style: none !important;
        -moz-text-decoration: none !important;
        -moz-text-decoration-line: none !important;
        -moz-text-decoration-style: none !important;
        color: inherit;
    }

    .pct-app-title strong[b-4rpesc1j19] {
        font-weight: 500;
        text-decoration: none !important;
    }

    .pct-app-title sup[b-4rpesc1j19] {
        font-size: 0.4em;
        text-decoration: none !important;
    }

.pct-footer-hidden[b-4rpesc1j19] {
    display: hidden;
}

.pct-drawer-content k-drawer-content[b-4rpesc1j19] {
    padding: 0px;
}

.pct-main[b-4rpesc1j19] {
    overflow-y: hidden;
    /*padding-right: var(--kendo-spacing-8);
    padding-left: var(--kendo-spacing-8);
    padding-top: var(--kendo-spacing-4);*/
    padding-bottom: 0px;
}

.initials-circle[b-4rpesc1j19] {
    width: 32px; /* Diameter of the circle */
    height: 32px;
    background-color: var(--kendo-color-primary); /* Gray background #808080 (50% gray) */
    color: white; /* Text color */
    font-size: 13px; /* Font size for the initials */
    font-weight: 300;
    text-align: center;
    line-height: 32px; /* Align text vertically */
    border-radius: 50%; /* Make it a circle */
    display: inline-block; /* Keeps it block-like but inline */
    cursor: pointer;
    /* No Select*/
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Standard syntax */
}

.pct-help-button[b-4rpesc1j19] {
    margin-left: var(--kendo-spacing-1);
    margin-right: var(--kendo-spacing-1);
}

.pct-avatar[b-4rpesc1j19] {
    cursor: pointer;
    margin-left: var(--kendo-spacing-2);
    margin-right: var(--kendo-spacing-2);
}

.predecessor[b-4rpesc1j19] {
    margin-bottom: 2px;
}

.target[b-4rpesc1j19] {
    padding: 2px;
}

.custom-collapsed-width .k-drawer-mini[b-4rpesc1j19] {
    width: 200px; /* Set your desired width */
}

.spacing[b-4rpesc1j19] {
    height: var(--kendo-spacing-6);
}

.pct-env-badge[b-4rpesc1j19] {
    color: var(--badge-text-color, #333333);
    background-color: var(--badge-bg-color, #F3F4F6);
    border-radius: 4px;
    padding: 4px 12px;
    margin: 0 6px;
    font-size: 0.8rem;
    font-weight: 400;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.pct-env-badge-user[b-4rpesc1j19] {
    font-size: 0.8rem;
}

    .pct-env-badge-user strong[b-4rpesc1j19] {
        font-weight: 600;
    }

.pct-env-badge-separator[b-4rpesc1j19] {
    opacity: 0.4;
    font-weight: 300;
}

.pct-env-badge-env[b-4rpesc1j19] {
    opacity: 0.75;
    font-size: 0.8rem;
}

.pct-env-badge-label[b-4rpesc1j19] {
    opacity: 0.7;
}

@media screen and (max-width: 940px) {
    .pct-env-badge[b-4rpesc1j19] {
        display: none;
    }
}

@media screen and (max-width: 640px) {
    .pct-compact-hide[b-4rpesc1j19] {
        display: none;
    }

    .pct-app-title[b-4rpesc1j19],
    #app-title[b-4rpesc1j19] {
        display: none !important;
    }
}
/* /Components/Layout/FormItemDetailLayout.razor.rz.scp.css */
/* Marker - FormItemDetailLayout.razor.css */
/*.content-container {
    overflow: auto;
    height: calc(100vh - 252px);
    padding-bottom: 4px;
    padding-right: 0px;
    outline-offset: -1px; 
}

body.light .content-container,
.light .content-container {
    border: none;*/ /* Remove the original border */
    /*outline: 1px solid #cacaca;
}

body.dark .content-container,
.dark .content-container {
    border: none;*/ /* Remove the original border */
    /*outline: 1px solid #3c3c3c;*/ /* Dark outline matching Fluent UI dark border color */
/*}*/

/* Light theme (original) */
/*body.light .form-body-container,
body.light .form-body-container-compact,
.light .form-body-container,
.light .form-body-container-compact {
    padding: 4px;
    max-inline-size: 1848px;*/ /* Max res width - 200px */
    /*background-color: #ffffff;*/ /* White from Fluent UI */
    /*margin-top: 0px;
    margin-bottom: 0px;
}

body.light .form-body-container-compact,
.light .form-body-container-compact {
    max-inline-size: 1184px;*/ /* Max res width - 96px */
/*}*/

/* Dark theme */
/*body.dark .form-body-container,
body.dark .form-body-container-compact,
.dark .form-body-container,
.dark .form-body-container-compact {
    padding: 4px;
    max-inline-size: 1848px;*/ /* Max res width - 200px */
    /*background-color: #1e1e1e;*/ /* Dark background */
    /*margin-top: 0px;
    margin-bottom: 0px;
}

body.dark .form-body-container-compact,
.dark .form-body-container-compact {
    max-inline-size: 1184px;*/ /* Max res width - 96px */
/*}

.center-squeezed {
    padding-left: calc(2vw);
    padding-right: calc(2vw);
}

.form-field-grid {
    width: calc(76vw - 368px);*/
    /* additional styling such as padding or border can be added */
/*}

.form-grid-toolbar-button {
    max-width:220px;
}

@media (min-width: 1200px) {
    .center-squeezed {
        padding-left: calc(12vw);
        padding-right: calc(12vw);
    }

    
}*/
/* /Components/Layout/GridLandingLayout.razor.rz.scp.css */
/* .content-container {
    margin-top: 12px;
    overflow: auto;
    height: calc(100vh - 264px);
}

.content-container-compact {
    margin-top: 12px;
    overflow: auto;
    height: calc(100vh - 108px);
}

.advancedFilter {
    height: 184px;
    overflow-y: auto;
}

 */
/* /Components/Layout/LogInOrOut.razor.rz.scp.css */
.bi[b-21ax6p1r1p] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-person-badge-nav-menu[b-21ax6p1r1p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu[b-21ax6p1r1p] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.nav-item[b-21ax6p1r1p] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
    text-align: left;
}

    .nav-item .nav-link[b-21ax6p1r1p] {
        color: black;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        text-align: left;
        width: 100%;
    }

.nav-item .nav-link:hover[b-21ax6p1r1p] {
    background-color: rgba(0,0,0,0.8);
    color: white;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-x3ksc4jqg3] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-x3ksc4jqg3] {
    flex: 1;
}

.sidebar[b-x3ksc4jqg3] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-x3ksc4jqg3] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-x3ksc4jqg3]  a, .top-row[b-x3ksc4jqg3]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-x3ksc4jqg3]  a:hover, .top-row[b-x3ksc4jqg3]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-x3ksc4jqg3]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-x3ksc4jqg3] {
        justify-content: space-between;
    }

    .top-row[b-x3ksc4jqg3]  a, .top-row[b-x3ksc4jqg3]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-x3ksc4jqg3] {
        flex-direction: row;
    }

    .sidebar[b-x3ksc4jqg3] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-x3ksc4jqg3] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-x3ksc4jqg3]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-x3ksc4jqg3], article[b-x3ksc4jqg3] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-x3ksc4jqg3] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-x3ksc4jqg3] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-7gz5lcy8a8] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-7gz5lcy8a8] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-7gz5lcy8a8] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-7gz5lcy8a8] {
    font-size: 1.1rem;
}

.bi[b-7gz5lcy8a8] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-7gz5lcy8a8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-7gz5lcy8a8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-7gz5lcy8a8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-7gz5lcy8a8] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-7gz5lcy8a8] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-7gz5lcy8a8] {
        padding-bottom: 1rem;
    }

    .nav-item[b-7gz5lcy8a8]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-7gz5lcy8a8]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-7gz5lcy8a8]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-7gz5lcy8a8] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-7gz5lcy8a8] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-7gz5lcy8a8] {
        display: none;
    }

    .nav-scrollable[b-7gz5lcy8a8] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Pages/About.razor.rz.scp.css */
/* ================================================================
   ABOUT.RAZOR.CSS
   Comprehensive styling for PIM Suite About page
   Theme-aware design using Kendo UI CSS variables
   ================================================================ */

/* ================================================================
   SCROLLER & CONTAINER
   ================================================================ */
.about-scroller[b-r3osknpjpy] {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.about-container[b-r3osknpjpy] {
    max-width: 1400px;
    margin: 0 auto;
    padding: var(--kendo-spacing-4, 1rem);
    font-family: var(--kendo-font-family, inherit);
    line-height: var(--kendo-line-height, 1.4285714286);
}

/* ================================================================
   SECTION TITLES - Consistent treatment across all sections
   ================================================================ */
.section-title[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size-2xl, 1.5rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
    text-align: center;
    position: relative;
    padding-bottom: var(--kendo-spacing-3, 0.75rem);
}

    .section-title[b-r3osknpjpy]::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 60px;
        height: 3px;
        background: var(--kendo-color-primary, #0078d4);
        border-radius: var(--kendo-border-radius-full, 9999px);
    }

.section-subtitle[b-r3osknpjpy] {
    text-align: center;
    max-width: 800px;
    margin: var(--kendo-spacing-4, 1rem) auto var(--kendo-spacing-6, 1.5rem);
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.6;
}

/* ================================================================
   HERO SECTION
   ================================================================ */
.about-hero-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

    .about-hero-section .k-messagebox[b-r3osknpjpy] {
        border-left: 4px solid var(--kendo-color-primary, #0078d4);
        background: linear-gradient(135deg, var(--kendo-color-primary-subtle, #deecf9) 0%, var(--kendo-color-base-subtle, #f3f2f1) 100%);
    }

.about-hero-content[b-r3osknpjpy] {
    padding: var(--kendo-spacing-8, 2rem) var(--kendo-spacing-6, 1.5rem);
    text-align: center;
}

.about-hero-title[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-4, 1rem) 0;
    font-size: var(--kendo-font-size-3xl, 1.875rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
}

.about-hero-text[b-r3osknpjpy] {
    margin: 0 auto var(--kendo-spacing-4, 1rem);
    font-size: var(--kendo-font-size-lg, 1rem);
    color: var(--kendo-color-on-app-surface, #323130);
    max-width: 900px;
    line-height: 1.7;
}

.about-hero-subtext[b-r3osknpjpy] {
    margin: 0 auto;
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-subtle, #605e5c);
    max-width: 800px;
    line-height: 1.6;
}

/* ================================================================
   METRICS SECTION
   ================================================================ */
.about-metrics-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.metrics-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.metric-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    text-align: center;
    transition: var(--kendo-transition);
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1, 0.25rem);
}

    .metric-card:hover[b-r3osknpjpy] {
        transform: translateY(-2px);
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
        border-color: var(--kendo-color-primary, #0078d4);
    }

    .metric-card.highlight[b-r3osknpjpy] {
        background: linear-gradient(135deg, var(--kendo-color-primary, #0078d4) 0%, var(--kendo-color-primary-hover, #106ebe) 100%);
        border-color: var(--kendo-color-primary, #0078d4);
    }

        .metric-card.highlight .metric-value[b-r3osknpjpy],
        .metric-card.highlight .metric-label[b-r3osknpjpy],
        .metric-card.highlight .metric-context[b-r3osknpjpy] {
            color: var(--kendo-color-on-primary, #ffffff);
        }

.metric-value[b-r3osknpjpy] {
    font-size: var(--kendo-font-size-2xl, 1.5rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-primary, #0078d4);
    line-height: 1.2;
}

.metric-label[b-r3osknpjpy] {
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.metric-context[b-r3osknpjpy] {
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.4;
}

/* ================================================================
   CAPABILITIES SECTION
   ================================================================ */
.about-capabilities-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.capabilities-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.capability-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    display: flex;
    gap: var(--kendo-spacing-4, 1rem);
    transition: var(--kendo-transition);
}

    .capability-card:hover[b-r3osknpjpy] {
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
        border-color: var(--kendo-color-primary, #0078d4);
    }

.capability-icon-wrapper[b-r3osknpjpy] {
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    background: var(--kendo-color-primary-subtle, #deecf9);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .capability-icon-wrapper.documents[b-r3osknpjpy] {
        background: #e8f4fd;
    }

    .capability-icon-wrapper.submittals[b-r3osknpjpy] {
        background: #fff4e5;
    }

    .capability-icon-wrapper.schedule[b-r3osknpjpy] {
        background: #e6f7e9;
    }

    .capability-icon-wrapper.budget[b-r3osknpjpy] {
        background: #fef3e2;
    }

    .capability-icon-wrapper.analytics[b-r3osknpjpy] {
        background: #f3e8fd;
    }

    .capability-icon-wrapper.correspondence[b-r3osknpjpy] {
        background: #e8f0fe;
    }

    .capability-icon-wrapper.compliance[b-r3osknpjpy] {
        background: #e6f7e9;
    }

.capability-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-xl, 2rem);
    height: var(--kendo-icon-size-xl, 2rem);
    color: var(--kendo-color-primary, #0078d4);
}

.capability-icon-wrapper.documents .capability-icon[b-r3osknpjpy] {
    color: #0a7eff;
}

.capability-icon-wrapper.submittals .capability-icon[b-r3osknpjpy] {
    color: #f59e0b;
}

.capability-icon-wrapper.schedule .capability-icon[b-r3osknpjpy] {
    color: #10b981;
}

.capability-icon-wrapper.budget .capability-icon[b-r3osknpjpy] {
    color: #f97316;
}

.capability-icon-wrapper.analytics .capability-icon[b-r3osknpjpy] {
    color: #8b5cf6;
}

.capability-icon-wrapper.correspondence .capability-icon[b-r3osknpjpy] {
    color: #3b82f6;
}

.capability-icon-wrapper.compliance .capability-icon[b-r3osknpjpy] {
    color: #10b981;
}

.capability-content[b-r3osknpjpy] {
    flex: 1;
}

    .capability-content h5[b-r3osknpjpy] {
        margin: 0 0 var(--kendo-spacing-1, 0.25rem) 0;
        font-size: var(--kendo-font-size-lg, 1rem);
        font-weight: var(--kendo-font-weight-semibold, 600);
        color: var(--kendo-color-on-app-surface, #323130);
    }

.capability-tagline[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-style: italic;
    color: var(--kendo-color-primary, #0078d4);
}

.capability-content p[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.5;
}

.capability-features[b-r3osknpjpy] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2, 0.5rem);
}

    .capability-features span[b-r3osknpjpy] {
        background: var(--kendo-color-surface, #faf9f8);
        padding: var(--kendo-spacing-1, 0.25rem) var(--kendo-spacing-2, 0.5rem);
        border-radius: var(--kendo-border-radius-sm, 0.125rem);
        font-size: var(--kendo-font-size-xs, 0.6875rem);
        color: var(--kendo-color-on-app-surface, #323130);
        border: 1px solid var(--kendo-color-border, #8a8886);
    }

/* ================================================================
   AI SECTION
   ================================================================ */
.about-ai-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
    background: var(--kendo-color-surface, #faf9f8);
    padding: var(--kendo-spacing-6, 1.5rem);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
}

/* AI Hero Card */
.ai-hero-card[b-r3osknpjpy] {
    background: linear-gradient(135deg, var(--kendo-color-surface-alt, #ffffff) 0%, var(--kendo-color-primary-subtle, #deecf9) 100%);
    border: 2px solid var(--kendo-color-primary, #0078d4);
    border-radius: var(--kendo-border-radius-lg, 0.5rem);
    padding: var(--kendo-spacing-6, 1.5rem);
    margin-bottom: var(--kendo-spacing-6, 1.5rem);
}

.ai-hero-content[b-r3osknpjpy] {
    max-width: 100%;
}

.ai-hero-header[b-r3osknpjpy] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3, 0.75rem);
    margin-bottom: var(--kendo-spacing-4, 1rem);
}

.ai-hero-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-2xl, 2.5rem);
    height: var(--kendo-icon-size-2xl, 2.5rem);
    color: var(--kendo-color-warning, #ffc80a);
}

.ai-hero-header h5[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size-xl, 1.25rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
}

.ai-hero-tagline[b-r3osknpjpy] {
    display: block;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-primary, #0078d4);
    font-weight: var(--kendo-font-weight-normal, 400);
}

.ai-hero-content > p[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-4, 1rem) 0;
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-on-app-surface, #323130);
    line-height: 1.6;
}

.ai-hero-stats[b-r3osknpjpy] {
    display: flex;
    gap: var(--kendo-spacing-6, 1.5rem);
    padding-top: var(--kendo-spacing-4, 1rem);
    border-top: 1px solid var(--kendo-color-border, #8a8886);
}

.ai-stat[b-r3osknpjpy] {
    text-align: center;
}

.ai-stat-number[b-r3osknpjpy] {
    display: block;
    font-size: var(--kendo-font-size-xl, 1.25rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-primary, #0078d4);
}

.ai-stat-label[b-r3osknpjpy] {
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
}

/* AI Capabilities Grid */
.ai-capabilities-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.ai-capability-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    transition: var(--kendo-transition);
}

    .ai-capability-card:hover[b-r3osknpjpy] {
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
    }

.ai-capability-header[b-r3osknpjpy] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    margin-bottom: var(--kendo-spacing-3, 0.75rem);
}

.ai-capability-icon[b-r3osknpjpy] {
    width: 36px;
    height: 36px;
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .ai-capability-icon.llm[b-r3osknpjpy] {
        background: #fef3e2;
    }

    .ai-capability-icon.multimodal[b-r3osknpjpy] {
        background: #f3e8fd;
    }

    .ai-capability-icon.vision[b-r3osknpjpy] {
        background: #e8f4fd;
    }

    .ai-capability-icon.agentic[b-r3osknpjpy] {
        background: #e6f7e9;
    }

    .ai-capability-icon.search[b-r3osknpjpy] {
        background: #fce7f3;
    }

    .ai-capability-icon.predictive[b-r3osknpjpy] {
        background: #e0f2fe;
    }

.ai-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
}

.ai-capability-icon.llm .ai-icon[b-r3osknpjpy] {
    color: #f97316;
}

.ai-capability-icon.multimodal .ai-icon[b-r3osknpjpy] {
    color: #8b5cf6;
}

.ai-capability-icon.vision .ai-icon[b-r3osknpjpy] {
    color: #0a7eff;
}

.ai-capability-icon.agentic .ai-icon[b-r3osknpjpy] {
    color: #10b981;
}

.ai-capability-icon.search .ai-icon[b-r3osknpjpy] {
    color: #ec4899;
}

.ai-capability-icon.predictive .ai-icon[b-r3osknpjpy] {
    color: #0284c7;
}

.ai-capability-header h5[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.ai-capability-card > p[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.5;
}

.ai-feature-list[b-r3osknpjpy] {
    margin: 0;
    padding-left: var(--kendo-spacing-4, 1rem);
    list-style-type: disc;
}

    .ai-feature-list li[b-r3osknpjpy] {
        font-size: var(--kendo-font-size-xs, 0.6875rem);
        color: var(--kendo-color-on-app-surface, #323130);
        margin-bottom: var(--kendo-spacing-1, 0.25rem);
        line-height: 1.4;
    }

/* ================================================================
   FRAMEWORK SECTION
   ================================================================ */
.about-framework-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.framework-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-6, 1.5rem);
    box-shadow: var(--kendo-elevation-2, 0 0.6px 1.8px rgba(0, 0, 0, 0.1), 0 3.2px 7.2px rgba(0, 0, 0, 0.13));
}

.framework-visual[b-r3osknpjpy] {
    max-width: 1000px;
    margin: 0 auto;
}

.framework-stages[b-r3osknpjpy] {
    display: flex;
    align-items: flex-start;
    gap: 0;
}

.stage-item[b-r3osknpjpy] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
}

.stage-number[b-r3osknpjpy] {
    width: 40px;
    height: 40px;
    background: var(--kendo-color-primary, #0078d4);
    color: var(--kendo-color-on-primary, #ffffff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--kendo-font-size-lg, 1rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    margin-bottom: var(--kendo-spacing-3, 0.75rem);
    position: relative;
    z-index: 1;
}

.stage-content h6[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-1, 0.25rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.stage-content p[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.4;
    padding: 0 var(--kendo-spacing-2, 0.5rem);
}

.stage-connector[b-r3osknpjpy] {
    width: 40px;
    height: 2px;
    background: var(--kendo-color-primary, #0078d4);
    margin-top: 19px;
    flex-shrink: 0;
}

/* ================================================================
   INNOVATION SECTION
   ================================================================ */
.about-innovation-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.innovation-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.innovation-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    transition: var(--kendo-transition);
}

    .innovation-card:hover[b-r3osknpjpy] {
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
    }

    .innovation-card.featured[b-r3osknpjpy] {
        grid-column: span 3;
        background: linear-gradient(135deg, var(--kendo-color-surface-alt, #ffffff) 0%, var(--kendo-color-primary-subtle, #deecf9) 100%);
        border: 2px solid var(--kendo-color-primary, #0078d4);
    }

.innovation-header[b-r3osknpjpy] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    margin-bottom: var(--kendo-spacing-3, 0.75rem);
}

.innovation-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
    color: var(--kendo-color-primary, #0078d4);
}

.innovation-header h5[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.innovation-card > p[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.5;
}

.innovation-details[b-r3osknpjpy] {
    margin-top: var(--kendo-spacing-4, 1rem);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.detail-item[b-r3osknpjpy] {
    background: var(--kendo-color-surface, #faf9f8);
    padding: var(--kendo-spacing-3, 0.75rem);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
}

    .detail-item strong[b-r3osknpjpy] {
        display: block;
        font-size: var(--kendo-font-size-sm, 0.75rem);
        color: var(--kendo-color-primary, #0078d4);
        margin-bottom: var(--kendo-spacing-1, 0.25rem);
    }

    .detail-item span[b-r3osknpjpy] {
        font-size: var(--kendo-font-size-xs, 0.6875rem);
        color: var(--kendo-color-on-app-surface, #323130);
        line-height: 1.4;
    }

/* ================================================================
   CASE STUDIES SECTION
   ================================================================ */
.about-case-studies-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.case-studies-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.case-study-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    transition: var(--kendo-transition);
}

    .case-study-card:hover[b-r3osknpjpy] {
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
        border-color: var(--kendo-color-primary, #0078d4);
    }

.case-study-header[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-3, 0.75rem);
    padding-bottom: var(--kendo-spacing-2, 0.5rem);
    border-bottom: 1px solid var(--kendo-color-border, #8a8886);
}

    .case-study-header h5[b-r3osknpjpy] {
        margin: 0 0 var(--kendo-spacing-1, 0.25rem) 0;
        font-size: var(--kendo-font-size, 0.875rem);
        font-weight: var(--kendo-font-weight-semibold, 600);
        color: var(--kendo-color-on-app-surface, #323130);
    }

.case-study-type[b-r3osknpjpy] {
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-primary, #0078d4);
    font-weight: var(--kendo-font-weight-medium, 500);
}

.case-study-card > p[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.5;
}

.case-study-capabilities[b-r3osknpjpy] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2, 0.5rem);
}

    .case-study-capabilities span[b-r3osknpjpy] {
        background: var(--kendo-color-primary-subtle, #deecf9);
        padding: var(--kendo-spacing-1, 0.25rem) var(--kendo-spacing-2, 0.5rem);
        border-radius: var(--kendo-border-radius-sm, 0.125rem);
        font-size: var(--kendo-font-size-xs, 0.6875rem);
        color: var(--kendo-color-primary, #0078d4);
        font-weight: var(--kendo-font-weight-medium, 500);
    }

/* ================================================================
   ARCHITECTURE SECTION
   ================================================================ */
.about-architecture-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.architecture-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.architecture-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    transition: var(--kendo-transition);
}

    .architecture-card:hover[b-r3osknpjpy] {
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
    }

.architecture-icon-wrapper[b-r3osknpjpy] {
    width: 48px;
    height: 48px;
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    background: var(--kendo-color-primary-subtle, #deecf9);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--kendo-spacing-3, 0.75rem);
}

    .architecture-icon-wrapper.api[b-r3osknpjpy] {
        background: #e6f7e9;
    }

    .architecture-icon-wrapper.integrations[b-r3osknpjpy] {
        background: #fef3e2;
    }

    .architecture-icon-wrapper.scale[b-r3osknpjpy] {
        background: #f3e8fd;
    }

.architecture-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
    color: var(--kendo-color-primary, #0078d4);
}

.architecture-icon-wrapper.api .architecture-icon[b-r3osknpjpy] {
    color: #10b981;
}

.architecture-icon-wrapper.integrations .architecture-icon[b-r3osknpjpy] {
    color: #f97316;
}

.architecture-icon-wrapper.scale .architecture-icon[b-r3osknpjpy] {
    color: #8b5cf6;
}

.architecture-card h5[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.architecture-card > p[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.5;
}

.architecture-specs[b-r3osknpjpy] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2, 0.5rem);
}

    .architecture-specs span[b-r3osknpjpy] {
        background: var(--kendo-color-surface, #faf9f8);
        padding: var(--kendo-spacing-1, 0.25rem) var(--kendo-spacing-2, 0.5rem);
        border-radius: var(--kendo-border-radius-sm, 0.125rem);
        font-size: var(--kendo-font-size-xs, 0.6875rem);
        color: var(--kendo-color-on-app-surface, #323130);
        border: 1px solid var(--kendo-color-border, #8a8886);
    }

.integration-logos[b-r3osknpjpy] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2, 0.5rem);
}

.integration-badge[b-r3osknpjpy] {
    background: var(--kendo-color-primary, #0078d4);
    color: var(--kendo-color-on-primary, #ffffff);
    padding: var(--kendo-spacing-1, 0.25rem) var(--kendo-spacing-3, 0.75rem);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    font-weight: var(--kendo-font-weight-medium, 500);
}

/* ================================================================
   SECURITY SECTION
   ================================================================ */
.about-security-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.security-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: var(--kendo-spacing-4, 1rem);
}

.security-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
}

    .security-card.main[b-r3osknpjpy] {
        border-left: 4px solid var(--kendo-color-primary, #0078d4);
    }

    .security-card h5[b-r3osknpjpy] {
        margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
        font-size: var(--kendo-font-size, 0.875rem);
        font-weight: var(--kendo-font-weight-semibold, 600);
        color: var(--kendo-color-on-app-surface, #323130);
    }

    .security-card > p[b-r3osknpjpy] {
        margin: 0 0 var(--kendo-spacing-4, 1rem) 0;
        font-size: var(--kendo-font-size-sm, 0.75rem);
        color: var(--kendo-color-subtle, #605e5c);
        line-height: 1.5;
    }

.compliance-badges[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-3, 0.75rem);
}

.compliance-badge[b-r3osknpjpy] {
    background: var(--kendo-color-surface, #faf9f8);
    padding: var(--kendo-spacing-3, 0.75rem);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    border: 1px solid var(--kendo-color-border, #8a8886);
}

.badge-name[b-r3osknpjpy] {
    display: block;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-primary, #0078d4);
    margin-bottom: var(--kendo-spacing-1, 0.25rem);
}

.badge-desc[b-r3osknpjpy] {
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
}

.security-features[b-r3osknpjpy] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-3, 0.75rem);
}

.security-feature[b-r3osknpjpy] {
    display: flex;
    align-items: flex-start;
    gap: var(--kendo-spacing-3, 0.75rem);
    padding: var(--kendo-spacing-3, 0.75rem);
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
}

.security-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
    color: var(--kendo-color-success, #107c10);
    flex-shrink: 0;
    margin-top: 2px;
}

.security-feature h6[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-1, 0.25rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.security-feature p[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
}

/* ================================================================
   BENEFITS SECTION
   ================================================================ */
.about-benefits-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.benefits-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.benefit-card[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    text-align: center;
    transition: var(--kendo-transition);
}

    .benefit-card:hover[b-r3osknpjpy] {
        transform: translateY(-2px);
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
    }

.benefit-icon-wrapper[b-r3osknpjpy] {
    width: 48px;
    height: 48px;
    margin: 0 auto var(--kendo-spacing-3, 0.75rem);
    border-radius: 50%;
    background: var(--kendo-color-success-subtle, #dff6dd);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .benefit-icon-wrapper.efficiency[b-r3osknpjpy] {
        background: #e8f4fd;
    }

    .benefit-icon-wrapper.decisions[b-r3osknpjpy] {
        background: #f3e8fd;
    }

    .benefit-icon-wrapper.savings[b-r3osknpjpy] {
        background: #fef3e2;
    }

    .benefit-icon-wrapper.scale[b-r3osknpjpy] {
        background: #e0f2fe;
    }

    .benefit-icon-wrapper.compliance[b-r3osknpjpy] {
        background: #fce7f3;
    }

.benefit-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
    color: var(--kendo-color-success, #107c10);
}

.benefit-icon-wrapper.efficiency .benefit-icon[b-r3osknpjpy] {
    color: #0a7eff;
}

.benefit-icon-wrapper.decisions .benefit-icon[b-r3osknpjpy] {
    color: #8b5cf6;
}

.benefit-icon-wrapper.savings .benefit-icon[b-r3osknpjpy] {
    color: #f97316;
}

.benefit-icon-wrapper.scale .benefit-icon[b-r3osknpjpy] {
    color: #0284c7;
}

.benefit-icon-wrapper.compliance .benefit-icon[b-r3osknpjpy] {
    color: #ec4899;
}

.benefit-card h5[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.benefit-card > p[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.5;
}

/* ================================================================
   INDUSTRIES SECTION
   ================================================================ */
.about-industries-section[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.industries-grid[b-r3osknpjpy] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.industry-item[b-r3osknpjpy] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    text-align: center;
    transition: var(--kendo-transition);
}

    .industry-item:hover[b-r3osknpjpy] {
        border-color: var(--kendo-color-primary, #0078d4);
        background: var(--kendo-color-primary-subtle, #deecf9);
    }

.industry-icon[b-r3osknpjpy] {
    width: var(--kendo-icon-size-xl, 2rem);
    height: var(--kendo-icon-size-xl, 2rem);
    color: var(--kendo-color-primary, #0078d4);
    margin-bottom: var(--kendo-spacing-2, 0.5rem);
}

.industry-item h6[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-1, 0.25rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.industry-item p[b-r3osknpjpy] {
    margin: 0;
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.4;
}

/* ================================================================
   CTA SECTION
   ================================================================ */
.about-cta-section[b-r3osknpjpy] {
    text-align: center;
    padding: var(--kendo-spacing-8, 2rem) var(--kendo-spacing-6, 1.5rem);
    background: linear-gradient(135deg, var(--kendo-color-primary-subtle, #deecf9) 0%, var(--kendo-color-surface, #faf9f8) 100%);
    border-radius: var(--kendo-border-radius-lg, 0.5rem);
    border: 1px solid var(--kendo-color-border, #8a8886);
}

.cta-content[b-r3osknpjpy] {
    max-width: 600px;
    margin: 0 auto;
}

.cta-icon[b-r3osknpjpy] {
    margin-bottom: var(--kendo-spacing-4, 1rem);
}

.cta-sparkle[b-r3osknpjpy] {
    width: var(--kendo-icon-size-2xl, 2.5rem);
    height: var(--kendo-icon-size-2xl, 2.5rem);
    color: var(--kendo-color-warning, #ffc80a);
}

.cta-content h5[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size-xl, 1.25rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
}

.cta-content > p[b-r3osknpjpy] {
    margin: 0 0 var(--kendo-spacing-6, 1.5rem) 0;
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.6;
}

.cta-buttons[b-r3osknpjpy] {
    display: flex;
    justify-content: center;
    gap: var(--kendo-spacing-4, 1rem);
}

.cta-button[b-r3osknpjpy] {
    min-width: 160px;
}

    .cta-button.secondary[b-r3osknpjpy] {
        border-color: var(--kendo-color-primary, #0078d4);
        color: var(--kendo-color-primary, #0078d4);
    }

/* ================================================================
   DARK THEME SUPPORT
   ================================================================ */
[data-theme="dark"] .about-hero-section .k-messagebox[b-r3osknpjpy] {
    background: linear-gradient(135deg, rgba(0, 120, 212, 0.15) 0%, var(--kendo-color-base-subtle, #1b1a19) 100%);
}

[data-theme="dark"] .metric-card.highlight[b-r3osknpjpy] {
    background: linear-gradient(135deg, var(--kendo-color-primary, #0078d4) 0%, var(--kendo-color-primary-hover, #106ebe) 100%);
}

[data-theme="dark"] .about-ai-section[b-r3osknpjpy] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

[data-theme="dark"] .ai-hero-card[b-r3osknpjpy] {
    background: linear-gradient(135deg, var(--kendo-color-surface-alt, #252423) 0%, rgba(0, 120, 212, 0.15) 100%);
}

[data-theme="dark"] .innovation-card.featured[b-r3osknpjpy] {
    background: linear-gradient(135deg, var(--kendo-color-surface-alt, #252423) 0%, rgba(0, 120, 212, 0.15) 100%);
}

[data-theme="dark"] .about-cta-section[b-r3osknpjpy] {
    background: linear-gradient(135deg, rgba(0, 120, 212, 0.15) 0%, var(--kendo-color-base-subtle, #1b1a19) 100%);
}

[data-theme="dark"] .capability-features span[b-r3osknpjpy],
[data-theme="dark"] .architecture-specs span[b-r3osknpjpy] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

[data-theme="dark"] .compliance-badge[b-r3osknpjpy],
[data-theme="dark"] .detail-item[b-r3osknpjpy] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

/* ================================================================
   CAPABILITIES ICON WRAPPERS - DARK THEME
   ================================================================ */
[data-theme="dark"] .capability-icon-wrapper[b-r3osknpjpy] {
    background: rgba(0, 120, 212, 0.25);
}

    [data-theme="dark"] .capability-icon-wrapper.documents[b-r3osknpjpy] {
        background: rgba(10, 126, 255, 0.25);
    }

    [data-theme="dark"] .capability-icon-wrapper.submittals[b-r3osknpjpy] {
        background: rgba(245, 158, 11, 0.25);
    }

    [data-theme="dark"] .capability-icon-wrapper.schedule[b-r3osknpjpy] {
        background: rgba(16, 185, 129, 0.25);
    }

    [data-theme="dark"] .capability-icon-wrapper.budget[b-r3osknpjpy] {
        background: rgba(249, 115, 22, 0.25);
    }

    [data-theme="dark"] .capability-icon-wrapper.analytics[b-r3osknpjpy] {
        background: rgba(139, 92, 246, 0.25);
    }

    [data-theme="dark"] .capability-icon-wrapper.correspondence[b-r3osknpjpy] {
        background: rgba(59, 130, 246, 0.25);
    }

    [data-theme="dark"] .capability-icon-wrapper.compliance[b-r3osknpjpy] {
        background: rgba(16, 185, 129, 0.25);
    }

/* ================================================================
   AI CAPABILITY ICONS - DARK THEME
   ================================================================ */
[data-theme="dark"] .ai-capability-icon.llm[b-r3osknpjpy] {
    background: rgba(249, 115, 22, 0.25);
}

[data-theme="dark"] .ai-capability-icon.multimodal[b-r3osknpjpy] {
    background: rgba(139, 92, 246, 0.25);
}

[data-theme="dark"] .ai-capability-icon.vision[b-r3osknpjpy] {
    background: rgba(10, 126, 255, 0.25);
}

[data-theme="dark"] .ai-capability-icon.agentic[b-r3osknpjpy] {
    background: rgba(16, 185, 129, 0.25);
}

[data-theme="dark"] .ai-capability-icon.search[b-r3osknpjpy] {
    background: rgba(236, 72, 153, 0.25);
}

[data-theme="dark"] .ai-capability-icon.predictive[b-r3osknpjpy] {
    background: rgba(2, 132, 199, 0.25);
}

/* ================================================================
   ARCHITECTURE ICON WRAPPERS - DARK THEME
   ================================================================ */
[data-theme="dark"] .architecture-icon-wrapper[b-r3osknpjpy] {
    background: rgba(0, 120, 212, 0.25);
}

    [data-theme="dark"] .architecture-icon-wrapper.api[b-r3osknpjpy] {
        background: rgba(16, 185, 129, 0.25);
    }

    [data-theme="dark"] .architecture-icon-wrapper.integrations[b-r3osknpjpy] {
        background: rgba(249, 115, 22, 0.25);
    }

    [data-theme="dark"] .architecture-icon-wrapper.scale[b-r3osknpjpy] {
        background: rgba(139, 92, 246, 0.25);
    }

/* ================================================================
   BENEFITS ICON WRAPPERS - DARK THEME
   ================================================================ */
[data-theme="dark"] .benefit-icon-wrapper[b-r3osknpjpy] {
    background: rgba(16, 124, 16, 0.25);
}

    [data-theme="dark"] .benefit-icon-wrapper.efficiency[b-r3osknpjpy] {
        background: rgba(10, 126, 255, 0.25);
    }

    [data-theme="dark"] .benefit-icon-wrapper.decisions[b-r3osknpjpy] {
        background: rgba(139, 92, 246, 0.25);
    }

    [data-theme="dark"] .benefit-icon-wrapper.savings[b-r3osknpjpy] {
        background: rgba(249, 115, 22, 0.25);
    }

    [data-theme="dark"] .benefit-icon-wrapper.scale[b-r3osknpjpy] {
        background: rgba(2, 132, 199, 0.25);
    }

    [data-theme="dark"] .benefit-icon-wrapper.compliance[b-r3osknpjpy] {
        background: rgba(236, 72, 153, 0.25);
    }

/* ================================================================
   INDUSTRIES SECTION - DARK THEME
   ================================================================ */
[data-theme="dark"] .industry-item:hover[b-r3osknpjpy] {
    background: rgba(0, 120, 212, 0.2);
}

/* ================================================================
   RESPONSIVE BREAKPOINTS
   ================================================================ */
@media (max-width: 1200px) {
    .metrics-grid[b-r3osknpjpy] {
        grid-template-columns: repeat(3, 1fr);
    }

    .industries-grid[b-r3osknpjpy] {
        grid-template-columns: repeat(3, 1fr);
    }

    .ai-capabilities-grid[b-r3osknpjpy] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 1024px) {
    .capabilities-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .innovation-grid[b-r3osknpjpy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .innovation-card.featured[b-r3osknpjpy] {
        grid-column: span 2;
    }

    .case-studies-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .architecture-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .security-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .benefits-grid[b-r3osknpjpy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .framework-stages[b-r3osknpjpy] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .stage-item[b-r3osknpjpy] {
        flex: 0 0 calc(33.333% - 20px);
        margin-bottom: var(--kendo-spacing-4, 1rem);
    }

    .stage-connector[b-r3osknpjpy] {
        display: none;
    }
}

@media (max-width: 768px) {
    .about-container[b-r3osknpjpy] {
        padding: var(--kendo-spacing-2, 0.5rem);
    }

    .about-hero-content[b-r3osknpjpy] {
        padding: var(--kendo-spacing-4, 1rem);
    }

    .about-hero-title[b-r3osknpjpy] {
        font-size: var(--kendo-font-size-xl, 1.25rem);
    }

    .metrics-grid[b-r3osknpjpy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .ai-capabilities-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .ai-hero-stats[b-r3osknpjpy] {
        flex-direction: column;
        gap: var(--kendo-spacing-3, 0.75rem);
    }

    .innovation-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .innovation-card.featured[b-r3osknpjpy] {
        grid-column: span 1;
    }

    .innovation-details[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .compliance-badges[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .benefits-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .industries-grid[b-r3osknpjpy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .stage-item[b-r3osknpjpy] {
        flex: 0 0 calc(50% - 10px);
    }

    .cta-buttons[b-r3osknpjpy] {
        flex-direction: column;
        align-items: center;
    }

    .cta-button[b-r3osknpjpy] {
        width: 100%;
        max-width: 280px;
    }

    .capability-card[b-r3osknpjpy] {
        flex-direction: column;
        text-align: center;
    }

    .capability-icon-wrapper[b-r3osknpjpy] {
        margin: 0 auto;
    }

    .capability-features[b-r3osknpjpy] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .metrics-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .industries-grid[b-r3osknpjpy] {
        grid-template-columns: 1fr;
    }

    .stage-item[b-r3osknpjpy] {
        flex: 0 0 100%;
    }

    .integration-logos[b-r3osknpjpy] {
        justify-content: center;
    }
}

/* ================================================================
   ACCESSIBILITY
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
    .metric-card[b-r3osknpjpy],
    .capability-card[b-r3osknpjpy],
    .ai-capability-card[b-r3osknpjpy],
    .innovation-card[b-r3osknpjpy],
    .case-study-card[b-r3osknpjpy],
    .architecture-card[b-r3osknpjpy],
    .benefit-card[b-r3osknpjpy],
    .industry-item[b-r3osknpjpy] {
        transition: none;
    }

        .metric-card:hover[b-r3osknpjpy],
        .benefit-card:hover[b-r3osknpjpy] {
            transform: none;
        }
}

.metric-card:focus-visible[b-r3osknpjpy],
.capability-card:focus-visible[b-r3osknpjpy],
.ai-capability-card:focus-visible[b-r3osknpjpy],
.innovation-card:focus-visible[b-r3osknpjpy],
.case-study-card:focus-visible[b-r3osknpjpy],
.architecture-card:focus-visible[b-r3osknpjpy],
.benefit-card:focus-visible[b-r3osknpjpy],
.industry-item:focus-visible[b-r3osknpjpy] {
    outline: 2px solid var(--kendo-color-primary, #0078d4);
    outline-offset: 2px;
}

@media (prefers-contrast: high) {
    .section-title[b-r3osknpjpy]::after {
        height: 6px;
    }

    .metric-card[b-r3osknpjpy],
    .capability-card[b-r3osknpjpy],
    .ai-capability-card[b-r3osknpjpy],
    .innovation-card[b-r3osknpjpy],
    .case-study-card[b-r3osknpjpy],
    .architecture-card[b-r3osknpjpy],
    .benefit-card[b-r3osknpjpy],
    .industry-item[b-r3osknpjpy],
    .security-card[b-r3osknpjpy],
    .security-feature[b-r3osknpjpy] {
        border-width: 2px;
    }
}

/* ================================================================
   PRINT STYLES
   ================================================================ */
@media print {
    .about-scroller[b-r3osknpjpy] {
        height: auto;
        overflow: visible;
    }

    .metric-card:hover[b-r3osknpjpy],
    .capability-card:hover[b-r3osknpjpy],
    .ai-capability-card:hover[b-r3osknpjpy],
    .innovation-card:hover[b-r3osknpjpy],
    .case-study-card:hover[b-r3osknpjpy],
    .architecture-card:hover[b-r3osknpjpy],
    .benefit-card:hover[b-r3osknpjpy],
    .industry-item:hover[b-r3osknpjpy] {
        transform: none;
        box-shadow: none;
    }

    .about-cta-section[b-r3osknpjpy] {
        display: none;
    }
}
/* /Components/Pages/Admin/AgenticIntelliSys/SystemPrompts/Detail.razor.rz.scp.css */
/* ============================================
   System Prompt Guide Window Styles
   Professional, polished presentation with
   proper light/dark theme support
   ============================================ */

/* Window Title */
.window-title-content[b-a3ecsyupzo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
}

/* Window Footer */
.window-footer-content[b-a3ecsyupzo] {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

/* Main Wrapper */
.prompt-guide-wrapper[b-a3ecsyupzo] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 350px;
    max-height: calc(85vh - 120px);
}

/* Tab Strip Customization */
[b-a3ecsyupzo] .prompt-guide-tabs {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

    [b-a3ecsyupzo] .prompt-guide-tabs .k-tabstrip-items-wrapper {
        flex-shrink: 0;
        border-bottom: 1px solid var(--kendo-color-border-alt);
        background: var(--kendo-color-surface-alt);
    }

    [b-a3ecsyupzo] .prompt-guide-tabs .k-tabstrip-content {
        flex: 1;
        overflow: hidden;
        padding: 0;
        border: none;
    }

    [b-a3ecsyupzo] .prompt-guide-tabs .k-tabstrip-items .k-item {
        font-weight: 500;
    }

/* Tab Content Panel */
.tab-content-panel[b-a3ecsyupzo] {
    padding: 1.25rem;
    height: 100%;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ============================================
   Quick Start Tab Styles
   ============================================ */

/* Intro Card */
.intro-card[b-a3ecsyupzo] {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    background: linear-gradient(135deg, var(--kendo-color-primary-subtle) 0%, var(--kendo-color-surface-alt) 100%);
    border-radius: var(--kendo-border-radius-md);
    border-left: 4px solid var(--kendo-color-primary);
}

.intro-card-icon[b-a3ecsyupzo] {
    flex-shrink: 0;
    color: var(--kendo-color-primary);
}

.intro-card-content h4[b-a3ecsyupzo] {
    margin: 0 0 0.5rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
}

.intro-card-content p[b-a3ecsyupzo] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    line-height: 1.5;
}

/* Best Practices Grid */
.best-practices-grid[b-a3ecsyupzo] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.practice-item[b-a3ecsyupzo] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.875rem;
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border-alt);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

    .practice-item:hover[b-a3ecsyupzo] {
        border-color: var(--kendo-color-primary-emphasis);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    }

.practice-icon[b-a3ecsyupzo] {
    flex-shrink: 0;
    color: var(--kendo-color-primary);
    margin-top: 2px;
}

.practice-content[b-a3ecsyupzo] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

    .practice-content strong[b-a3ecsyupzo] {
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
    }

    .practice-content span[b-a3ecsyupzo] {
        font-size: 0.75rem;
        color: var(--kendo-color-subtle);
    }

/* Structure Steps */
.structure-steps[b-a3ecsyupzo] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border-alt);
    border-radius: var(--kendo-border-radius-md);
    padding: 1rem;
}

    .structure-steps h5[b-a3ecsyupzo] {
        margin: 0 0 1rem 0;
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

.steps-container[b-a3ecsyupzo] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    overflow-x: auto;
    padding-bottom: 0.5rem;
}

.step-item[b-a3ecsyupzo] {
    flex: 1;
    min-width: 150px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    text-align: center;
}

.step-number[b-a3ecsyupzo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
    border-radius: 50%;
    font-size: 0.875rem;
    font-weight: 600;
}

.step-label[b-a3ecsyupzo] {
    font-weight: 600;
    font-size: 0.8125rem;
    color: var(--kendo-color-on-app-surface);
}

.step-item code[b-a3ecsyupzo] {
    font-family: 'Cascadia Code', 'Consolas', 'Monaco', monospace;
    font-size: 0.6875rem;
    padding: 0.375rem 0.5rem;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border-alt);
    border-radius: var(--kendo-border-radius-sm);
    color: var(--kendo-color-subtle);
    white-space: nowrap;
}

.step-connector[b-a3ecsyupzo] {
    flex-shrink: 0;
    width: 24px;
    height: 2px;
    background: var(--kendo-color-border);
    margin-top: 14px;
}

/* ============================================
   Sample Prompts Tab Styles
   ============================================ */

/* Samples Header */
.samples-header[b-a3ecsyupzo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}

.samples-hint[b-a3ecsyupzo] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

/* Samples Layout - Split View */
.samples-layout[b-a3ecsyupzo] {
    display: flex;
    gap: 1rem;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* Prompt List Panel */
.prompt-list-panel[b-a3ecsyupzo] {
    width: 260px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.prompt-item[b-a3ecsyupzo] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.75rem;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border-alt);
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.15s ease;
}

    .prompt-item:hover[b-a3ecsyupzo] {
        background: var(--kendo-color-base-hover);
        border-color: var(--kendo-color-border);
    }

    .prompt-item.selected[b-a3ecsyupzo] {
        background: var(--kendo-color-primary-subtle);
        border-color: var(--kendo-color-primary);
    }

.prompt-item-header[b-a3ecsyupzo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.prompt-item-icon[b-a3ecsyupzo] {
    color: var(--kendo-color-primary);
    flex-shrink: 0;
}

.prompt-item.selected .prompt-item-icon[b-a3ecsyupzo] {
    color: var(--kendo-color-primary-on-surface);
}

.prompt-item-name[b-a3ecsyupzo] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prompt-item-category[b-a3ecsyupzo] {
    font-size: 0.6875rem;
    color: var(--kendo-color-subtle);
    padding-left: 1.5rem;
}

/* Preview Panel */
.prompt-preview-panel[b-a3ecsyupzo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border-alt);
    border-radius: var(--kendo-border-radius-md);
    overflow: hidden;
}

.preview-header[b-a3ecsyupzo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--kendo-color-border-alt);
    background: var(--kendo-color-surface-alt);
    flex-shrink: 0;
}

    .preview-header h5[b-a3ecsyupzo] {
        margin: 0;
        font-size: 0.9375rem;
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
    }

.preview-actions[b-a3ecsyupzo] {
    display: flex;
    gap: 0.5rem;
}

.preview-description[b-a3ecsyupzo] {
    margin: 0;
    padding: 0.75rem 1rem;
    font-size: 0.8125rem;
    color: var(--kendo-color-subtle);
    background: var(--kendo-color-surface-alt);
    border-bottom: 1px solid var(--kendo-color-border-alt);
    flex-shrink: 0;
}

.preview-content[b-a3ecsyupzo] {
    flex: 1;
    overflow: auto;
    padding: 1rem;
}

    .preview-content pre[b-a3ecsyupzo] {
        margin: 0;
        font-family: 'Cascadia Code', 'Consolas', 'Monaco', monospace;
        font-size: 0.75rem;
        line-height: 1.6;
        white-space: pre-wrap;
        word-wrap: break-word;
        color: var(--kendo-color-on-app-surface);
    }

/* Preview Placeholder */
.preview-placeholder[b-a3ecsyupzo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    color: var(--kendo-color-subtle);
    padding: 2rem;
}

    .preview-placeholder p[b-a3ecsyupzo] {
        margin: 0;
        font-size: 0.875rem;
    }

/* ============================================
   Code Textarea Styling
   ============================================ */

.pct-textarea-code[b-a3ecsyupzo] {
    font-family: 'Cascadia Code', 'Consolas', 'Monaco', monospace;
    font-size: 0.875rem;
}

[b-a3ecsyupzo] .pct-textarea-code textarea {
    font-family: 'Cascadia Code', 'Consolas', 'Monaco', monospace !important;
}

/* ============================================
   Responsive Adjustments
   ============================================ */

@media (max-width: 768px) {
    .best-practices-grid[b-a3ecsyupzo] {
        grid-template-columns: 1fr;
    }

    .steps-container[b-a3ecsyupzo] {
        flex-direction: column;
        align-items: stretch;
    }

    .step-connector[b-a3ecsyupzo] {
        width: 2px;
        height: 16px;
        margin: 0 auto;
    }

    .step-item[b-a3ecsyupzo] {
        min-width: auto;
    }

    .samples-layout[b-a3ecsyupzo] {
        flex-direction: column;
    }

    .prompt-list-panel[b-a3ecsyupzo] {
        width: 100%;
        max-height: 200px;
        padding-right: 0;
    }

    .samples-header[b-a3ecsyupzo] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

/* ============================================
   Dark Theme Specific Overrides
   ============================================ */

@media (prefers-color-scheme: dark) {
    .intro-card[b-a3ecsyupzo] {
        background: linear-gradient(135deg, rgba(129, 85, 185, 0.15) 0%, var(--kendo-color-surface-alt) 100%);
    }

    .practice-item:hover[b-a3ecsyupzo] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    }

    .preview-content pre[b-a3ecsyupzo] {
        color: var(--kendo-color-on-app-surface);
    }
}

/* Dark theme via data attribute (for Telerik theme switching) */
[data-theme="dark"] .intro-card[b-a3ecsyupzo],
.k-dark .intro-card[b-a3ecsyupzo] {
    background: linear-gradient(135deg, rgba(129, 85, 185, 0.2) 0%, var(--kendo-color-surface-alt) 100%);
}

[data-theme="dark"] .practice-item:hover[b-a3ecsyupzo],
.k-dark .practice-item:hover[b-a3ecsyupzo] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

/* ============================================
   Print Styles
   ============================================ */

@media print {
    .prompt-guide-wrapper[b-a3ecsyupzo] {
        max-height: none;
        overflow: visible;
    }

    .preview-actions[b-a3ecsyupzo],
    .samples-header[b-a3ecsyupzo] {
        display: none;
    }
}
/* /Components/Pages/Admin/ApiKeyManagement.razor.rz.scp.css */
body[b-zoa3efyafd] {
}
/* /Components/Pages/Admin/AppGlobals/ConfigData.razor.rz.scp.css */
body[b-tuyjukei6c] {
}

/* /Components/Pages/Admin/ApplicationSettingsConfig.razor.rz.scp.css */
.tabs-container[b-gtft3aybp8] {
    height: calc(100vh - 202px);
    display: flex;
    flex-direction: column;
}

    .tabs-container[b-gtft3aybp8]  .k-tabstrip {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .tabs-container[b-gtft3aybp8]  .k-tabstrip-items-wrapper {
        flex-shrink: 0;
    }

    .tabs-container[b-gtft3aybp8]  .k-tabstrip-content {
        flex: 1;
        overflow: hidden;
        padding: 0;
    }

.tab-content-scroll[b-gtft3aybp8] {
    height: 100%;
    overflow-y: auto;
    padding: 8px;
    background: var(--kendo-color-app-surface);
}

.admin-title[b-gtft3aybp8] {
    font-size: 2rem;
    font-weight: 400;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: 8px;
}

.admin-subtitle[b-gtft3aybp8] {
    font-size: 1rem;
    color: var(--kendo-color-subtle);
    margin: 0;
}

.config-section[b-gtft3aybp8] {
    padding: 24px 0;
}

    .config-section:first-child[b-gtft3aybp8] {
        padding-top: 8px;
    }

.section-header[b-gtft3aybp8] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--kendo-color-border);
    position: sticky;
    top: 0;
    background: var(--kendo-color-app-surface);
    z-index: 1;
}

.section-icon[b-gtft3aybp8] {
    font-size: 24px;
    color: var(--kendo-color-primary);
}

.section-header h3[b-gtft3aybp8] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--kendo-color-on-app-surface);
    flex: 1;
}

.env-filter-bar[b-gtft3aybp8] {
    margin-bottom: 24px;
    display: flex;
    gap: 12px;
    align-items: center;
    position: sticky;
    top: 0;
    background: var(--kendo-color-app-surface);
    z-index: 1;
    padding: 8px 0;
}

.settings-grid[b-gtft3aybp8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 16px;
    padding-bottom: 24px;
}

.setting-card[b-gtft3aybp8] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: 8px;
    padding: 16px;
    transition: all 0.2s ease;
}

    .setting-card:hover[b-gtft3aybp8] {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        border-color: var(--kendo-color-primary-subtle);
    }

.setting-content[b-gtft3aybp8] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.setting-key[b-gtft3aybp8] {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--kendo-color-on-app-surface);
    word-break: break-word;
}

.setting-value[b-gtft3aybp8] {
    font-family: 'SF Mono', 'Consolas', monospace;
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    word-break: break-all;
    padding: 8px;
    background: var(--kendo-color-base-subtle);
    border-radius: 4px;
}

.sensitive-value[b-gtft3aybp8] {
    color: var(--kendo-color-warning);
    background: var(--kendo-color-warning-subtle-active);
}

.access-denied-card[b-gtft3aybp8] {
    max-width: 600px;
    margin: 48px auto;
    text-align: center;
}

    .access-denied-card h2[b-gtft3aybp8] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        color: var(--kendo-color-error);
    }

/* Dark theme adjustments */
@media (prefers-color-scheme: dark) {
    .tab-content-scroll[b-gtft3aybp8] {
        background: var(--kendo-color-app-surface);
    }

    .section-header[b-gtft3aybp8] {
        background: var(--kendo-color-app-surface);
    }

    .env-filter-bar[b-gtft3aybp8] {
        background: var(--kendo-color-app-surface);
    }

    .setting-card[b-gtft3aybp8] {
        background: var(--kendo-color-surface-alt);
    }

    .setting-value[b-gtft3aybp8] {
        background: rgba(255, 255, 255, 0.05);
    }

    .sensitive-value[b-gtft3aybp8] {
        background: rgba(245, 158, 11, 0.15);
    }
}

/* Responsive design */
@media (max-width: 768px) {
    .tabs-container[b-gtft3aybp8] {
        height: calc(100vh - 220px);
    }

    .tab-content-scroll[b-gtft3aybp8] {
        padding: 16px;
    }

    .settings-grid[b-gtft3aybp8] {
        grid-template-columns: 1fr;
    }

    .env-filter-bar[b-gtft3aybp8] {
        flex-direction: column;
        align-items: stretch;
    }

        .env-filter-bar .k-textbox[b-gtft3aybp8] {
            width: 100% !important;
        }
}
/* /Components/Pages/Admin/Correspondence/ConfigData.razor.rz.scp.css */
body[b-s6rbc0xruh] {
}

/* /Components/Pages/Admin/DocumentManagement/ConfigData.razor.rz.scp.css */
body[b-zfgy2tu8di] {
}

/* /Components/Pages/Admin/Index.razor.rz.scp.css */
/* Admin Container */
.admin-container[b-zoeq5pgtop] {
    height: calc(100vh - 84px);
    overflow-y: auto;
    padding-bottom: 0px;
    padding-left: var(--kendo-spacing-4);
    padding-right: var(--kendo-spacing-6);
    background: var(--kendo-color-base);
}

/* Header Section */
.admin-header[b-zoeq5pgtop] {
    margin-bottom: var(--kendo-spacing-8);
}

.admin-title[b-zoeq5pgtop] {
    font-size: 2.5rem;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: var(--kendo-spacing-2);
}

.admin-subtitle[b-zoeq5pgtop] {
    font-size: 1.125rem;
    color: var(--kendo-color-subtle);
    margin: 0;
}

/* Section Headers */
.section-title[b-zoeq5pgtop] {
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: var(--kendo-spacing-6);
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
}

.section-header[b-zoeq5pgtop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--kendo-spacing-6);
}

/* Metrics Section */
.metrics-section[b-zoeq5pgtop] {
    margin-bottom: var(--kendo-spacing-10);
}

.metrics-grid[b-zoeq5pgtop] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: var(--kendo-spacing-6);
}

.metric-card[b-zoeq5pgtop] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-6);
    transition: all 0.2s ease;
}

    .metric-card:hover[b-zoeq5pgtop] {
        box-shadow: var(--kendo-elevation-3);
        transform: translateY(-2px);
    }

    .metric-card.status-warning[b-zoeq5pgtop] {
        border-color: var(--kendo-color-warning-subtle);
        background: var(--kendo-color-warning-subtle-active);
    }

    .metric-card.status-critical[b-zoeq5pgtop] {
        border-color: var(--kendo-color-error-subtle);
        background: var(--kendo-color-error-subtle-active);
    }

.metric-header[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
    margin-bottom: var(--kendo-spacing-4);
}

.metric-icon[b-zoeq5pgtop] {
    font-size: 1.5rem;
    color: var(--kendo-color-primary);
}

.metric-label[b-zoeq5pgtop] {
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
}

.metric-content[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-6);
}

.metric-gauge[b-zoeq5pgtop] {
    flex-shrink: 0;
}

.metric-details[b-zoeq5pgtop] {
    flex: 1;
}

.metric-value[b-zoeq5pgtop] {
    font-size: 2rem;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    line-height: 1;
    margin-bottom: var(--kendo-spacing-2);
}

.metric-subtext[b-zoeq5pgtop] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    margin-bottom: var(--kendo-spacing-3);
}

.metric-info[b-zoeq5pgtop] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1);
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

/* Environment Info */
.environment-info[b-zoeq5pgtop] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-3);
}

.info-row[b-zoeq5pgtop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.info-label[b-zoeq5pgtop] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

.info-value[b-zoeq5pgtop] {
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
}

.environment-chip.env-production[b-zoeq5pgtop] {
    background: var(--kendo-color-error);
    color: var(--kendo-color-on-error);
}

.environment-chip.env-staging[b-zoeq5pgtop] {
    background: var(--kendo-color-warning);
    color: var(--kendo-color-on-warning);
}

.environment-chip.env-development[b-zoeq5pgtop] {
    background: var(--kendo-color-success);
    color: var(--kendo-color-on-success);
}

/* Time Zone Info */
.timezone-info[b-zoeq5pgtop] {
    padding-top: var(--kendo-spacing-4);
}

.time-display[b-zoeq5pgtop] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-3);
}

.time-zone[b-zoeq5pgtop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.zone-label[b-zoeq5pgtop] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    font-weight: 500;
}

.zone-time[b-zoeq5pgtop] {
    font-family: monospace;
    font-size: 0.875rem;
    color: var(--kendo-color-on-app-surface);
}

/* Quick Actions */
.quick-actions-section[b-zoeq5pgtop] {
    margin-top: var(--kendo-spacing-10);
    margin-bottom: var(--kendo-spacing-10);
}

.quick-actions-grid[b-zoeq5pgtop] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: var(--kendo-spacing-4);
}

[b-zoeq5pgtop] .quick-action-button {
    width: 100%;
    height: auto;
    padding: var(--kendo-spacing-6);
    justify-content: flex-start;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    transition: all 0.2s ease;
}

    [b-zoeq5pgtop] .quick-action-button:hover {
        background: var(--kendo-color-base-hover);
        border-color: var(--kendo-color-primary);
        transform: translateY(-2px);
        box-shadow: var(--kendo-elevation-2);
    }

    [b-zoeq5pgtop] .quick-action-button .k-button-icon {
        font-size: 2rem;
        margin-right: var(--kendo-spacing-4);
    }

.button-content[b-zoeq5pgtop] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.button-title[b-zoeq5pgtop] {
    font-weight: 500;
    font-size: 1rem;
    margin-bottom: var(--kendo-spacing-1);
    color: var(--kendo-color-on-app-surface);
}

.button-subtitle[b-zoeq5pgtop] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    font-weight: normal;
}

/* Module Configuration */
.modules-section[b-zoeq5pgtop] {
    margin-bottom: var(--kendo-spacing-10);
}

.section-actions[b-zoeq5pgtop] {
    display: flex;
    gap: var(--kendo-spacing-4);
}

.module-category-card[b-zoeq5pgtop] {
    margin-top: var(--kendo-spacing-8);
    margin-bottom: var(--kendo-spacing-8);
    border: 1px solid var(--kendo-color-border);
}

.category-header[b-zoeq5pgtop] {
    padding: var(--kendo-spacing-4) var(--kendo-spacing-6);
    background: var(--kendo-color-base-subtle);
    border-bottom: 1px solid var(--kendo-color-border);
}

.category-title[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
    cursor: pointer;
    user-select: none;
}

    .category-title h3[b-zoeq5pgtop] {
        margin: 0;
        font-size: 1.125rem;
        font-weight: 500;
        flex: 1;
    }

.module-count-chip[b-zoeq5pgtop] {
    font-size: 0.75rem;
}

.module-list-card[b-zoeq5pgtop] {
    border: 1px solid var(--kendo-color-border);
}

.module-grid[b-zoeq5pgtop] {
    display: grid;
    gap: var(--kendo-spacing-2);
}

.module-item[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-4);
    padding: var(--kendo-spacing-4);
    background: var(--kendo-color-base);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .module-item:hover[b-zoeq5pgtop] {
        background: var(--kendo-color-base-hover);
        border-color: var(--kendo-color-primary);
        transform: translateX(4px);
    }

.module-icon[b-zoeq5pgtop] {
    font-size: 1.5rem;
    color: var(--kendo-color-primary);
    flex-shrink: 0;
}

.module-content[b-zoeq5pgtop] {
    flex: 1;
}

.module-name[b-zoeq5pgtop] {
    margin: 0 0 var(--kendo-spacing-1) 0;
    font-size: 1rem;
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
}

.module-description[b-zoeq5pgtop] {
    margin: 0 0 var(--kendo-spacing-2) 0;
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

.module-category[b-zoeq5pgtop] {
    font-size: 0.75rem;
    color: var(--kendo-color-subtle);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.module-badge[b-zoeq5pgtop] {
    flex-shrink: 0;
}

.module-arrow[b-zoeq5pgtop] {
    color: var(--kendo-color-subtle);
    flex-shrink: 0;
}

/* Reference Section */
.reference-section[b-zoeq5pgtop] {
    margin-bottom: var(--kendo-spacing-10);
}

.badge-showcase[b-zoeq5pgtop] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-4);
    align-items: center;
}

.badge-item[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
}

/* Detailed System Metrics */
.detailed-metrics-section[b-zoeq5pgtop] {
    margin-top: var(--kendo-spacing-10);
    margin-bottom: var(--kendo-spacing-8);
}

.section-header-expandable[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    padding: var(--kendo-spacing-3) 0;
    margin-top: var(--kendo-spacing-8);
    margin-bottom: var(--kendo-spacing-8);
    cursor: pointer;
    user-select: none;
}

.expandable-title[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
    font-size: 1rem;
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
}

    .expandable-title > span[b-zoeq5pgtop] {
        margin-right: var(--kendo-spacing-2);
    }

.detailed-metrics-grid[b-zoeq5pgtop] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--kendo-spacing-6);
}

.detail-stats[b-zoeq5pgtop] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-2);
    width: 100%;
}

.stat-item[b-zoeq5pgtop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--kendo-spacing-1) 0;
    font-size: 0.875rem;
}

.stat-label[b-zoeq5pgtop] {
    color: var(--kendo-color-subtle);
    font-weight: 400;
}

.stat-value[b-zoeq5pgtop] {
    color: var(--kendo-color-on-app-surface);
    font-weight: 500;
}

.fragmentation-high[b-zoeq5pgtop] {
    color: var(--kendo-color-error) !important;
}

.fragmentation-medium[b-zoeq5pgtop] {
    color: var(--kendo-color-warning) !important;
}

.gen2-frequent[b-zoeq5pgtop] {
    color: var(--kendo-color-warning) !important;
}

/* Circuit Health Indicators */
.circuit-healthy[b-zoeq5pgtop] {
    border-color: var(--kendo-color-success-subtle);
}

.circuit-warning[b-zoeq5pgtop] {
    border-color: var(--kendo-color-warning-subtle);
    background: var(--kendo-color-warning-subtle-active);
}

.circuit-unhealthy[b-zoeq5pgtop] {
    border-color: var(--kendo-color-error-subtle);
    background: var(--kendo-color-error-subtle-active);
}

.latency-high[b-zoeq5pgtop] {
    color: var(--kendo-color-error) !important;
}

.latency-medium[b-zoeq5pgtop] {
    color: var(--kendo-color-warning) !important;
}

.stat-warning[b-zoeq5pgtop] {
    color: var(--kendo-color-warning) !important;
    font-weight: 600;
}

/* Dark Theme Adjustments */

/* Dark Theme Adjustments */
@media (prefers-color-scheme: dark) {
    .admin-container[b-zoeq5pgtop] {
        background: var(--kendo-color-app-surface);
    }

    .metric-card[b-zoeq5pgtop] {
        background: var(--kendo-color-surface-alt);
    }

    [b-zoeq5pgtop] .quick-action-button {
        background: var(--kendo-color-surface-alt);
        color: var(--kendo-color-on-app-surface);
    }

    .module-item[b-zoeq5pgtop] {
        background: var(--kendo-color-surface-alt);
    }

    .ai-feature-card[b-zoeq5pgtop] {
        background: var(--kendo-color-surface-alt);
    }

    .ai-features-content[b-zoeq5pgtop] {
        background: var(--kendo-color-surface-alt);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .metrics-grid[b-zoeq5pgtop] {
        grid-template-columns: 1fr;
    }

    .quick-actions-grid[b-zoeq5pgtop] {
        grid-template-columns: 1fr;
    }

    .section-header[b-zoeq5pgtop] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--kendo-spacing-4);
    }

    .metric-content[b-zoeq5pgtop] {
        flex-direction: column;
        text-align: center;
    }

    .ai-features-grid[b-zoeq5pgtop] {
        grid-template-columns: 1fr;
    }
}


/* Database Contexts Section */
.db-contexts-section[b-zoeq5pgtop] {
    margin-top: 2rem;
}

.db-contexts-grid[b-zoeq5pgtop] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1.5rem;
    margin-top: 1rem;
}

/* Database Context Health Status Classes */
.db-context-healthy[b-zoeq5pgtop] {
    border-left: 3px solid var(--kendo-color-success);
}

.db-context-unhealthy[b-zoeq5pgtop] {
    border-left: 3px solid var(--kendo-color-error);
    background-color: var(--kendo-color-error-subtle);
}

/* Stacked Stat Item for Connection String */
.stat-item-stacked[b-zoeq5pgtop] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem 0;
    border-top: 1px solid var(--kendo-color-border);
    margin-top: 0.5rem;
    grid-column: 1 / -1;
}

    .stat-item-stacked .stat-label[b-zoeq5pgtop] {
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: var(--kendo-color-subtle);
        margin-bottom: 0.25rem;
    }

    .stat-item-stacked .stat-value[b-zoeq5pgtop] {
        font-size: 0.875rem;
        color: var(--kendo-color-on-app-surface);
        font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
        word-break: break-all;
        line-height: 1.5;
        padding: 0.5rem;
        background-color: var(--kendo-color-surface-alt);
        border-radius: 4px;
        max-height: 4.5rem;
        overflow-y: auto;
    }

/* Connection String with Ellipsis Option */
.connection-string-value[b-zoeq5pgtop] {
    display: block;
    white-space: normal;
    cursor: help;
}

/* Alternative: Ellipsis truncation (uncomment if preferred) */
/*
.connection-string-value {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: help;
}
*/

/* Status indicators for values */
.stat-success[b-zoeq5pgtop] {
    color: var(--kendo-color-success);
    font-weight: 600;
}

.stat-warning[b-zoeq5pgtop] {
    color: var(--kendo-color-warning);
    font-weight: 600;
}

/* No Data Message */
.no-data-message[b-zoeq5pgtop] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    color: var(--kendo-color-subtle);
    gap: 1rem;
}

    .no-data-message svg[b-zoeq5pgtop] {
        font-size: 3rem;
        opacity: 0.5;
    }

    .no-data-message p[b-zoeq5pgtop] {
        font-size: 1rem;
        margin: 0;
    }

/* Expandable Section Header */
.section-header-expandable[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    padding: 1rem;
    background-color: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 200ms ease;
}

    .section-header-expandable:hover[b-zoeq5pgtop] {
        background-color: var(--kendo-color-surface-alt);
    }

.expandable-title[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    font-size: 1.125rem;
    font-weight: 600;
}

    .expandable-title svg:first-child[b-zoeq5pgtop] {
        transition: transform 200ms ease;
    }

/* Responsive adjustments */
@media (max-width: 768px) {
    .db-contexts-grid[b-zoeq5pgtop] {
        grid-template-columns: 1fr;
    }

    .stat-item-stacked .stat-value[b-zoeq5pgtop] {
        font-size: 0.75rem;
        max-height: 6rem;
    }
}

/* Scrollbar styling for connection string */
.stat-item-stacked .stat-value[b-zoeq5pgtop]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.stat-item-stacked .stat-value[b-zoeq5pgtop]::-webkit-scrollbar-track {
    background: var(--kendo-color-base-subtle);
    border-radius: 3px;
}

.stat-item-stacked .stat-value[b-zoeq5pgtop]::-webkit-scrollbar-thumb {
    background: var(--kendo-color-base);
    border-radius: 3px;
}

    .stat-item-stacked .stat-value[b-zoeq5pgtop]::-webkit-scrollbar-thumb:hover {
        background: var(--kendo-color-base-emphasis);
    }

/* ================================================================
   AI FEATURES SECTION
   ================================================================ */
.ai-features-section[b-zoeq5pgtop] {
    margin-top: var(--kendo-spacing-10);
    margin-bottom: var(--kendo-spacing-10);
}

.ai-features-content[b-zoeq5pgtop] {
    margin-top: var(--kendo-spacing-6);
    padding: var(--kendo-spacing-6);
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
}

.ai-features-description[b-zoeq5pgtop] {
    margin-bottom: var(--kendo-spacing-6);
}

    .ai-features-description p[b-zoeq5pgtop] {
        margin: 0;
        font-size: 0.9375rem;
        color: var(--kendo-color-subtle);
        line-height: 1.6;
    }

.ai-features-grid[b-zoeq5pgtop] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: var(--kendo-spacing-6);
}

.ai-feature-card[b-zoeq5pgtop] {
    display: flex;
    align-items: flex-start;
    gap: var(--kendo-spacing-4);
    padding: var(--kendo-spacing-5);
    background: var(--kendo-color-base);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}

    .ai-feature-card:hover[b-zoeq5pgtop] {
        background: var(--kendo-color-base-hover);
        border-color: var(--kendo-color-tertiary);
        box-shadow: var(--kendo-elevation-3);
        transform: translateY(-2px);
    }

        .ai-feature-card:hover .ai-feature-icon-wrapper[b-zoeq5pgtop] {
            background: var(--kendo-color-tertiary);
        }

        .ai-feature-card:hover .ai-feature-icon[b-zoeq5pgtop] {
            color: var(--kendo-color-on-primary);
        }

        .ai-feature-card:hover .ai-feature-arrow[b-zoeq5pgtop] {
            color: var(--kendo-color-tertiary);
            transform: translateX(4px);
        }

.ai-feature-icon-wrapper[b-zoeq5pgtop] {
    width: 48px;
    height: 48px;
    min-width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--kendo-color-tertiary-subtle, #e8f0fe) 0%, var(--kendo-color-primary-subtle, #deecf9) 100%);
    border-radius: var(--kendo-border-radius-md);
    transition: all 0.2s ease;
}

.ai-feature-icon[b-zoeq5pgtop] {
    width: 24px;
    height: 24px;
    color: var(--kendo-color-tertiary, #6366f1);
    transition: color 0.2s ease;
}

.ai-feature-content[b-zoeq5pgtop] {
    flex: 1;
    min-width: 0;
}

.ai-feature-title[b-zoeq5pgtop] {
    margin: 0 0 var(--kendo-spacing-2) 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    line-height: 1.3;
}

.ai-feature-description[b-zoeq5pgtop] {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--kendo-color-subtle);
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ai-feature-meta[b-zoeq5pgtop] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: var(--kendo-spacing-3);
}

.ai-feature-arrow[b-zoeq5pgtop] {
    width: 16px;
    height: 16px;
    color: var(--kendo-color-subtle);
    transition: all 0.2s ease;
}

/* AI Section Chip Styling */
[b-zoeq5pgtop] .k-chip-solid-tertiary {
    background-color: var(--kendo-color-tertiary, #6366f1);
    color: var(--kendo-color-on-primary, #ffffff);
    border-color: var(--kendo-color-tertiary, #6366f1);
}

/* AI Features Section Dark Theme */
@media (prefers-color-scheme: dark) {
    .ai-features-content[b-zoeq5pgtop] {
        background: var(--kendo-color-surface-alt);
    }

    .ai-feature-card[b-zoeq5pgtop] {
        background: var(--kendo-color-surface);
    }

        .ai-feature-card:hover[b-zoeq5pgtop] {
            background: var(--kendo-color-base-hover);
        }

    .ai-feature-icon-wrapper[b-zoeq5pgtop] {
        background: linear-gradient(135deg, rgba(99, 102, 241, 0.2) 0%, rgba(0, 120, 212, 0.2) 100%);
    }
}

/* AI Features Responsive */
@media (max-width: 768px) {
    .ai-features-grid[b-zoeq5pgtop] {
        grid-template-columns: 1fr;
    }

    .ai-feature-card[b-zoeq5pgtop] {
        padding: var(--kendo-spacing-4);
    }

    .ai-feature-icon-wrapper[b-zoeq5pgtop] {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }

    .ai-feature-icon[b-zoeq5pgtop] {
        width: 20px;
        height: 20px;
    }
}
/* /Components/Pages/Admin/Issues/ConfigData.razor.rz.scp.css */
body[b-dfvvsb7xos] {
}

/* /Components/Pages/Admin/LogViewer.razor.rz.scp.css */
/* ============================================================================
   Log Viewer - Main Container
   ============================================================================ */

.log-viewer-container[b-lvie1tmf3q] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 84px);
    background: var(--kendo-color-surface, #f8f8f8);
    border-radius: var(--kendo-border-radius-lg, 8px);
    overflow: hidden;
}

/* ============================================================================
   Header Section
   ============================================================================ */

.log-viewer-header[b-lvie1tmf3q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--kendo-spacing-6, 1.5rem) var(--kendo-spacing-6, 1.5rem) var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-app-surface, #ffffff);
    border-bottom: 1px solid var(--kendo-color-border, #e0e0e0);
    gap: var(--kendo-spacing-4, 1rem);
}

.log-viewer-title-section[b-lvie1tmf3q] {
    flex: 1;
    min-width: 0;
}

.log-viewer-title[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    margin: 0 0 var(--kendo-spacing-1, 0.25rem) 0;
    font-size: var(--kendo-font-size-xl, 1.25rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.log-viewer-subtitle[b-lvie1tmf3q] {
    margin: 0;
    font-size: var(--kendo-font-size-sm, 0.875rem);
    color: var(--kendo-color-subtle, #6e6e6e);
    line-height: 1.4;
}

.log-viewer-toolbar[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
}

/* ============================================================================
   Content Section - Split Layout
   ============================================================================ */

.log-viewer-content[b-lvie1tmf3q] {
    display: grid;
    grid-template-columns: 480px 1fr;
    gap: var(--kendo-spacing-1, 0.25rem);
    flex: 1;
    min-height: 0;
    padding: var(--kendo-spacing-1, 0.25rem);
}

/* ============================================================================
   Files Panel
   ============================================================================ */

.log-files-panel[b-lvie1tmf3q] {
    display: flex;
    flex-direction: column;
    background: var(--kendo-color-app-surface, #ffffff);
    border-radius: var(--kendo-border-radius-md, 4px);
    border: 1px solid var(--kendo-color-border, #e0e0e0);
    overflow: hidden;
}

.panel-header[b-lvie1tmf3q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--kendo-spacing-4, 1rem) var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-surface-alt, #fafafa);
    border-bottom: 1px solid var(--kendo-color-border, #e0e0e0);
    gap: var(--kendo-spacing-2, 0.5rem);
}

.panel-title[b-lvie1tmf3q] {
    display: flex;
    align-items: center;    
    gap: var(--kendo-spacing-2, 0.5rem);
    margin: 0;
    font-size: var(--kendo-font-size-md, 1rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.files-grid-container[b-lvie1tmf3q] {
    flex: 1;
    min-height: 0;
}

[b-lvie1tmf3q] .log-files-grid {
    height: 100%;
}

    [b-lvie1tmf3q] .log-files-grid .k-grid-header {
        background: var(--kendo-color-surface-alt, #fafafa);
    }

    [b-lvie1tmf3q] .log-files-grid .k-grid-content {
        overflow-y: auto;
    }

    [b-lvie1tmf3q] .log-files-grid .k-table-row.k-selected {
        background: var(--kendo-color-primary-subtle, #f0e1fe);
        border-left: 3px solid var(--kendo-color-primary, #8155b9);
    }

    [b-lvie1tmf3q] .log-files-grid .k-table-row:hover {
        background: var(--kendo-color-base-hover, #f5f5f5);
        cursor: pointer;
    }

/* File name cell styling */
.file-name-cell[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    padding: var(--kendo-spacing-1, 0.25rem) 0;
}

.file-name[b-lvie1tmf3q] {
    font-family: var(--kendo-font-family-monospace, 'Courier New', monospace);
    font-size: var(--kendo-font-size-sm, 0.875rem);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.timestamp-cell[b-lvie1tmf3q],
.file-size-cell[b-lvie1tmf3q] {
    font-size: var(--kendo-font-size-sm, 0.875rem);
    color: var(--kendo-color-subtle, #6e6e6e);
}

.file-size[b-lvie1tmf3q] {
    font-family: var(--kendo-font-family-monospace, 'Courier New', monospace);
    font-weight: var(--kendo-font-weight-medium, 500);
}

/* ============================================================================
   Content Panel
   ============================================================================ */

.log-content-panel[b-lvie1tmf3q] {
    display: flex;
    flex-direction: column;
    background: var(--kendo-color-app-surface, #ffffff);
    border-radius: var(--kendo-border-radius-md, 4px);
    border: 1px solid var(--kendo-color-border, #e0e0e0);
    overflow: hidden;
}

.log-info[b-lvie1tmf3q] {
    flex: 1;
    min-width: 0;
}

.log-metadata[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    margin-top: var(--kendo-spacing-1, 0.25rem);
    font-size: var(--kendo-font-size-sm, 0.875rem);
    color: var(--kendo-color-subtle, #6e6e6e);
}

.metadata-item[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-1, 0.25rem);
}

.metadata-separator[b-lvie1tmf3q] {
    color: var(--kendo-color-border, #e0e0e0);
}

.content-controls[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
}

[b-lvie1tmf3q] .search-box input {
    font-size: var(--kendo-font-size-sm, 0.875rem);
}

[b-lvie1tmf3q] .level-filter {
    min-width: 140px;
}

.filter-value[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-1, 0.25rem);
}

[b-lvie1tmf3q] .auto-refresh-switch {
    border: 1px solid var(--kendo-color-border, #e0e0e0);
    border-radius: var(--kendo-border-radius-md, 4px);
}

/* ============================================================================
   Log Statistics Bar
   ============================================================================ */

.log-stats-bar[b-lvie1tmf3q] {
    display: flex;
    gap: var(--kendo-spacing-4, 1rem);
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-surface-alt, #fafafa);
    border-bottom: 1px solid var(--kendo-color-border, #e0e0e0);
}

.stat-item[b-lvie1tmf3q] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    font-size: var(--kendo-font-size-sm, 0.875rem);
    font-weight: var(--kendo-font-weight-medium, 500);
}

.stat-error[b-lvie1tmf3q] {
    color: var(--kendo-color-error, #c2666b);
}

.stat-warning[b-lvie1tmf3q] {
    color: var(--kendo-color-warning, #ffc80a);
}

.stat-info[b-lvie1tmf3q] {
    color: var(--kendo-color-info, #0a7eff);
}

.stat-debug[b-lvie1tmf3q] {
    color: var(--kendo-color-subtle, #6e6e6e);
}

/* ============================================================================
   Log Content Viewer
   ============================================================================ */

.log-content-viewer[b-lvie1tmf3q] {
    flex: 1;
    min-height: 0;
    position: relative;
    overflow: hidden;
}

.log-content[b-lvie1tmf3q] {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: var(--kendo-spacing-4, 1rem);
    font-family: var(--kendo-font-family-monospace, 'Courier New', monospace);
    font-size: 0.8125rem;
    line-height: 1.6;
    color: var(--kendo-color-on-app-surface, #323130);
    background: var(--kendo-color-app-surface, #ffffff);
    white-space: pre-wrap;
    word-wrap: break-word;
    overflow: auto;
}

/* Log level formatting */
[b-lvie1tmf3q] .log-level {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: var(--kendo-border-radius-sm, 2px);
    font-weight: var(--kendo-font-weight-semibold, 600);
    font-size: 0.75rem;
}

[b-lvie1tmf3q] .log-level-icon {
    font-size: 0.625rem;
    line-height: 1;
}

[b-lvie1tmf3q] .log-level-error {
    background: var(--kendo-color-error-subtle, #fde7e9);
    color: var(--kendo-color-error, #c2666b);
    border: 1px solid var(--kendo-color-error-emphasis, #a4262c);
}

[b-lvie1tmf3q] .log-level-warning {
    background: var(--kendo-color-warning-subtle, #fff4ce);
    color: var(--kendo-color-warning-emphasis, #7a6000);
    border: 1px solid var(--kendo-color-warning, #ffc80a);
}

[b-lvie1tmf3q] .log-level-info {
    background: var(--kendo-color-info-subtle, #cee5ff);
    color: var(--kendo-color-info-hover, #096edf);
    border: 1px solid var(--kendo-color-info, #0a7eff);
}

[b-lvie1tmf3q] .log-level-debug {
    background: var(--kendo-color-base-subtle, #f8f8f8);
    color: var(--kendo-color-subtle, #6e6e6e);
    border: 1px solid var(--kendo-color-border, #e0e0e0);
}

[b-lvie1tmf3q] .log-timestamp {
    color: var(--kendo-color-primary, #8155b9);
    font-weight: var(--kendo-font-weight-medium, 500);
}

[b-lvie1tmf3q] .search-highlight {
    background: var(--kendo-color-warning-subtle, #fff4ce);
    color: var(--kendo-color-warning-emphasis, #7a6000);
    padding: 0.125rem 0.25rem;
    border-radius: var(--kendo-border-radius-sm, 2px);
    font-weight: var(--kendo-font-weight-semibold, 600);
}

/* ============================================================================
   State Overlays
   ============================================================================ */

.loading-overlay[b-lvie1tmf3q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--kendo-spacing-4, 1rem);
    height: 100%;
    background: var(--kendo-color-app-surface, #ffffff);
}

.loading-text[b-lvie1tmf3q] {
    margin: 0;
    font-size: var(--kendo-font-size-md, 1rem);
    color: var(--kendo-color-subtle, #6e6e6e);
}

.empty-state[b-lvie1tmf3q],
.error-state[b-lvie1tmf3q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--kendo-spacing-3, 0.75rem);
    height: 100%;
    text-align: center;
    padding: var(--kendo-spacing-8, 2rem);
}

    .empty-state h4[b-lvie1tmf3q],
    .error-state h4[b-lvie1tmf3q] {
        margin: 0;
        font-size: var(--kendo-font-size-lg, 1.125rem);
        font-weight: var(--kendo-font-weight-semibold, 600);
        color: var(--kendo-color-on-app-surface, #323130);
    }

    .empty-state p[b-lvie1tmf3q],
    .error-state p[b-lvie1tmf3q] {
        margin: 0;
        font-size: var(--kendo-font-size-md, 1rem);
        color: var(--kendo-color-subtle, #6e6e6e);
        max-width: 400px;
    }

    .empty-state[b-lvie1tmf3q]  .k-svg-icon,
    .error-state[b-lvie1tmf3q]  .k-svg-icon {
        color: var(--kendo-color-subtle, #6e6e6e);
        opacity: 0.5;
    }

.empty-state-container[b-lvie1tmf3q] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--kendo-spacing-8, 2rem);
}

.unauthorized-state[b-lvie1tmf3q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--kendo-spacing-4, 1rem);
    height: calc(100vh - 164px);
    text-align: center;
    padding: var(--kendo-spacing-8, 2rem);
}

    .unauthorized-state h4[b-lvie1tmf3q] {
        margin: 0;
        font-size: var(--kendo-font-size-xl, 1.25rem);
        font-weight: var(--kendo-font-weight-semibold, 600);
        color: var(--kendo-color-error, #c2666b);
    }

    .unauthorized-state p[b-lvie1tmf3q] {
        margin: 0;
        font-size: var(--kendo-font-size-md, 1rem);
        color: var(--kendo-color-subtle, #6e6e6e);
    }

    .unauthorized-state[b-lvie1tmf3q]  .k-svg-icon {
        color: var(--kendo-color-error, #c2666b);
    }

/* ============================================================================
   Dark Theme Overrides
   ============================================================================ */

[data-theme="dark"] .log-viewer-container[b-lvie1tmf3q] {
    background: var(--kendo-color-surface, #1f1f1f);
}

[data-theme="dark"] .log-viewer-header[b-lvie1tmf3q],
[data-theme="dark"] .log-files-panel[b-lvie1tmf3q],
[data-theme="dark"] .log-content-panel[b-lvie1tmf3q] {
    background: var(--kendo-color-app-surface, #1a1a1a);
    border-color: var(--kendo-color-border, #4d4d4d);
}

[data-theme="dark"] .panel-header[b-lvie1tmf3q],
[data-theme="dark"] .log-stats-bar[b-lvie1tmf3q] {
    background: var(--kendo-color-surface-alt, #303030);
    border-color: var(--kendo-color-border, #4d4d4d);
}

[data-theme="dark"][b-lvie1tmf3q]  .log-files-grid .k-grid-header {
    background: var(--kendo-color-surface-alt, #303030);
}

[data-theme="dark"][b-lvie1tmf3q]  .log-files-grid .k-table-row:hover {
    background: var(--kendo-color-base-hover, #303030);
}

[data-theme="dark"][b-lvie1tmf3q]  .log-files-grid .k-table-row.k-selected {
    background: var(--kendo-color-primary-subtle, #432d5f);
    border-left-color: var(--kendo-color-primary, #bfa1e0);
}

[data-theme="dark"] .log-content[b-lvie1tmf3q] {
    background: var(--kendo-color-app-surface, #1a1a1a);
    color: var(--kendo-color-on-app-surface, #ffffff);
}

[data-theme="dark"][b-lvie1tmf3q]  .log-level-error {
    background: rgba(239, 68, 68, 0.15);
    color: #ef4444;
    border-color: #ef4444;
}

[data-theme="dark"][b-lvie1tmf3q]  .log-level-warning {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
    border-color: #f59e0b;
}

[data-theme="dark"][b-lvie1tmf3q]  .log-level-info {
    background: rgba(10, 126, 255, 0.15);
    color: #0a7eff;
    border-color: #0a7eff;
}

[data-theme="dark"][b-lvie1tmf3q]  .log-level-debug {
    background: var(--kendo-color-surface-alt, #303030);
    color: var(--kendo-color-subtle, #a8a8a8);
    border-color: var(--kendo-color-border, #4d4d4d);
}

[data-theme="dark"][b-lvie1tmf3q]  .search-highlight {
    background: rgba(245, 158, 11, 0.25);
    color: #fbbf24;
}

/* ============================================================================
   Responsive Adjustments
   ============================================================================ */

@media (max-width: 1400px) {
    .log-viewer-content[b-lvie1tmf3q] {
        grid-template-columns: 400px 1fr;
    }
}

@media (max-width: 1200px) {
    .log-viewer-content[b-lvie1tmf3q] {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
    }

    .log-files-panel[b-lvie1tmf3q] {
        max-height: 300px;
    }
}

@media (max-width: 768px) {
    .log-viewer-header[b-lvie1tmf3q] {
        flex-direction: column;
        align-items: stretch;
        padding: var(--kendo-spacing-4, 1rem);
    }

    .log-viewer-toolbar[b-lvie1tmf3q] {
        justify-content: stretch;
    }

        .log-viewer-toolbar > *[b-lvie1tmf3q] {
            flex: 1;
        }

    .content-controls[b-lvie1tmf3q] {
        flex-wrap: wrap;
    }

    .log-stats-bar[b-lvie1tmf3q] {
        flex-wrap: wrap;
        gap: var(--kendo-spacing-2, 0.5rem);
    }
}

/* ============================================================================
   Scrollbar Styling
   ============================================================================ */

.log-content[b-lvie1tmf3q]::-webkit-scrollbar,
.files-grid-container[b-lvie1tmf3q]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.log-content[b-lvie1tmf3q]::-webkit-scrollbar-track,
.files-grid-container[b-lvie1tmf3q]::-webkit-scrollbar-track {
    background: var(--kendo-color-surface, #f8f8f8);
}

.log-content[b-lvie1tmf3q]::-webkit-scrollbar-thumb,
.files-grid-container[b-lvie1tmf3q]::-webkit-scrollbar-thumb {
    background: var(--kendo-color-border, #e0e0e0);
    border-radius: var(--kendo-border-radius-sm, 2px);
}

    .log-content[b-lvie1tmf3q]::-webkit-scrollbar-thumb:hover,
    .files-grid-container[b-lvie1tmf3q]::-webkit-scrollbar-thumb:hover {
        background: var(--kendo-color-subtle, #6e6e6e);
    }

[data-theme="dark"] .log-content[b-lvie1tmf3q]::-webkit-scrollbar-track,
[data-theme="dark"] .files-grid-container[b-lvie1tmf3q]::-webkit-scrollbar-track {
    background: var(--kendo-color-surface, #1f1f1f);
}

[data-theme="dark"] .log-content[b-lvie1tmf3q]::-webkit-scrollbar-thumb,
[data-theme="dark"] .files-grid-container[b-lvie1tmf3q]::-webkit-scrollbar-thumb {
    background: var(--kendo-color-border, #4d4d4d);
}

    [data-theme="dark"] .log-content[b-lvie1tmf3q]::-webkit-scrollbar-thumb:hover,
    [data-theme="dark"] .files-grid-container[b-lvie1tmf3q]::-webkit-scrollbar-thumb:hover {
        background: var(--kendo-color-subtle, #a8a8a8);
    }
/* /Components/Pages/Admin/MeetingSchedules/ConfigData.razor.rz.scp.css */
body[b-1gx2zvgi1a] {
}

/* /Components/Pages/Admin/Requests/ConfigData.razor.rz.scp.css */
body[b-7e77iwre9o] {
}
/* /Components/Pages/Admin/Schedule/ConfigData.razor.rz.scp.css */
body[b-lkp8cgwa2d] {
}
/* /Components/Pages/Admin/Submittals/ConfigData.razor.rz.scp.css */
body[b-aawajc8pkn] {
}

/* /Components/Pages/Admin/SystemEmailGenerator.razor.rz.scp.css */
body[b-prkaqs7kp4] {
}
.email-generator-container[b-prkaqs7kp4] {
    --email-primary: var(--kendo-color-primary, #8155B9);
    --email-surface: var(--kendo-color-surface, #f8f8f8);
    --email-surface-alt: var(--kendo-color-surface-alt, #f8f8f8);
    --email-text: var(--kendo-color-on-app-surface, #1F1F1F);
    --email-text-subtle: var(--kendo-color-subtle, #6E6E6E);
    --email-border: var(--kendo-color-border-alt, #D1D1D1);
    --email-success: var(--kendo-color-success, #10b981);
    --email-warning: var(--kendo-color-warning, #f59e0b);
    --email-error: var(--kendo-color-error, #ef4444);
    --email-info: var(--kendo-color-info, #0a7eff);
}

.email-generator-wrapper[b-prkaqs7kp4] {
    max-width: 900px;
    margin: 0 auto;
    padding: 24px;
    min-height: calc(100vh - 200px);
}

/* Header Section */
.email-header-section[b-prkaqs7kp4] {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 32px;
    padding: 24px;
    background: var(--email-surface);
    border-radius: 12px;
    border: 1px solid var(--email-border);
}

.section-icon[b-prkaqs7kp4] {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, var(--email-primary) 0%, color-mix(in srgb, var(--email-primary) 70%, transparent) 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .section-icon .k-svg-icon[b-prkaqs7kp4] {
        width: 28px;
        height: 28px;
        color: white;
    }

.section-content[b-prkaqs7kp4] {
    flex: 1;
}

.section-title[b-prkaqs7kp4] {
    margin: 0 0 4px;
    font-size: 24px;
    font-weight: 600;
    color: var(--email-text);
}

.section-subtitle[b-prkaqs7kp4] {
    margin: 0;
    font-size: 14px;
    color: var(--email-text-subtle);
}

.status-chip[b-prkaqs7kp4] {
    margin-left: auto;
}

    .status-chip.success[b-prkaqs7kp4] {
        background: var(--email-success);
        color: white;
    }

    .status-chip.error[b-prkaqs7kp4] {
        background: var(--email-error);
        color: white;
    }

/* Form Container */
.email-form-container[b-prkaqs7kp4] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.email-form-card[b-prkaqs7kp4] {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.card-header-content[b-prkaqs7kp4] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 24px;
    font-weight: 600;
    background: linear-gradient(90deg, var(--email-surface) 0%, var(--email-surface-alt) 100%);
    border-bottom: 1px solid var(--email-border);
}

    .card-header-content .k-svg-icon[b-prkaqs7kp4] {
        width: 20px;
        height: 20px;
        color: var(--email-primary);
    }

/* Form Grid */
.form-grid[b-prkaqs7kp4] {
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 24px;
}

.form-section[b-prkaqs7kp4] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.section-header[b-prkaqs7kp4] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--email-border);
    font-weight: 600;
    color: var(--email-text);
}

    .section-header .k-svg-icon[b-prkaqs7kp4] {
        width: 18px;
        height: 18px;
        color: var(--email-primary);
    }

/* Form Groups */
.form-group[b-prkaqs7kp4] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-label[b-prkaqs7kp4] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--email-text);
}

.label-icon[b-prkaqs7kp4] {
    width: 16px;
    height: 16px;
    color: var(--email-text-subtle);
}

.label-hint[b-prkaqs7kp4] {
    margin-left: auto;
    font-size: 12px;
    font-weight: normal;
    color: var(--email-text-subtle);
}

/* Modern Inputs */
.modern-input[b-prkaqs7kp4],
.modern-textarea[b-prkaqs7kp4] {
    border-radius: 8px;
    border-color: var(--email-border);
    background: var(--kendo-color-base, #ffffff);
    transition: all 0.2s ease;
}

    .modern-input:hover[b-prkaqs7kp4],
    .modern-textarea:hover[b-prkaqs7kp4] {
        border-color: var(--email-primary);
    }

    .modern-input:focus[b-prkaqs7kp4],
    .modern-textarea:focus[b-prkaqs7kp4] {
        border-color: var(--email-primary);
        box-shadow: 0 0 0 2px color-mix(in srgb, var(--email-primary) 20%, transparent);
    }

/* Actions Card */
.actions-card[b-prkaqs7kp4] {
    border-radius: 12px;
    background: var(--email-surface);
}

.actions-container[b-prkaqs7kp4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px;
}

.action-info[b-prkaqs7kp4] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: var(--email-text-subtle);
}

.info-icon[b-prkaqs7kp4] {
    width: 20px;
    height: 20px;
    color: var(--email-info);
}

.action-buttons[b-prkaqs7kp4] {
    display: flex;
    gap: 12px;
}

.action-button[b-prkaqs7kp4] {
    min-width: 120px;
}

.action-button-primary[b-prkaqs7kp4] {
    font-weight: 600;
}

/* Preview Card */
.preview-card[b-prkaqs7kp4] {
    border-radius: 12px;
    overflow: hidden;
}

.preview-close[b-prkaqs7kp4] {
    margin-left: auto;
}

.email-preview[b-prkaqs7kp4] {
    padding: 24px;
    background: white;
    border-radius: 8px;
    min-height: 200px;
}

/* Dark Theme Adjustments */
:global([data-theme="dark"] .email-generator-container)[b-prkaqs7kp4] {
    --email-surface: #1F1F1F;
    --email-surface-alt: #303030;
    --email-text: #FFFFFF;
    --email-text-subtle: #A8A8A8;
    --email-border: #4D4D4D;
}

:global([data-theme="dark"] .email-header-section)[b-prkaqs7kp4] {
    background: #242424;
}

:global([data-theme="dark"] .modern-input)[b-prkaqs7kp4],
:global([data-theme="dark"] .modern-textarea)[b-prkaqs7kp4] {
    background: #1A1A1A;
    color: #FFFFFF;
}

:global([data-theme="dark"] .email-preview)[b-prkaqs7kp4] {
    background: #1A1A1A;
}

/* Responsive */
@media (max-width: 768px) {
    .email-generator-wrapper[b-prkaqs7kp4] {
        padding: 16px;
    }

    .email-header-section[b-prkaqs7kp4] {
        flex-direction: column;
        text-align: center;
    }

    .actions-container[b-prkaqs7kp4] {
        flex-direction: column;
        align-items: stretch;
    }

    .action-buttons[b-prkaqs7kp4] {
        width: 100%;
        flex-direction: column;
    }

    .action-button[b-prkaqs7kp4] {
        width: 100%;
    }
}
/* /Components/Pages/Admin/TaskHubs/ConfigData.razor.rz.scp.css */
body[b-n9aevnsgly] {
}

/* /Components/Pages/Admin/Transmittals/ConfigData.razor.rz.scp.css */
body[b-1zaapzh4xq] {
}

/* /Components/Pages/Contact.razor.rz.scp.css */
/* ================================================================
   CONTACT.RAZOR.CSS - Premium Marketing Page Styles
   WSP Project Controls & Technology Team Page
   
   Design System: Kendo UI CSS Variables
   Theme Support: Light/Dark via [data-theme] selectors
   ================================================================ */

/* ================================================================
   BASE CONTAINER STYLES
   ================================================================ */
.contact-scroller[b-2kzsxt1ka9] {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.contact-container[b-2kzsxt1ka9] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--kendo-spacing-6);
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-8);
}

/* ================================================================
   SECTION TITLES - Consistent heading treatment
   ================================================================ */
.section-title[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-2xl);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    text-align: center;
    margin-bottom: var(--kendo-spacing-2);
    position: relative;
    padding-bottom: var(--kendo-spacing-3);
}

    .section-title[b-2kzsxt1ka9]::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 60px;
        height: 4px;
        background: var(--kendo-color-primary);
        border-radius: var(--kendo-border-radius-full);
    }

.section-subtitle[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-md);
    color: var(--kendo-color-subtle);
    text-align: center;
    max-width: 800px;
    margin: 0 auto var(--kendo-spacing-6);
    line-height: 1.6;
}

/* ================================================================
   HERO SECTION
   ================================================================ */
.contact-hero-section[b-2kzsxt1ka9] {
    margin-bottom: var(--kendo-spacing-4);
}

    .contact-hero-section .k-messagebox[b-2kzsxt1ka9] {
        background: linear-gradient(135deg, var(--kendo-color-primary-subtle) 0%, var(--kendo-color-base-subtle) 100%);
        border: none;
        border-left: 4px solid var(--kendo-color-primary);
        padding: var(--kendo-spacing-8);
        box-shadow: var(--kendo-elevation-4);
    }

[data-theme="dark"] .contact-hero-section .k-messagebox[b-2kzsxt1ka9] {
    background: linear-gradient(135deg, rgba(191, 161, 224, 0.1) 0%, rgba(255, 255, 255, 0.02) 100%);
}

.contact-hero-content[b-2kzsxt1ka9] {
    max-width: 900px;
    margin: 0 auto;
}

.contact-hero-title[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-2xl);
    font-weight: 700;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: var(--kendo-spacing-4);
    line-height: 1.3;
}

.contact-hero-text[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-md);
    color: var(--kendo-color-on-app-surface);
    line-height: 1.7;
    margin-bottom: var(--kendo-spacing-4);
}

.contact-hero-subtext[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.6;
    font-style: italic;
}

/* ================================================================
   EXCELLENCE SECTION - Three pillars
   ================================================================ */
.excellence-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-6);
}

.excellence-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-6);
    text-align: center;
    transition: all 0.3s ease;
    box-shadow: var(--kendo-elevation-2);
}

    .excellence-card:hover[b-2kzsxt1ka9] {
        transform: translateY(-4px);
        box-shadow: var(--kendo-elevation-6);
        border-color: var(--kendo-color-primary);
    }

.excellence-icon-wrapper[b-2kzsxt1ka9] {
    width: 64px;
    height: 64px;
    border-radius: var(--kendo-border-radius-full);
    background: var(--kendo-color-primary-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--kendo-spacing-4);
}

[data-theme="dark"] .excellence-icon-wrapper[b-2kzsxt1ka9] {
    background: rgba(191, 161, 224, 0.15);
}

.excellence-icon[b-2kzsxt1ka9] {
    width: 28px;
    height: 28px;
    color: var(--kendo-color-primary);
}

.excellence-card h5[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-lg);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: var(--kendo-spacing-3);
}

.excellence-card p[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.6;
}

/* ================================================================
   LEADERSHIP SECTION
   ================================================================ */
.contact-leadership-section[b-2kzsxt1ka9] {
    padding: var(--kendo-spacing-6) 0;
}

.leadership-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-6);
}

.leader-card[b-2kzsxt1ka9] {
    display: flex;
    gap: var(--kendo-spacing-5);
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-5);
    transition: all 0.3s ease;
}

    .leader-card:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
        border-color: var(--kendo-color-primary-subtle);
    }

    .leader-card.featured[b-2kzsxt1ka9] {
        border-left: 4px solid var(--kendo-color-primary);
    }

.leader-avatar[b-2kzsxt1ka9] {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    border-radius: var(--kendo-border-radius-full);
    background: var(--kendo-color-primary-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

[data-theme="dark"] .leader-avatar[b-2kzsxt1ka9] {
    background: rgba(191, 161, 224, 0.15);
}

.leader-avatar-icon[b-2kzsxt1ka9] {
    width: 48px;
    height: 48px;
    color: var(--kendo-color-primary);
    opacity: 0.7;
}

.leader-avatar-image[b-2kzsxt1ka9] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    border-radius: var(--kendo-border-radius-full);
}

.leader-info[b-2kzsxt1ka9] {
    flex: 1;
    min-width: 0;
}

.leader-name[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-lg);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: var(--kendo-spacing-1);
}

.leader-title[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-primary);
    font-weight: 500;
    margin-bottom: var(--kendo-spacing-3);
}

.leader-bio[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.6;
    margin-bottom: var(--kendo-spacing-3);
}

.leader-expertise[b-2kzsxt1ka9] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2);
    margin-bottom: var(--kendo-spacing-3);
}

    .leader-expertise span[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-xs);
        background: var(--kendo-color-base-subtle);
        color: var(--kendo-color-subtle);
        padding: var(--kendo-spacing-1) var(--kendo-spacing-2);
        border-radius: var(--kendo-border-radius-full);
    }

.leader-email[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-primary);
    text-decoration: none;
}

    .leader-email:hover[b-2kzsxt1ka9] {
        text-decoration: underline;
    }

/* ================================================================
   PEOPLE SECTION - Statistics
   ================================================================ */
.people-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-6);
    box-shadow: var(--kendo-elevation-2);
}

.people-stats[b-2kzsxt1ka9] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--kendo-spacing-6);
    margin-bottom: var(--kendo-spacing-6);
    padding-bottom: var(--kendo-spacing-6);
    border-bottom: 1px solid var(--kendo-color-border);
    flex-wrap: wrap;
}

.stat-item[b-2kzsxt1ka9] {
    text-align: center;
    padding: 0 var(--kendo-spacing-4);
}

.stat-number[b-2kzsxt1ka9] {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--kendo-color-primary);
    line-height: 1.2;
}

.stat-label[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: var(--kendo-spacing-1);
}

.stat-divider[b-2kzsxt1ka9] {
    width: 1px;
    height: 50px;
    background: var(--kendo-color-border);
}

.people-description[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-md);
    color: var(--kendo-color-on-app-surface);
    line-height: 1.7;
    text-align: center;
    max-width: 900px;
    margin: 0 auto var(--kendo-spacing-6);
}

.credentials-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: var(--kendo-spacing-4);
    padding-top: var(--kendo-spacing-4);
    border-top: 1px solid var(--kendo-color-border);
}

.credential-item[b-2kzsxt1ka9] {
    text-align: center;
    padding: var(--kendo-spacing-3);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-md);
}

.credential-count[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xl);
    font-weight: 700;
    color: var(--kendo-color-primary);
}

.credential-type[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
}

/* ================================================================
   APPROACH SECTION - CREATE / NAVIGATE / INNOVATE
   ================================================================ */
.approach-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-6);
}

.approach-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-5);
    border-left: 4px solid var(--kendo-color-border);
    transition: all 0.3s ease;
}

    .approach-card:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
    }

    .approach-card.create-card[b-2kzsxt1ka9] {
        border-left-color: #0a7eff;
    }

    .approach-card.navigate-card[b-2kzsxt1ka9] {
        border-left-color: #10b981;
    }

    .approach-card.innovate-card[b-2kzsxt1ka9] {
        border-left-color: #f59e0b;
    }

.approach-header[b-2kzsxt1ka9] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
    margin-bottom: var(--kendo-spacing-4);
}

.approach-icon[b-2kzsxt1ka9] {
    width: 24px;
    height: 24px;
    color: var(--kendo-color-primary);
}

.approach-header h5[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-lg);
    font-weight: 700;
    color: var(--kendo-color-on-app-surface);
    letter-spacing: 0.1em;
}

.approach-card p[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.6;
    margin-bottom: var(--kendo-spacing-4);
}

.approach-outcomes[b-2kzsxt1ka9] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2);
}

    .approach-outcomes span[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-xs);
        background: var(--kendo-color-primary-subtle);
        color: var(--kendo-color-primary);
        padding: var(--kendo-spacing-1) var(--kendo-spacing-3);
        border-radius: var(--kendo-border-radius-full);
    }

[data-theme="dark"] .approach-outcomes span[b-2kzsxt1ka9] {
    background: rgba(191, 161, 224, 0.15);
}

/* ================================================================
   CASE STUDIES SECTION
   ================================================================ */
.contact-case-studies-section[b-2kzsxt1ka9] {
    padding: var(--kendo-spacing-6) 0;
}

.case-study-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-6);
    margin-bottom: var(--kendo-spacing-6);
    position: relative;
    transition: all 0.3s ease;
}

    .case-study-card:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
    }

    .case-study-card:last-child[b-2kzsxt1ka9] {
        margin-bottom: 0;
    }

    .case-study-card.featured-case[b-2kzsxt1ka9] {
        border: 2px solid var(--kendo-color-primary);
        background: linear-gradient(135deg, var(--kendo-color-surface) 0%, var(--kendo-color-primary-subtle) 100%);
    }

[data-theme="dark"] .case-study-card.featured-case[b-2kzsxt1ka9] {
    background: linear-gradient(135deg, var(--kendo-color-surface) 0%, rgba(191, 161, 224, 0.05) 100%);
}

.case-study-badge[b-2kzsxt1ka9] {
    position: absolute;
    top: var(--kendo-spacing-4);
    right: var(--kendo-spacing-4);
    background: var(--kendo-color-primary);
    color: white;
    font-size: var(--kendo-font-size-xs);
    font-weight: 600;
    padding: var(--kendo-spacing-1) var(--kendo-spacing-3);
    border-radius: var(--kendo-border-radius-full);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.case-study-header[b-2kzsxt1ka9] {
    margin-bottom: var(--kendo-spacing-4);
}

    .case-study-header h5[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-xl);
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
        margin-bottom: var(--kendo-spacing-1);
    }

.case-study-subtitle[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-primary);
    font-weight: 500;
}

.case-study-metrics[b-2kzsxt1ka9] {
    display: flex;
    gap: var(--kendo-spacing-6);
    margin-bottom: var(--kendo-spacing-5);
    padding: var(--kendo-spacing-4);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-md);
    flex-wrap: wrap;
}

.metric-item[b-2kzsxt1ka9] {
    text-align: center;
    flex: 1;
    min-width: 120px;
}

.metric-number[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xl);
    font-weight: 700;
    color: var(--kendo-color-primary);
}

.metric-label[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.case-study-content[b-2kzsxt1ka9] {
    margin-bottom: var(--kendo-spacing-5);
}

    .case-study-content > p[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        color: var(--kendo-color-on-app-surface);
        line-height: 1.7;
        margin-bottom: var(--kendo-spacing-4);
    }

.case-study-challenge[b-2kzsxt1ka9],
.case-study-solution[b-2kzsxt1ka9],
.case-study-results[b-2kzsxt1ka9] {
    margin-bottom: var(--kendo-spacing-4);
}

    .case-study-challenge h6[b-2kzsxt1ka9],
    .case-study-solution h6[b-2kzsxt1ka9],
    .case-study-results h6[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        font-weight: 600;
        color: var(--kendo-color-primary);
        margin-bottom: var(--kendo-spacing-2);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .case-study-challenge p[b-2kzsxt1ka9],
    .case-study-solution p[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        color: var(--kendo-color-subtle);
        line-height: 1.6;
    }

.results-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-3);
}

.result-item[b-2kzsxt1ka9] {
    display: flex;
    align-items: flex-start;
    gap: var(--kendo-spacing-2);
}

.result-icon[b-2kzsxt1ka9] {
    width: 18px;
    height: 18px;
    color: #10b981;
    flex-shrink: 0;
    margin-top: 2px;
}

.result-item span[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.5;
}

.case-study-services[b-2kzsxt1ka9] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2);
    padding-top: var(--kendo-spacing-4);
    border-top: 1px solid var(--kendo-color-border);
}

.service-tag[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-xs);
    background: var(--kendo-color-primary-subtle);
    color: var(--kendo-color-primary);
    padding: var(--kendo-spacing-1) var(--kendo-spacing-3);
    border-radius: var(--kendo-border-radius-full);
    font-weight: 500;
}

[data-theme="dark"] .service-tag[b-2kzsxt1ka9] {
    background: rgba(191, 161, 224, 0.15);
}

/* ================================================================
   TECHNOLOGY SERVICES SECTION
   ================================================================ */
.service-detail-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    margin-bottom: var(--kendo-spacing-6);
    overflow: hidden;
    transition: all 0.3s ease;
}

    .service-detail-card:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
    }

    .service-detail-card:last-child[b-2kzsxt1ka9] {
        margin-bottom: 0;
    }

.service-detail-header[b-2kzsxt1ka9] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-4);
    padding: var(--kendo-spacing-5);
    background: var(--kendo-color-base-subtle);
    border-bottom: 1px solid var(--kendo-color-border);
    flex-wrap: wrap;
}

.service-detail-icon-wrapper[b-2kzsxt1ka9] {
    width: 56px;
    height: 56px;
    border-radius: var(--kendo-border-radius-lg);
    background: var(--kendo-color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .service-detail-icon-wrapper.econstruction[b-2kzsxt1ka9] {
        background: #0a7eff;
    }

    .service-detail-icon-wrapper.bi[b-2kzsxt1ka9] {
        background: #10b981;
    }

    .service-detail-icon-wrapper.mobile[b-2kzsxt1ka9] {
        background: #f59e0b;
    }

    .service-detail-icon-wrapper.geo[b-2kzsxt1ka9] {
        background: #8b5cf6;
    }

    .service-detail-icon-wrapper.ba[b-2kzsxt1ka9] {
        background: #ec4899;
    }

.service-detail-icon[b-2kzsxt1ka9] {
    width: 48px;
    height: 48px;
    color: white;
}

.service-detail-title-group[b-2kzsxt1ka9] {
    flex: 1;
    min-width: 200px;
}

    .service-detail-title-group h5[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-lg);
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
        margin-bottom: var(--kendo-spacing-1);
    }

.service-tagline[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    font-style: italic;
}

.service-stats-badge[b-2kzsxt1ka9] {
    text-align: center;
    padding: var(--kendo-spacing-2) var(--kendo-spacing-4);
    background: var(--kendo-color-surface);
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
}

.badge-number[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xl);
    font-weight: 700;
    color: var(--kendo-color-primary);
}

.badge-label[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
}

.service-detail-content[b-2kzsxt1ka9] {
    padding: var(--kendo-spacing-5);
}

    .service-detail-content > p[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        color: var(--kendo-color-on-app-surface);
        line-height: 1.7;
        margin-bottom: var(--kendo-spacing-4);
    }

.service-capabilities-detailed[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-5);
    margin-bottom: var(--kendo-spacing-5);
    padding: var(--kendo-spacing-4);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-md);
}

.capability-group h6[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    font-weight: 600;
    color: var(--kendo-color-primary);
    margin-bottom: var(--kendo-spacing-3);
}

.capability-group ul[b-2kzsxt1ka9] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.capability-group li[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    padding: var(--kendo-spacing-1) 0;
    padding-left: var(--kendo-spacing-4);
    position: relative;
    line-height: 1.5;
}

    .capability-group li[b-2kzsxt1ka9]::before {
        content: '•';
        position: absolute;
        left: 0;
        color: var(--kendo-color-primary);
    }

.innovation-highlight[b-2kzsxt1ka9] {
    background: linear-gradient(135deg, var(--kendo-color-primary-subtle) 0%, var(--kendo-color-surface) 100%);
    border-left: 4px solid var(--kendo-color-primary);
    padding: var(--kendo-spacing-4);
    border-radius: var(--kendo-border-radius-md);
    margin-bottom: var(--kendo-spacing-5);
}

[data-theme="dark"] .innovation-highlight[b-2kzsxt1ka9] {
    background: linear-gradient(135deg, rgba(191, 161, 224, 0.1) 0%, var(--kendo-color-surface) 100%);
}

.innovation-highlight h6[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    font-weight: 600;
    color: var(--kendo-color-primary);
    margin-bottom: var(--kendo-spacing-2);
}

.innovation-highlight p[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-on-app-surface);
    line-height: 1.6;
    margin: 0;
}

.service-features[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-3);
}

.feature-item[b-2kzsxt1ka9] {
    display: flex;
    align-items: flex-start;
    gap: var(--kendo-spacing-2);
}

.feature-icon[b-2kzsxt1ka9] {
    width: 18px;
    height: 18px;
    color: #10b981;
    flex-shrink: 0;
    margin-top: 2px;
}

.feature-item span[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.5;
}

/* ================================================================
   PROJECT CONTROLS SECTION
   ================================================================ */
.controls-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-5);
}

.control-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-5);
    transition: all 0.3s ease;
}

    .control-card:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
        border-color: var(--kendo-color-primary-subtle);
    }

.control-header[b-2kzsxt1ka9] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
    margin-bottom: var(--kendo-spacing-3);
}

.control-icon[b-2kzsxt1ka9] {
    width: 24px;
    height: 24px;
    color: var(--kendo-color-primary);
}

.control-header h5[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-md);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
}

.control-stats[b-2kzsxt1ka9] {
    display: flex;
    align-items: baseline;
    gap: var(--kendo-spacing-2);
    margin-bottom: var(--kendo-spacing-3);
}

.control-stat-number[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-xl);
    font-weight: 700;
    color: var(--kendo-color-primary);
}

.control-stat-label[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
}

.control-tagline[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-primary);
    font-style: italic;
    margin-bottom: var(--kendo-spacing-3);
}

.control-card > p[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.6;
    margin-bottom: var(--kendo-spacing-4);
}

.control-capabilities[b-2kzsxt1ka9] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-2);
}

    .control-capabilities span[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-xs);
        background: var(--kendo-color-base-subtle);
        color: var(--kendo-color-subtle);
        padding: var(--kendo-spacing-1) var(--kendo-spacing-2);
        border-radius: var(--kendo-border-radius-sm);
    }

/* ================================================================
   PORTFOLIO SECTION
   ================================================================ */
.contact-portfolio-section[b-2kzsxt1ka9] {
    padding: var(--kendo-spacing-6) 0;
}

/* Featured Case Study */
.featured-case-study[b-2kzsxt1ka9] {
    background: linear-gradient(135deg, var(--kendo-color-surface) 0%, var(--kendo-color-primary-subtle) 100%);
    border: 2px solid var(--kendo-color-primary);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-6);
    margin-bottom: var(--kendo-spacing-6);
    position: relative;
}

[data-theme="dark"] .featured-case-study[b-2kzsxt1ka9] {
    background: linear-gradient(135deg, var(--kendo-color-surface) 0%, rgba(191, 161, 224, 0.08) 100%);
}

.featured-case-study .case-study-badge[b-2kzsxt1ka9] {
    position: absolute;
    top: var(--kendo-spacing-4);
    right: var(--kendo-spacing-4);
    background: var(--kendo-color-primary);
    color: white;
    font-size: var(--kendo-font-size-xs);
    font-weight: 600;
    padding: var(--kendo-spacing-1) var(--kendo-spacing-3);
    border-radius: var(--kendo-border-radius-full);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.featured-case-study h5[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-xl);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: var(--kendo-spacing-4);
    padding-right: var(--kendo-spacing-16);
}

.featured-case-study > p[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-on-app-surface);
    line-height: 1.7;
    margin-bottom: var(--kendo-spacing-4);
}

/* Case Study Stats */
.case-study-stats[b-2kzsxt1ka9] {
    display: flex;
    gap: var(--kendo-spacing-6);
    margin-bottom: var(--kendo-spacing-5);
    padding: var(--kendo-spacing-4);
    background: var(--kendo-color-surface);
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
    flex-wrap: wrap;
}

.case-stat[b-2kzsxt1ka9] {
    text-align: center;
    flex: 1;
    min-width: 120px;
}

.case-stat-number[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xl);
    font-weight: 700;
    color: var(--kendo-color-primary);
}

.case-stat-label[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Case Study Highlights */
.case-study-highlights[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-3);
}

.highlight-item[b-2kzsxt1ka9] {
    display: flex;
    align-items: flex-start;
    gap: var(--kendo-spacing-2);
}

.highlight-icon[b-2kzsxt1ka9] {
    width: 18px;
    height: 18px;
    color: #10b981;
    flex-shrink: 0;
    margin-top: 2px;
}

.highlight-item span[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.5;
}

/* Portfolio Grid */
.portfolio-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-6);
}

/* Portfolio Category */
.portfolio-category[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-5);
    transition: all 0.3s ease;
}

    .portfolio-category:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
        border-color: var(--kendo-color-primary-subtle);
    }

/* Category Title */
.category-title[b-2kzsxt1ka9] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
    font-size: var(--kendo-font-size-md);
    font-weight: 600;
    color: var(--kendo-color-primary);
    margin-bottom: var(--kendo-spacing-4);
    padding-bottom: var(--kendo-spacing-3);
    border-bottom: 2px solid var(--kendo-color-primary-subtle);
}

.category-icon[b-2kzsxt1ka9] {
    width: 20px;
    height: 20px;
    color: var(--kendo-color-primary);
    flex-shrink: 0;
}

/* Project List */
.project-list[b-2kzsxt1ka9] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-2);
}

/* Project Item */
.project-item[b-2kzsxt1ka9] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1);
    padding: var(--kendo-spacing-3);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-md);
    transition: all 0.2s ease;
}

    .project-item:hover[b-2kzsxt1ka9] {
        background: var(--kendo-color-primary-subtle);
    }

[data-theme="dark"] .project-item:hover[b-2kzsxt1ka9] {
    background: rgba(191, 161, 224, 0.1);
}

.project-name[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-sm);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
}

.project-location[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
}

/* ================================================================
   PORTFOLIO SECTION - RESPONSIVE
   ================================================================ */
@media (max-width: 1024px) {
    .portfolio-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .case-study-highlights[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .featured-case-study .case-study-badge[b-2kzsxt1ka9] {
        position: static;
        display: inline-block;
        margin-bottom: var(--kendo-spacing-3);
    }

    .featured-case-study h5[b-2kzsxt1ka9] {
        padding-right: 0;
    }

    .case-study-stats[b-2kzsxt1ka9] {
        flex-direction: column;
        gap: var(--kendo-spacing-3);
    }
}

/* ================================================================
   INNOVATION SECTION
   ================================================================ */
.innovation-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-5);
}

.innovation-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-5);
    transition: all 0.3s ease;
}

    .innovation-card:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
        border-color: var(--kendo-color-primary-subtle);
    }

    .innovation-card.featured[b-2kzsxt1ka9] {
        grid-column: span 3;
        background: linear-gradient(135deg, var(--kendo-color-surface) 0%, var(--kendo-color-primary-subtle) 100%);
        border-color: var(--kendo-color-primary);
    }

[data-theme="dark"] .innovation-card.featured[b-2kzsxt1ka9] {
    background: linear-gradient(135deg, var(--kendo-color-surface) 0%, rgba(191, 161, 224, 0.08) 100%);
}

.innovation-header[b-2kzsxt1ka9] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
    margin-bottom: var(--kendo-spacing-3);
}

.innovation-icon[b-2kzsxt1ka9] {
    width: 24px;
    height: 24px;
    color: var(--kendo-color-primary);
}

.innovation-header h5[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-md);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
}

.innovation-card > p[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.6;
}

.innovation-features[b-2kzsxt1ka9] {
    list-style: none;
    padding: 0;
    margin: var(--kendo-spacing-4) 0 0 0;
}

    .innovation-features li[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        color: var(--kendo-color-subtle);
        padding: var(--kendo-spacing-1) 0;
        padding-left: var(--kendo-spacing-4);
        position: relative;
        line-height: 1.5;
    }

        .innovation-features li[b-2kzsxt1ka9]::before {
            content: '→';
            position: absolute;
            left: 0;
            color: var(--kendo-color-primary);
        }

/* ================================================================
   SECURITY SECTION
   ================================================================ */
.security-content[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--kendo-spacing-6);
}

.security-card[b-2kzsxt1ka9],
.partnerships-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-5);
}

    .security-card h5[b-2kzsxt1ka9],
    .partnerships-card h5[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-lg);
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
        margin-bottom: var(--kendo-spacing-3);
    }

    .security-card > p[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        color: var(--kendo-color-subtle);
        line-height: 1.6;
        margin-bottom: var(--kendo-spacing-4);
    }

.compliance-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-3);
}

.compliance-item[b-2kzsxt1ka9] {
    background: var(--kendo-color-base-subtle);
    padding: var(--kendo-spacing-3);
    border-radius: var(--kendo-border-radius-md);
}

.compliance-badge[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-sm);
    font-weight: 700;
    color: var(--kendo-color-primary);
    margin-bottom: var(--kendo-spacing-1);
}

.compliance-desc[b-2kzsxt1ka9] {
    display: block;
    font-size: var(--kendo-font-size-xs);
    color: var(--kendo-color-subtle);
}

.partner-list[b-2kzsxt1ka9] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-4);
}

.partner-item[b-2kzsxt1ka9] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-4);
    padding: var(--kendo-spacing-3);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-md);
}

.partner-icon[b-2kzsxt1ka9] {
    width: 32px;
    height: 32px;
    color: var(--kendo-color-primary);
    flex-shrink: 0;
}

.partner-details[b-2kzsxt1ka9] {
    flex: 1;
}

    .partner-details strong[b-2kzsxt1ka9] {
        display: block;
        font-size: var(--kendo-font-size-sm);
        color: var(--kendo-color-on-app-surface);
        margin-bottom: var(--kendo-spacing-1);
    }

    .partner-details span[b-2kzsxt1ka9] {
        display: block;
        font-size: var(--kendo-font-size-xs);
        color: var(--kendo-color-subtle);
    }

/* ================================================================
   INDUSTRIES SECTION
   ================================================================ */
.industries-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: var(--kendo-spacing-4);
}

.industry-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-4);
    transition: all 0.2s ease;
}

    .industry-card:hover[b-2kzsxt1ka9] {
        border-color: var(--kendo-color-primary-subtle);
        box-shadow: var(--kendo-elevation-2);
    }

    .industry-card h6[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        font-weight: 600;
        color: var(--kendo-color-primary);
        margin-bottom: var(--kendo-spacing-3);
        padding-bottom: var(--kendo-spacing-2);
        border-bottom: 2px solid var(--kendo-color-primary-subtle);
    }

    .industry-card ul[b-2kzsxt1ka9] {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .industry-card li[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-xs);
        color: var(--kendo-color-subtle);
        padding: var(--kendo-spacing-1) 0;
        line-height: 1.4;
    }

/* ================================================================
   CONTACT INFO SECTION
   ================================================================ */
.contact-cards-grid[b-2kzsxt1ka9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-6);
}

.contact-info-card[b-2kzsxt1ka9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    overflow: hidden;
    transition: all 0.3s ease;
}

    .contact-info-card:hover[b-2kzsxt1ka9] {
        box-shadow: var(--kendo-elevation-4);
        border-color: var(--kendo-color-primary-subtle);
    }

.contact-info-header[b-2kzsxt1ka9] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
    padding: var(--kendo-spacing-4);
    background: var(--kendo-color-primary);
    color: white;
}

.contact-info-icon[b-2kzsxt1ka9] {
    width: 24px;
    height: 24px;
    color: white;
}

.contact-info-header h5[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-md);
    font-weight: 600;
    color: white;
}

.contact-info-content[b-2kzsxt1ka9] {
    padding: var(--kendo-spacing-4);
}

.contact-label[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    margin-bottom: var(--kendo-spacing-2);
}

.contact-info-content p[b-2kzsxt1ka9] {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    line-height: 1.5;
    margin-bottom: var(--kendo-spacing-2);
}

.contact-link[b-2kzsxt1ka9] {
    display: inline-block;
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-primary);
    text-decoration: none;
    transition: all 0.2s ease;
}

    .contact-link:hover[b-2kzsxt1ka9] {
        text-decoration: underline;
    }

    .contact-link.primary[b-2kzsxt1ka9] {
        font-weight: 600;
        font-size: var(--kendo-font-size-md);
    }

.contact-phones[b-2kzsxt1ka9] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1);
    margin-top: var(--kendo-spacing-2);
}

    .contact-phones span[b-2kzsxt1ka9] {
        font-size: var(--kendo-font-size-sm);
        color: var(--kendo-color-subtle);
    }

/* ================================================================
   RESPONSIVE BREAKPOINTS
   ================================================================ */

/* Large tablets and small desktops */
@media (max-width: 1024px) {
    .leadership-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .controls-grid[b-2kzsxt1ka9] {
        grid-template-columns: repeat(2, 1fr);
    }

    .project-grid[b-2kzsxt1ka9] {
        grid-template-columns: repeat(2, 1fr);
    }

    .innovation-grid[b-2kzsxt1ka9] {
        grid-template-columns: repeat(2, 1fr);
    }

    .innovation-card.featured[b-2kzsxt1ka9] {
        grid-column: span 2;
    }

    .industries-grid[b-2kzsxt1ka9] {
        grid-template-columns: repeat(3, 1fr);
    }

    .credentials-grid[b-2kzsxt1ka9] {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Tablets */
@media (max-width: 768px) {
    .contact-container[b-2kzsxt1ka9] {
        padding: var(--kendo-spacing-4);
        gap: var(--kendo-spacing-6);
    }

    .excellence-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .approach-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .controls-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .security-content[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .contact-cards-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .project-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .innovation-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .innovation-card.featured[b-2kzsxt1ka9] {
        grid-column: span 1;
    }

    .industries-grid[b-2kzsxt1ka9] {
        grid-template-columns: repeat(2, 1fr);
    }

    .credentials-grid[b-2kzsxt1ka9] {
        grid-template-columns: repeat(2, 1fr);
    }

    .service-features[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .results-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .service-capabilities-detailed[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .compliance-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .people-stats[b-2kzsxt1ka9] {
        flex-direction: column;
        gap: var(--kendo-spacing-4);
    }

    .stat-divider[b-2kzsxt1ka9] {
        width: 50px;
        height: 1px;
    }

    .leader-card[b-2kzsxt1ka9] {
        flex-direction: column;
        text-align: center;
    }

    .leader-avatar[b-2kzsxt1ka9] {
        margin: 0 auto;
    }

    .leader-expertise[b-2kzsxt1ka9] {
        justify-content: center;
    }

    .case-study-badge[b-2kzsxt1ka9] {
        position: static;
        display: inline-block;
        margin-bottom: var(--kendo-spacing-3);
    }
}

/* Mobile */
@media (max-width: 480px) {
    .industries-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .credentials-grid[b-2kzsxt1ka9] {
        grid-template-columns: 1fr;
    }

    .case-study-metrics[b-2kzsxt1ka9] {
        flex-direction: column;
        gap: var(--kendo-spacing-3);
    }

    .service-detail-header[b-2kzsxt1ka9] {
        flex-direction: column;
        text-align: center;
    }

    .service-stats-badge[b-2kzsxt1ka9] {
        width: 100%;
    }
}

/* ================================================================
   ACCESSIBILITY
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
    .excellence-card[b-2kzsxt1ka9],
    .leader-card[b-2kzsxt1ka9],
    .case-study-card[b-2kzsxt1ka9],
    .service-detail-card[b-2kzsxt1ka9],
    .control-card[b-2kzsxt1ka9],
    .innovation-card[b-2kzsxt1ka9],
    .contact-info-card[b-2kzsxt1ka9],
    .project-card[b-2kzsxt1ka9],
    .industry-card[b-2kzsxt1ka9] {
        transition: none;
    }

        .excellence-card:hover[b-2kzsxt1ka9] {
            transform: none;
        }
}

/* Focus states for keyboard navigation */
.contact-link:focus-visible[b-2kzsxt1ka9],
.leader-email:focus-visible[b-2kzsxt1ka9] {
    outline: 2px solid var(--kendo-color-primary);
    outline-offset: 2px;
    border-radius: var(--kendo-border-radius-sm);
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .excellence-card[b-2kzsxt1ka9],
    .leader-card[b-2kzsxt1ka9],
    .case-study-card[b-2kzsxt1ka9],
    .service-detail-card[b-2kzsxt1ka9],
    .control-card[b-2kzsxt1ka9],
    .innovation-card[b-2kzsxt1ka9],
    .contact-info-card[b-2kzsxt1ka9] {
        border-width: 2px;
    }

    .section-title[b-2kzsxt1ka9]::after {
        height: 6px;
    }
}

/* Print styles */
@media print {
    .contact-scroller[b-2kzsxt1ka9] {
        overflow: visible;
        height: auto;
    }

    .excellence-card:hover[b-2kzsxt1ka9],
    .leader-card:hover[b-2kzsxt1ka9],
    .case-study-card:hover[b-2kzsxt1ka9],
    .service-detail-card:hover[b-2kzsxt1ka9],
    .control-card:hover[b-2kzsxt1ka9],
    .innovation-card:hover[b-2kzsxt1ka9],
    .contact-info-card:hover[b-2kzsxt1ka9] {
        box-shadow: none;
        transform: none;
    }
}
/* /Components/Pages/DataSampling.razor.rz.scp.css */
/* /Components/Pages/Error.razor.rz.scp.css */
/* Modern Enterprise Error Page Styles */
.error-page[b-62rqf97w7h] {
    --error-bg: var(--kendo-color-surface);
    --error-fg: var(--kendo-color-on-app-surface);
    --error-muted: var(--kendo-color-subtle);
    --error-border: var(--kendo-color-border);
    --error-accent: #7c3aed;
    --error-accent-light: #a78bfa;
    --error-card-bg: var(--kendo-color-surface-alt);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: linear-gradient(135deg, color-mix(in oklab, var(--error-bg), transparent 60%) 0%, color-mix(in oklab, var(--error-accent), transparent 95%) 100%);
}

/* Main Container */
.error-container[b-62rqf97w7h] {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* Hero Section */
.error-hero[b-62rqf97w7h] {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 4rem;
    align-items: center;
    margin-bottom: 3rem;
}

/* Illustration Container */
.illustration-container[b-62rqf97w7h] {
    position: relative;
    width: 100%;
    max-width: 500px;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.error-illustration[b-62rqf97w7h] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.1));
    animation: float-b-62rqf97w7h 6s ease-in-out infinite;
}

.illustration-overlay[b-62rqf97w7h] {
    position: absolute;
    inset: -20%;
    background: radial-gradient(circle at center, color-mix(in oklab, var(--error-accent), transparent 90%) 0%, transparent 70%);
    filter: blur(60px);
    opacity: 0.3;
    animation: pulse-b-62rqf97w7h 4s ease-in-out infinite;
}

/* Error Content */
.error-content[b-62rqf97w7h] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.error-badge[b-62rqf97w7h] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.5rem 1rem;
    background: color-mix(in oklab, var(--error-accent), transparent 85%);
    color: var(--error-accent);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    border-radius: 100px;
    animation: slideIn-b-62rqf97w7h 0.6s ease-out;
}

.error-title[b-62rqf97w7h] {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    color: var(--error-fg);
    line-height: 1.2;
    letter-spacing: -0.02em;
    animation: slideIn-b-62rqf97w7h 0.6s ease-out 0.1s both;
}

.error-description[b-62rqf97w7h] {
    font-size: 1.125rem;
    line-height: 1.7;
    color: var(--error-muted);
    max-width: 600px;
    animation: slideIn-b-62rqf97w7h 0.6s ease-out 0.2s both;
}

/* Reference Card */
.reference-card[b-62rqf97w7h] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.5rem;
    background: var(--error-card-bg);
    border: 1px solid var(--error-border);
    border-radius: 12px;
    animation: slideIn-b-62rqf97w7h 0.6s ease-out 0.3s both;
}

.reference-label[b-62rqf97w7h] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--error-muted);
    letter-spacing: 0.05em;
}

.reference-value[b-62rqf97w7h] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .reference-value code[b-62rqf97w7h] {
        font-family: ui-monospace, "SF Mono", "Cascadia Code", monospace;
        font-size: 1.25rem;
        font-weight: 600;
        color: var(--error-fg);
        letter-spacing: 0.05em;
    }

.copy-btn[b-62rqf97w7h] {
    opacity: 0.7;
    transition: opacity 0.2s;
}

    .copy-btn:hover[b-62rqf97w7h] {
        opacity: 1;
    }

/* Action Section */
.action-section[b-62rqf97w7h] {
    display: flex;
    gap: 1rem;
    margin-bottom: 4rem;
    animation: slideIn-b-62rqf97w7h 0.6s ease-out 0.4s both;
}

.action-btn[b-62rqf97w7h] {
    min-width: 180px;
    height: 48px;
    font-weight: 600;
}

    .action-btn.primary[b-62rqf97w7h] {
        background: var(--error-accent);
        color: white;
    }

        .action-btn.primary:hover[b-62rqf97w7h] {
            background: color-mix(in oklab, var(--error-accent), black 10%);
        }

/* Info Section */
.info-section[b-62rqf97w7h] {
    margin-bottom: 3rem;
    animation: fadeIn-b-62rqf97w7h 0.8s ease-out 0.5s both;
}

.info-grid[b-62rqf97w7h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.info-card[b-62rqf97w7h] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    background: var(--error-card-bg);
    border: 1px solid var(--error-border);
    border-radius: 12px;
    transition: transform 0.2s, box-shadow 0.2s;
}

    .info-card:hover[b-62rqf97w7h] {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }

.info-icon[b-62rqf97w7h] {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: var(--error-accent);
}

.info-content[b-62rqf97w7h] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.info-label[b-62rqf97w7h] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--error-muted);
    letter-spacing: 0.05em;
}

.info-value[b-62rqf97w7h] {
    font-size: 1rem;
    color: var(--error-fg);
    font-weight: 500;
}

/* Tips Section */
.tips-section[b-62rqf97w7h] {
    padding: 2rem;
    background: var(--error-card-bg);
    border: 1px solid var(--error-border);
    border-radius: 16px;
    animation: fadeIn-b-62rqf97w7h 0.8s ease-out 0.6s both;
}

.tips-title[b-62rqf97w7h] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--error-fg);
    margin-bottom: 1.5rem;
}

.tips-grid[b-62rqf97w7h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.tip-item[b-62rqf97w7h] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--error-bg);
    border-radius: 8px;
    font-size: 0.875rem;
    color: var(--error-muted);
}

.tip-icon[b-62rqf97w7h] {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--error-accent);
}

/* Development Section */
.dev-section[b-62rqf97w7h] {
    margin-top: 4rem;
    width: 100%;
    max-width: 1200px;
    animation: fadeIn-b-62rqf97w7h 0.8s ease-out 0.7s both;
}

.dev-card[b-62rqf97w7h] {
    border: 2px dashed var(--error-accent);
    background: color-mix(in oklab, var(--error-card-bg), transparent 50%);
}

.dev-header[b-62rqf97w7h] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.dev-icon[b-62rqf97w7h] {
    color: var(--error-accent);
}

.dev-title[b-62rqf97w7h] {
    flex: 1;
    font-weight: 600;
    color: var(--error-fg);
}

.dev-grid[b-62rqf97w7h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.dev-detail[b-62rqf97w7h] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.5rem;
    background: var(--error-bg);
    border-radius: 6px;
}

.dev-label[b-62rqf97w7h] {
    font-size: 0.875rem;
    color: var(--error-muted);
    font-weight: 500;
}

.dev-detail code[b-62rqf97w7h] {
    font-family: ui-monospace, "SF Mono", "Cascadia Code", monospace;
    font-size: 0.875rem;
    color: var(--error-fg);
}

.dev-actions[b-62rqf97w7h] {
    display: flex;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--error-border);
}

/* Animations */
@keyframes float-b-62rqf97w7h {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-20px);
    }
}

@keyframes pulse-b-62rqf97w7h {
    0%, 100% {
        opacity: 0.3;
        transform: scale(1);
    }

    50% {
        opacity: 0.5;
        transform: scale(1.1);
    }
}

@keyframes slideIn-b-62rqf97w7h {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeIn-b-62rqf97w7h {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Responsive Design */
@media (max-width: 968px) {
    .error-hero[b-62rqf97w7h] {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 2rem;
    }

    .illustration-container[b-62rqf97w7h] {
        max-width: 350px;
        margin: 0 auto;
    }

    .error-content[b-62rqf97w7h] {
        align-items: center;
    }

    .error-description[b-62rqf97w7h] {
        text-align: center;
    }

    .reference-card[b-62rqf97w7h] {
        align-self: center;
    }

    .action-section[b-62rqf97w7h] {
        justify-content: center;
        flex-wrap: wrap;
    }

    .info-grid[b-62rqf97w7h] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .error-page[b-62rqf97w7h] {
        padding: 1rem;
    }

    .error-hero[b-62rqf97w7h] {
        gap: 1.5rem;
    }

    .action-btn[b-62rqf97w7h] {
        width: 100%;
    }

    .tips-grid[b-62rqf97w7h] {
        grid-template-columns: 1fr;
    }
}

/* Dark Theme Adjustments */
@media (prefers-color-scheme: dark) {
    .error-page[b-62rqf97w7h] {
        --error-accent: #8b5cf6;
        --error-accent-light: #c4b5fd;
    }

    .error-illustration[b-62rqf97w7h] {
        opacity: 0.9;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
#home-page[b-a8xyxyf3u3] {
    position: relative; /* Changed back to relative to respect layout */
    width: 100%;
    height: calc(100vh - var(--header-height, 84px)); /* Account for header */
    display: flex;
    align-items: flex-start;
    justify-content: center;
    font-size: var(--kendo-font-size-xl);
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.pct-app-home-banner[b-a8xyxyf3u3] {
    font-size: clamp(32px, 5vw, 42px);
    font-weight: 400;
    margin-bottom: 1rem;
    color: var(--kendo-color-on-base);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); /* Enhanced shadow for readability */
}

.video-container[b-a8xyxyf3u3] {
    position: absolute; /* Absolute within relative parent */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}

.video-background[b-a8xyxyf3u3] {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translateX(-50%) translateY(-50%);
    object-fit: cover;
    z-index: 0;
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
}

/* Ensure video fills on different aspect ratios */
@media (aspect-ratio: 16/9) {
    .video-background[b-a8xyxyf3u3] {
        width: 100%;
        height: auto;
    }
}

@media (max-aspect-ratio: 16/9) {
    .video-background[b-a8xyxyf3u3] {
        width: auto;
        height: 100%;
    }
}

/* Video poster/placeholder while loading */
.video-poster[b-a8xyxyf3u3] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--kendo-color-primary-subtle) 0%, var(--kendo-color-base) 100%);
    z-index: 1;
    opacity: 1;
    transition: opacity 0.5s ease-out;
}

    .video-poster.hidden[b-a8xyxyf3u3] {
        opacity: 0;
        pointer-events: none;
    }

.splash-boilerplate[b-a8xyxyf3u3] {
    position: relative;
    z-index: 2;
    text-align: center;
    width: 100%;
    max-width: 800px;
    padding: 30px;
    margin-top: 15vh; /* Fixed distance from top */
    border-radius: 12px;
    /* Light theme default - semi-transparent white background */
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
}

/* Light theme text colors */
#home-page[data-theme="light"] .splash-boilerplate[b-a8xyxyf3u3],
#home-page[data-theme="neutral"] .splash-boilerplate[b-a8xyxyf3u3] {
    color: #333333;
}

#home-page[data-theme="light"] .pct-app-home-banner[b-a8xyxyf3u3],
#home-page[data-theme="neutral"] .pct-app-home-banner[b-a8xyxyf3u3] {
    color: #1a1a1a;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

#home-page[data-theme="light"] .splash-boilerplate p[b-a8xyxyf3u3],
#home-page[data-theme="neutral"] .splash-boilerplate p[b-a8xyxyf3u3] {
    color: #4a4a4a;
}

#home-page[data-theme="light"] .splash-boilerplate-deployment-tag[b-a8xyxyf3u3],
#home-page[data-theme="neutral"] .splash-boilerplate-deployment-tag[b-a8xyxyf3u3] {
    color: #6c757d;
}

#home-page[data-theme="light"] .splash-boilerplate a[b-a8xyxyf3u3],
#home-page[data-theme="neutral"] .splash-boilerplate a[b-a8xyxyf3u3] {
    color: #0066cc;
}

/* Dark theme adjustments */
#home-page[data-theme="dark"] .splash-boilerplate[b-a8xyxyf3u3] {
    /* Semi-transparent dark background with slight purple tint */
    background: rgba(20, 15, 30, 0.88);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

#home-page[data-theme="dark"] .pct-app-home-banner[b-a8xyxyf3u3] {
    color: #ffffff;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

#home-page[data-theme="dark"] .splash-boilerplate p[b-a8xyxyf3u3] {
    color: #e0e0e0;
}

#home-page[data-theme="dark"] .splash-boilerplate-deployment-tag[b-a8xyxyf3u3] {
    color: #b0b0b0;
}

#home-page[data-theme="dark"] .splash-boilerplate a[b-a8xyxyf3u3] {
    color: #80b3ff;
    text-decoration: underline;
}

    #home-page[data-theme="dark"] .splash-boilerplate a:hover[b-a8xyxyf3u3] {
        color: #a0c4ff;
    }

#home-page[data-theme="dark"] .video-poster[b-a8xyxyf3u3] {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
}

.pct-environment-banner[b-a8xyxyf3u3] {
    display: inline-block;
    padding: 0.35rem 0.85rem;
    border-radius: 6px;
    margin: 0.5rem 0;
    font-weight: 500;
}

.splash-boilerplate p[b-a8xyxyf3u3] {
    margin: 0.5rem 0;
}

.splash-boilerplate-deployment-tag[b-a8xyxyf3u3] {
    font-size: 0.875rem;
    margin: 0.25rem 0;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .splash-boilerplate[b-a8xyxyf3u3] {
        padding: 20px;
        margin: 10vh 15px 0 15px;
        max-width: calc(100% - 30px);
    }

    .pct-app-home-banner[b-a8xyxyf3u3] {
        font-size: 28px;
    }
}

/* Ensure no overflow on the main container */
.pct-main[b-a8xyxyf3u3] {
    overflow: hidden;
}

/* Accessibility: Reduce motion if preferred */
@media (prefers-reduced-motion: reduce) {
    .video-background[b-a8xyxyf3u3],
    .video-poster[b-a8xyxyf3u3],
    #home-page *[b-a8xyxyf3u3] {
        transition: none;
    }
}
/* /Components/Pages/Modules/AgenticIntelliSys/Agent.razor.rz.scp.css */
body[b-rr5dvnelwx] {
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/AITraining.razor.rz.scp.css */
/* Host component styles (scoped to AITraining.razor) */
.training-capture-container[b-xqdfjqkxav] {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: var(--kendo-color-surface);
}

.training-header[b-xqdfjqkxav] {
    background: var(--kendo-color-surface-alt);
    border-bottom: 1px solid var(--kendo-color-border);
    padding: 1.5rem;
}

.header-content[b-xqdfjqkxav] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .header-content h2[b-xqdfjqkxav] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin: 0;
    }

.header-subtitle[b-xqdfjqkxav] {
    font-size: 0.875rem;
    font-weight: normal;
    opacity: 0.7;
    margin-left: 0.5rem;
}

.header-actions[b-xqdfjqkxav] {
    display: flex;
    gap: 0.5rem;
}

.quality-insights-bar[b-xqdfjqkxav] {
    background: var(--kendo-color-info-subtle);
    padding: 0.75rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 2rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

.insight-item[b-xqdfjqkxav] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

.quality-progress[b-xqdfjqkxav] {
    width: 100px;
}

.mode-selection[b-xqdfjqkxav] {
    padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--kendo-color-border);
}

.system-selection[b-xqdfjqkxav] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.persona-item[b-xqdfjqkxav] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.training-content[b-xqdfjqkxav] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
}

.recent-examples-strip[b-xqdfjqkxav] {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid var(--kendo-color-border);
}

    .recent-examples-strip h4[b-xqdfjqkxav] {
        margin-bottom: 1rem;
    }

.examples-carousel[b-xqdfjqkxav] {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    padding-bottom: 0.5rem;
}

.example-card[b-xqdfjqkxav] {
    min-width: 250px;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .example-card:hover[b-xqdfjqkxav] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    .example-card.favorite[b-xqdfjqkxav] {
        border-color: var(--kendo-color-warning);
    }

.example-header[b-xqdfjqkxav] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.example-type[b-xqdfjqkxav] {
    font-size: 0.75rem;
    text-transform: uppercase;
    opacity: 0.6;
}

.favorite-icon[b-xqdfjqkxav] {
    margin-left: auto;
    color: var(--kendo-color-warning);
}

.example-preview[b-xqdfjqkxav] {
    font-size: 0.875rem;
    line-height: 1.5;
    height: 3em;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 0.5rem;
}

.example-meta[b-xqdfjqkxav] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.75rem;
    opacity: 0.6;
}

.import-options[b-xqdfjqkxav] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.training-notification[b-xqdfjqkxav] {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 10000;
}

.loading-indicator[b-xqdfjqkxav] {
    display: grid;
    place-items: center;
    gap: 0.75rem;
    min-height: 40vh;
}

.training-library-item[b-xqdfjqkxav] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Deep rules limited to descendants or 3rd-party internals.
   Scoped to specific containers to avoid collisions with host classes. */

/* Generic header subtitle used by nested components */
[b-xqdfjqkxav] .header-subtitle {
    font-size: 0.875rem;
    opacity: 0.7;
    font-weight: normal;
}

/* Optional layout wrapper used by nested training sections */
[b-xqdfjqkxav] .training-container {
    height: calc(100vh - 240px);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
}

    /* Only target nested .training-content inside a .training-container, not the host’s */
    [b-xqdfjqkxav] .training-container .training-content {
        flex: 1;
        background: var(--kendo-color-surface);
        border-radius: var(--kendo-border-radius-lg);
        overflow: hidden;
    }

/* System selection bar (nested component) */
[b-xqdfjqkxav] .system-selection-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: var(--kendo-color-surface);
    border-radius: var(--kendo-border-radius-lg);
    border: 1px solid var(--kendo-color-border);
}

[b-xqdfjqkxav] .system-selector {
    display: flex;
    align-items: center;
    gap: 1rem;
}

    [b-xqdfjqkxav] .system-selector label {
        font-weight: 500;
        color: var(--kendo-color-on-app-surface);
    }

[b-xqdfjqkxav] .system-actions {
    display: flex;
    gap: 0.75rem;
}

/* TabStrip polish (applies to child TabStrip markup with an opt-in wrapper) */
[b-xqdfjqkxav] .modern-tabs {
    height: 100%;
}

    [b-xqdfjqkxav] .modern-tabs .k-tabstrip-items-wrapper {
        background: var(--kendo-color-surface-alt);
        border-bottom: 1px solid var(--kendo-color-border);
    }

    [b-xqdfjqkxav] .modern-tabs .k-tabstrip-content {
        height: calc(100% - 48px);
        overflow-y: auto;
        padding: 0;
    }

/* Conversation builder (Simple / Multi-turn components) */
[b-xqdfjqkxav] .conversation-builder {
    padding: 1.5rem;
    height: 100%;
    display: flex;
    flex-direction: column;
}

[b-xqdfjqkxav] .builder-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

    [b-xqdfjqkxav] .builder-header h4 {
        margin: 0;
        font-size: 1.125rem;
    }

[b-xqdfjqkxav] .conversation-flow {
    flex: 1;
    overflow-y: auto;
}

[b-xqdfjqkxav] .flow-simple {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 800px;
    margin: 0 auto;
}

[b-xqdfjqkxav] .message-card {
    background: var(--kendo-color-base);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.25rem;
    transition: all 0.2s ease;
}

    [b-xqdfjqkxav] .message-card:hover {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    [b-xqdfjqkxav] .message-card.system {
        border-left: 4px solid var(--kendo-color-info);
    }

    [b-xqdfjqkxav] .message-card.user {
        border-left: 4px solid var(--kendo-color-primary);
    }

    [b-xqdfjqkxav] .message-card.assistant {
        border-left: 4px solid var(--kendo-color-success);
    }

[b-xqdfjqkxav] .message-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    font-weight: 500;
}

[b-xqdfjqkxav] .flow-arrow {
    text-align: center;
    color: var(--kendo-color-subtle);
    margin: 0.5rem 0;
}

[b-xqdfjqkxav] .modern-textarea {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
    font-size: 0.875rem;
    background: var(--kendo-color-surface);
}

[b-xqdfjqkxav] .action-bar {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin-top: 1.5rem;
}

/* Multi-turn layout */
[b-xqdfjqkxav] .flow-multi {
    height: 100%;
    display: flex;
    flex-direction: column;
}

[b-xqdfjqkxav] .multi-turn-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    max-width: 800px;
    margin: 0 auto;
    width: 100%;
}

[b-xqdfjqkxav] .conversation-thread {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-lg);
    border: 1px solid var(--kendo-color-border);
    margin-bottom: 1rem;
}

[b-xqdfjqkxav] .message-bubble {
    margin-bottom: 1rem;
    padding: 1rem;
    border-radius: var(--kendo-border-radius-md);
    position: relative;
}

    [b-xqdfjqkxav] .message-bubble.system {
        background: var(--kendo-color-info-subtle);
        margin-left: 2rem;
    }

    [b-xqdfjqkxav] .message-bubble.user {
        background: var(--kendo-color-primary-subtle);
        margin-right: 2rem;
    }

    [b-xqdfjqkxav] .message-bubble.assistant {
        background: var(--kendo-color-success-subtle);
        margin-left: 2rem;
    }

[b-xqdfjqkxav] .bubble-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
}

[b-xqdfjqkxav] .bubble-content {
    font-size: 0.9375rem;
    line-height: 1.5;
}

[b-xqdfjqkxav] .turn-builder {
    background: var(--kendo-color-base);
    padding: 1rem;
    border-radius: var(--kendo-border-radius-lg);
    border: 1px solid var(--kendo-color-border);
}

[b-xqdfjqkxav] .turn-inputs {
    display: flex;
    gap: 1rem;
    align-items: center;
}

/* Vision builder (nested component styles here are specific and non-conflicting) */
[b-xqdfjqkxav] .flow-vision {
    height: 100%;
}

[b-xqdfjqkxav] .vision-container {
    display: grid;
    grid-template-columns: 400px 1fr;
    gap: 1.5rem;
    height: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

[b-xqdfjqkxav] .image-upload-zone {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

[b-xqdfjqkxav] .upload-dropzone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    background: var(--kendo-color-base);
    border: 2px dashed var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

    [b-xqdfjqkxav] .upload-dropzone:hover {
        border-color: var(--kendo-color-primary);
        background: var(--kendo-color-primary-subtle);
    }

[b-xqdfjqkxav] .file-types {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

[b-xqdfjqkxav] .image-preview {
    position: relative;
    border-radius: var(--kendo-border-radius-lg);
    overflow: hidden;
}

    [b-xqdfjqkxav] .image-preview img {
        width: 100%;
        height: auto;
        display: block;
    }

[b-xqdfjqkxav] .image-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
    padding: 1rem;
    display: flex;
    justify-content: center;
}

[b-xqdfjqkxav] .vision-messages {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Training Library view (qualify all descendants under .training-library) */
[b-xqdfjqkxav] .training-library {
    padding: 1.5rem;
    height: 100%;
    display: flex;
    flex-direction: column;
}

    [b-xqdfjqkxav] .training-library .library-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1.5rem;
    }

        [b-xqdfjqkxav] .training-library .library-header h4 {
            margin: 0;
            font-size: 1.125rem;
        }

    [b-xqdfjqkxav] .training-library .library-stats {
        display: flex;
        gap: 0.75rem;
    }

    [b-xqdfjqkxav] .training-library .library-toolbar {
        display: flex;
        gap: 1rem;
        margin-bottom: 1.5rem;
    }

    [b-xqdfjqkxav] .training-library .modern-grid {
        background: var(--kendo-color-base);
        border-radius: var(--kendo-border-radius-lg);
    }

    [b-xqdfjqkxav] .training-library .set-name {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

/* Examples Preview view (qualify to avoid conflicts with host .example-card) */
[b-xqdfjqkxav] .examples-preview {
    padding: 1.5rem;
    height: 100%;
    overflow-y: auto;
}

    [b-xqdfjqkxav] .examples-preview .preview-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1.5rem;
    }

        [b-xqdfjqkxav] .examples-preview .preview-header h4 {
            margin: 0;
            font-size: 1.125rem;
        }

    [b-xqdfjqkxav] .examples-preview .examples-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 1rem;
    }

    [b-xqdfjqkxav] .examples-preview .example-card {
        background: var(--kendo-color-base);
        border: 1px solid var(--kendo-color-border);
        border-radius: var(--kendo-border-radius-lg);
        padding: 1.25rem;
        transition: all 0.2s ease;
    }

        [b-xqdfjqkxav] .examples-preview .example-card:hover {
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        }

    [b-xqdfjqkxav] .examples-preview .example-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1rem;
    }

    [b-xqdfjqkxav] .examples-preview .example-date {
        font-size: 0.875rem;
        color: var(--kendo-color-subtle);
    }

    [b-xqdfjqkxav] .examples-preview .example-messages {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        margin-bottom: 1rem;
    }

    [b-xqdfjqkxav] .examples-preview .example-message {
        padding: 0.5rem;
        border-radius: var(--kendo-border-radius-sm);
        font-size: 0.875rem;
        line-height: 1.4;
    }

        [b-xqdfjqkxav] .examples-preview .example-message.system {
            background: var(--kendo-color-info-subtle);
        }

        [b-xqdfjqkxav] .examples-preview .example-message.user {
            background: var(--kendo-color-primary-subtle);
        }

        [b-xqdfjqkxav] .examples-preview .example-message.assistant {
            background: var(--kendo-color-success-subtle);
        }

    [b-xqdfjqkxav] .examples-preview .example-actions {
        display: flex;
        gap: 0.5rem;
        justify-content: flex-end;
    }

/* Help and JSON previews in nested components */
[b-xqdfjqkxav] .help-content {
    padding: 1rem;
    max-height: 100%;
    overflow-y: auto;
}

    [b-xqdfjqkxav] .help-content h2 {
        color: var(--kendo-color-primary);
        margin-bottom: 1rem;
    }

    [b-xqdfjqkxav] .help-content pre {
        background: var(--kendo-color-base);
        padding: 1rem;
        border-radius: var(--kendo-border-radius-md);
        overflow-x: auto;
        font-size: 0.875rem;
    }

[b-xqdfjqkxav] .json-preview {
    height: 100%;
    overflow: auto;
    background: var(--kendo-color-base);
    padding: 1rem;
    border-radius: var(--kendo-border-radius-md);
}

    [b-xqdfjqkxav] .json-preview pre {
        margin: 0;
        font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
        font-size: 0.875rem;
        line-height: 1.5;
    }

/* Dark theme enhancements (limited to nested items where needed) */
@media (prefers-color-scheme: dark) {
    [b-xqdfjqkxav] .message-card {
        background: var(--kendo-color-surface);
    }

    [b-xqdfjqkxav] .conversation-thread {
        background: var(--kendo-color-surface);
    }

    [b-xqdfjqkxav] .upload-dropzone {
        background: var(--kendo-color-surface);
    }

    [b-xqdfjqkxav] .modern-textarea {
        background: var(--kendo-color-base);
    }
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/ExamplePreviewView.razor.rz.scp.css */
.examples-preview-container[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

/* Header */
.preview-header[b-xlp8njl7dy] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

.header-content[b-xlp8njl7dy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .header-content h5[b-xlp8njl7dy] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0;
    }

.example-count[b-xlp8njl7dy] {
    font-size: 0.875rem;
    font-weight: normal;
    opacity: 0.7;
    margin-left: 0.5rem;
}

.header-controls[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Export Bar */
.export-bar[b-xlp8njl7dy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
    padding: 1rem;
    background: var(--kendo-color-info-subtle);
    border-radius: var(--kendo-border-radius-md);
}

.export-info[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

.export-actions[b-xlp8njl7dy] {
    display: flex;
    gap: 0.75rem;
}

/* Content */
.examples-content[b-xlp8njl7dy] {
    flex: 1;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
    overflow-y: auto;
}

/* Empty State */
.empty-state[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    opacity: 0.6;
    gap: 1rem;
}

/* Examples List */
.examples-list[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.example-item[b-xlp8njl7dy] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.25rem;
    transition: all 0.3s ease;
    display: flex;
    gap: 1rem;
}

    .example-item:hover[b-xlp8njl7dy] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    }

    .example-item.favorite[b-xlp8njl7dy] {
        border-color: var(--kendo-color-warning);
    }

    .example-item.selected[b-xlp8njl7dy] {
        background: var(--kendo-color-primary-subtle);
        border-color: var(--kendo-color-primary);
    }

/* Dark mode example hover */
@media (prefers-color-scheme: dark) {
    .example-item:hover[b-xlp8njl7dy] {
        box-shadow: 0 4px 12px rgba(255, 255, 255, 0.05);
    }
}

.selection-control[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    padding-right: 0.5rem;
}

/* Example Header */
.example-header[b-xlp8njl7dy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.header-info[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.example-type[b-xlp8njl7dy] {
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
}

.example-date[b-xlp8njl7dy] {
    font-size: 0.8125rem;
    opacity: 0.6;
}

.favorite-icon[b-xlp8njl7dy] {
    color: var(--kendo-color-warning);
}

.header-actions[b-xlp8njl7dy] {
    display: flex;
    gap: 0.25rem;
}

/* Example Content */
.example-content[b-xlp8njl7dy] {
    flex: 1;
}

/* Conversation Preview */
.conversation-preview[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.message[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.75rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
}

    .message.system[b-xlp8njl7dy] {
        background: var(--kendo-color-info-subtle);
    }

    .message.user[b-xlp8njl7dy] {
        background: var(--kendo-color-primary-subtle);
    }

    .message.assistant[b-xlp8njl7dy] {
        background: var(--kendo-color-success-subtle);
    }

.message-role[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    opacity: 0.8;
}

.message-text[b-xlp8njl7dy] {
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Vision Preview */
.vision-preview[b-xlp8njl7dy] {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 1rem;
}

.vision-image[b-xlp8njl7dy] {
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: var(--kendo-border-radius-md);
}

    .vision-image img[b-xlp8njl7dy] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.vision-conversation[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Function Preview */
.function-preview[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.function-query[b-xlp8njl7dy],
.function-call[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
}

.function-call[b-xlp8njl7dy] {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
    font-size: 0.875rem;
}

/* Example Footer */
.example-footer[b-xlp8njl7dy] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--kendo-color-border);
}

.quality-info[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* Export Preview */
.export-preview[b-xlp8njl7dy] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.export-stats[b-xlp8njl7dy] {
    display: flex;
    gap: 2rem;
    padding: 1rem;
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-md);
}

    .export-stats .stat[b-xlp8njl7dy] {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
    }

    .export-stats label[b-xlp8njl7dy] {
        font-size: 0.8125rem;
        font-weight: 500;
        opacity: 0.7;
    }

.jsonl-preview[b-xlp8njl7dy] {
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    overflow: hidden;
}

    .jsonl-preview .preview-header[b-xlp8njl7dy] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.75rem 1rem;
        border-bottom: 1px solid var(--kendo-color-border);
        background: var(--kendo-color-surface-alt);
    }

        .jsonl-preview .preview-header h6[b-xlp8njl7dy] {
            margin: 0;
            font-size: 0.875rem;
        }

.jsonl-content[b-xlp8njl7dy] {
    padding: 1rem;
    background: var(--kendo-color-base);
    font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
    font-size: 0.8125rem;
    line-height: 1.5;
    overflow-x: auto;
    white-space: pre-wrap;
    margin: 0;
    max-height: 300px;
    overflow-y: auto;
}

/* Delete Dialog */
.warning-text[b-xlp8njl7dy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--kendo-color-error);
    margin-top: 1rem;
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    .message[b-xlp8njl7dy],
    .function-query[b-xlp8njl7dy],
    .function-call[b-xlp8njl7dy] {
        background: var(--kendo-color-surface);
    }

    .jsonl-content[b-xlp8njl7dy] {
        background: var(--kendo-color-surface);
    }

    .example-item[b-xlp8njl7dy] {
        background: var(--kendo-color-surface);
    }

        .example-item:hover[b-xlp8njl7dy] {
            border-color: var(--kendo-color-primary-subtle);
        }

    .export-bar[b-xlp8njl7dy] {
        background: var(--kendo-color-info-subtle);
        border-color: var(--kendo-color-info);
    }

    .empty-state[b-xlp8njl7dy] {
        opacity: 0.5;
    }

    .vision-image[b-xlp8njl7dy] {
        border: 1px solid var(--kendo-color-border);
    }

    .example-footer[b-xlp8njl7dy] {
        border-color: rgba(255, 255, 255, 0.1);
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .header-content[b-xlp8njl7dy] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }

    .header-controls[b-xlp8njl7dy] {
        flex-wrap: wrap;
    }

    .export-bar[b-xlp8njl7dy] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }

    .export-actions[b-xlp8njl7dy] {
        justify-content: flex-end;
    }

    .vision-preview[b-xlp8njl7dy] {
        grid-template-columns: 1fr;
    }

    .vision-image[b-xlp8njl7dy] {
        max-width: 200px;
        margin: 0 auto;
    }
}

/* Animations */
@keyframes fadeIn-b-xlp8njl7dy {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.example-item[b-xlp8njl7dy] {
    animation: fadeIn-b-xlp8njl7dy 0.3s ease-out;
    animation-fill-mode: both;
}

    .example-item:nth-child(1)[b-xlp8njl7dy] {
        animation-delay: 0.05s;
    }

    .example-item:nth-child(2)[b-xlp8njl7dy] {
        animation-delay: 0.1s;
    }

    .example-item:nth-child(3)[b-xlp8njl7dy] {
        animation-delay: 0.15s;
    }

    .example-item:nth-child(4)[b-xlp8njl7dy] {
        animation-delay: 0.2s;
    }

    .example-item:nth-child(5)[b-xlp8njl7dy] {
        animation-delay: 0.25s;
    }

/* Loading skeleton animations */
@keyframes shimmer-b-xlp8njl7dy {
    0% {
        background-position: -1000px 0;
    }

    100% {
        background-position: 1000px 0;
    }
}

.loading-skeleton[b-xlp8njl7dy] {
    background: linear-gradient( to right, var(--kendo-color-surface) 8%, var(--kendo-color-surface-alt) 18%, var(--kendo-color-surface) 33% );
    background-size: 1000px 100%;
    animation: shimmer-b-xlp8njl7dy 1.5s infinite linear;
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/ExpertReviewsView.razor.rz.scp.css */
.expert-reviews-container[b-olragphgax] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

/* Header */
.reviews-header[b-olragphgax] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

.header-content[b-olragphgax] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

    .header-content h5[b-olragphgax] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin: 0;
    }

.header-controls[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Expert Stats */
.expert-stats[b-olragphgax] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1rem;
}

.expert-card[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
}

.expert-info h6[b-olragphgax] {
    margin: 0 0 0.25rem 0;
    font-size: 0.875rem;
}

.expert-metrics[b-olragphgax] {
    display: flex;
    gap: 1rem;
}

.metric[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.8125rem;
    opacity: 0.8;
}

.expert-specialties[b-olragphgax] {
    margin-left: auto;
    display: flex;
    gap: 0.5rem;
}

/* Content */
.reviews-content[b-olragphgax] {
    flex: 1;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
    overflow-y: auto;
}

/* Empty State */
.empty-state[b-olragphgax] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    opacity: 0.6;
    gap: 1rem;
}

/* Reviews Grid */
.reviews-grid[b-olragphgax] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 1.5rem;
}

.review-card[b-olragphgax] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: all 0.3s ease;
}

    .review-card:hover[b-olragphgax] {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    }

    .review-card.pending[b-olragphgax] {
        border-color: var(--kendo-color-warning);
    }

/* Dark mode review hover */
@media (prefers-color-scheme: dark) {
    .review-card:hover[b-olragphgax] {
        box-shadow: 0 4px 12px rgba(255, 255, 255, 0.05);
    }
}

/* Review Header */
.review-header[b-olragphgax] {
    display: flex;
    justify-content: space-between;
    align-items: start;
}

.review-meta[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.meta-info h6[b-olragphgax] {
    margin: 0;
    font-size: 0.875rem;
}

.review-date[b-olragphgax] {
    font-size: 0.8125rem;
    opacity: 0.6;
}

.score-display[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.score-value[b-olragphgax] {
    font-size: 1.25rem;
    font-weight: 600;
}

.score-good[b-olragphgax] {
    color: var(--kendo-color-success);
}

.score-warning[b-olragphgax] {
    color: var(--kendo-color-warning);
}

/* Review Example */
.review-example[b-olragphgax] {
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
}

.example-preview[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.example-content[b-olragphgax] {
    font-size: 0.875rem;
    line-height: 1.5;
    opacity: 0.9;
}

/* Review Feedback */
.review-feedback[b-olragphgax] {
    padding: 1rem;
    background: var(--kendo-color-info-subtle);
    border-radius: var(--kendo-border-radius-md);
}

    .review-feedback h6[b-olragphgax] {
        margin: 0 0 0.5rem 0;
        font-size: 0.875rem;
    }

    .review-feedback p[b-olragphgax] {
        margin: 0 0 1rem 0;
        line-height: 1.5;
    }

.suggestions[b-olragphgax] {
    font-size: 0.875rem;
}

    .suggestions ul[b-olragphgax] {
        margin: 0.5rem 0 0 0;
        padding-left: 1.5rem;
    }

/* Review Categories */
.review-categories[b-olragphgax] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.category-score[b-olragphgax] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.category-name[b-olragphgax] {
    font-size: 0.8125rem;
    font-weight: 500;
}

.score-bar[b-olragphgax] {
    height: 6px;
}

/* Review Actions */
.review-actions[b-olragphgax] {
    display: flex;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--kendo-color-border);
}

/* Request Dialog */
.request-form[b-olragphgax] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.form-section h6[b-olragphgax] {
    margin: 0 0 0.5rem 0;
}

.form-section p[b-olragphgax] {
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    opacity: 0.8;
}

.sets-list[b-olragphgax] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-height: 200px;
    overflow-y: auto;
}

.set-item[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
}

.set-info[b-olragphgax] {
    display: flex;
    flex-direction: column;
}

.set-name[b-olragphgax] {
    font-weight: 500;
}

.set-meta[b-olragphgax] {
    font-size: 0.8125rem;
    opacity: 0.6;
}

/* Experts Grid */
.experts-grid[b-olragphgax] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.expert-selection[b-olragphgax] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--kendo-color-base);
    border: 2px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.2s ease;
}

    .expert-selection:hover[b-olragphgax] {
        border-color: var(--kendo-color-primary);
    }

    .expert-selection.selected[b-olragphgax] {
        background: var(--kendo-color-primary-subtle);
        border-color: var(--kendo-color-primary);
    }

.expert-details[b-olragphgax] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.expert-name[b-olragphgax] {
    font-weight: 500;
    font-size: 0.875rem;
}

.expert-tags[b-olragphgax] {
    display: flex;
    gap: 0.25rem;
}

/* Discussion Dialog */
.discussion-container[b-olragphgax] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.feedback-summary[b-olragphgax] {
    padding: 1rem;
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-md);
}

    .feedback-summary h6[b-olragphgax] {
        margin: 0 0 0.5rem 0;
    }

    .feedback-summary p[b-olragphgax] {
        margin: 0 0 1rem 0;
        line-height: 1.5;
    }

.score-summary[b-olragphgax] {
    font-weight: 600;
    color: var(--kendo-color-primary);
}

.discussion-thread[b-olragphgax] {
    max-height: 300px;
    overflow-y: auto;
}

    .discussion-thread h6[b-olragphgax] {
        margin: 0 0 1rem 0;
    }

.discussion-message[b-olragphgax] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

    .discussion-message.expert .message-content[b-olragphgax] {
        background: var(--kendo-color-info-subtle);
    }

    .discussion-message.user .message-content[b-olragphgax] {
        background: var(--kendo-color-primary-subtle);
    }

.message-content[b-olragphgax] {
    flex: 1;
    padding: 0.75rem;
    border-radius: var(--kendo-border-radius-md);
}

.message-header[b-olragphgax] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.25rem;
    font-size: 0.8125rem;
}

    .message-header .author[b-olragphgax] {
        font-weight: 500;
    }

    .message-header .timestamp[b-olragphgax] {
        opacity: 0.6;
    }

.message-content p[b-olragphgax] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    .expert-card[b-olragphgax],
    .review-example[b-olragphgax],
    .set-item[b-olragphgax],
    .expert-selection[b-olragphgax] {
        background: var(--kendo-color-surface);
    }

    .feedback-summary[b-olragphgax] {
        background: var(--kendo-color-surface);
    }
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/FunctionTrainingMode.razor.rz.scp.css */
.function-training-container[b-ugmfkt26cq] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

/* Header */
.function-header[b-ugmfkt26cq] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

.header-content[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-info[b-ugmfkt26cq] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.info-text h4[b-ugmfkt26cq] {
    margin: 0;
    font-size: 1.125rem;
}

.header-subtitle[b-ugmfkt26cq] {
    font-size: 0.875rem;
    opacity: 0.7;
    font-weight: normal;
}

.header-actions[b-ugmfkt26cq] {
    display: flex;
    gap: 0.75rem;
}

/* Main Content */
.function-content[b-ugmfkt26cq] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    flex: 1;
    min-height: 0;
}

/* Panels */
.definition-panel[b-ugmfkt26cq],
.examples-panel[b-ugmfkt26cq] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.panel-header[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

    .panel-header h5[b-ugmfkt26cq] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0;
    }

.example-count[b-ugmfkt26cq] {
    font-size: 0.875rem;
    opacity: 0.7;
}

/* Definition Content */
.definition-content[b-ugmfkt26cq],
.examples-content[b-ugmfkt26cq] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
}

/* Empty States */
.empty-state[b-ugmfkt26cq],
.no-function-selected[b-ugmfkt26cq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    opacity: 0.6;
    gap: 1rem;
}

/* Function Editor */
.function-editor[b-ugmfkt26cq] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.editor-section[b-ugmfkt26cq] {
    border-bottom: 1px solid var(--kendo-color-border);
    padding-bottom: 1.5rem;
}

    .editor-section:last-of-type[b-ugmfkt26cq] {
        border-bottom: none;
    }

    .editor-section h6[b-ugmfkt26cq] {
        margin: 0 0 1rem 0;
    }

.section-header[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

    .section-header h6[b-ugmfkt26cq] {
        margin: 0;
    }

/* Form Groups */
.form-group[b-ugmfkt26cq] {
    margin-bottom: 1rem;
}

    .form-group label[b-ugmfkt26cq] {
        display: block;
        font-weight: 500;
        font-size: 0.875rem;
        margin-bottom: 0.375rem;
    }

    .form-group.checkbox[b-ugmfkt26cq] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0;
    }

        .form-group.checkbox label[b-ugmfkt26cq] {
            margin: 0;
            font-weight: normal;
        }

    .form-group.full-width[b-ugmfkt26cq] {
        grid-column: 1 / -1;
    }

.field-error[b-ugmfkt26cq] {
    display: block;
    color: var(--kendo-color-error);
    font-size: 0.8125rem;
    margin-top: 0.25rem;
}

.field-success[b-ugmfkt26cq] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--kendo-color-success);
    font-size: 0.8125rem;
    margin-top: 0.25rem;
}

/* Parameters */
.no-parameters[b-ugmfkt26cq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    font-size: 0.875rem;
    opacity: 0.7;
}

.parameters-list[b-ugmfkt26cq] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.parameter-item[b-ugmfkt26cq] {
    background: var(--kendo-color-base);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    padding: 1rem;
}

.parameter-header[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.parameter-number[b-ugmfkt26cq] {
    font-size: 0.75rem;
    font-weight: 600;
    opacity: 0.6;
}

.parameter-fields[b-ugmfkt26cq] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.field-row[b-ugmfkt26cq] {
    display: grid;
    grid-template-columns: 1fr 120px auto;
    gap: 1rem;
    align-items: end;
}

/* Editor Actions */
.editor-actions[b-ugmfkt26cq] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    margin-top: 1.5rem;
}

/* Function Display */
.function-display[b-ugmfkt26cq] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.function-info h5[b-ugmfkt26cq] {
    margin: 0 0 0.5rem 0;
}

.function-info p[b-ugmfkt26cq] {
    margin: 0;
    opacity: 0.8;
}

.function-schema[b-ugmfkt26cq] {
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    overflow: hidden;
}

.schema-header[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

    .schema-header h6[b-ugmfkt26cq] {
        margin: 0;
        font-size: 0.875rem;
    }

.schema-code[b-ugmfkt26cq],
.code-textarea[b-ugmfkt26cq] {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
    font-size: 0.8125rem;
    line-height: 1.5;
}

.schema-code[b-ugmfkt26cq] {
    margin: 0;
    padding: 1rem;
    overflow-x: auto;
    white-space: pre-wrap;
}

.function-actions[b-ugmfkt26cq] {
    display: flex;
    gap: 0.75rem;
}

/* Example Builder */
.example-builder[b-ugmfkt26cq] {
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

    .example-builder h6[b-ugmfkt26cq] {
        margin: 0 0 1rem 0;
    }

.json-editor[b-ugmfkt26cq] {
    position: relative;
}

.json-tools[b-ugmfkt26cq] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    display: flex;
    gap: 0.5rem;
}

.example-actions[b-ugmfkt26cq] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    margin-top: 1rem;
}

/* Examples List */
.examples-list h6[b-ugmfkt26cq] {
    margin: 0 0 1rem 0;
}

.example-item[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: start;
    padding: 1rem;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    margin-bottom: 0.75rem;
    transition: all 0.2s ease;
}

    .example-item:hover[b-ugmfkt26cq] {
        border-color: var(--kendo-color-primary-subtle);
        transform: translateX(2px);
    }

.example-content[b-ugmfkt26cq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.example-query[b-ugmfkt26cq],
.example-call[b-ugmfkt26cq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

.example-call[b-ugmfkt26cq] {
    opacity: 0.8;
}

    .example-call code[b-ugmfkt26cq] {
        font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
        font-size: 0.8125rem;
    }

.example-actions[b-ugmfkt26cq] {
    display: flex;
    gap: 0.25rem;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.example-item:hover .example-actions[b-ugmfkt26cq] {
    opacity: 1;
}

/* Action Bar */
.action-bar[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
}

.function-management[b-ugmfkt26cq],
.export-actions[b-ugmfkt26cq] {
    display: flex;
    gap: 0.75rem;
}

/* Dialogs */
.schema-preview[b-ugmfkt26cq],
.jsonl-content[b-ugmfkt26cq] {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
    font-size: 0.8125rem;
    line-height: 1.5;
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    overflow-x: auto;
    white-space: pre-wrap;
    margin: 0;
}

.jsonl-preview[b-ugmfkt26cq] {
    max-height: 500px;
    overflow-y: auto;
}

.preview-header[b-ugmfkt26cq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    .schema-code[b-ugmfkt26cq],
    .jsonl-content[b-ugmfkt26cq],
    .code-textarea[b-ugmfkt26cq] {
        background: var(--kendo-color-surface);
    }

    .no-parameters[b-ugmfkt26cq],
    .parameter-item[b-ugmfkt26cq],
    .example-builder[b-ugmfkt26cq],
    .function-schema[b-ugmfkt26cq] {
        background: var(--kendo-color-surface);
    }
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/MultiTurnTrainingMode.razor.rz.scp.css */
.multi-turn-container[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

/* Header */
.conversation-header[b-skklygvo4a] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

.header-content[b-skklygvo4a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.conversation-info[b-skklygvo4a] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.info-text h4[b-skklygvo4a] {
    margin: 0;
    font-size: 1.125rem;
}

.conversation-stats[b-skklygvo4a] {
    font-size: 0.875rem;
    opacity: 0.7;
}

.header-controls[b-skklygvo4a] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

/* Tips */
.conversation-tips[b-skklygvo4a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.75rem 1rem;
    background: var(--kendo-color-info-subtle);
    border-radius: var(--kendo-border-radius-md);
    font-size: 0.875rem;
}

/* Builder Area */
.conversation-builder[b-skklygvo4a] {
    flex: 1;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    overflow: hidden;
}

/* Flow View */
.flow-container[b-skklygvo4a] {
    padding: 2rem;
    overflow-y: auto;
    height: 100%;
}

.empty-state[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100%;
    gap: 1rem;
    opacity: 0.6;
}

.messages-flow[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    gap: 0;
    max-width: 700px;
    margin: 0 auto;
}

.flow-message-wrapper[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.flow-connector[b-skklygvo4a] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2rem;
    position: relative;
}

.connector-line[b-skklygvo4a] {
    width: 2px;
    height: 100%;
    background: var(--kendo-color-border);
}

    .connector-line.dashed[b-skklygvo4a] {
        background: repeating-linear-gradient( to bottom, var(--kendo-color-border) 0, var(--kendo-color-border) 4px, transparent 4px, transparent 8px );
    }

.connector-arrow[b-skklygvo4a] {
    position: absolute;
    background: var(--kendo-color-surface);
    padding: 0.25rem;
    color: var(--kendo-color-subtle);
}

.flow-message[b-skklygvo4a] {
    width: 100%;
    background: var(--kendo-color-surface-alt);
    border: 2px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.25rem;
    cursor: move;
    transition: all 0.3s ease;
}

    .flow-message:hover[b-skklygvo4a] {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
    }

    .flow-message.selected[b-skklygvo4a] {
        border-color: var(--kendo-color-primary);
        box-shadow: 0 0 0 3px var(--kendo-color-primary-subtle);
    }

    .flow-message.system-message[b-skklygvo4a] {
        border-color: var(--kendo-color-info);
    }

    .flow-message.user-message[b-skklygvo4a] {
        border-color: var(--kendo-color-primary);
    }

    .flow-message.assistant-message[b-skklygvo4a] {
        border-color: var(--kendo-color-success);
    }

/* Dark mode flow message hover */
@media (prefers-color-scheme: dark) {
    .flow-message:hover[b-skklygvo4a] {
        box-shadow: 0 6px 20px rgba(255, 255, 255, 0.1);
    }
}

/* Message Structure */
.message-header[b-skklygvo4a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.message-info[b-skklygvo4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.message-role[b-skklygvo4a] {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.75rem;
}

.message-number[b-skklygvo4a] {
    font-size: 0.75rem;
    opacity: 0.5;
}

.message-actions[b-skklygvo4a] {
    display: flex;
    gap: 0.25rem;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.flow-message:hover .message-actions[b-skklygvo4a] {
    opacity: 1;
}

.message-content[b-skklygvo4a] {
    line-height: 1.6;
    margin-bottom: 0.75rem;
}

.message-footer[b-skklygvo4a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.75rem;
    opacity: 0.6;
}

.word-count[b-skklygvo4a] {
    font-size: 0.75rem;
}

.message-warnings[b-skklygvo4a] {
    display: flex;
    gap: 0.5rem;
}

.warning-icon[b-skklygvo4a] {
    color: var(--kendo-color-warning);
    cursor: help;
}

/* Chat View */
.chat-container[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.chat-messages[b-skklygvo4a] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.chat-message[b-skklygvo4a] {
    display: flex;
    gap: 0.75rem;
    animation: fadeInUp-b-skklygvo4a 0.3s ease-out;
}

    .chat-message.user-message[b-skklygvo4a] {
        flex-direction: row-reverse;
    }

.message-avatar[b-skklygvo4a] {
    width: 36px;
    height: 36px;
    background: var(--kendo-color-surface-alt);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--kendo-color-border);
}

.chat-message.system-message .message-avatar[b-skklygvo4a] {
    background: var(--kendo-color-info-subtle);
    border-color: var(--kendo-color-info);
}

.chat-message.user-message .message-avatar[b-skklygvo4a] {
    background: var(--kendo-color-primary-subtle);
    border-color: var(--kendo-color-primary);
}

.chat-message.assistant-message .message-avatar[b-skklygvo4a] {
    background: var(--kendo-color-success-subtle);
    border-color: var(--kendo-color-success);
}

.message-bubble[b-skklygvo4a] {
    max-width: 70%;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1rem;
}

.chat-message.user-message .message-bubble[b-skklygvo4a] {
    background: var(--kendo-color-primary-subtle);
    border-color: var(--kendo-color-primary);
}

.bubble-header[b-skklygvo4a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.bubble-role[b-skklygvo4a] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    opacity: 0.7;
}

.bubble-actions[b-skklygvo4a] {
    display: flex;
    gap: 0.25rem;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.message-bubble:hover .bubble-actions[b-skklygvo4a] {
    opacity: 1;
}

.bubble-content[b-skklygvo4a] {
    line-height: 1.6;
}

/* Typing Indicator */
.typing-indicator[b-skklygvo4a] {
    display: flex;
    gap: 4px;
    padding: 8px 0;
}

    .typing-indicator span[b-skklygvo4a] {
        width: 8px;
        height: 8px;
        background: var(--kendo-color-subtle);
        border-radius: 50%;
        animation: typing-b-skklygvo4a 1.4s infinite;
    }

        .typing-indicator span:nth-child(2)[b-skklygvo4a] {
            animation-delay: 0.2s;
        }

        .typing-indicator span:nth-child(3)[b-skklygvo4a] {
            animation-delay: 0.4s;
        }

@keyframes typing-b-skklygvo4a {
    0%, 60%, 100% {
        transform: translateY(0);
        opacity: 0.7;
    }

    30% {
        transform: translateY(-10px);
        opacity: 1;
    }
}

/* Chat Input Bar */
.chat-input-bar[b-skklygvo4a] {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    background: var(--kendo-color-surface-alt);
    border-top: 1px solid var(--kendo-color-border);
}

.role-item[b-skklygvo4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Add Message Button */
.flow-add-message[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 0;
}

.add-message-button[b-skklygvo4a] {
    width: 200px;
}

/* Analysis Panel */
.analysis-panel[b-skklygvo4a] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

    .analysis-panel h5[b-skklygvo4a] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0 0 1rem 0;
    }

.analysis-grid[b-skklygvo4a] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.analysis-item[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.analysis-label[b-skklygvo4a] {
    font-size: 0.875rem;
    opacity: 0.7;
}

.analysis-value[b-skklygvo4a] {
    font-size: 1.25rem;
    font-weight: 600;
}

.analysis-indicator[b-skklygvo4a] {
    height: 4px;
    border-radius: 2px;
    background: var(--kendo-color-base);
}

    .analysis-indicator.good[b-skklygvo4a] {
        background: var(--kendo-color-success);
    }

    .analysis-indicator.warning[b-skklygvo4a] {
        background: var(--kendo-color-warning);
    }

.quality-progress[b-skklygvo4a] {
    height: 4px;
    margin-top: 0.5rem;
}

/* Suggestions */
.suggestions-section h6[b-skklygvo4a] {
    margin: 0 0 0.75rem 0;
    font-size: 0.875rem;
}

.suggestion-list[b-skklygvo4a] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .suggestion-list li[b-skklygvo4a] {
        padding: 0.5rem 0;
        padding-left: 1.5rem;
        position: relative;
        font-size: 0.875rem;
        line-height: 1.5;
    }

        .suggestion-list li[b-skklygvo4a]::before {
            content: "•";
            position: absolute;
            left: 0.5rem;
            color: var(--kendo-color-primary);
        }

/* Action Bar */
.action-bar[b-skklygvo4a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
}

.action-buttons[b-skklygvo4a] {
    display: flex;
    gap: 0.75rem;
}

/* Message Editor */
.message-editor[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.editor-field[b-skklygvo4a] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

    .editor-field label[b-skklygvo4a] {
        font-weight: 500;
        font-size: 0.875rem;
    }

.content-helpers[b-skklygvo4a] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.editor-preview[b-skklygvo4a] {
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    padding: 1rem;
}

    .editor-preview h6[b-skklygvo4a] {
        margin: 0 0 0.75rem 0;
        font-size: 0.875rem;
        opacity: 0.7;
    }

.preview-message[b-skklygvo4a] {
    padding: 0.75rem;
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
}

.preview-role[b-skklygvo4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
    opacity: 0.8;
}

.preview-content[b-skklygvo4a] {
    line-height: 1.6;
    opacity: 0.9;
}

/* Preview Dialog */
.preview-conversation[b-skklygvo4a] {
    max-height: 400px;
    overflow-y: auto;
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    margin-bottom: 1.5rem;
}

.preview-turn[b-skklygvo4a] {
    padding: 1rem;
    margin-bottom: 1rem;
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
}

    .preview-turn:last-child[b-skklygvo4a] {
        margin-bottom: 0;
    }

    .preview-turn.system-message[b-skklygvo4a] {
        background: var(--kendo-color-info-subtle);
        border-color: var(--kendo-color-info);
    }

    .preview-turn.user-message[b-skklygvo4a] {
        background: var(--kendo-color-primary-subtle);
        border-color: var(--kendo-color-primary);
    }

    .preview-turn.assistant-message[b-skklygvo4a] {
        background: var(--kendo-color-success-subtle);
        border-color: var(--kendo-color-success);
    }

.turn-header[b-skklygvo4a] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.turn-role[b-skklygvo4a] {
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    opacity: 0.8;
}

.turn-content[b-skklygvo4a] {
    line-height: 1.6;
}

.preview-stats[b-skklygvo4a] {
    display: flex;
    gap: 2rem;
    padding: 1rem;
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-md);
}

.stat-item[b-skklygvo4a] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.stat-label[b-skklygvo4a] {
    font-size: 0.875rem;
    opacity: 0.7;
}

.stat-value[b-skklygvo4a] {
    font-weight: 600;
}

/* Animations */
@keyframes fadeInUp-b-skklygvo4a {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Dark mode specific adjustments */
@media (prefers-color-scheme: dark) {
    .analysis-indicator[b-skklygvo4a] {
        opacity: 0.8;
    }

    .preview-conversation[b-skklygvo4a] {
        background: var(--kendo-color-surface);
    }

    .editor-preview[b-skklygvo4a] {
        background: var(--kendo-color-surface);
    }
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/QualityGuidelines.razor.rz.scp.css */
:host[b-xv2wdatxo9] {
    display: block;
    max-width: 100%;
}

/* Contain sizing and prevent horizontal overflow within dialogs */
.quality-guidelines-container[b-xv2wdatxo9] {
    display: flex;    
    flex-direction: column;
    gap: 1.5rem;
    width: 100%;
    max-width: 100%;
    overflow-x: clip; /* avoid horizontal scroll caused by transforms/min-content */
}

    /* Ensure box sizing stays predictable only within this component */
    .quality-guidelines-container[b-xv2wdatxo9],
    .quality-guidelines-container *[b-xv2wdatxo9] {
        box-sizing: border-box;
    }

/* Header Section */
.guidelines-header[b-xv2wdatxo9] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); /* allow children to shrink */
    gap: 1.5rem;
    padding: 1.5rem;
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-lg);
}

/* Let children shrink inside flex/grid parents to avoid overflow */
.score-overview[b-xv2wdatxo9],
.score-details[b-xv2wdatxo9],
.suggestion-category[b-xv2wdatxo9],
.suggestion-content[b-xv2wdatxo9],
.suggestion-text[b-xv2wdatxo9],
.milestone-content[b-xv2wdatxo9],
.action-content[b-xv2wdatxo9],
.template-header[b-xv2wdatxo9],
.template-preview[b-xv2wdatxo9],
.category-header[b-xv2wdatxo9] {
    min-width: 0;
}

.score-overview[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.score-circle[b-xv2wdatxo9] {
    width: 120px;
    height: 120px;
}

.score-details h4[b-xv2wdatxo9] {
    margin: 0 0 0.5rem 0;
}

.score-value[b-xv2wdatxo9] {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 0.5rem;
}

.score-status[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

    .score-status.excellent[b-xv2wdatxo9] {
        color: var(--kendo-color-success);
    }

    .score-status.good[b-xv2wdatxo9] {
        color: var(--kendo-color-info);
    }

    .score-status.fair[b-xv2wdatxo9] {
        color: var(--kendo-color-warning);
    }

    .score-status.needs-improvement[b-xv2wdatxo9] {
        color: var(--kendo-color-error);
    }

.improvement-potential[b-xv2wdatxo9] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.5rem;
    background: var(--kendo-color-primary-subtle);
    border-radius: var(--kendo-border-radius-md);
}

    .improvement-potential h5[b-xv2wdatxo9] {
        margin: 0;
        font-size: 0.875rem;
    }

    /* Ensure Telerik progressbars shrink within container */
    .improvement-potential :deep(.k-progressbar)[b-xv2wdatxo9],
    .category-score :deep(.k-progressbar)[b-xv2wdatxo9] {
        width: 100%;
        max-width: 100%;
    }

.potential-bar[b-xv2wdatxo9] {
    height: 8px;
}

.potential-text[b-xv2wdatxo9] {
    font-size: 0.875rem;
    font-weight: 500;
}

/* Suggestions Content */
.suggestions-content[b-xv2wdatxo9] {
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

    .suggestions-content h5[b-xv2wdatxo9] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0 0 1.5rem 0;
    }

/* Clamp card columns so they never force horizontal overflow */
.suggestions-grid[b-xv2wdatxo9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
    gap: 1.5rem;
}

.suggestion-category[b-xv2wdatxo9] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    padding: 1.25rem;
    max-width: 100%;
}

.category-header[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

    .category-header h6[b-xv2wdatxo9] {
        flex: 1;
        margin: 0;
    }

.category-score[b-xv2wdatxo9] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.category-progress[b-xv2wdatxo9] {
    height: 6px;
}

.suggestions-list[b-xv2wdatxo9] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.suggestion-item[b-xv2wdatxo9] {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
    padding: 0.75rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-sm);
    transition: all 0.2s ease;
    max-width: 100%;
}

    .suggestion-item.applied[b-xv2wdatxo9] {
        opacity: 0.6;
        background: var(--kendo-color-success-subtle);
    }

.suggestion-content[b-xv2wdatxo9] {
    display: flex;
    gap: 0.75rem;
    flex: 1;
}

.suggestion-text[b-xv2wdatxo9] {
    flex: 1;
}

    /* Wrap long text to avoid pushing layout */
    .suggestion-text p[b-xv2wdatxo9],
    .template-preview .message[b-xv2wdatxo9],
    .template-notes[b-xv2wdatxo9] {
        margin: 0 0 0.5rem 0;
        font-size: 0.875rem;
        line-height: 1.5;
        word-break: break-word;
        overflow-wrap: anywhere;
    }

.suggestion-example[b-xv2wdatxo9] {
    font-size: 0.8125rem;
    opacity: 0.8;
    font-style: italic;
}

/* Best Practices */
.best-practices[b-xv2wdatxo9] {
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

    .best-practices h5[b-xv2wdatxo9] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0 0 1rem 0;
    }

.practices-content[b-xv2wdatxo9] {
    padding: 1rem 0;
}

.practice-section h6[b-xv2wdatxo9] {
    margin: 0 0 1rem 0;
}

.practice-section ul[b-xv2wdatxo9] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.practice-section li[b-xv2wdatxo9] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

    .practice-section li:last-child[b-xv2wdatxo9] {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

.check-icon[b-xv2wdatxo9] {
    color: var(--kendo-color-success);
    flex-shrink: 0;
}

/* Do's and Don'ts */
.dos-donts-grid[b-xv2wdatxo9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
    gap: 2rem;
    padding: 1rem 0;
}

.dos-section[b-xv2wdatxo9],
.donts-section[b-xv2wdatxo9] {
    padding: 1.25rem;
    border-radius: var(--kendo-border-radius-md);
}

.dos-section[b-xv2wdatxo9] {
    background: var(--kendo-color-success-subtle);
}

.donts-section[b-xv2wdatxo9] {
    background: var(--kendo-color-error-subtle);
}

.dos-header[b-xv2wdatxo9],
.donts-header[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 1rem 0;
}

.dos-header[b-xv2wdatxo9] {
    color: var(--kendo-color-success);
}

.donts-header[b-xv2wdatxo9] {
    color: var(--kendo-color-error);
}

.dos-section ul[b-xv2wdatxo9],
.donts-section ul[b-xv2wdatxo9] {
    margin: 0;
    padding-left: 1.5rem;
}

.dos-section li[b-xv2wdatxo9],
.donts-section li[b-xv2wdatxo9] {
    margin-bottom: 0.5rem;
}

/* Templates */
.templates-showcase[b-xv2wdatxo9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
    gap: 1.5rem;
    padding: 1rem 0;
}

.template-card[b-xv2wdatxo9] {
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    overflow: hidden;
    max-width: 100%;
}

.template-header[b-xv2wdatxo9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: var(--kendo-color-base);
}

    .template-header h6[b-xv2wdatxo9] {
        margin: 0;
    }

.template-preview[b-xv2wdatxo9] {
    padding: 1rem;
}

    .template-preview .message[b-xv2wdatxo9] {
        padding: 0.75rem;
        margin-bottom: 0.75rem;
        border-radius: var(--kendo-border-radius-sm);
        font-size: 0.875rem;
        line-height: 1.5;
    }

        .template-preview .message:last-child[b-xv2wdatxo9] {
            margin-bottom: 0;
        }

        .template-preview .message.user[b-xv2wdatxo9] {
            background: var(--kendo-color-primary-subtle);
            border: 1px solid var(--kendo-color-primary);
        }

        .template-preview .message.assistant[b-xv2wdatxo9] {
            background: var(--kendo-color-success-subtle);
            border: 1px solid var(--kendo-color-success);
        }

.message-role[b-xv2wdatxo9] {
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    margin-bottom: 0.25rem;
    opacity: 0.8;
}

/* Progress Tracking */
.progress-section[b-xv2wdatxo9] {
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

    .progress-section h5[b-xv2wdatxo9] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0 0 1.5rem 0;
    }

.milestones-list[b-xv2wdatxo9] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.milestone-item[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    transition: all 0.2s ease;
    max-width: 100%;
}

    .milestone-item.achieved[b-xv2wdatxo9] {
        background: var(--kendo-color-success-subtle);
        border-color: var(--kendo-color-success);
    }

    .milestone-item.current[b-xv2wdatxo9] {
        border-color: var(--kendo-color-primary);
        box-shadow: 0 0 0 2px var(--kendo-color-primary-subtle);
    }

.milestone-icon[b-xv2wdatxo9] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--kendo-color-base);
    border: 2px solid var(--kendo-color-border);
}

.milestone-item.achieved .milestone-icon[b-xv2wdatxo9] {
    background: var(--kendo-color-success);
    border-color: var(--kendo-color-success);
    color: white;
}

.milestone-content[b-xv2wdatxo9] {
    flex: 1;
}

    .milestone-content h6[b-xv2wdatxo9] {
        margin: 0 0 0.25rem 0;
    }

    .milestone-content p[b-xv2wdatxo9] {
        margin: 0;
        font-size: 0.875rem;
        opacity: 0.8;
    }

.milestone-reward[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Action Items */
.action-items[b-xv2wdatxo9] {
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

    .action-items h5[b-xv2wdatxo9] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0 0 1rem 0;
    }

.actions-list[b-xv2wdatxo9] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.action-item[b-xv2wdatxo9] {
    display: flex;
    align-items: start;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.2s ease;
    max-width: 100%;
}

    .action-item:hover[b-xv2wdatxo9] {
        border-color: var(--kendo-color-primary);
        transform: translateX(4px);
    }

    .action-item.completed[b-xv2wdatxo9] {
        opacity: 0.6;
        text-decoration: line-through;
    }

.action-priority[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    flex-shrink: 0;
}

    .action-priority.high[b-xv2wdatxo9] {
        background: var(--kendo-color-error-subtle);
        color: var(--kendo-color-error);
    }

    .action-priority.medium[b-xv2wdatxo9] {
        background: var(--kendo-color-warning-subtle);
        color: var(--kendo-color-warning);
    }

    .action-priority.low[b-xv2wdatxo9] {
        background: var(--kendo-color-info-subtle);
        color: var(--kendo-color-info);
    }

.action-content[b-xv2wdatxo9] {
    flex: 1;
}

    .action-content p[b-xv2wdatxo9] {
        margin: 0;
        font-size: 0.875rem;
        line-height: 1.5;
    }

    .action-content .action-impact[b-xv2wdatxo9] {
        font-size: 0.8125rem;
        opacity: 0.6;
        margin-top: 0.25rem;
    }

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    .improvement-potential[b-xv2wdatxo9] {
        background: var(--kendo-color-primary-subtle);
        opacity: 0.9;
    }

    .suggestion-item[b-xv2wdatxo9] {
        background: var(--kendo-color-surface);
    }

        .suggestion-item.applied[b-xv2wdatxo9] {
            background: var(--kendo-color-success-subtle);
            opacity: 0.7;
        }

    .dos-section[b-xv2wdatxo9] {
        background: var(--kendo-color-success-subtle);
        opacity: 0.9;
    }

    .donts-section[b-xv2wdatxo9] {
        background: var(--kendo-color-error-subtle);
        opacity: 0.9;
    }

    .template-card[b-xv2wdatxo9] {
        background: var(--kendo-color-surface);
    }

    .milestone-item[b-xv2wdatxo9],
    .action-item[b-xv2wdatxo9] {
        background: var(--kendo-color-surface);
    }

        .milestone-item.achieved[b-xv2wdatxo9] {
            background: var(--kendo-color-success-subtle);
            opacity: 0.9;
        }

    .expert-card[b-xv2wdatxo9] {
        background: var(--kendo-color-surface);
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .guidelines-header[b-xv2wdatxo9] {
        grid-template-columns: 1fr;
    }

    .suggestions-grid[b-xv2wdatxo9] {
        grid-template-columns: 1fr;
    }

    .dos-donts-grid[b-xv2wdatxo9] {
        grid-template-columns: 1fr;
    }

    .expert-stats[b-xv2wdatxo9] {
        grid-template-columns: 1fr;
    }

    .practices-content[b-xv2wdatxo9] {
        padding: 0.5rem 0;
    }

    .score-circle[b-xv2wdatxo9] {
        width: 100px;
        height: 100px;
    }

    .score-value[b-xv2wdatxo9] {
        font-size: 2rem;
    }
}

/* Animations */
@keyframes slideInRight-b-xv2wdatxo9 {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes pulse-b-xv2wdatxo9 {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

.suggestion-item[b-xv2wdatxo9],
.milestone-item[b-xv2wdatxo9],
.action-item[b-xv2wdatxo9] {
    animation: slideInRight-b-xv2wdatxo9 0.3s ease-out;
    animation-fill-mode: both;
}

    .suggestion-item:nth-child(1)[b-xv2wdatxo9] {
        animation-delay: 0.05s;
    }

    .suggestion-item:nth-child(2)[b-xv2wdatxo9] {
        animation-delay: 0.1s;
    }

    .suggestion-item:nth-child(3)[b-xv2wdatxo9] {
        animation-delay: 0.15s;
    }

.improvement-potential[b-xv2wdatxo9] {
    animation: pulse-b-xv2wdatxo9 2s ease-in-out infinite;
}

/* Loading states */
.loading-shimmer[b-xv2wdatxo9] {
    position: relative;
    overflow: hidden;
}

    .loading-shimmer[b-xv2wdatxo9]::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, 0.1) 50%, transparent 100% );
        animation: shimmer-b-xv2wdatxo9 1.5s infinite;
    }

@keyframes shimmer-b-xv2wdatxo9 {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(100%);
    }
}

/* Utility classes */
.text-truncate[b-xv2wdatxo9] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fade-in[b-xv2wdatxo9] {
    animation: fadeIn-b-xv2wdatxo9 0.3s ease-out;
}

@keyframes fadeIn-b-xv2wdatxo9 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Footer layout to avoid overflow in tight spaces */
.guidelines-footer[b-xv2wdatxo9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/SimpleTrainingMode.razor.rz.scp.css */
.simple-training-container[b-4qo7i0he5m] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 900px;
    margin: 0 auto;
}

/* Section Styling */
.context-section[b-4qo7i0he5m],
.query-section[b-4qo7i0he5m],
.response-section[b-4qo7i0he5m] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
    transition: all 0.3s ease;
}

    .context-section:hover[b-4qo7i0he5m],
    .query-section:hover[b-4qo7i0he5m],
    .response-section:hover[b-4qo7i0he5m] {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
        transform: translateY(-1px);
    }

/* Dark mode enhancements */
@media (prefers-color-scheme: dark) {
    .context-section:hover[b-4qo7i0he5m],
    .query-section:hover[b-4qo7i0he5m],
    .response-section:hover[b-4qo7i0he5m] {
        box-shadow: 0 4px 12px rgba(255, 255, 255, 0.05);
        border-color: var(--kendo-color-primary-subtle);
    }
}

/* Section Headers */
.section-header[b-4qo7i0he5m] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.header-title[b-4qo7i0he5m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .header-title h4[b-4qo7i0he5m] {
        margin: 0;
        font-size: 1rem;
        font-weight: 600;
    }

.optional-badge[b-4qo7i0he5m],
.required-badge[b-4qo7i0he5m] {
    font-size: 0.75rem;
    padding: 0.125rem 0.5rem;
    border-radius: var(--kendo-border-radius-sm);
    font-weight: 500;
}

.optional-badge[b-4qo7i0he5m] {
    background: var(--kendo-color-info-subtle);
    color: var(--kendo-color-info-on-subtle);
}

.required-badge[b-4qo7i0he5m] {
    background: var(--kendo-color-error-subtle);
    color: var(--kendo-color-error-on-subtle);
}

/* Role Icons */
.role-icon[b-4qo7i0he5m] {
    width: 24px;
    height: 24px;
    padding: 4px;
    border-radius: var(--kendo-border-radius-md);
}

    .role-icon.user[b-4qo7i0he5m] {
        background: var(--kendo-color-primary-subtle);
        color: var(--kendo-color-primary);
    }

    .role-icon.assistant[b-4qo7i0he5m] {
        background: var(--kendo-color-success-subtle);
        color: var(--kendo-color-success);
    }

/* Input Areas */
.context-input-wrapper[b-4qo7i0he5m],
.input-container[b-4qo7i0he5m] {
    position: relative;
}

.context-textarea[b-4qo7i0he5m],
.query-textarea[b-4qo7i0he5m],
.response-textarea[b-4qo7i0he5m] {
    width: 100%;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 0.9375rem;
    line-height: 1.6;
    resize: vertical;
}

.character-count[b-4qo7i0he5m] {
    position: absolute;
    bottom: 0.5rem;
    right: 0.5rem;
    font-size: 0.75rem;
    opacity: 0.6;
}

    .character-count .warning[b-4qo7i0he5m] {
        color: var(--kendo-color-warning);
        font-weight: 600;
    }

/* Context Examples */
.context-examples[b-4qo7i0he5m] {
    margin-top: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.examples-label[b-4qo7i0he5m] {
    font-size: 0.875rem;
    opacity: 0.7;
}

.example-chips[b-4qo7i0he5m] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Visual Connector */
.visual-connector[b-4qo7i0he5m] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2rem;
    position: relative;
}

.connector-line[b-4qo7i0he5m] {
    position: absolute;
    width: 2px;
    height: 100%;
    background: var(--kendo-color-border);
    opacity: 0.5;
}

.connector-icon[b-4qo7i0he5m] {
    background: var(--kendo-color-surface);
    padding: 0.25rem;
    border-radius: 50%;
    z-index: 1;
    color: var(--kendo-color-subtle);
}

/* Query Analysis */
.query-analysis[b-4qo7i0he5m] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--kendo-color-border);
}

.analysis-items[b-4qo7i0he5m] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.analysis-item[b-4qo7i0he5m] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    opacity: 0.8;
}

/* Suggestions Panel */
.suggestions-panel[b-4qo7i0he5m] {
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
}

.suggestions-label[b-4qo7i0he5m] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    opacity: 0.7;
}

.suggestion-list[b-4qo7i0he5m] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.suggestion-item[b-4qo7i0he5m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: var(--kendo-color-surface);
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.875rem;
}

    .suggestion-item:hover[b-4qo7i0he5m] {
        background: var(--kendo-color-base-hover);
        transform: translateX(4px);
    }

/* Quality Indicators */
.quality-indicators[b-4qo7i0he5m] {
    display: flex;
    gap: 1rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--kendo-color-border);
}

.indicator[b-4qo7i0he5m] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
}

    .indicator.success[b-4qo7i0he5m] {
        color: var(--kendo-color-success);
    }

    .indicator.warning[b-4qo7i0he5m] {
        color: var(--kendo-color-warning);
    }

/* Enhancement Tools */
.enhancement-tools[b-4qo7i0he5m] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--kendo-color-border);
}

/* Action Bar */
.action-bar[b-4qo7i0he5m] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    margin-top: 1rem;
}

.action-info[b-4qo7i0he5m] {
    flex: 1;
}

.validation-summary[b-4qo7i0he5m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

    .validation-summary.error[b-4qo7i0he5m] {
        color: var(--kendo-color-error);
    }

    .validation-summary.success[b-4qo7i0he5m] {
        color: var(--kendo-color-success);
    }

.action-buttons[b-4qo7i0he5m] {
    display: flex;
    gap: 0.75rem;
}

/* Preview Dialog */
.preview-container[b-4qo7i0he5m] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.preview-message[b-4qo7i0he5m] {
    padding: 1rem;
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
}

    .preview-message.system[b-4qo7i0he5m] {
        background: var(--kendo-color-info-subtle);
        border-color: var(--kendo-color-info);
    }

    .preview-message.user[b-4qo7i0he5m] {
        background: var(--kendo-color-primary-subtle);
        border-color: var(--kendo-color-primary);
    }

    .preview-message.assistant[b-4qo7i0he5m] {
        background: var(--kendo-color-success-subtle);
        border-color: var(--kendo-color-success);
    }

.message-role[b-4qo7i0he5m] {
    font-weight: 600;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    opacity: 0.8;
}

.message-content[b-4qo7i0he5m] {
    line-height: 1.6;
    white-space: pre-wrap;
}

/* Dark mode optimizations */
@media (prefers-color-scheme: dark) {
    .suggestion-item[b-4qo7i0he5m] {
        background: var(--kendo-color-surface-alt);
    }

    .suggestions-panel[b-4qo7i0he5m] {
        background: var(--kendo-color-surface);
    }

    .preview-message[b-4qo7i0he5m] {
        border-width: 1px;
    }

    .quality-indicators[b-4qo7i0he5m],
    .enhancement-tools[b-4qo7i0he5m],
    .query-analysis[b-4qo7i0he5m] {
        border-color: rgba(255, 255, 255, 0.1);
    }
}

/* Animations */
@keyframes slideIn-b-4qo7i0he5m {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.suggestions-panel[b-4qo7i0he5m],
.query-analysis[b-4qo7i0he5m],
.quality-indicators[b-4qo7i0he5m] {
    animation: slideIn-b-4qo7i0he5m 0.3s ease-out;
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/TrainingLibraryView.razor.rz.scp.css */
.training-library-container[b-ot25hovbey] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

/* Header */
.library-header[b-ot25hovbey] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

.header-content[b-ot25hovbey] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

    .header-content h5[b-ot25hovbey] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0;
    }

.header-controls[b-ot25hovbey] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Stats */
.library-stats[b-ot25hovbey] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
}

.stat-card[b-ot25hovbey] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
}

.stat-content[b-ot25hovbey] {
    display: flex;
    flex-direction: column;
}

.stat-value[b-ot25hovbey] {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1;
}

.stat-label[b-ot25hovbey] {
    font-size: 0.875rem;
    opacity: 0.7;
}

/* Content */
.library-content[b-ot25hovbey] {
    flex: 1;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
    overflow-y: auto;
}

/* Empty State */
.empty-state[b-ot25hovbey] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    opacity: 0.6;
    gap: 1rem;
}

/* Grid View */
.training-grid[b-ot25hovbey] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
}

.training-card[b-ot25hovbey] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: all 0.3s ease;
}

    .training-card:hover[b-ot25hovbey] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    }

    .training-card.favorite[b-ot25hovbey] {
        border-color: var(--kendo-color-warning);
    }

/* Dark mode card hover */
@media (prefers-color-scheme: dark) {
    .training-card:hover[b-ot25hovbey] {
        box-shadow: 0 4px 12px rgba(255, 255, 255, 0.05);
    }
}

.card-header[b-ot25hovbey] {
    display: flex;
    justify-content: space-between;
    align-items: start;
}

.card-title[b-ot25hovbey] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .card-title h6[b-ot25hovbey] {
        margin: 0;
        font-size: 1rem;
    }

.favorite-icon[b-ot25hovbey] {
    color: var(--kendo-color-warning);
}

.card-description[b-ot25hovbey] {
    font-size: 0.875rem;
    opacity: 0.8;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.card-stats[b-ot25hovbey] {
    display: flex;
    gap: 1.5rem;
}

.stat[b-ot25hovbey] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    opacity: 0.8;
}

.card-metadata[b-ot25hovbey] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid var(--kendo-color-border);
}

.metadata-item[b-ot25hovbey] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    opacity: 0.7;
}

.status-chip[b-ot25hovbey] {
    font-size: 0.75rem;
}

    .status-chip.status-active[b-ot25hovbey] {
        background: var(--kendo-color-success-subtle);
        color: var(--kendo-color-success-on-subtle);
    }

    .status-chip.status-draft[b-ot25hovbey] {
        background: var(--kendo-color-info-subtle);
        color: var(--kendo-color-info-on-subtle);
    }

    .status-chip.status-review[b-ot25hovbey] {
        background: var(--kendo-color-warning-subtle);
        color: var(--kendo-color-warning-on-subtle);
    }

    .status-chip.status-approved[b-ot25hovbey] {
        background: var(--kendo-color-success-subtle);
        color: var(--kendo-color-success-on-subtle);
    }

.card-actions[b-ot25hovbey] {
    display: flex;
    gap: 0.75rem;
    margin-top: auto;
}

/* List View */
.training-list[b-ot25hovbey] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.list-header[b-ot25hovbey] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr auto;
    gap: 1rem;
    padding: 0.75rem 1rem;
    font-weight: 600;
    font-size: 0.875rem;
    opacity: 0.8;
    border-bottom: 2px solid var(--kendo-color-border);
}

.list-item[b-ot25hovbey] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr auto;
    gap: 1rem;
    padding: 1rem;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    align-items: center;
    transition: all 0.2s ease;
}

    .list-item:hover[b-ot25hovbey] {
        border-color: var(--kendo-color-primary-subtle);
        transform: translateX(2px);
    }

    .list-item.favorite[b-ot25hovbey] {
        border-color: var(--kendo-color-warning);
    }

.item-name[b-ot25hovbey] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
}

    .item-name .clickable[b-ot25hovbey] {
        cursor: pointer;
        color: var(--kendo-color-primary);
    }

        .item-name .clickable:hover[b-ot25hovbey] {
            text-decoration: underline;
        }

.quality-bar[b-ot25hovbey] {
    height: 6px;
}

.item-actions[b-ot25hovbey] {
    display: flex;
    gap: 0.25rem;
    justify-content: flex-end;
}

/* Details Dialog */
.details-container[b-ot25hovbey] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.details-section h6[b-ot25hovbey] {
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    text-transform: uppercase;
    opacity: 0.7;
}

.details-grid[b-ot25hovbey] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.detail-item[b-ot25hovbey] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .detail-item label[b-ot25hovbey] {
        font-size: 0.8125rem;
        font-weight: 500;
        opacity: 0.7;
    }

.quality-breakdown[b-ot25hovbey] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.quality-item[b-ot25hovbey] {
    display: grid;
    grid-template-columns: 120px 1fr;
    align-items: center;
    gap: 1rem;
}

    .quality-item span[b-ot25hovbey] {
        font-size: 0.875rem;
    }

/* Delete Dialog */
.warning-text[b-ot25hovbey] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--kendo-color-error);
    margin-top: 1rem;
}

/* Menu Items */
.delete-item[b-ot25hovbey] {
    color: var(--kendo-color-error);
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    .stat-card[b-ot25hovbey] {
        background: var(--kendo-color-surface);
    }
}
/* /Components/Pages/Modules/AgenticIntelliSys/AITraining/VisionTrainingMode.razor.rz.scp.css */
.vision-training-container[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

/* Vision Header */
.vision-header[b-pgf80w6bfo] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

.header-content[b-pgf80w6bfo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-info[b-pgf80w6bfo] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.info-text h4[b-pgf80w6bfo] {
    margin: 0;
    font-size: 1.125rem;
}

.header-subtitle[b-pgf80w6bfo] {
    font-size: 0.875rem;
    opacity: 0.7;
    font-weight: normal;
}

.header-stats[b-pgf80w6bfo] {
    display: flex;
    gap: 2rem;
}

.stat-item[b-pgf80w6bfo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    opacity: 0.8;
}

/* Vision Tips */
.vision-tips[b-pgf80w6bfo] {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
    padding: 1rem;
    background: var(--kendo-color-info-subtle);
    border-radius: var(--kendo-border-radius-md);
}

.tips-content[b-pgf80w6bfo] {
    flex: 1;
    font-size: 0.875rem;
}

    .tips-content strong[b-pgf80w6bfo] {
        display: block;
        margin-bottom: 0.5rem;
    }

    .tips-content ul[b-pgf80w6bfo] {
        margin: 0;
        padding-left: 1.5rem;
    }

    .tips-content li[b-pgf80w6bfo] {
        margin: 0.25rem 0;
    }

/* Main Content */
.vision-content[b-pgf80w6bfo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    flex: 1;
    min-height: 0;
}

/* Image Section */
.image-section[b-pgf80w6bfo],
.example-section[b-pgf80w6bfo] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.section-header[b-pgf80w6bfo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

    .section-header h5[b-pgf80w6bfo] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0;
    }

/* Upload Zone */
.upload-zone[b-pgf80w6bfo] {
    flex: 1;
    margin: 1.5rem;
    border: 2px dashed var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    background: var(--kendo-color-base);
    transition: all 0.3s ease;
    overflow-y: auto;
}

    .upload-zone.dragging[b-pgf80w6bfo] {
        border-color: var(--kendo-color-primary);
        background: var(--kendo-color-primary-subtle);
        transform: scale(1.02);
    }

.upload-placeholder[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 2rem;
    text-align: center;
    opacity: 0.7;
}

    .upload-placeholder h6[b-pgf80w6bfo] {
        margin: 1rem 0 0.5rem 0;
    }

    .upload-placeholder p[b-pgf80w6bfo] {
        font-size: 0.875rem;
        margin-bottom: 1.5rem;
    }

.vision-uploader[b-pgf80w6bfo] {
    width: 200px;
}

/* Image Gallery */
.image-gallery[b-pgf80w6bfo] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 1rem;
    padding: 1rem;
}

.image-item[b-pgf80w6bfo] {
    background: var(--kendo-color-surface);
    border: 2px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .image-item:hover[b-pgf80w6bfo] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    .image-item.selected[b-pgf80w6bfo] {
        border-color: var(--kendo-color-primary);
        box-shadow: 0 0 0 3px var(--kendo-color-primary-subtle);
    }

/* Dark mode image hover */
@media (prefers-color-scheme: dark) {
    .image-item:hover[b-pgf80w6bfo] {
        box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
    }
}

.image-container[b-pgf80w6bfo] {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
}

    .image-container img[b-pgf80w6bfo] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.image-overlay[b-pgf80w6bfo] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.8);
    color: white;
    gap: 0.5rem;
}

    .image-overlay.processing[b-pgf80w6bfo] {
        background: rgba(0, 0, 0, 0.7);
    }

.image-actions[b-pgf80w6bfo] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.image-item:hover .image-actions[b-pgf80w6bfo] {
    opacity: 1;
}

.image-info[b-pgf80w6bfo] {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.image-name[b-pgf80w6bfo] {
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.image-size[b-pgf80w6bfo] {
    font-size: 0.75rem;
    opacity: 0.6;
}

.image-tags[b-pgf80w6bfo] {
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
    margin-top: 0.5rem;
}

/* Add More Button */
.add-more-images[b-pgf80w6bfo] {
    display: flex;
    align-items: center;
    justify-content: stretch;
    min-height: 150px;
}

.add-more-button[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    border: 2px dashed var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.3s ease;
    opacity: 0.7;
}

    .add-more-button:hover[b-pgf80w6bfo] {
        opacity: 1;
        border-color: var(--kendo-color-primary);
        background: var(--kendo-color-primary-subtle);
    }

/* Example Section */
.selected-image-badge[b-pgf80w6bfo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: var(--kendo-color-primary-subtle);
    border-radius: var(--kendo-border-radius-md);
    font-size: 0.875rem;
}

.no-image-selected[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    opacity: 0.5;
    text-align: center;
    padding: 2rem;
}

/* Example Builder */
.example-builder[b-pgf80w6bfo] {
    padding: 1.5rem;
    overflow-y: auto;
}

.template-chips[b-pgf80w6bfo] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.chips-label[b-pgf80w6bfo] {
    font-size: 0.875rem;
    font-weight: 500;
    opacity: 0.7;
}

.example-field[b-pgf80w6bfo] {
    margin-bottom: 1.5rem;
}

    .example-field label[b-pgf80w6bfo] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-weight: 500;
        margin-bottom: 0.5rem;
    }

    .example-field .optional[b-pgf80w6bfo] {
        font-size: 0.75rem;
        opacity: 0.6;
        font-weight: normal;
        margin-left: 0.5rem;
    }

.example-textarea[b-pgf80w6bfo] {
    width: 100%;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Query Suggestions */
.query-suggestions[b-pgf80w6bfo] {
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
}

.suggestions-label[b-pgf80w6bfo] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    opacity: 0.7;
}

.suggestion-list[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.suggestion-item[b-pgf80w6bfo] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.5rem 0.75rem;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-sm);
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.875rem;
}

    .suggestion-item:hover[b-pgf80w6bfo] {
        background: var(--kendo-color-base-hover);
        border-color: var(--kendo-color-primary);
    }

/* Response Tools */
.response-tools[b-pgf80w6bfo] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

/* Quality Panel */
.quality-panel[b-pgf80w6bfo] {
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    padding: 1rem;
    margin-top: 1.5rem;
}

    .quality-panel h6[b-pgf80w6bfo] {
        margin: 0 0 0.75rem 0;
        font-size: 0.875rem;
    }

.quality-metrics[b-pgf80w6bfo] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.metric[b-pgf80w6bfo] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
}

    .metric.good[b-pgf80w6bfo] {
        color: var(--kendo-color-success);
    }

    .metric.warning[b-pgf80w6bfo] {
        color: var(--kendo-color-warning);
    }

/* Recent Examples */
.recent-examples[b-pgf80w6bfo] {
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
}

    .recent-examples h5[b-pgf80w6bfo] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0 0 1rem 0;
    }

.examples-grid[b-pgf80w6bfo] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}

.recent-example-card[b-pgf80w6bfo] {
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .recent-example-card:hover[b-pgf80w6bfo] {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

.example-image[b-pgf80w6bfo] {
    aspect-ratio: 16/9;
    overflow: hidden;
}

    .example-image img[b-pgf80w6bfo] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.example-details[b-pgf80w6bfo] {
    padding: 0.75rem;
}

.example-query[b-pgf80w6bfo] {
    font-size: 0.875rem;
    line-height: 1.4;
    margin-bottom: 0.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.example-meta[b-pgf80w6bfo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.75rem;
    opacity: 0.6;
}

/* Action Bar */
.action-bar[b-pgf80w6bfo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: var(--kendo-color-surface-alt);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
}

.batch-actions[b-pgf80w6bfo],
.primary-actions[b-pgf80w6bfo] {
    display: flex;
    gap: 0.75rem;
}

/* Image Preview Dialog */
.image-preview-container[b-pgf80w6bfo] {
    position: relative;
}

    .image-preview-container img[b-pgf80w6bfo] {
        width: 100%;
        height: auto;
        border-radius: var(--kendo-border-radius-md);
    }

.image-analysis-overlay[b-pgf80w6bfo] {
    margin-top: 1rem;
    padding: 1rem;
    background: var(--kendo-color-surface-alt);
    border-radius: var(--kendo-border-radius-md);
}

    .image-analysis-overlay h6[b-pgf80w6bfo] {
        margin: 0 0 0.75rem 0;
    }

.analysis-content[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.analysis-section strong[b-pgf80w6bfo] {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}

.analysis-tags[b-pgf80w6bfo] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.color-palette[b-pgf80w6bfo] {
    display: flex;
    gap: 0.5rem;
}

.color-swatch[b-pgf80w6bfo] {
    width: 32px;
    height: 32px;
    border-radius: var(--kendo-border-radius-sm);
    border: 2px solid var(--kendo-color-border);
    cursor: pointer;
    transition: transform 0.2s ease;
}

    .color-swatch:hover[b-pgf80w6bfo] {
        transform: scale(1.1);
    }

/* Example Preview Dialog */
.example-preview[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.preview-image[b-pgf80w6bfo] {
    max-height: 300px;
    overflow: hidden;
    border-radius: var(--kendo-border-radius-md);
}

    .preview-image img[b-pgf80w6bfo] {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

.preview-conversation[b-pgf80w6bfo] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.preview-message[b-pgf80w6bfo] {
    padding: 1rem;
    border-radius: var(--kendo-border-radius-md);
    border: 1px solid var(--kendo-color-border);
}

    .preview-message.user[b-pgf80w6bfo] {
        background: var(--kendo-color-primary-subtle);
        border-color: var(--kendo-color-primary);
    }

    .preview-message.assistant[b-pgf80w6bfo] {
        background: var(--kendo-color-success-subtle);
        border-color: var(--kendo-color-success);
    }

.message-header[b-pgf80w6bfo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.875rem;
    opacity: 0.8;
}

.message-content[b-pgf80w6bfo] {
    line-height: 1.6;
}

.preview-context[b-pgf80w6bfo] {
    padding: 0.75rem;
    background: var(--kendo-color-info-subtle);
    border-radius: var(--kendo-border-radius-md);
    font-size: 0.875rem;
}

/* Animations */
@keyframes fadeIn-b-pgf80w6bfo {
    from {
        opacity: 0;
        transform: scale(0.95);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.image-item[b-pgf80w6bfo] {
    animation: fadeIn-b-pgf80w6bfo 0.3s ease-out;
}

/* Dark mode specific adjustments */
@media (prefers-color-scheme: dark) {
    .upload-zone[b-pgf80w6bfo] {
        background: var(--kendo-color-surface);
    }

    .query-suggestions[b-pgf80w6bfo],
    .quality-panel[b-pgf80w6bfo] {
        background: var(--kendo-color-surface);
    }

    .suggestion-item[b-pgf80w6bfo] {
        background: var(--kendo-color-surface-alt);
    }

    .recent-example-card:hover[b-pgf80w6bfo] {
        box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
    }
}
/* /Components/Pages/Modules/AgenticIntelliSys/PromptLibrary.razor.rz.scp.css */
/* ============================================================================
   AI Prompt Library - Enhanced Responsive Styles
   ============================================================================
   
   Design Philosophy:
   - Leverages Telerik Kendo CSS variables for theme consistency
   - Supports both light and dark themes automatically
   - Mobile-first responsive design with three breakpoints
   - Follows BEM-like naming conventions for maintainability
   - Uses semantic spacing and sizing tokens
   
   Breakpoints:
   - Compact: < 768px (Mobile)
   - Medium: 768px - 1199px (Tablet)
   - Large: ≥ 1200px (Desktop)
   
   Maintainer Notes:
   - All colors use Kendo CSS variables for theme support
   - Spacing uses consistent multipliers of base unit (0.25rem)
   - Z-index scale: Base UI (1-10), Overlays (100-200), Modals (1000+)
   ============================================================================ */

/* ==========================================================================
   Base Container Layout
   ========================================================================== */

[b-fkapqql5x1] .prompt-library-container {
    /* Use viewport calculation for full height minus header */
    height: calc(100vh - var(--kendo-appbar-height, 84px));
    background: var(--kendo-color-surface);
    display: flex;
    flex-direction: column;
    /* Remove gaps to allow sections to manage their own spacing */
    gap: 0;
    padding: 0;
    /* Ensure container respects theme transitions */
    transition: background-color 0.2s ease;
}

    /* Compact view modifier */
    [b-fkapqql5x1] .prompt-library-container.compact-view {
        /* Maintains same structure in compact mode */
        padding: 0;
        gap: 0;
    }

/* ==========================================================================
   System Selection Bar
   ========================================================================== */

[b-fkapqql5x1] .system-selection-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* Consistent padding using spacing tokens */
    padding: var(--kendo-spacing-3) var(--kendo-spacing-4);
    /* Theme-aware background */
    background: var(--kendo-color-surface-alt);
    /* Use Kendo border variables */
    border-bottom: 1px solid var(--kendo-color-border);
    /* Compact height for efficiency */
    min-height: 52px;
    /* Allow wrapping on smaller screens */
    flex-wrap: wrap;
    gap: var(--kendo-spacing-4);
    /* Smooth theme transitions */
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* System selector group for responsive layout */
[b-fkapqql5x1] .system-selector-group {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-4);
    flex: 1;
    min-width: 0; /* Prevent overflow */
}

[b-fkapqql5x1] .system-selector {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-4);
    flex: 1;
    min-width: 0; /* Prevent overflow */
}

    /* System selector label */
    [b-fkapqql5x1] .system-selector label,
    [b-fkapqql5x1] .selector-label {
        font-weight: var(--kendo-font-weight-medium);
        color: var(--kendo-color-on-app-surface);
        /* Prevent label from shrinking */
        flex-shrink: 0;
        white-space: nowrap;
        /* Use Kendo typography scale */
        font-size: var(--kendo-font-size-sm);
    }

/* Dropdown customization */
[b-fkapqql5x1] .system-dropdown {
    min-width: 200px;
    /* Ensure dropdown respects container */
    max-width: 100%;
}

/* System statistics chips */
[b-fkapqql5x1] .system-stats {
    display: flex;
    gap: var(--kendo-spacing-3);
    align-items: center;
}

/* Action buttons group */
[b-fkapqql5x1] .system-actions {
    display: flex;
    gap: var(--kendo-spacing-3);
    /* Prevent shrinking below minimum */
    flex-shrink: 0;
}

/* ==========================================================================
   Main Content Splitter
   ========================================================================== */

[b-fkapqql5x1] .library-splitter {
    flex: 1;
    /* Transparent to inherit from parent */
    background: transparent;
    overflow: hidden;
    /* Visual separation from header */
    margin-top: 1px;
    /* Minimum height for usability */
    min-height: 0;
}

    /* Splitter pane styling */
    [b-fkapqql5x1] .library-splitter .k-splitter-pane {
        overflow: hidden;
        /* Ensure panes respect theme */
        background: var(--kendo-color-surface);
    }

    /* Splitter bar customization */
    [b-fkapqql5x1] .library-splitter .k-splitbar {
        /* Use subtle border color for splitter */
        background: var(--kendo-color-border-subtle);
        /* Even more subtle in light theme */
        opacity: 0.5;
        /* Add hover state for better UX */
        transition: background-color 0.2s ease, opacity 0.2s ease;
    }

        [b-fkapqql5x1] .library-splitter .k-splitbar:hover {
            background: var(--kendo-color-border);
            opacity: 0.8;
        }

        /* Splitter drag handle - make it more subtle */
        [b-fkapqql5x1] .library-splitter .k-splitbar .k-resize-handle {
            /* Use subtle color for the dots */
            background-color: var(--kendo-color-subtle);
            opacity: 0.4;
        }

        [b-fkapqql5x1] .library-splitter .k-splitbar:hover .k-resize-handle {
            opacity: 0.7;
        }

/* ==========================================================================
   Panel Headers
   ========================================================================== */

[b-fkapqql5x1] .panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* Consistent padding */
    padding: var(--kendo-spacing-3) var(--kendo-spacing-4);
    /* Theme-aware border */
    border-bottom: 1px solid var(--kendo-color-border);
    /* Subtle background difference */
    background: var(--kendo-color-base-subtle);
    /* Compact height */
    min-height: 48px;
    /* Smooth transitions */
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* Panel title styling */
[b-fkapqql5x1] .panel-title {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
    margin: 0;
    /* Use Kendo typography */
    font-size: var(--kendo-font-size);
    font-weight: var(--kendo-font-weight-medium);
    color: var(--kendo-color-on-app-surface);
    /* Prevent overflow */
    overflow: hidden;
    min-width: 0;
}

/* Title text with ellipsis */
[b-fkapqql5x1] .title-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* System name subtitle */
[b-fkapqql5x1] .system-name {
    font-size: var(--kendo-font-size-sm);
    font-weight: var(--kendo-font-weight);
    opacity: 0.7;
    margin-left: var(--kendo-spacing-1);
}

/* Header action buttons */
[b-fkapqql5x1] .header-actions {
    display: flex;
    gap: var(--kendo-spacing-2);
    flex-shrink: 0;
}

/* ==========================================================================
   Library Panel
   ========================================================================== */

[b-fkapqql5x1] .library-panel {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* Theme-aware background */
    background: var(--kendo-color-surface);
    /* Separator border */
    border-right: 1px solid var(--kendo-color-border);
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* Library search area */
[b-fkapqql5x1] .library-search {
    padding: var(--kendo-spacing-3) var(--kendo-spacing-4);
    display: flex;
    gap: var(--kendo-spacing-3);
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface);
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* Library list container */
[b-fkapqql5x1] .library-list {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0;
    background: var(--kendo-color-surface);
    /* Critical for flex scrolling */
    min-height: 0;
    /* Smooth scroll behavior */
    scroll-behavior: smooth;
}

/* Library list item */
[b-fkapqql5x1] .library-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* Generous padding for touch targets */
    padding: var(--kendo-spacing-3-5) var(--kendo-spacing-4);
    margin: 0;
    cursor: pointer;
    /* Smooth transitions for interactions */
    transition: all 0.15s ease;
    /* Subtle separator */
    border-bottom: 1px solid var(--kendo-color-border-subtle);
    background: var(--kendo-color-surface);
    /* Focus indicator for accessibility */
    position: relative;
}

    /* Library item hover state */
    [b-fkapqql5x1] .library-item:hover {
        background: var(--kendo-color-base-hover);
        /* Subtle depth on hover */
        box-shadow: inset 0 0 0 1px var(--kendo-color-border);
    }

    /* Library item selected state */
    [b-fkapqql5x1] .library-item.selected {
        /* Use theme primary color for selection */
        background: var(--kendo-color-primary-subtle);
        /* Strong left border indicator */
        border-left: 3px solid var(--kendo-color-primary);
        /* Adjust padding to account for border */
        padding-left: calc(var(--kendo-spacing-4) - 3px);
    }

    /* Library item focus state for keyboard navigation */
    [b-fkapqql5x1] .library-item:focus-visible {
        outline: 2px solid var(--kendo-color-primary);
        outline-offset: -2px;
        z-index: 1;
    }

/* Library info section */
[b-fkapqql5x1] .library-info {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3-5);
    /* Prevent overflow */
    min-width: 0;
}

/* Library details */
[b-fkapqql5x1] .library-details {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-0-5);
    /* Prevent overflow */
    min-width: 0;
}

/* Library name */
[b-fkapqql5x1] .library-name {
    font-weight: var(--kendo-font-weight-medium);
    color: var(--kendo-color-on-app-surface);
    font-size: var(--kendo-font-size);
    /* Handle long names gracefully */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Library item count */
[b-fkapqql5x1] .library-count {
    font-size: var(--kendo-font-size-sm);
    color: var(--kendo-color-subtle);
    opacity: 0.8;
}

/* Library actions */
[b-fkapqql5x1] .library-actions {
    flex-shrink: 0;
    /* Smooth opacity transition */
    transition: opacity 0.2s ease;
}

/* ==========================================================================
   Templates Panel
   ========================================================================== */

[b-fkapqql5x1] .templates-panel {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* Slightly different background for visual hierarchy */
    background: var(--kendo-color-base-subtle);
    transition: background-color 0.2s ease;
}

/* Templates search area */
[b-fkapqql5x1] .templates-search {
    padding: var(--kendo-spacing-3) var(--kendo-spacing-4);
    display: flex;
    gap: var(--kendo-spacing-3);
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface);
    /* Allow wrapping on small screens */
    flex-wrap: wrap;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* Templates grid container */
[b-fkapqql5x1] .templates-grid {
    flex: 1;
    padding: var(--kendo-spacing-5);
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--kendo-color-base-subtle);
    /* Critical for flex scrolling */
    min-height: 0;
    /* Smooth scroll behavior */
    scroll-behavior: smooth;
    transition: background-color 0.2s ease;
}

    /* Grid layout variations */
    [b-fkapqql5x1] .templates-grid.large-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
        gap: var(--kendo-spacing-5);
    }

    [b-fkapqql5x1] .templates-grid.medium-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
        gap: var(--kendo-spacing-4);
    }

    [b-fkapqql5x1] .templates-grid.compact-grid {
        display: flex;
        flex-direction: column;
        gap: var(--kendo-spacing-3-5);
    }

/* ==========================================================================
   Prompt Cards
   ========================================================================== */

[b-fkapqql5x1] .prompt-card {
    /* Theme-aware card styling */
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-lg);
    padding: var(--kendo-spacing-5);
    /* Smooth transitions for interactions */
    transition: all 0.2s ease;
    /* Flex layout for consistent structure */
    display: flex;
    flex-direction: column;
    position: relative;
    height: 100%;
    /* Subtle shadow for depth */
    box-shadow: var(--kendo-elevation-1);
}

    /* Card hover state */
    [b-fkapqql5x1] .prompt-card:hover {
        /* Elevate on hover */
        box-shadow: var(--kendo-elevation-4);
        transform: translateY(-2px);
        /* Slightly darker border */
        border-color: var(--kendo-color-border-hover);
    }

    /* Card focus state for keyboard navigation */
    [b-fkapqql5x1] .prompt-card:focus-within {
        outline: 2px solid var(--kendo-color-primary);
        outline-offset: 2px;
    }

/* Compact grid card adjustments */
[b-fkapqql5x1] .compact-grid .prompt-card {
    padding: var(--kendo-spacing-4);
}

/* Card header */
[b-fkapqql5x1] .card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--kendo-spacing-4);
    margin-bottom: var(--kendo-spacing-3);
}

    /* Card title */
    [b-fkapqql5x1] .card-header h5 {
        margin: 0;
        font-size: var(--kendo-font-size-lg);
        font-weight: var(--kendo-font-weight-medium);
        color: var(--kendo-color-on-app-surface);
        /* Handle long titles */
        word-break: break-word;
        hyphens: auto;
    }

/* Card content area */
[b-fkapqql5x1] .card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-3);
}

/* Prompt preview */
[b-fkapqql5x1] .prompt-preview {
    /* Subtle background for code */
    background: var(--kendo-color-base);
    padding: var(--kendo-spacing-3-5);
    border-radius: var(--kendo-border-radius-md);
    /* Monospace font stack */
    font-family: var(--kendo-font-family-monospace, 'SF Mono', Monaco, 'Cascadia Code', Consolas, monospace);
    font-size: var(--kendo-font-size-sm);
    line-height: 1.5;
    /* Constrain height with scroll */
    max-height: 120px;
    overflow-y: auto;
    white-space: pre-wrap;
    word-break: break-word;
    /* Subtle border */
    border: 1px solid var(--kendo-color-border-subtle);
    /* Smooth transitions */
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

    /* Parameter highlighting in preview */
    [b-fkapqql5x1] .prompt-preview .parameter {
        /* Use theme info color for parameters */
        background: var(--kendo-color-info-subtle);
        color: var(--kendo-color-info-on-subtle);
        padding: var(--kendo-spacing-0-5) var(--kendo-spacing-1-5);
        border-radius: var(--kendo-border-radius-sm);
        font-weight: var(--kendo-font-weight-medium);
        /* Inline-block for proper spacing */
        display: inline-block;
        margin: 0 2px;
    }

/* Parameters section */
[b-fkapqql5x1] .parameters-section {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1-5);
}

/* Parameters label */
[b-fkapqql5x1] .parameters-label {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-1);
    font-size: var(--kendo-font-size-sm);
    font-weight: var(--kendo-font-weight-medium);
    color: var(--kendo-color-subtle);
}

/* Parameter chips container */
[b-fkapqql5x1] .parameter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-1-5);
}

/* Card actions footer */
[b-fkapqql5x1] .card-actions {
    display: flex;
    gap: var(--kendo-spacing-2);
    justify-content: flex-end;
    padding-top: var(--kendo-spacing-3);
    border-top: 1px solid var(--kendo-color-border-subtle);
    /* Push to bottom of card */
    margin-top: auto;
    /* Smooth transition for hover effects */
    transition: opacity 0.2s ease, border-color 0.2s ease;
}

/* Card toolbar for responsive actions */
[b-fkapqql5x1] .card-toolbar {
    width: 100%;
}

    [b-fkapqql5x1] .card-toolbar .k-toolbar {
        background: transparent;
        border: none;
        padding: 0;
        min-height: auto;
    }

    [b-fkapqql5x1] .card-toolbar .k-toolbar-item {
        margin: 0;
    }

/* ==========================================================================
   Empty States
   ========================================================================== */

[b-fkapqql5x1] .empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 300px;
    gap: var(--kendo-spacing-4);
    padding: var(--kendo-spacing-8);
    text-align: center;
    /* Subtle opacity for empty state */
    opacity: 0.6;
}

    [b-fkapqql5x1] .empty-state p {
        margin: 0;
        color: var(--kendo-color-subtle);
        font-size: var(--kendo-font-size);
        max-width: 300px;
    }

/* ==========================================================================
   Scrollbar Styling
   ========================================================================== */

/* Custom scrollbar for better visual integration */
[b-fkapqql5x1] .library-list::-webkit-scrollbar,
[b-fkapqql5x1] .templates-grid::-webkit-scrollbar,
[b-fkapqql5x1] .prompt-preview::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[b-fkapqql5x1] .library-list::-webkit-scrollbar-track,
[b-fkapqql5x1] .templates-grid::-webkit-scrollbar-track,
[b-fkapqql5x1] .prompt-preview::-webkit-scrollbar-track {
    background: var(--kendo-color-base);
    border-radius: 4px;
}

[b-fkapqql5x1] .library-list::-webkit-scrollbar-thumb,
[b-fkapqql5x1] .templates-grid::-webkit-scrollbar-thumb,
[b-fkapqql5x1] .prompt-preview::-webkit-scrollbar-thumb {
    background: var(--kendo-color-border);
    border-radius: 4px;
    /* Add hover state */
    transition: background-color 0.2s ease;
}

    [b-fkapqql5x1] .library-list::-webkit-scrollbar-thumb:hover,
    [b-fkapqql5x1] .templates-grid::-webkit-scrollbar-thumb:hover,
    [b-fkapqql5x1] .prompt-preview::-webkit-scrollbar-thumb:hover {
        background: var(--kendo-color-border-hover);
    }

/* Firefox scrollbar styling */
[b-fkapqql5x1] .library-list,
[b-fkapqql5x1] .templates-grid,
[b-fkapqql5x1] .prompt-preview {
    scrollbar-width: thin;
    scrollbar-color: var(--kendo-color-border) var(--kendo-color-base);
}

/* ==========================================================================
   Component-Specific Overrides
   ========================================================================== */

/* Chip customizations */
[b-fkapqql5x1] .k-chip {
    /* Consistent sizing */
    font-size: var(--kendo-font-size-xs);
    /* Smooth transitions */
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* Button customizations */
[b-fkapqql5x1] .k-button {
    /* Consistent font size */
    font-size: var(--kendo-font-size-sm);
    /* Smooth transitions */
    transition: all 0.15s ease;
}

/* Small button variant */
[b-fkapqql5x1] .k-button-sm {
    padding: var(--kendo-spacing-1) var(--kendo-spacing-2);
    font-size: var(--kendo-font-size-xs);
}

/* ==========================================================================
   Stats Popup (Mobile)
   ========================================================================== */

[b-fkapqql5x1] .stats-popup {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-4);
    padding: var(--kendo-spacing-4);
}

[b-fkapqql5x1] .stat-item {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3);
    padding: var(--kendo-spacing-3);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-md);
    transition: background-color 0.2s ease;
}

/* ==========================================================================
   Responsive Design - Mobile First
   ========================================================================== */

/* Mobile/Compact View (< 768px) */
@media (max-width: 767px) {
    /* Stack system selection bar */
    [b-fkapqql5x1] .system-selection-bar {
        flex-direction: column;
        align-items: stretch;
        padding: var(--kendo-spacing-2) var(--kendo-spacing-3);
    }

    [b-fkapqql5x1] .system-selector-group {
        flex-direction: column;
        width: 100%;
    }

    [b-fkapqql5x1] .system-selector {
        flex-direction: column;
        align-items: stretch;
        gap: var(--kendo-spacing-2);
    }

        [b-fkapqql5x1] .system-selector label {
            min-width: unset;
        }

    /* Adjust splitter for mobile */
    [b-fkapqql5x1] .library-splitter {
        height: calc(100vh - 220px) !important;
    }

        [b-fkapqql5x1] .library-splitter .k-splitter-pane:first-child {
            min-height: 150px !important;
        }

    /* Compact panel headers */
    [b-fkapqql5x1] .panel-header {
        padding: var(--kendo-spacing-2-5) var(--kendo-spacing-3);
    }

    [b-fkapqql5x1] .panel-title {
        font-size: var(--kendo-font-size-sm);
    }

    /* Adjust search areas */
    [b-fkapqql5x1] .library-search,
    [b-fkapqql5x1] .templates-search {
        padding: var(--kendo-spacing-2-5) var(--kendo-spacing-3);
        flex-direction: column;
        gap: var(--kendo-spacing-2);
    }

    /* Compact prompt cards */
    [b-fkapqql5x1] .prompt-card {
        min-height: auto;
        padding: var(--kendo-spacing-3);
    }

    [b-fkapqql5x1] .prompt-preview {
        max-height: 100px;
        font-size: var(--kendo-font-size-xs);
    }

    [b-fkapqql5x1] .card-header h5 {
        font-size: var(--kendo-font-size);
    }

    /* Adjust grid padding */
    [b-fkapqql5x1] .templates-grid {
        padding: var(--kendo-spacing-3);
    }

    /* Hide system stats on mobile */
    [b-fkapqql5x1] .system-stats {
        display: none;
    }
}

/* Medium/Tablet View (768px - 1199px) */
@media (min-width: 768px) and (max-width: 1199px) {
    /* Wrap system bar elements */
    [b-fkapqql5x1] .system-selection-bar {
        flex-wrap: wrap;
    }

    /* Move stats to new row */
    [b-fkapqql5x1] .system-stats {
        order: 3;
        width: 100%;
        justify-content: center;
        margin-top: var(--kendo-spacing-2);
    }

    /* Adjust grid spacing */
    [b-fkapqql5x1] .templates-grid {
        gap: var(--kendo-spacing-3-5);
        padding: var(--kendo-spacing-4);
    }

    /* Medium card adjustments */
    [b-fkapqql5x1] .prompt-card {
        padding: var(--kendo-spacing-4);
    }
}

/* Large/Desktop View (≥ 1200px) */
@media (min-width: 1200px) {
    /* Enhanced hover states for desktop */
    [b-fkapqql5x1] .prompt-card:hover {
        box-shadow: var(--kendo-elevation-6);
        transform: translateY(-3px);
    }

    [b-fkapqql5x1] .library-item:hover {
        transform: translateX(2px);
    }

    /* Show actions only on hover for desktop */
    [b-fkapqql5x1] .card-actions {
        opacity: 0;
    }

    [b-fkapqql5x1] .prompt-card:hover .card-actions {
        opacity: 1;
    }

    [b-fkapqql5x1] .library-actions {
        opacity: 0;
    }

    [b-fkapqql5x1] .library-item:hover .library-actions {
        opacity: 1;
    }

    /* Larger click targets for desktop */
    [b-fkapqql5x1] .library-item {
        padding: var(--kendo-spacing-4) var(--kendo-spacing-5);
    }
}

/* ==========================================================================
   Dark Theme Support
   ========================================================================== */

/* Dark theme overrides - minimal as we use CSS variables */
.k-theme-dark[b-fkapqql5x1] {
    /* Parameter highlighting adjustments for dark theme */
    :: deep .prompt-preview .parameter

{
    /* Ensure good contrast in dark mode */
    background: var(--kendo-color-info-subtle);
    color: var(--kendo-color-info-on-subtle);
}

/* Enhance card depth in dark mode */
[b-fkapqql5x1] .prompt-card {
    box-shadow: var(--kendo-elevation-2);
}

    [b-fkapqql5x1] .prompt-card:hover {
        box-shadow: var(--kendo-elevation-8);
    }

/* Adjust empty state opacity for dark theme */
[b-fkapqql5x1] .empty-state {
    opacity: 0.7;
}

/* Splitter is already subtle in dark theme, but ensure consistency */
[b-fkapqql5x1] .library-splitter .k-splitbar {
    opacity: 0.6;
}

    [b-fkapqql5x1] .library-splitter .k-splitbar:hover {
        opacity: 0.9;
    }

}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
    /* Hide interactive elements */
    [b-fkapqql5x1] .system-selection-bar,
    [b-fkapqql5x1] .library-actions,
    [b-fkapqql5x1] .card-actions,
    [b-fkapqql5x1] .system-actions,
    [b-fkapqql5x1] .header-actions {
        display: none !important;
    }

    /* Optimize card layout for print */
    [b-fkapqql5x1] .prompt-card {
        break-inside: avoid;
        page-break-inside: avoid;
        box-shadow: none;
        border: 1px solid #000;
        margin-bottom: var(--kendo-spacing-4);
    }

    /* Single column for print */
    [b-fkapqql5x1] .templates-grid {
        display: block;
    }

    /* Expand preview for print */
    [b-fkapqql5x1] .prompt-preview {
        max-height: none;
    }

    /* Show all content */
    [b-fkapqql5x1] .library-splitter {
        display: block;
        height: auto !important;
    }

        [b-fkapqql5x1] .library-splitter .k-splitter-pane {
            display: block !important;
            height: auto !important;
            width: 100% !important;
        }
}

/* ==========================================================================
   Accessibility Enhancements
   ========================================================================== */

/* High contrast mode support */
@media (prefers-contrast: high) {
    [b-fkapqql5x1] .library-item.selected {
        outline: 2px solid;
        outline-offset: -2px;
    }

    [b-fkapqql5x1] .prompt-card {
        border-width: 2px;
    }

    [b-fkapqql5x1] .prompt-preview .parameter {
        outline: 1px solid;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    [b-fkapqql5x1] * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Focus visible for keyboard navigation */
[b-fkapqql5x1] :focus-visible {
    outline: 2px solid var(--kendo-color-primary);
    outline-offset: 2px;
}

/* ==========================================================================
   Performance Optimizations
   ========================================================================== */

/* Hardware acceleration for transforms */
[b-fkapqql5x1] .prompt-card,
[b-fkapqql5x1] .library-item {
    will-change: transform;
}

/* Optimize scrolling performance */
[b-fkapqql5x1] .library-list,
[b-fkapqql5x1] .templates-grid {
    -webkit-overflow-scrolling: touch;
    /* Contain layout for performance */
    contain: layout style;
}

/* ==========================================================================
   Utility Classes for Dynamic Styling
   ========================================================================== */

/* Loading state */
[b-fkapqql5x1] .loading-shimmer {
    background: linear-gradient( 90deg, var(--kendo-color-surface) 25%, var(--kendo-color-base-hover) 50%, var(--kendo-color-surface) 75% );
    background-size: 200% 100%;
    animation: shimmer-b-fkapqql5x1 1.5s infinite;
}

@keyframes shimmer-b-fkapqql5x1 {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

/* Fade in animation for cards */
[b-fkapqql5x1] .prompt-card {
    animation: fadeIn-b-fkapqql5x1 0.3s ease-out;
}

@keyframes fadeIn-b-fkapqql5x1 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==========================================================================
   Future Enhancement Hooks
   ========================================================================== */

/* 
   Reserved classes for future features:
   - .prompt-card--featured: For highlighting important prompts
   - .library-item--new: For indicating new libraries
   - .templates-grid--compact: For an even more compact view
   - .prompt-preview--expanded: For full preview mode
   
   These follow BEM naming conventions for maintainability
*/

/* End of Prompt Library Styles */
/* /Components/Pages/Modules/BallInCourt/Detail.razor.rz.scp.css */
body[b-5b8hpse2w0] {
}
/* /Components/Pages/Modules/BallInCourt/Index.razor.rz.scp.css */
body[b-xy40mh8gfe] {
}



:root[b-xy40mh8gfe] {
    --kendo-slider-alt-size: 64px;
    --kendo-slider-track-size: 64px;
}

.date-range-slider k-slider[b-xy40mh8gfe] {
    height: var(--kendo-slider-track-size);
}
/* /Components/Pages/Modules/CommCenter/Detail.razor.rz.scp.css */

.email-container[b-uppoledhxx] {
    width: 80%;
    margin: auto;
    height:calc(100vh - 360px);
    font-size:large;
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 8px;
    overflow:auto;
}

.email-header[b-uppoledhxx] {
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.email-body[b-uppoledhxx] {
    margin-bottom: 30px;
}

.email-footer[b-uppoledhxx] {
    border-top: 1px solid #ddd;
    padding-top: 10px;
    text-align: center;
    color: #888;
}
/* /Components/Pages/Modules/Correspondence/Detail.razor.rz.scp.css */

/* /Components/Pages/Modules/Correspondence/Index.razor.rz.scp.css */
/* /Components/Pages/Modules/Dashboards/Index.razor.rz.scp.css */
.container-fit[b-08utw1sgrp] {
    width: 100%;
    overflow: hidden; /* Clip only the image inside */
    margin-bottom: 20px; /* Create visual space between the image and the list */
}

    .container-fit img[b-08utw1sgrp] {
        width: 100%;
        height: 100%;
        object-fit: cover; /* Ensures the image fills the container, even if cropped */
        object-position: center; /* Centers the image so the midpoint is always visible */
    }

/* Ensure the content container displays fully */
.content[b-08utw1sgrp] {
    overflow: visible;
    /* Additional styling for the list can go here */
}

ul[b-08utw1sgrp] {
    font-size: large;
}
/* /Components/Pages/Modules/Dashboards/Reporting.razor.rz.scp.css */
/* Enterprise Reporting Platform - Isolated Styles */
/* Full dark and light theme support via CSS variables */

.rpt-container[b-yqkfbql8he] {
    --rpt-primary: var(--kendo-color-primary, #8155B9);
    --rpt-primary-subtle: var(--kendo-color-primary-subtle, #F0E1FE);
    --rpt-primary-hover: var(--kendo-color-primary-hover, #7147A6);
    --rpt-surface: var(--kendo-color-surface, #f8f8f8);
    --rpt-surface-alt: var(--kendo-color-surface-alt, #ffffff);
    --rpt-text: var(--kendo-color-on-app-surface, #1F1F1F);
    --rpt-text-subtle: var(--kendo-color-subtle, #6E6E6E);
    --rpt-border: var(--kendo-color-border-alt, #D1D1D1);
    --rpt-success: var(--kendo-color-success, #10b981);
    --rpt-warning: var(--kendo-color-warning, #f59e0b);
    --rpt-error: var(--kendo-color-error, #ef4444);
    --rpt-info: var(--kendo-color-info, #0a7eff);
    --rpt-bg: var(--kendo-color-app-surface, #ffffff);
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px 48px;
    color: var(--rpt-text);
}

/* Hero Section */
.rpt-hero[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    padding: 48px 0 64px;
    min-height: 520px;
}

.rpt-hero-content[b-yqkfbql8he] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.rpt-badge[b-yqkfbql8he] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: linear-gradient(135deg, var(--rpt-primary) 0%, var(--rpt-primary-hover) 100%);
    color: white;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    width: fit-content;
    animation: badgeGlow 3s ease-in-out infinite;
}

    .rpt-badge .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 16px;
    }

.rpt-title[b-yqkfbql8he] {
    font-size: 48px;
    font-weight: 300;
    line-height: 1.15;
    margin: 0;
    background: linear-gradient(135deg, var(--rpt-text) 0%, var(--rpt-primary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.rpt-subtitle[b-yqkfbql8he] {
    font-size: 18px;
    line-height: 1.7;
    color: var(--rpt-text-subtle);
    margin: 0;
    max-width: 540px;
}

.rpt-cta-group[b-yqkfbql8he] {
    display: flex;
    gap: 12px;
    margin-top: 8px;
    flex-wrap: wrap;
}

    .rpt-cta-group .k-button[b-yqkfbql8he] {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 12px 24px;
        font-size: 14px;
        font-weight: 500;
    }

        .rpt-cta-group .k-button .material-symbols-outlined[b-yqkfbql8he] {
            font-size: 20px;
        }

/* Dashboard Preview Visual */
.rpt-hero-visual[b-yqkfbql8he] {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.rpt-dashboard-preview[b-yqkfbql8he] {
    position: relative;
    width: 100%;
    max-width: 520px;
    aspect-ratio: 4/3;
}

.rpt-dashboard-canvas[b-yqkfbql8he] {
    position: relative;
    width: 100%;
    height: 100%;
    background: var(--rpt-surface);
    border: 1px solid var(--rpt-border);
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.rpt-dashboard-glow[b-yqkfbql8he] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    height: 90%;
    background: radial-gradient(ellipse at center, rgba(129, 85, 185, 0.1) 0%, transparent 70%);
    pointer-events: none;
    z-index: -1;
}

/* Dashboard Header */
.rpt-dash-header[b-yqkfbql8he] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--rpt-border);
}

.rpt-dash-title[b-yqkfbql8he] {
    font-size: 14px;
    font-weight: 600;
    color: var(--rpt-text);
}

.rpt-dash-date[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--rpt-success);
}

    .rpt-dash-date .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 14px;
    }

/* KPI Cards */
.rpt-kpi-row[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.rpt-kpi-card[b-yqkfbql8he] {
    padding: 12px;
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 8px;
    display: flex;
    gap: 10px;
}

.rpt-kpi-icon[b-yqkfbql8he] {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .rpt-kpi-icon .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 18px;
    }

.rpt-kpi-primary .rpt-kpi-icon[b-yqkfbql8he] {
    background: rgba(129, 85, 185, 0.1);
    color: var(--rpt-primary);
}

.rpt-kpi-success .rpt-kpi-icon[b-yqkfbql8he] {
    background: rgba(16, 185, 129, 0.1);
    color: var(--rpt-success);
}

.rpt-kpi-warning .rpt-kpi-icon[b-yqkfbql8he] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--rpt-warning);
}

.rpt-kpi-content[b-yqkfbql8he] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.rpt-kpi-value[b-yqkfbql8he] {
    font-size: 16px;
    font-weight: 600;
    color: var(--rpt-text);
}

.rpt-kpi-label[b-yqkfbql8he] {
    font-size: 9px;
    color: var(--rpt-text-subtle);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.rpt-kpi-trend[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 10px;
    margin-top: 2px;
}

    .rpt-kpi-trend .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 12px;
    }

.rpt-trend-up[b-yqkfbql8he] {
    color: var(--rpt-success);
}

.rpt-trend-down[b-yqkfbql8he] {
    color: var(--rpt-error);
}

/* Mini Charts */
.rpt-chart-row[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.rpt-mini-chart[b-yqkfbql8he] {
    padding: 12px;
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 8px;
    height: 60px;
}

.rpt-chart-bars[b-yqkfbql8he] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    height: 100%;
    gap: 4px;
}

.rpt-bar[b-yqkfbql8he] {
    flex: 1;
    background: linear-gradient(to top, var(--rpt-primary), var(--rpt-primary-subtle));
    border-radius: 2px 2px 0 0;
    animation: barGrow 2s ease-out;
}

.rpt-chart-line[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    height: 100%;
}

.rpt-line-svg[b-yqkfbql8he] {
    width: 100%;
    height: 100%;
}

/* Section Styles */
.rpt-section[b-yqkfbql8he] {
    padding: 56px 0;
    border-top: 1px solid var(--rpt-border);
}

.rpt-section-alt[b-yqkfbql8he] {
    background: var(--rpt-surface);
    margin: 0 -24px;
    padding: 56px 24px;
    border-radius: 24px;
}

.rpt-section-title[b-yqkfbql8he] {
    font-size: 32px;
    font-weight: 400;
    text-align: center;
    margin: 0 0 12px;
}

.rpt-section-desc[b-yqkfbql8he] {
    font-size: 16px;
    color: var(--rpt-text-subtle);
    text-align: center;
    max-width: 640px;
    margin: 0 auto 40px;
    line-height: 1.6;
}

/* Report Categories */
.rpt-categories[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1100px;
    margin: 0 auto;
}

.rpt-category[b-yqkfbql8he] {
    padding: 28px;
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 16px;
    transition: all 0.3s ease;
}

    .rpt-category:hover[b-yqkfbql8he] {
        transform: translateY(-4px);
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
        border-color: var(--rpt-primary);
    }

.rpt-category-icon[b-yqkfbql8he] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

    .rpt-category-icon .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 28px;
    }

.rpt-icon-executive[b-yqkfbql8he] {
    background: linear-gradient(135deg, rgba(129, 85, 185, 0.15) 0%, rgba(129, 85, 185, 0.25) 100%);
    color: var(--rpt-primary);
}

.rpt-icon-operations[b-yqkfbql8he] {
    background: linear-gradient(135deg, rgba(10, 126, 255, 0.15) 0%, rgba(10, 126, 255, 0.25) 100%);
    color: var(--rpt-info);
}

.rpt-icon-compliance[b-yqkfbql8he] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(16, 185, 129, 0.25) 100%);
    color: var(--rpt-success);
}

.rpt-category h3[b-yqkfbql8he] {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 8px;
}

.rpt-category p[b-yqkfbql8he] {
    font-size: 14px;
    color: var(--rpt-text-subtle);
    line-height: 1.6;
    margin: 0 0 20px;
}

.rpt-report-list[b-yqkfbql8he] {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}

    .rpt-report-list li[b-yqkfbql8he] {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 0;
        font-size: 13px;
        color: var(--rpt-text-subtle);
        border-bottom: 1px solid var(--rpt-border);
    }

        .rpt-report-list li .material-symbols-outlined[b-yqkfbql8he] {
            font-size: 16px;
            color: var(--rpt-primary);
        }

.rpt-category-btn[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: transparent;
    border: 1px solid var(--rpt-primary);
    color: var(--rpt-primary);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 100%;
    justify-content: center;
}

    .rpt-category-btn:hover[b-yqkfbql8he] {
        background: var(--rpt-primary);
        color: white;
    }

    .rpt-category-btn .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 18px;
    }

/* Real-Time Analytics */
.rpt-realtime[b-yqkfbql8he] {
    max-width: 1100px;
    margin: 0 auto;
}

.rpt-realtime-grid[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 32px;
}

.rpt-metric-card[b-yqkfbql8he] {
    padding: 20px;
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 12px;
    transition: all 0.3s ease;
}

    .rpt-metric-card:hover[b-yqkfbql8he] {
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
    }

.rpt-metric-header[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

    .rpt-metric-header .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 20px;
        color: var(--rpt-primary);
    }

.rpt-metric-title[b-yqkfbql8he] {
    flex: 1;
    font-size: 12px;
    font-weight: 500;
    color: var(--rpt-text-subtle);
}

.rpt-live-indicator[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 10px;
    font-weight: 600;
    color: var(--rpt-success);
}

.rpt-pulse[b-yqkfbql8he] {
    width: 6px;
    height: 6px;
    background: var(--rpt-success);
    border-radius: 50%;
    animation: pulse 2s ease-in-out infinite;
}

.rpt-metric-value[b-yqkfbql8he] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 12px;
}

.rpt-metric-main[b-yqkfbql8he] {
    font-size: 28px;
    font-weight: 600;
    color: var(--rpt-text);
}

.rpt-metric-change[b-yqkfbql8he] {
    font-size: 12px;
    font-weight: 500;
}

.rpt-positive[b-yqkfbql8he] {
    color: var(--rpt-success);
}

.rpt-negative[b-yqkfbql8he] {
    color: var(--rpt-error);
}

/* Sparklines */
.rpt-sparkline[b-yqkfbql8he] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    height: 40px;
    gap: 2px;
}

.rpt-spark-bar[b-yqkfbql8he] {
    flex: 1;
    background: var(--rpt-border);
    border-radius: 2px 2px 0 0;
    transition: all 0.3s ease;
}

.rpt-spark-current[b-yqkfbql8he] {
    background: var(--rpt-primary);
}

.rpt-spark-warning[b-yqkfbql8he] {
    background: var(--rpt-warning);
}

/* Activity Feed */
.rpt-activity-feed[b-yqkfbql8he] {
    padding: 24px;
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 12px;
}

.rpt-feed-title[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 20px;
}

    .rpt-feed-title .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 20px;
        color: var(--rpt-primary);
    }

.rpt-feed-items[b-yqkfbql8he] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.rpt-feed-item[b-yqkfbql8he] {
    display: flex;
    gap: 12px;
    padding: 12px;
    background: var(--rpt-surface);
    border-radius: 8px;
}

.rpt-feed-icon[b-yqkfbql8he] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .rpt-feed-icon .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 18px;
    }

.rpt-feed-success[b-yqkfbql8he] {
    background: rgba(16, 185, 129, 0.1);
    color: var(--rpt-success);
}

.rpt-feed-warning[b-yqkfbql8he] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--rpt-warning);
}

.rpt-feed-info[b-yqkfbql8he] {
    background: rgba(10, 126, 255, 0.1);
    color: var(--rpt-info);
}

.rpt-feed-content[b-yqkfbql8he] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.rpt-feed-text[b-yqkfbql8he] {
    font-size: 14px;
    color: var(--rpt-text);
}

.rpt-feed-meta[b-yqkfbql8he] {
    font-size: 12px;
    color: var(--rpt-text-subtle);
}

/* AI Insights */
.rpt-ai-insights[b-yqkfbql8he] {
    max-width: 1100px;
    margin: 0 auto;
}

.rpt-ai-header[b-yqkfbql8he] {
    text-align: center;
    margin-bottom: 40px;
}

.rpt-ai-badge[b-yqkfbql8he] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
    color: white;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

    .rpt-ai-badge .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 16px;
    }

.rpt-insights-grid[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.rpt-insight-card[b-yqkfbql8he] {
    padding: 24px;
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 12px;
    transition: all 0.3s ease;
}

    .rpt-insight-card:hover[b-yqkfbql8he] {
        transform: translateY(-2px);
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    }

.rpt-insight-header[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    color: var(--rpt-success);
}

.rpt-insight-risk[b-yqkfbql8he] {
    color: var(--rpt-warning);
}

.rpt-insight-recommendation[b-yqkfbql8he] {
    color: var(--rpt-info);
}

.rpt-insight-header .material-symbols-outlined[b-yqkfbql8he] {
    font-size: 20px;
}

.rpt-insight-type[b-yqkfbql8he] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.rpt-insight-card h4[b-yqkfbql8he] {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 8px;
}

.rpt-insight-card p[b-yqkfbql8he] {
    font-size: 14px;
    color: var(--rpt-text-subtle);
    line-height: 1.6;
    margin: 0 0 16px;
}

.rpt-insight-impact[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--rpt-surface);
    border-radius: 6px;
    font-size: 13px;
    margin-bottom: 16px;
}

.rpt-impact-label[b-yqkfbql8he] {
    color: var(--rpt-text-subtle);
}

.rpt-impact-value[b-yqkfbql8he] {
    font-weight: 600;
    color: var(--rpt-text);
}

.rpt-insight-action[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 10px 16px;
    background: transparent;
    border: 1px solid var(--rpt-primary);
    color: var(--rpt-primary);
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .rpt-insight-action:hover[b-yqkfbql8he] {
        background: var(--rpt-primary);
        color: white;
    }

    .rpt-insight-action .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 16px;
    }

/* Custom Report Builder */
.rpt-builder-preview[b-yqkfbql8he] {
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 12px;
    overflow: hidden;
}

.rpt-builder-header[b-yqkfbql8he] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: var(--rpt-surface);
    border-bottom: 1px solid var(--rpt-border);
}

.rpt-builder-tabs[b-yqkfbql8he] {
    display: flex;
    gap: 4px;
}

.rpt-tab[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: transparent;
    border: none;
    color: var(--rpt-text-subtle);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.2s ease;
}

    .rpt-tab:hover[b-yqkfbql8he] {
        background: var(--rpt-bg);
        color: var(--rpt-text);
    }

.rpt-tab-active[b-yqkfbql8he] {
    background: var(--rpt-bg);
    color: var(--rpt-primary);
}

.rpt-tab .material-symbols-outlined[b-yqkfbql8he] {
    font-size: 18px;
}

.rpt-builder-save[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: var(--rpt-primary);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

    .rpt-builder-save:hover[b-yqkfbql8he] {
        background: var(--rpt-primary-hover);
    }

    .rpt-builder-save .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 16px;
    }

.rpt-builder-workspace[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: 240px 1fr;
    height: 400px;
}

.rpt-widget-library[b-yqkfbql8he] {
    padding: 20px;
    background: var(--rpt-surface);
    border-right: 1px solid var(--rpt-border);
}

    .rpt-widget-library h4[b-yqkfbql8he] {
        font-size: 12px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--rpt-text-subtle);
        margin: 0 0 16px;
    }

.rpt-widget-list[b-yqkfbql8he] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rpt-widget-item[b-yqkfbql8he] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: var(--rpt-bg);
    border: 1px solid var(--rpt-border);
    border-radius: 6px;
    font-size: 13px;
    cursor: grab;
    transition: all 0.2s ease;
}

    .rpt-widget-item:hover[b-yqkfbql8he] {
        border-color: var(--rpt-primary);
        background: var(--rpt-primary-subtle);
    }

    .rpt-widget-item:active[b-yqkfbql8he] {
        cursor: grabbing;
    }

    .rpt-widget-item .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 18px;
        color: var(--rpt-primary);
    }

.rpt-builder-canvas[b-yqkfbql8he] {
    padding: 20px;
}

.rpt-canvas-grid[b-yqkfbql8he] {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 16px;
}

.rpt-canvas-placeholder[b-yqkfbql8he] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--rpt-surface);
    border: 2px dashed var(--rpt-border);
    border-radius: 8px;
    color: var(--rpt-text-subtle);
    font-size: 13px;
}

    .rpt-canvas-placeholder .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 32px;
        opacity: 0.5;
    }

/* Export Options */
.rpt-export-grid[b-yqkfbql8he] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    max-width: 1100px;
    margin: 0 auto;
}

.rpt-export-option[b-yqkfbql8he] {
    text-align: center;
    padding: 24px;
    background: var(--rpt-surface);
    border-radius: 12px;
    transition: all 0.3s ease;
}

    .rpt-export-option:hover[b-yqkfbql8he] {
        transform: translateY(-4px);
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
    }

.rpt-export-icon[b-yqkfbql8he] {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, var(--rpt-primary-subtle) 0%, rgba(129, 85, 185, 0.2) 100%);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 12px;
}

    .rpt-export-icon .material-symbols-outlined[b-yqkfbql8he] {
        font-size: 28px;
        color: var(--rpt-primary);
    }

.rpt-export-option h4[b-yqkfbql8he] {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 8px;
}

.rpt-export-option p[b-yqkfbql8he] {
    font-size: 13px;
    color: var(--rpt-text-subtle);
    line-height: 1.5;
    margin: 0;
}

/* Footer CTA */
.rpt-footer-cta[b-yqkfbql8he] {
    margin-top: 48px;
    padding: 64px 48px;
    background: linear-gradient(135deg, var(--rpt-primary) 0%, var(--rpt-primary-hover) 50%, #533676 100%);
    border-radius: 24px;
    text-align: center;
}

.rpt-footer-content[b-yqkfbql8he] {
    max-width: 560px;
    margin: 0 auto;
}

.rpt-footer-icon[b-yqkfbql8he] {
    font-size: 48px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 16px;
}

.rpt-footer-cta h2[b-yqkfbql8he] {
    font-size: 28px;
    font-weight: 500;
    color: white;
    margin: 0 0 12px;
}

.rpt-footer-cta p[b-yqkfbql8he] {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
    margin: 0 0 28px;
}

.rpt-footer-actions[b-yqkfbql8he] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

    .rpt-footer-actions .k-button[b-yqkfbql8he] {
        padding: 12px 24px;
    }

    .rpt-footer-actions .k-button-solid-primary[b-yqkfbql8he] {
        background: white;
        color: var(--rpt-primary);
    }

        .rpt-footer-actions .k-button-solid-primary:hover:not(:disabled)[b-yqkfbql8he] {
            background: rgba(255, 255, 255, 0.9);
        }

    .rpt-footer-actions .k-button-outline-base[b-yqkfbql8he] {
        border-color: rgba(255, 255, 255, 0.5);
        color: white;
    }

        .rpt-footer-actions .k-button-outline-base:hover:not(:disabled)[b-yqkfbql8he] {
            background: rgba(255, 255, 255, 0.1);
            border-color: white;
        }

/* Dark Theme Adjustments */
:global([data-theme="dark"]) .rpt-container[b-yqkfbql8he] {
    --rpt-bg: #1a1a1a;
    --rpt-surface: #242424;
    --rpt-surface-alt: #2a2a2a;
    --rpt-text: #f0f0f0;
    --rpt-text-subtle: #a0a0a0;
    --rpt-border: #3a3a3a;
}

:global([data-theme="dark"]) .rpt-title[b-yqkfbql8he] {
    background: linear-gradient(135deg, #f0f0f0 0%, #b794d4 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

:global([data-theme="dark"]) .rpt-dashboard-canvas[b-yqkfbql8he],
:global([data-theme="dark"]) .rpt-kpi-card[b-yqkfbql8he],
:global([data-theme="dark"]) .rpt-mini-chart[b-yqkfbql8he],
:global([data-theme="dark"]) .rpt-category[b-yqkfbql8he],
:global([data-theme="dark"]) .rpt-metric-card[b-yqkfbql8he],
:global([data-theme="dark"]) .rpt-activity-feed[b-yqkfbql8he],
:global([data-theme="dark"]) .rpt-insight-card[b-yqkfbql8he],
:global([data-theme="dark"]) .rpt-builder-preview[b-yqkfbql8he] {
    background: #1e1e1e;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

:global([data-theme="dark"]) .rpt-spark-bar:not(.rpt-spark-current):not(.rpt-spark-warning)[b-yqkfbql8he] {
    background: #4a4a4a;
}

:global([data-theme="dark"]) .rpt-widget-item[b-yqkfbql8he] {
    background: #2a2a2a;
}

    :global([data-theme="dark"]) .rpt-widget-item:hover[b-yqkfbql8he] {
        background: rgba(129, 85, 185, 0.2);
    }

:global([data-theme="dark"]) .rpt-export-option[b-yqkfbql8he] {
    background: #242424;
}

:global([data-theme="dark"]) .rpt-dashboard-glow[b-yqkfbql8he] {
    background: radial-gradient(ellipse at center, rgba(129, 85, 185, 0.25) 0%, transparent 70%);
}

:global([data-theme="dark"]) .rpt-canvas-placeholder[b-yqkfbql8he] {
    background: #1a1a1a;
    border-color: #4a4a4a;
}

/* Responsive */
@media (max-width: 1200px) {
    .rpt-hero[b-yqkfbql8he] {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .rpt-hero-content[b-yqkfbql8he] {
        align-items: center;
    }

    .rpt-categories[b-yqkfbql8he],
    .rpt-insights-grid[b-yqkfbql8he] {
        grid-template-columns: 1fr;
        max-width: 540px;
    }

    .rpt-realtime-grid[b-yqkfbql8he] {
        grid-template-columns: repeat(2, 1fr);
    }

    .rpt-export-grid[b-yqkfbql8he] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .rpt-kpi-row[b-yqkfbql8he],
    .rpt-chart-row[b-yqkfbql8he] {
        grid-template-columns: 1fr;
    }
    .rpt-metric-card[b-yqkfbql8he] {
        padding: 16px;
    }
    .rpt-builder-workspace[b-yqkfbql8he] {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        height: auto;
    }
    .rpt-builder-canvas[b-yqkfbql8he] {
        padding: 16px;
    }
}

/* Additional Mobile Responsive Adjustments */
@media (max-width: 768px) {
    /* Hero Section Mobile */
    .rpt-title[b-yqkfbql8he] {
        font-size: 36px;
    }

    .rpt-subtitle[b-yqkfbql8he] {
        font-size: 16px;
    }

    .rpt-hero[b-yqkfbql8he] {
        padding: 32px 0 48px;
        min-height: auto;
    }

    .rpt-dashboard-preview[b-yqkfbql8he] {
        max-width: 100%;
    }

    .rpt-cta-group[b-yqkfbql8he] {
        flex-direction: column;
        width: 100%;
    }

        .rpt-cta-group .k-button[b-yqkfbql8he] {
            width: 100%;
            justify-content: center;
        }

    /* Section Adjustments */
    .rpt-section[b-yqkfbql8he] {
        padding: 40px 0;
    }

    .rpt-section-title[b-yqkfbql8he] {
        font-size: 24px;
    }

    .rpt-section-desc[b-yqkfbql8he] {
        font-size: 14px;
    }

    /* Category Cards Mobile */
    .rpt-category[b-yqkfbql8he] {
        padding: 20px;
    }

    /* Real-time Grid Mobile */
    .rpt-realtime-grid[b-yqkfbql8he] {
        grid-template-columns: 1fr;
    }

    /* Export Grid Mobile */
    .rpt-export-grid[b-yqkfbql8he] {
        grid-template-columns: 1fr;
    }

    /* Footer CTA Mobile */
    .rpt-footer-cta[b-yqkfbql8he] {
        padding: 48px 24px;
    }

        .rpt-footer-cta h2[b-yqkfbql8he] {
            font-size: 24px;
        }

    .rpt-footer-actions[b-yqkfbql8he] {
        flex-direction: column;
    }

        .rpt-footer-actions .k-button[b-yqkfbql8he] {
            width: 100%;
        }

    /* Widget Library Mobile */
    .rpt-widget-library[b-yqkfbql8he] {
        padding: 16px;
    }

    /* Canvas Grid Mobile */
    .rpt-canvas-grid[b-yqkfbql8he] {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }
}

/* Small Mobile Devices */
@media (max-width: 480px) {
    .rpt-container[b-yqkfbql8he] {
        padding: 0 16px 32px;
    }

    .rpt-title[b-yqkfbql8he] {
        font-size: 28px;
    }

    .rpt-badge[b-yqkfbql8he] {
        font-size: 12px;
        padding: 4px 10px;
    }

    .rpt-dashboard-canvas[b-yqkfbql8he] {
        padding: 16px;
    }

    .rpt-kpi-card[b-yqkfbql8he] {
        padding: 10px;
    }

    .rpt-kpi-value[b-yqkfbql8he] {
        font-size: 14px;
    }

    .rpt-section-alt[b-yqkfbql8he] {
        margin: 0 -16px;
        padding: 40px 16px;
        border-radius: 16px;
    }

    .rpt-builder-tabs[b-yqkfbql8he] {
        flex-wrap: wrap;
    }

    .rpt-tab[b-yqkfbql8he] {
        font-size: 12px;
        padding: 6px 12px;
    }
}

/* Animations - Performance optimization for mobile */
@media (max-width: 768px) and (prefers-reduced-motion: no-preference) {
    .rpt-badge[b-yqkfbql8he] {
        animation: none;
    }

    .rpt-pulse[b-yqkfbql8he] {
        animation: pulse 3s ease-in-out infinite; /* Slower animation on mobile */
    }

    .rpt-bar[b-yqkfbql8he] {
        animation: none; /* Disable complex animations on mobile */
    }
}

/* Landscape Mobile Orientation */
@media (max-width: 768px) and (orientation: landscape) {
    .rpt-hero[b-yqkfbql8he] {
        min-height: auto;
    }

    .rpt-dashboard-preview[b-yqkfbql8he] {
        aspect-ratio: 16/9;
    }

    .rpt-realtime-grid[b-yqkfbql8he] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Touch Device Optimizations */
@media (hover: none) and (pointer: coarse) {
    .rpt-category-btn[b-yqkfbql8he],
    .rpt-insight-action[b-yqkfbql8he],
    .rpt-tab[b-yqkfbql8he],
    .rpt-builder-save[b-yqkfbql8he] {
        min-height: 44px; /* iOS touch target recommendation */
    }

    .rpt-widget-item[b-yqkfbql8he] {
        min-height: 48px; /* Easier dragging on touch */
    }
}

/* /Components/Pages/Modules/Dashboards/Statistics.razor.rz.scp.css */
/* Container and Layout */
.stats-container[b-li4e2naygx] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px 48px;
}

/* Hero Section */
.stats-hero[b-li4e2naygx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    padding: 48px 0 64px;
    align-items: center;
}

.stats-hero-content[b-li4e2naygx] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.stats-badge[b-li4e2naygx] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: linear-gradient(135deg, var(--kendo-color-primary, #8155B9), var(--kendo-color-primary-hover, #7147A6));
    color: white;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.05em;
    width: fit-content;
}

.stats-title[b-li4e2naygx] {
    font-size: 48px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

.stats-subtitle[b-li4e2naygx] {
    font-size: 18px;
    line-height: 1.7;
    color: var(--kendo-color-subtle, #6E6E6E);
    margin: 0;
}

.stats-cta-group[b-li4e2naygx] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* Preview Visual */
.stats-hero-visual[b-li4e2naygx] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.stats-preview[b-li4e2naygx] {
    width: 100%;
    max-width: 480px;
    background: var(--kendo-color-surface, #ffffff);
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.preview-header[b-li4e2naygx] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    background: var(--kendo-color-surface-alt, #f8f8f8);
    border-bottom: 1px solid var(--kendo-color-border, #E0E0E0);
}

.preview-badge[b-li4e2naygx] {
    padding: 4px 8px;
    background: #10b981;
    color: white;
    font-size: 10px;
    font-weight: 700;
    border-radius: 4px;
    animation: pulse-b-li4e2naygx 2s infinite;
}

.preview-chart[b-li4e2naygx] {
    padding: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.chart-placeholder[b-li4e2naygx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    color: var(--kendo-color-subtle, #6E6E6E);
}

    .chart-placeholder .material-symbols-outlined[b-li4e2naygx] {
        font-size: 64px;
        opacity: 0.3;
    }

.preview-stats[b-li4e2naygx] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--kendo-color-border, #E0E0E0);
}

.stat-item[b-li4e2naygx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 16px;
    border-right: 1px solid var(--kendo-color-border, #E0E0E0);
}

    .stat-item:last-child[b-li4e2naygx] {
        border-right: none;
    }

.stat-value[b-li4e2naygx] {
    font-size: 24px;
    font-weight: 700;
    color: var(--kendo-color-primary, #8155B9);
}

.stat-label[b-li4e2naygx] {
    font-size: 12px;
    color: var(--kendo-color-subtle, #6E6E6E);
    margin-top: 4px;
}

/* Sections */
.stats-section[b-li4e2naygx] {
    padding: 64px 0;
}

.stats-section-alt[b-li4e2naygx] {
    background: var(--kendo-color-surface-alt, #f8f8f8);
    margin: 0 -24px;
    padding: 64px 24px;
}

.section-header[b-li4e2naygx] {
    text-align: center;
    margin-bottom: 48px;
}

.section-title[b-li4e2naygx] {
    font-size: 36px;
    font-weight: 700;
    color: var(--kendo-color-on-app-surface, #1F1F1F);
    margin: 0 0 16px;
}

.section-desc[b-li4e2naygx] {
    font-size: 16px;
    color: var(--kendo-color-subtle, #6E6E6E);
    margin: 0;
}

/* Statistics Categories */
.stats-categories[b-li4e2naygx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
}

.stat-category[b-li4e2naygx] {
    background: var(--kendo-color-surface, #ffffff);
    border-radius: 8px;
    padding: 32px;
    border: 1px solid var(--kendo-color-border, #E0E0E0);
    transition: all 0.3s ease;
}

    .stat-category:hover[b-li4e2naygx] {
        transform: translateY(-4px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    }

.category-icon[b-li4e2naygx] {
    width: 48px;
    height: 48px;
    background: var(--kendo-color-primary-subtle, #F0E1FE);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

    .category-icon .material-symbols-outlined[b-li4e2naygx] {
        font-size: 24px;
        color: var(--kendo-color-primary, #8155B9);
    }

.category-title[b-li4e2naygx] {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 12px;
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

.category-desc[b-li4e2naygx] {
    font-size: 14px;
    line-height: 1.6;
    color: var(--kendo-color-subtle, #6E6E6E);
    margin: 0 0 20px;
}

.category-features[b-li4e2naygx] {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}

    .category-features li[b-li4e2naygx] {
        padding: 8px 0;
        font-size: 14px;
        color: var(--kendo-color-on-surface, #424242);
        display: flex;
        align-items: center;
    }

        .category-features li[b-li4e2naygx]:before {
            content: "•";
            color: var(--kendo-color-primary, #8155B9);
            font-weight: bold;
            margin-right: 8px;
        }

.category-footer[b-li4e2naygx] {
    padding-top: 16px;
    border-top: 1px solid var(--kendo-color-border, #E0E0E0);
}

.update-frequency[b-li4e2naygx] {
    font-size: 12px;
    color: var(--kendo-color-subtle, #6E6E6E);
    font-style: italic;
}

/* Features */
.stats-features[b-li4e2naygx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 24px;
}

.feature-card[b-li4e2naygx] {
    text-align: center;
    padding: 24px;
}

.feature-icon[b-li4e2naygx] {
    font-size: 48px;
    color: var(--kendo-color-primary, #8155B9);
    margin-bottom: 16px;
}

.feature-card h4[b-li4e2naygx] {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 8px;
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

.feature-card p[b-li4e2naygx] {
    font-size: 14px;
    color: var(--kendo-color-subtle, #6E6E6E);
    margin: 0;
}

/* Examples */
.stats-examples[b-li4e2naygx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 24px;
}

.example-card[b-li4e2naygx] {
    background: var(--kendo-color-surface, #ffffff);
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--kendo-color-border, #E0E0E0);
}

.example-header[b-li4e2naygx] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: var(--kendo-color-surface-alt, #f8f8f8);
    font-size: 14px;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

.example-preview[b-li4e2naygx] {
    padding: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 120px;
}

.chart-placeholder-small[b-li4e2naygx] {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .chart-placeholder-small .material-symbols-outlined[b-li4e2naygx] {
        font-size: 48px;
        opacity: 0.2;
        color: var(--kendo-color-primary, #8155B9);
    }

/* Footer CTA */
.stats-footer-cta[b-li4e2naygx] {
    background: linear-gradient(135deg, var(--kendo-color-primary, #8155B9), var(--kendo-color-primary-hover, #7147A6));
    border-radius: 16px;
    padding: 64px 48px;
    text-align: center;
    margin-top: 64px;
}

.cta-content h2[b-li4e2naygx] {
    color: white;
    font-size: 36px;
    margin: 0 0 16px;
}

.cta-content p[b-li4e2naygx] {
    color: rgba(255, 255, 255, 0.9);
    font-size: 18px;
    margin: 0 0 32px;
}

.cta-actions[b-li4e2naygx] {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Animations */
@keyframes pulse-b-li4e2naygx {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

/* Responsive */
@media (max-width: 968px) {
    .stats-hero[b-li4e2naygx] {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .stats-title[b-li4e2naygx] {
        font-size: 36px;
    }

    .stats-categories[b-li4e2naygx] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .stats-container[b-li4e2naygx] {
        padding: 0 16px 32px;
    }

    .stats-title[b-li4e2naygx] {
        font-size: 28px;
    }

    .stats-subtitle[b-li4e2naygx] {
        font-size: 16px;
    }

    .stats-cta-group[b-li4e2naygx] {
        flex-direction: column;
    }

        .stats-cta-group .k-button[b-li4e2naygx] {
            width: 100%;
        }
}

/* Dark Theme Support */
[data-theme="dark"] .stats-container[b-li4e2naygx] {
    color: var(--kendo-color-on-app-surface, #ffffff);
}

[data-theme="dark"] .stats-preview[b-li4e2naygx],
[data-theme="dark"] .stat-category[b-li4e2naygx],
[data-theme="dark"] .example-card[b-li4e2naygx] {
    background: var(--kendo-color-surface, #2c2c2c);
}
/* /Components/Pages/Modules/DigitalProcessOrchestration/Index.razor.rz.scp.css */
/* AI Process Automation - Isolated Styles */
/* Supports light and dark themes via CSS variables */

.apa-container[b-vfmrwm922d] {
    --apa-primary: var(--kendo-color-primary, #8155B9);
    --apa-primary-subtle: var(--kendo-color-primary-subtle, #F0E1FE);
    --apa-primary-hover: var(--kendo-color-primary-hover, #7147A6);
    --apa-surface: var(--kendo-color-surface, #f8f8f8);
    --apa-surface-alt: var(--kendo-color-surface-alt, #f8f8f8);
    --apa-text: var(--kendo-color-on-app-surface, #1F1F1F);
    --apa-text-subtle: var(--kendo-color-subtle, #6E6E6E);
    --apa-border: var(--kendo-color-border-alt, #D1D1D1);
    --apa-success: var(--kendo-color-success, #10b981);
    --apa-warning: var(--kendo-color-warning, #f59e0b);
    --apa-error: var(--kendo-color-error, #ef4444);
    --apa-info: var(--kendo-color-info, #0a7eff);
    --apa-bg: var(--kendo-color-app-surface, #ffffff);
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 24px 48px;
    color: var(--apa-text);
}

/* Hero Section */
.apa-hero[b-vfmrwm922d] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    padding: 48px 0 64px;
    min-height: 480px;
}

.apa-hero-content[b-vfmrwm922d] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.apa-badge[b-vfmrwm922d] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: linear-gradient(135deg, var(--apa-primary) 0%, var(--apa-primary-hover) 100%);
    color: white;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    width: fit-content;
    box-shadow: 0 2px 8px rgba(129, 85, 185, 0.3);
}

    .apa-badge .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 16px;
    }

.apa-title[b-vfmrwm922d] {
    font-size: 48px;
    font-weight: 300;
    line-height: 1.15;
    margin: 0;
    background: linear-gradient(135deg, var(--apa-text) 0%, var(--apa-primary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.apa-subtitle[b-vfmrwm922d] {
    font-size: 18px;
    line-height: 1.7;
    color: var(--apa-text-subtle);
    margin: 0;
    max-width: 540px;
}

.apa-cta-group[b-vfmrwm922d] {
    display: flex;
    gap: 12px;
    margin-top: 8px;
    flex-wrap: wrap;
}

    .apa-cta-group .k-button[b-vfmrwm922d] {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 12px 24px;
        font-size: 14px;
        font-weight: 500;
    }

        .apa-cta-group .k-button .material-symbols-outlined[b-vfmrwm922d] {
            font-size: 20px;
        }

/* Hero Visual - Workflow Preview */
.apa-hero-visual[b-vfmrwm922d] {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.apa-workflow-preview[b-vfmrwm922d] {
    position: relative;
    width: 100%;
    max-width: 480px;
    aspect-ratio: 4/3;
}

.apa-workflow-canvas[b-vfmrwm922d] {
    position: relative;
    width: 100%;
    height: 100%;
    background: var(--apa-surface);
    border: 1px solid var(--apa-border);
    border-radius: 16px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

.apa-workflow-glow[b-vfmrwm922d] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    height: 80%;
    background: radial-gradient(ellipse at center, rgba(129, 85, 185, 0.15) 0%, transparent 70%);
    pointer-events: none;
    z-index: -1;
}

/* Workflow Nodes */
.apa-node[b-vfmrwm922d] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: var(--apa-bg);
    border: 2px solid var(--apa-border);
    border-radius: 10px;
    min-width: 140px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

    .apa-node:hover[b-vfmrwm922d] {
        transform: translateY(-2px);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    }

.apa-node-icon[b-vfmrwm922d] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .apa-node-icon .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 20px;
    }

.apa-node-label[b-vfmrwm922d] {
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}

.apa-node-trigger .apa-node-icon[b-vfmrwm922d] {
    background: rgba(129, 85, 185, 0.1);
    color: var(--apa-primary);
}

.apa-node-trigger[b-vfmrwm922d] {
    border-color: var(--apa-primary);
}

.apa-node-action .apa-node-icon[b-vfmrwm922d] {
    background: rgba(10, 126, 255, 0.1);
    color: var(--apa-info);
}

.apa-node-action[b-vfmrwm922d] {
    border-color: var(--apa-info);
}

.apa-node-condition .apa-node-icon[b-vfmrwm922d] {
    background: rgba(245, 158, 11, 0.1);
    color: var(--apa-warning);
}

.apa-node-condition[b-vfmrwm922d] {
    border-color: var(--apa-warning);
}

.apa-node-success .apa-node-icon[b-vfmrwm922d] {
    background: rgba(16, 185, 129, 0.1);
    color: var(--apa-success);
}

.apa-node-success[b-vfmrwm922d] {
    border-color: var(--apa-success);
}

.apa-node-warning .apa-node-icon[b-vfmrwm922d] {
    background: rgba(239, 68, 68, 0.1);
    color: var(--apa-error);
}

.apa-node-warning[b-vfmrwm922d] {
    border-color: var(--apa-error);
}

/* Connectors */
.apa-connector[b-vfmrwm922d] {
    width: 2px;
    height: 20px;
    background: var(--apa-border);
    position: relative;
}

    .apa-connector[b-vfmrwm922d]::after {
        content: '';
        position: absolute;
        bottom: -4px;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 6px solid var(--apa-border);
    }

/* Branch Container */
.apa-branch-container[b-vfmrwm922d] {
    display: flex;
    gap: 24px;
    margin-top: 4px;
}

.apa-branch[b-vfmrwm922d] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.apa-connector-branch[b-vfmrwm922d] {
    height: 16px;
}

/* Section Styles */
.apa-section[b-vfmrwm922d] {
    padding: 56px 0;
    border-top: 1px solid var(--apa-border);
}

.apa-section-alt[b-vfmrwm922d] {
    background: var(--apa-surface);
    margin: 0 -24px;
    padding: 56px 24px;
    border-radius: 24px;
}

.apa-section-title[b-vfmrwm922d] {
    font-size: 32px;
    font-weight: 400;
    text-align: center;
    margin: 0 0 12px;
}

.apa-section-desc[b-vfmrwm922d] {
    font-size: 16px;
    color: var(--apa-text-subtle);
    text-align: center;
    max-width: 640px;
    margin: 0 auto 40px;
    line-height: 1.6;
}

/* Steps */
.apa-steps[b-vfmrwm922d] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    max-width: 1100px;
    margin: 0 auto;
}

.apa-step[b-vfmrwm922d] {
    position: relative;
    padding: 24px;
    background: var(--apa-bg);
    border: 1px solid var(--apa-border);
    border-radius: 16px;
    transition: all 0.3s ease;
}

    .apa-step:hover[b-vfmrwm922d] {
        border-color: var(--apa-primary);
        box-shadow: 0 8px 32px rgba(129, 85, 185, 0.1);
    }

.apa-step-number[b-vfmrwm922d] {
    position: absolute;
    top: -14px;
    left: 24px;
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, var(--apa-primary) 0%, var(--apa-primary-hover) 100%);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
}

.apa-step-content h3[b-vfmrwm922d] {
    font-size: 18px;
    font-weight: 600;
    margin: 8px 0 12px;
}

.apa-step-content p[b-vfmrwm922d] {
    font-size: 14px;
    color: var(--apa-text-subtle);
    line-height: 1.6;
    margin: 0 0 16px;
}

/* Code Preview */
.apa-code-preview[b-vfmrwm922d] {
    border: 1px solid var(--apa-border);
    border-radius: 8px;
    padding: 12px 16px;
    overflow-x: auto;
}

    .apa-code-preview code[b-vfmrwm922d] {
        font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
        font-size: 12px;
        line-height: 1.8;
        color: var(--apa-text);
    }

.apa-code-key[b-vfmrwm922d] {
    color: var(--apa-primary);
    font-weight: 600;
}

.apa-code-fn[b-vfmrwm922d] {
    color: var(--apa-info);
}

/* Execution Modes */
.apa-execution-modes[b-vfmrwm922d] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.apa-mode[b-vfmrwm922d] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--apa-primary-subtle);
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: var(--apa-primary);
}

    .apa-mode .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 18px;
    }

/* Capabilities Grid */
.apa-capabilities[b-vfmrwm922d] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1100px;
    margin: 0 auto;
}

.apa-capability[b-vfmrwm922d] {
    padding: 28px;
    background: var(--apa-bg);
    border: 1px solid var(--apa-border);
    border-radius: 16px;
    text-align: center;
    transition: all 0.3s ease;
}

    .apa-capability:hover[b-vfmrwm922d] {
        transform: translateY(-4px);
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
    }

.apa-capability-icon[b-vfmrwm922d] {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, var(--apa-primary-subtle) 0%, rgba(129, 85, 185, 0.2) 100%);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

    .apa-capability-icon .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 28px;
        color: var(--apa-primary);
    }

.apa-capability h3[b-vfmrwm922d] {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 8px;
}

.apa-capability p[b-vfmrwm922d] {
    font-size: 14px;
    color: var(--apa-text-subtle);
    line-height: 1.6;
    margin: 0;
}

/* Comparison Section */
.apa-comparison[b-vfmrwm922d] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 900px;
    margin: 0 auto;
}

.apa-comparison-item[b-vfmrwm922d] {
    padding: 24px;
    background: var(--apa-surface);
    border-radius: 12px;
    text-align: center;
}

.apa-comparison-header[b-vfmrwm922d] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 12px;
    color: var(--apa-primary);
}

    .apa-comparison-header .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 24px;
    }

.apa-comparison-item p[b-vfmrwm922d] {
    font-size: 14px;
    color: var(--apa-text-subtle);
    line-height: 1.6;
    margin: 0;
}

/* Footer CTA */
.apa-footer-cta[b-vfmrwm922d] {
    margin-top: 48px;
    padding: 64px 48px;
    background: linear-gradient(135deg, var(--apa-primary) 0%, var(--apa-primary-hover) 50%, #533676 100%);
    border-radius: 24px;
    text-align: center;
}

.apa-footer-content[b-vfmrwm922d] {
    max-width: 560px;
    margin: 0 auto;
}

.apa-footer-icon[b-vfmrwm922d] {
    font-size: 48px;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 16px;
}

.apa-footer-cta h2[b-vfmrwm922d] {
    font-size: 28px;
    font-weight: 500;
    color: white;
    margin: 0 0 12px;
}

.apa-footer-cta p[b-vfmrwm922d] {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
    margin: 0 0 28px;
}

.apa-email-signup[b-vfmrwm922d] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

    .apa-email-signup .k-textbox[b-vfmrwm922d] {
        min-width: 280px;
        padding: 12px 16px;
        border-radius: 8px;
        border: 2px solid rgba(255, 255, 255, 0.3);
        background: rgba(255, 255, 255, 0.95);
    }

    .apa-email-signup .k-button[b-vfmrwm922d] {
        padding: 12px 24px;
        background: white;
        color: var(--apa-primary);
        font-weight: 600;
    }

        .apa-email-signup .k-button:hover:not(:disabled)[b-vfmrwm922d] {
            background: rgba(255, 255, 255, 0.9);
        }

/* Dark Theme Adjustments */
:global([data-theme="dark"]) .apa-container[b-vfmrwm922d] {
    --apa-bg: #1a1a1a;
    --apa-surface: #242424;
    --apa-surface-alt: #2a2a2a;
    --apa-text: #f0f0f0;
    --apa-text-subtle: #a0a0a0;
    --apa-border: #3a3a3a;
}

:global([data-theme="dark"]) .apa-title[b-vfmrwm922d] {
    background: linear-gradient(135deg, #f0f0f0 0%, #b794d4 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

:global([data-theme="dark"]) .apa-workflow-canvas[b-vfmrwm922d] {
    background: #1e1e1e;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

:global([data-theme="dark"]) .apa-node[b-vfmrwm922d] {
    background: #2a2a2a;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

:global([data-theme="dark"]) .apa-step[b-vfmrwm922d],
:global([data-theme="dark"]) .apa-capability[b-vfmrwm922d] {
    background: #1e1e1e;
}

:global([data-theme="dark"]) .apa-code-preview[b-vfmrwm922d] {
    background: #1a1a1a;
}

:global([data-theme="dark"]) .apa-mode[b-vfmrwm922d] {
    background: rgba(129, 85, 185, 0.2);
}

:global([data-theme="dark"]) .apa-capability-icon[b-vfmrwm922d] {
    background: linear-gradient(135deg, rgba(129, 85, 185, 0.3) 0%, rgba(129, 85, 185, 0.15) 100%);
}

:global([data-theme="dark"]) .apa-comparison-item[b-vfmrwm922d] {
    background: #242424;
}

:global([data-theme="dark"]) .apa-section-alt[b-vfmrwm922d] {
    background: #1a1a1a;
}

:global([data-theme="dark"]) .apa-workflow-glow[b-vfmrwm922d] {
    background: radial-gradient(ellipse at center, rgba(129, 85, 185, 0.25) 0%, transparent 70%);
}

/* Responsive */
@media (max-width: 1024px) {
    .apa-hero[b-vfmrwm922d] {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }

    .apa-hero-content[b-vfmrwm922d] {
        align-items: center;
    }

    .apa-subtitle[b-vfmrwm922d] {
        max-width: 100%;
    }

    .apa-cta-group[b-vfmrwm922d] {
        justify-content: center;
    }

    .apa-steps[b-vfmrwm922d],
    .apa-capabilities[b-vfmrwm922d],
    .apa-comparison[b-vfmrwm922d] {
        grid-template-columns: 1fr;
        max-width: 480px;
    }
}

@media (max-width: 640px) {
    .apa-container[b-vfmrwm922d] {
        padding: 0 16px 32px;
    }

    .apa-title[b-vfmrwm922d] {
        font-size: 32px;
    }

    .apa-section-title[b-vfmrwm922d] {
        font-size: 24px;
    }

    .apa-footer-cta[b-vfmrwm922d] {
        padding: 40px 24px;
        border-radius: 16px;
    }

    .apa-email-signup[b-vfmrwm922d] {
        flex-direction: column;
    }

        .apa-email-signup .k-textbox[b-vfmrwm922d] {
            min-width: unset;
            width: 100%;
        }

    .apa-workflow-preview[b-vfmrwm922d] {
        max-width: 320px;
    }
}

/* Animations */
@keyframes nodeFloat-b-vfmrwm922d {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-4px);
    }
}

.apa-node-trigger[b-vfmrwm922d] {
    animation: nodeFloat-b-vfmrwm922d 3s ease-in-out infinite;
}

.apa-node-action[b-vfmrwm922d] {
    animation: nodeFloat-b-vfmrwm922d 3s ease-in-out infinite 0.5s;
}

.apa-node-condition[b-vfmrwm922d] {
    animation: nodeFloat-b-vfmrwm922d 3s ease-in-out infinite 1s;
}

.apa-node-success[b-vfmrwm922d] {
    animation: nodeFloat-b-vfmrwm922d 3s ease-in-out infinite 1.5s;
}

.apa-node-warning[b-vfmrwm922d] {
    animation: nodeFloat-b-vfmrwm922d 3s ease-in-out infinite 1.5s;
}

/* Pulse animation for coming soon badge */
@keyframes badgePulse-b-vfmrwm922d {
    0%, 100% {
        box-shadow: 0 2px 8px rgba(129, 85, 185, 0.3);
    }

    50% {
        box-shadow: 0 2px 16px rgba(129, 85, 185, 0.5);
    }
}

.apa-badge[b-vfmrwm922d] {
    animation: badgePulse-b-vfmrwm922d 2s ease-in-out infinite;
}

/* ========================================
   Use Case Section - Corridor Assessment
   ======================================== */

.apa-usecase-section[b-vfmrwm922d] {
    background: linear-gradient(180deg, var(--apa-surface) 0%, var(--apa-bg) 100%);
    margin: 0 -24px;
    padding: 56px 24px;
    border-radius: 24px;
}

.apa-usecase-header[b-vfmrwm922d] {
    text-align: center;
    margin-bottom: 40px;
}

.apa-usecase-badge[b-vfmrwm922d] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

    .apa-usecase-badge .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 16px;
    }

.apa-usecase-workflow[b-vfmrwm922d] {
    max-width: 1000px;
    margin: 0 auto;
}

/* Corridor Diagram */
.apa-corridor-diagram[b-vfmrwm922d] {
    background: var(--apa-bg);
    border: 1px solid var(--apa-border);
    border-radius: 16px;
    padding: 24px;
    margin-bottom: 32px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    position: relative;
    overflow: hidden;
}

.apa-corridor-header[b-vfmrwm922d] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--apa-border);
    margin-bottom: 24px;
    font-weight: 600;
    font-size: 15px;
}

    .apa-corridor-header .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 22px;
        color: var(--apa-primary);
    }

.apa-corridor-status[b-vfmrwm922d] {
    margin-left: auto;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 4px 10px;
    background: var(--apa-primary-subtle);
    color: var(--apa-primary);
    border-radius: 12px;
}

/* Flow Layout */
.apa-corridor-flow[b-vfmrwm922d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 20px 0;
    overflow-x: auto;
}

.apa-corridor-step[b-vfmrwm922d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    min-width: 100px;
    flex-shrink: 0;
}

.apa-corridor-step-expanded[b-vfmrwm922d] {
    min-width: 160px;
}

.apa-corridor-node[b-vfmrwm922d] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    position: relative;
}

    .apa-corridor-node .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 26px;
    }

    .apa-corridor-node:hover[b-vfmrwm922d] {
        transform: scale(1.08);
    }

/* Node Types */
.apa-corridor-input[b-vfmrwm922d] {
    background: linear-gradient(135deg, rgba(129, 85, 185, 0.15) 0%, rgba(129, 85, 185, 0.25) 100%);
    border: 2px solid var(--apa-primary);
    color: var(--apa-primary);
}

.apa-corridor-loop[b-vfmrwm922d] {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.15) 0%, rgba(245, 158, 11, 0.25) 100%);
    border: 2px solid var(--apa-warning);
    color: var(--apa-warning);
}

.apa-corridor-action[b-vfmrwm922d] {
    background: linear-gradient(135deg, rgba(10, 126, 255, 0.15) 0%, rgba(10, 126, 255, 0.25) 100%);
    border: 2px solid var(--apa-info);
    color: var(--apa-info);
}

.apa-corridor-ai[b-vfmrwm922d] {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.15) 0%, rgba(139, 92, 246, 0.25) 100%);
    border: 2px solid #8b5cf6;
    color: #8b5cf6;
}

.apa-corridor-output[b-vfmrwm922d] {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(16, 185, 129, 0.25) 100%);
    border: 2px solid var(--apa-success);
    color: var(--apa-success);
}

.apa-corridor-detail[b-vfmrwm922d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
}

.apa-corridor-label[b-vfmrwm922d] {
    font-size: 12px;
    font-weight: 600;
    color: var(--apa-text);
}

.apa-corridor-value[b-vfmrwm922d] {
    font-size: 11px;
    color: var(--apa-text-subtle);
}

.apa-corridor-code[b-vfmrwm922d] {
    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
    font-size: 9px;
    color: var(--apa-info);
    background: rgba(10, 126, 255, 0.08);
    padding: 4px 8px;
    border-radius: 6px;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Connectors */
.apa-corridor-connector[b-vfmrwm922d] {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--apa-border);
    flex-shrink: 0;
}

.apa-connector-line[b-vfmrwm922d] {
    width: 20px;
    height: 2px;
    background: var(--apa-border);
}

.apa-corridor-connector .material-symbols-outlined[b-vfmrwm922d] {
    font-size: 18px;
    color: var(--apa-text-subtle);
}

/* Loop Indicator */
.apa-corridor-loop-indicator[b-vfmrwm922d] {
    position: absolute;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    width: 400px;
    color: var(--apa-warning);
    opacity: 0.7;
}

.apa-loop-svg[b-vfmrwm922d] {
    width: 100%;
    height: 60px;
}

/* Benefits */
.apa-usecase-benefits[b-vfmrwm922d] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 32px;
}

.apa-benefit[b-vfmrwm922d] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 20px;
    background: var(--apa-bg);
    border: 1px solid var(--apa-border);
    border-radius: 12px;
    transition: all 0.3s ease;
}

    .apa-benefit:hover[b-vfmrwm922d] {
        border-color: var(--apa-primary);
        box-shadow: 0 4px 16px rgba(129, 85, 185, 0.1);
    }

.apa-benefit-icon[b-vfmrwm922d] {
    width: 40px;
    height: 40px;
    background: var(--apa-primary-subtle);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .apa-benefit-icon .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 22px;
        color: var(--apa-primary);
    }

.apa-benefit-content[b-vfmrwm922d] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .apa-benefit-content strong[b-vfmrwm922d] {
        font-size: 14px;
        font-weight: 600;
        color: var(--apa-text);
    }

    .apa-benefit-content span[b-vfmrwm922d] {
        font-size: 13px;
        color: var(--apa-text-subtle);
        line-height: 1.5;
    }

/* Code Example */
.apa-usecase-code[b-vfmrwm922d] {
    background: #1e1e2e;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
}

.apa-code-header[b-vfmrwm922d] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: #2a2a3e;
    color: #a0a0b0;
    font-size: 13px;
    font-weight: 500;
    border-bottom: 1px solid #3a3a4e;
}

    .apa-code-header .material-symbols-outlined[b-vfmrwm922d] {
        font-size: 18px;
    }

.apa-code-block[b-vfmrwm922d] {
    margin: 0;
    padding: 20px 24px;
    overflow-x: auto;
    background: #303030;
}

    .apa-code-block code[b-vfmrwm922d] {
        font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
        font-size: 13px;
        line-height: 1.8;
        color: #e0e0e8;
    }

    .apa-code-block .apa-code-key[b-vfmrwm922d] {
        color: #c792ea;
        font-weight: 600;
    }

    .apa-code-block .apa-code-fn[b-vfmrwm922d] {
        color: #82aaff;
    }

    .apa-code-block .apa-code-str[b-vfmrwm922d] {
        color: #c3e88d;
    }

    .apa-code-block .apa-code-var[b-vfmrwm922d] {
        color: #ffcb6b;
    }

/* Dark theme adjustments for use case section */
:global([data-theme="dark"]) .apa-usecase-section[b-vfmrwm922d] {
    background: linear-gradient(180deg, #1a1a1a 0%, #0f0f0f 100%);
}

:global([data-theme="dark"]) .apa-corridor-diagram[b-vfmrwm922d] {
    background: #1e1e1e;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

:global([data-theme="dark"]) .apa-corridor-code[b-vfmrwm922d] {
    background: rgba(10, 126, 255, 0.15);
}

:global([data-theme="dark"]) .apa-benefit[b-vfmrwm922d] {
    background: #1e1e1e;
}

:global([data-theme="dark"]) .apa-usecase-code[b-vfmrwm922d] {
    background: #0d0d14;
}

:global([data-theme="dark"]) .apa-code-header[b-vfmrwm922d] {
    background: #1a1a24;
    border-color: #2a2a3a;
}

/* Loop animation */
@keyframes loopPulse-b-vfmrwm922d {
    0%, 100% {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }
}

.apa-corridor-loop-indicator[b-vfmrwm922d] {
    animation: loopPulse-b-vfmrwm922d 2s ease-in-out infinite;
}

/* Node sequence animation */
@keyframes nodeActivate-b-vfmrwm922d {
    0%, 100% {
        box-shadow: 0 0 0 0 transparent;
    }

    50% {
        box-shadow: 0 0 0 4px rgba(129, 85, 185, 0.2);
    }
}

.apa-corridor-node[b-vfmrwm922d] {
    animation: nodeActivate-b-vfmrwm922d 3s ease-in-out infinite;
}

.apa-corridor-loop[b-vfmrwm922d] {
    animation-delay: 0.5s;
}

.apa-corridor-action[b-vfmrwm922d] {
    animation-delay: 1s;
}

.apa-corridor-ai[b-vfmrwm922d] {
    animation-delay: 1.5s;
}

.apa-corridor-output[b-vfmrwm922d] {
    animation-delay: 2s;
}

/* Responsive for use case section */
@media (max-width: 900px) {
    .apa-corridor-flow[b-vfmrwm922d] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .apa-corridor-connector[b-vfmrwm922d] {
        display: none;
    }

    .apa-corridor-step[b-vfmrwm922d] {
        width: calc(33% - 16px);
        margin-bottom: 24px;
    }

    .apa-corridor-loop-indicator[b-vfmrwm922d] {
        display: none;
    }

    .apa-usecase-benefits[b-vfmrwm922d] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .apa-corridor-step[b-vfmrwm922d] {
        width: calc(50% - 12px);
    }

    .apa-code-block code[b-vfmrwm922d] {
        font-size: 11px;
    }
}
/* /Components/Pages/Modules/DocumentManagement/FileWorkspaceManager.razor.rz.scp.css */
/*

.splitter {
    display: flex;
    flex-direction: row;
}

.file-grid {
    height: calc(100vh -140px)
}

.processing-indicator {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    color: var(--kendo-color-primary);
}
/*

/* Ensure the right pane uses a flex column so the path row is not clipped */
.folder-pane[b-olvhda9dev] {
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0; /* critical for nested scrollables */
}

.k-treeview[b-olvhda9dev] {
    height: 100% !important;
}

/* Path banner styling */
.directory-path[b-olvhda9dev] {
    flex: 0 0 auto;
    padding: 8px 12px;
    border-bottom: 1px solid var(--kendo-component-border, #e0e0e0);
    background: var(--kendo-component-bg, #fff);
    z-index: 1;
}

/* Grid host consumes remaining height without overflow issues */
.grid-host[b-olvhda9dev] {
    flex: 1 1 auto;
    min-height: 0; /* allow the grid to shrink inside splitter pane */
    display: flex;
    flex-direction: column;
}

    /* Telerik grid should fill the grid-host only */
    .grid-host .k-grid[b-olvhda9dev] {
        height: 100% !important;
        min-height: 0;
    }

/* Tiles view: full height flex layout */
.tiles-view-container[b-olvhda9dev] {
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.tiles-content-wrapper[b-olvhda9dev] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto; /* keep internal scroll here */
}

.tiles-listview[b-olvhda9dev] {
    height: 100%;
}

/* Optional: make the pager stay visible and not steal height unexpectedly */
.tiles-footer[b-olvhda9dev] {
    flex: 0 0 auto;
    border-top: 1px solid var(--kendo-component-border, #e0e0e0);
    background: var(--kendo-component-bg, #fff);
}


/* Tiles View Container */
.tiles-view-container[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 270px);
    background-color: var(--kendo-color-surface);
}

/* Tiles Toolbar */
.tiles-toolbar[b-olvhda9dev] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 1rem;
    background-color: var(--kendo-color-surface-alt);
    border-bottom: 1px solid var(--kendo-color-border);
}

.tiles-toolbar-left[b-olvhda9dev],
.tiles-toolbar-right[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Tiles Header */
.tiles-header[b-olvhda9dev] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background-color: var(--kendo-color-surface);
    border-bottom: 1px solid var(--kendo-color-border);
}

.tiles-count[b-olvhda9dev] {
    color: var(--kendo-color-on-surface);
    opacity: 0.7;
    font-size: 0.875rem;
}

.tiles-sort-controls[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Tiles Content Wrapper */
.tiles-content-wrapper[b-olvhda9dev] {
    flex: 1;
    overflow: hidden;
    position: relative;
}

/* ListView Customization */
[b-olvhda9dev] .tiles-listview {
    height: 100%;
    background-color: var(--kendo-color-surface);
}

    [b-olvhda9dev] .tiles-listview .k-listview-content {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        gap: 1rem;
        padding: 1rem;
        overflow-y: auto;
        height: calc(100% - 60px);  Account for header 
}

/* Tile Item */
.tile-item[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    background-color: var(--kendo-color-surface-alt);
    border: 2px solid transparent;
    border-radius: var(--kendo-border-radius-md);
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    position: relative;
    height: 180px;
}

    .tile-item:hover[b-olvhda9dev] {
        background-color: var(--kendo-color-base-hover);
        border-color: var(--kendo-color-primary);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }

    .tile-item.tile-selected[b-olvhda9dev] {
        background-color: var(--kendo-color-primary-subtle);
        border-color: var(--kendo-color-primary);
    }

/* Dark theme adjustments */
.k-theme-dark .tile-item:hover[b-olvhda9dev] {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Tile Icon Wrapper */
.tile-icon-wrapper[b-olvhda9dev] {
    position: relative;
    margin-bottom: 0.75rem;
}

    .tile-icon-wrapper[b-olvhda9dev]  .k-svg-icon {
        color: var(--kendo-color-primary);
    }

/* Selection Indicator */
.tile-selection-indicator[b-olvhda9dev] {
    position: absolute;
    top: -8px;
    right: -8px;
    background-color: var(--kendo-color-primary);
    border-radius: 50%;
    padding: 2px;
}

    .tile-selection-indicator[b-olvhda9dev]  .k-svg-icon {
        color: var(--kendo-color-on-primary);
        width: 16px;
        height: 16px;
    }

/* Tile Content */
.tile-content[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
}

.tile-name[b-olvhda9dev] {
    font-weight: 500;
    color: var(--kendo-color-on-surface);
    margin-bottom: 0.25rem;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
}

.tile-metadata[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    color: var(--kendo-color-on-surface);
    opacity: 0.7;
    margin-bottom: 0.25rem;
}

.tile-separator[b-olvhda9dev] {
    opacity: 0.5;
}

.tile-dates[b-olvhda9dev] {
    font-size: 0.6875rem;
    color: var(--kendo-color-on-surface);
    opacity: 0.6;
}

/* Tiles Footer */
.tiles-footer[b-olvhda9dev] {
    padding: 0.5rem 1rem;
    background-color: var(--kendo-color-surface-alt);
    border-top: 1px solid var(--kendo-color-border);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    [b-olvhda9dev] .tiles-listview .k-listview-content {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 0.75rem;
        padding: 0.75rem;
    }

    .tile-item[b-olvhda9dev] {
        padding: 0.75rem;
        height: 160px;
    }
}

@media (max-width: 480px) {
    [b-olvhda9dev] .tiles-listview .k-listview-content {
        grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
        gap: 0.5rem;
        padding: 0.5rem;
    }

    .tile-item[b-olvhda9dev] {
        padding: 0.5rem;
        height: 140px;
    }

    .tile-name[b-olvhda9dev] {
        font-size: 0.75rem;
    }

    .tile-metadata[b-olvhda9dev] {
        font-size: 0.6875rem;
    }
}

/* Loading state for tiles */
.tile-item.loading[b-olvhda9dev] {
    opacity: 0.5;
    pointer-events: none;
}

/* Drag and drop support */
.tile-item.drag-over[b-olvhda9dev] {
    background-color: var(--kendo-color-primary-subtle);
    border-color: var(--kendo-color-primary);
    border-style: dashed;
}

/* Focus styles for accessibility */
.tile-item:focus[b-olvhda9dev] {
    outline: 2px solid var(--kendo-color-primary);
    outline-offset: 2px;
}

/* Animation for tile selection */
@keyframes tile-select-b-olvhda9dev {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.95);
    }

    100% {
        transform: scale(1);
    }
}

.tile-item.tile-selected[b-olvhda9dev] {
    animation: tile-select-b-olvhda9dev 0.2s ease-in-out;
}

/* Focus state for keyboard navigation */
.tiles-content-wrapper:focus[b-olvhda9dev] {
    outline: 2px solid var(--kendo-color-primary);
    outline-offset: -2px;
}

.tiles-content-wrapper:focus-visible[b-olvhda9dev] {
    outline: 2px solid var(--kendo-color-primary);
    outline-offset: -2px;
}

/* Enhanced selection state */
.tile-item.tile-selected[b-olvhda9dev] {
    background-color: var(--kendo-color-primary-subtle);
    border-color: var(--kendo-color-primary);
    box-shadow: 0 0 0 1px var(--kendo-color-primary) inset;
}

/* Hover state when item is already selected */
    .tile-item.tile-selected:hover[b-olvhda9dev] {
        background-color: var(--kendo-color-primary-subtle-hover);
    }

/* Visual feedback for multi-select mode */
.tiles-listview[b-olvhda9dev] {
    user-select: none;  Prevent text selection during multi-select 
}

.tiles-listview .k-listview-content[b-olvhda9dev] {
/*existing styles */
    position: relative;
}

.tile-item[b-olvhda9dev] {
 existing styles 
pointer-events: auto;
    position: relative;
    z-index: 1;
}

/* File icon column styling for compact view - using class selector for flexibility */
[b-olvhda9dev] .file-icon-column {
    padding: 0.25rem !important;
    text-align: center !important;
}

/* Target cells in the file icon column */
[b-olvhda9dev] .k-grid td.file-icon-column {
    padding: 0.25rem;
    text-align: center;
    vertical-align: middle;
}

/* Target header cells in the file icon column */
[b-olvhda9dev] .k-grid th.file-icon-column {
    padding: 0.25rem;
    text-align: center;
    vertical-align: middle;
}

/* Ensure icon content is centered and compact */
[b-olvhda9dev] .file-icon-column .k-svg-icon {
    vertical-align: middle;
    margin: 0;
    display: inline-block;
}

/* Remove any default margins/padding from the icon cell content */
[b-olvhda9dev] .file-icon-column > * {
    margin: 0;
    padding: 0;
}

/* Consistent icon sizing in the file icon column */
[b-olvhda9dev] .file-icon-column .k-svg-icon {
    width: 16px;
    height: 16px;
}

/* Optional: Add subtle hover effect for better UX */
[b-olvhda9dev] .k-grid tr:hover .file-icon-column .k-svg-icon {
    opacity: 0.8;
    transition: opacity 0.2s ease;
}

/* Optional: Different icon colors for folders vs files */
[b-olvhda9dev] .file-icon-column .k-svg-i-folder {
    color: var(--kendo-color-warning);
}

[b-olvhda9dev] .file-icon-column .k-svg-icon[class*="k-svg-i-file"] {
    color: var(--kendo-color-info);
}

/* Dark theme adjustments */
[b-olvhda9dev] .k-theme-dark .file-icon-column .k-svg-i-folder {
    color: var(--kendo-color-warning-lighter);
}

[b-olvhda9dev] .k-theme-dark .file-icon-column .k-svg-icon[class*="k-svg-i-file"] {
    color: var(--kendo-color-info-lighter);
}

/* AI Analysis Window Base Styles */
.ai-analysis-window[b-olvhda9dev] {
    --ai-border-radius: 8px;
    --ai-spacing-xs: 4px;
    --ai-spacing-sm: 8px;
    --ai-spacing-md: 16px;
    --ai-spacing-lg: 24px;
    --ai-spacing-xl: 32px;
    --ai-transition: all 0.2s ease;
}

/* Window Title Styling */
.ai-window-title[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-sm);
    font-size: 1.125rem;
    font-weight: 600;
}

.ai-title-icon[b-olvhda9dev] {
    color: var(--kendo-color-primary);
}

.ai-title-metadata[b-olvhda9dev] {
    margin-left: auto;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--kendo-color-subtle);
}

    .ai-title-metadata .separator[b-olvhda9dev] {
        margin: 0 var(--ai-spacing-xs);
        opacity: 0.5;
    }

/* Content Wrapper */
.ai-analysis-content-wrapper[b-olvhda9dev] {
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}

/* Processing Overlay */
.ai-processing-overlay[b-olvhda9dev] {
    position: absolute;
    inset: 0;
    background-color: var(--kendo-color-base-white);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
}

:global(.k-dark) .ai-processing-overlay[b-olvhda9dev] {
    background-color: var(--kendo-color-base-black);
}

.ai-processing-content[b-olvhda9dev] {
    text-align: center;
    margin-top: var(--ai-spacing-lg);
}

.processing-title[b-olvhda9dev] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: var(--ai-spacing-sm);
    color: var(--kendo-color-on-app-surface);
}

.processing-subtitle[b-olvhda9dev] {
    color: var(--kendo-color-subtle);
}

/* Tab Styling */
.ai-analysis-tabs[b-olvhda9dev] {
    height: 100%;
    border: none;
}

    .ai-analysis-tabs .k-tabstrip-items-wrapper[b-olvhda9dev] {
        background-color: var(--kendo-color-surface);
        border-bottom: 1px solid var(--kendo-color-border);
    }

.tab-header[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-xs);
}

.ai-analysis-tabs .k-tabstrip-content[b-olvhda9dev] {
    height: calc(100% - 44px);
    padding: 0;
    overflow: hidden;
}

/* Analysis Container */
.ai-analysis-container[b-olvhda9dev],
.ai-digest-container[b-olvhda9dev] {
    height: 100%;
    overflow-y: auto;
    padding: var(--ai-spacing-lg);
    background-color: var(--kendo-color-base);
}

/* Error Message */
.ai-error-message[b-olvhda9dev] {
    display: flex;
    gap: var(--ai-spacing-md);
    padding: var(--ai-spacing-md);
    background-color: var(--kendo-color-error-subtle);
    border: 1px solid var(--kendo-color-error);
    border-radius: var(--ai-border-radius);
    color: var(--kendo-color-error-on-subtle);
}

    .ai-error-message .k-svg-icon[b-olvhda9dev] {
        color: var(--kendo-color-error);
        flex-shrink: 0;
    }

.error-content h4[b-olvhda9dev] {
    margin: 0 0 var(--ai-spacing-xs) 0;
    font-size: 1rem;
}

.error-content p[b-olvhda9dev] {
    margin: 0;
}

/* Report Styling */
.ai-analysis-report[b-olvhda9dev],
.ai-digest-report[b-olvhda9dev] {
    max-width: 1200px;
    margin: 0 auto;
}

.report-header[b-olvhda9dev] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--ai-spacing-lg);
    padding-bottom: var(--ai-spacing-md);
    border-bottom: 2px solid var(--kendo-color-border);
}

    .report-header h2[b-olvhda9dev] {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
    }

.report-metadata[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-md);
    color: var(--kendo-color-subtle);
    font-size: 0.875rem;
}

.processing-time[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-xs);
}

/* ... existing styles ... */

/* Updated Markdown Content Styling - Remove gray backgrounds */
.ai-response-markdown[b-olvhda9dev],
.digest-markdown[b-olvhda9dev] {
    line-height: 1.6;
    color: var(--kendo-color-on-app-surface);
    background-color: transparent !important;
/* Prevent horizontal scrolling from long unbroken text */
word-wrap: break-word;
    word-break: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
}

/* Ensure all child elements also handle long text properly */
.ai-response-markdown *[b-olvhda9dev],
    .digest-markdown *[b-olvhda9dev] {
        background-color: transparent !important;
        word-wrap: break-word;
        word-break: break-word;
        overflow-wrap: break-word;
    }

/* Update code blocks to handle overflow */
.ai-response-markdown pre[b-olvhda9dev],
    .digest-markdown pre[b-olvhda9dev] {
        margin: var(--ai-spacing-md) 0;
        padding: var(--ai-spacing-md);
        background-color: var(--kendo-color-base-hover) !important;
        border: 1px solid var(--kendo-color-border);
        border-radius: var(--ai-border-radius);
        overflow-x: auto;
        max-width: 100%;
/* Allow horizontal scroll only for code blocks */
word-wrap: normal;
        word-break: normal;
    }

/* Ensure pre/code blocks still allow horizontal scroll when needed */
.ai-response-markdown pre code[b-olvhda9dev],
        .digest-markdown pre code[b-olvhda9dev] {
            padding: 0;
            background-color: transparent !important;
            border: none;
            white-space: pre;
            word-wrap: normal;
            word-break: normal;
        }

/* Inline code should wrap */
.ai-response-markdown code:not(pre code)[b-olvhda9dev],
    .digest-markdown code:not(pre code)[b-olvhda9dev] {
        padding: 2px 6px;
        background-color: var(--kendo-color-base-hover) !important;
        border-radius: 3px;
        font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
        font-size: 0.875em;
        color: var(--kendo-color-on-app-surface);
        border: 1px solid var(--kendo-color-border-alt);
        word-wrap: break-word;
        word-break: break-word;
    }

/* Ensure the parent containers don't add backgrounds */
.ai-analysis-container[b-olvhda9dev],
.ai-digest-container[b-olvhda9dev] {
    height: 100%;
    overflow-y: auto;
    padding: var(--ai-spacing-lg);
    background-color: transparent !important;  Changed from var(--kendo-color-base) 
}

/* Make report containers transparent */
.ai-analysis-report[b-olvhda9dev],
.ai-digest-report[b-olvhda9dev] {
    max-width: 1200px;
    margin: 0 auto;
    background-color: transparent !important;
}

/* Remove background from all markdown child elements */
.ai-response-markdown *[b-olvhda9dev],
.digest-markdown *[b-olvhda9dev] {
    background-color: transparent !important;
}

/* Only add subtle backgrounds to specific elements that need them */
.ai-response-markdown code[b-olvhda9dev],
.digest-markdown code[b-olvhda9dev] {
    padding: 2px 6px;
    background-color: var(--kendo-color-base-hover) !important;  /* Very subtle background */
    border-radius: 3px;
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
    font-size: 0.875em;
    color: var(--kendo-color-on-app-surface);
    border: 1px solid var(--kendo-color-border-alt);
}

.ai-response-markdown pre[b-olvhda9dev],
.digest-markdown pre[b-olvhda9dev] {
    margin: var(--ai-spacing-md) 0;
    padding: var(--ai-spacing-md);
    background-color: var(--kendo-color-base-hover) !important; /* Subtle background */
border: 1px solid var(--kendo-color-border);
    border-radius: var(--ai-border-radius);
    overflow-x: auto;
}

    .ai-response-markdown pre code[b-olvhda9dev],
    .digest-markdown pre code[b-olvhda9dev] {
        padding: 0;
        background-color: transparent !important;
        border: none;
    }

/* Blockquotes with very subtle background */
.ai-response-markdown blockquote[b-olvhda9dev],
.digest-markdown blockquote[b-olvhda9dev] {
    margin: var(--ai-spacing-md) 0;
    padding: var(--ai-spacing-md);
    border-left: 4px solid var(--kendo-color-primary);
    background-color: var(--kendo-color-base-hover) !important; /* Very subtle */
    font-style: italic;
    color: var(--kendo-color-on-app-surface);
}   

/* Tables with proper contrast */
.ai-response-markdown table[b-olvhda9dev],
.digest-markdown table[b-olvhda9dev] {
    width: 100%;
    margin: var(--ai-spacing-md) 0;
    border-collapse: collapse;
    background-color: transparent !important;
}

.ai-response-markdown th[b-olvhda9dev],
.digest-markdown th[b-olvhda9dev] {
    background-color: var(--kendo-color-base-hover) !important; /* Subtle header */
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    padding: var(--ai-spacing-sm) var(--ai-spacing-md);
    border: 1px solid var(--kendo-color-border);
    text-align: left;
}

.ai-response-markdown td[b-olvhda9dev],
.digest-markdown td[b-olvhda9dev] {
    padding: var(--ai-spacing-sm) var(--ai-spacing-md);
    border: 1px solid var(--kendo-color-border);
    text-align: left;
    background-color: transparent !important;
    color: var(--kendo-color-on-app-surface);
}

.ai-response-markdown tr:nth-child(even) td[b-olvhda9dev],
.digest-markdown tr:nth-child(even) td[b-olvhda9dev] {
    background-color: var(--kendo-color-base-hover) !important;*/ /* Very subtle stripe */
}

/* Dark Theme Specific Overrides */
:global(.k-dark) .ai-response-markdown code[b-olvhda9dev],
:global(.k-dark) .digest-markdown code[b-olvhda9dev] {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1);
}

:global(.k-dark) .ai-response-markdown pre[b-olvhda9dev],
:global(.k-dark) .digest-markdown pre[b-olvhda9dev] {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border-color: rgba(255, 255, 255, 0.1);
}

:global(.k-dark) .ai-response-markdown blockquote[b-olvhda9dev],
:global(.k-dark) .digest-markdown blockquote[b-olvhda9dev] {
    background-color: rgba(255, 255, 255, 0.02) !important;
    border-left-color: var(--kendo-color-primary-lighter);
}

:global(.k-dark) .ai-response-markdown th[b-olvhda9dev],
:global(.k-dark) .digest-markdown th[b-olvhda9dev] {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

:global(.k-dark) .ai-response-markdown tr:nth-child(even) td[b-olvhda9dev],
:global(.k-dark) .digest-markdown tr:nth-child(even) td[b-olvhda9dev] {
    background-color: rgba(255, 255, 255, 0.02) !important;
}

/* Ensure window content has transparent background */
.ai-analysis-window .k-window-content[b-olvhda9dev] {
    background-color: var(--kendo-color-base) !important;  Clean window background 
}

/* Tab content should be transparent */
.ai-analysis-tabs .k-tabstrip-content[b-olvhda9dev] {
    background-color: transparent !important;
}

/* Override any theme-specific backgrounds that might leak through */
.ai-analysis-window .k-content[b-olvhda9dev],
.ai-analysis-window .k-tabstrip-items-wrapper[b-olvhda9dev] {
    background-color: var(--kendo-color-surface) !important;  Tab header background 
}

/* Ensure rendered markdown content wrapper is transparent */
.rendered-markdown-content[b-olvhda9dev] {
    background-color: transparent !important;
}

/* Contributing Documents Section */
.contributing-documents-section[b-olvhda9dev] {
    margin-top: var(--ai-spacing-xl);
    padding-top: var(--ai-spacing-xl);
    border-top: 1px solid var(--kendo-color-border);
}

.section-title[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-sm);
    margin-bottom: var(--ai-spacing-lg);
    font-size: 1.25rem;
    font-weight: 600;
}

.document-badge[b-olvhda9dev] {
    margin-left: auto;
    padding: 2px 8px;
    background-color: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
    border-radius: 12px;
    font-size: 0.875rem;
    font-weight: 500;
}

.documents-grid-wrapper[b-olvhda9dev] {
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--ai-border-radius);
    overflow: hidden;
}

.contributing-documents-grid[b-olvhda9dev] {
    border: none;
}

    .contributing-documents-grid .k-grid-header[b-olvhda9dev] {
        background-color: var(--kendo-color-surface);
    }

.file-size[b-olvhda9dev] {
    font-family: monospace;
    font-size: 0.875rem;
}

.date-modified[b-olvhda9dev] {
    color: var(--kendo-color-subtle);
}

.tag-list[b-olvhda9dev] {
    display: flex;
    gap: var(--ai-spacing-xs);
    flex-wrap: wrap;
}

.document-tag[b-olvhda9dev] {
    display: inline-block;
    padding: 2px 8px;
    background-color: var(--kendo-color-base-hover);
    border-radius: 12px;
    font-size: 0.75rem;
    color: var(--kendo-color-on-app-surface);
}

.tag-more[b-olvhda9dev] {
    display: inline-block;
    padding: 2px 8px;
    color: var(--kendo-color-subtle);
    font-size: 0.75rem;
}

/* Contributing Documents Grid Toolbar */
.contributing-documents-toolbar[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-sm);
    padding: var(--ai-spacing-sm);
    background-color: var(--kendo-color-surface);
    border-bottom: 1px solid var(--kendo-color-border);
}

.documents-selection-info[b-olvhda9dev] {
    margin-left: auto;
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

/* Empty States */
.ai-empty-state[b-olvhda9dev],
.no-documents-message[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    text-align: center;
    color: var(--kendo-color-subtle);
}

    .ai-empty-state .k-svg-icon[b-olvhda9dev],
    .no-documents-message .k-svg-icon[b-olvhda9dev] {
        margin-bottom: var(--ai-spacing-md);
        opacity: 0.5;
    }

    .ai-empty-state h3[b-olvhda9dev] {
        margin-bottom: var(--ai-spacing-sm);
        color: var(--kendo-color-on-app-surface);
    }

/* Footer Styling */
.ai-window-footer[b-olvhda9dev] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--ai-spacing-md);
    background-color: var(--kendo-color-surface);
    border-top: 1px solid var(--kendo-color-border);
}

.footer-left[b-olvhda9dev] {
    display: flex;
    align-items: center;
}

.ai-personalization-toggle[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-sm);
}

.personalization-checkbox[b-olvhda9dev] {
    margin-right: var(--ai-spacing-xs);
}

.personalization-label[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--ai-spacing-xs);
    cursor: pointer;
    font-size: 0.875rem;
    color: var(--kendo-color-on-app-surface);
    transition: var(--ai-transition);
}

    .personalization-label:hover[b-olvhda9dev] {
        color: var(--kendo-color-primary);
    }

.footer-actions[b-olvhda9dev] {
    display: flex;
    gap: var(--ai-spacing-sm);
}

.footer-button[b-olvhda9dev] {
    min-width: 120px;
}

    .footer-button.primary[b-olvhda9dev] {
        font-weight: 600;
    }

/* Dark Theme Overrides */
:global(.k-dark) .ai-response-markdown blockquote[b-olvhda9dev],
:global(.k-dark) .digest-markdown blockquote[b-olvhda9dev] {
    background-color: var(--kendo-color-surface-alt);
    border-left-color: var(--kendo-color-primary-lighter);
}

:global(.k-dark) .document-tag[b-olvhda9dev] {
    background-color: var(--kendo-color-base-subtle);
}

/* Responsive Design */
@media (max-width: 768px) {
    .ai-window-title[b-olvhda9dev] {
        flex-wrap: wrap;
    }

    .ai-title-metadata[b-olvhda9dev] {
        margin-left: 0;
        margin-top: var(--ai-spacing-xs);
        width: 100%;
        font-size: 0.75rem;
    }

    .report-header[b-olvhda9dev] {
        flex-direction: column;
        align-items: flex-start;
    }

    .ai-window-footer[b-olvhda9dev] {
        flex-direction: column;
        gap: var(--ai-spacing-md);
    }

    .footer-left[b-olvhda9dev],
    .footer-actions[b-olvhda9dev] {
        width: 100%;
    }

    .footer-actions[b-olvhda9dev] {
        justify-content: flex-end;
    }
}

/* Print Styles */
@media print {
    .ai-analysis-tabs .k-tabstrip-items-wrapper[b-olvhda9dev],
    .ai-window-footer[b-olvhda9dev],
    .k-window-actions[b-olvhda9dev] {
        display: none !important;
    }

    .ai-analysis-container[b-olvhda9dev],
    .ai-digest-container[b-olvhda9dev] {
        padding: 0;
        overflow: visible;
    }

    .ai-response-markdown[b-olvhda9dev],
    .digest-markdown[b-olvhda9dev] {
        page-break-inside: avoid;
    }
}

/* Code Block Copy Button */
.copy-code-button[b-olvhda9dev] {
    position: absolute;
    top: var(--ai-spacing-sm);
    right: var(--ai-spacing-sm);
    padding: 4px 8px;
    background-color: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.2s ease;
}

pre:hover .copy-code-button[b-olvhda9dev] {
    opacity: 1;
}

.copy-code-button:hover[b-olvhda9dev] {
    background-color: var(--kendo-color-primary-hover);
}

.copy-code-button:active[b-olvhda9dev] {
    transform: scale(0.95);
}


.directory-path[b-olvhda9dev] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: stretch;
    color: var(--kendo-color-base-active);
    margin-block: var(--kendo-spacing-3, 0.75rem);
    margin-inline: var(--kendo-spacing-3, 0.75rem);
}

.right-click-enabled[b-olvhda9dev] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: stretch;
    color: var(--kendo-color-base-active);
    justify-content: right;
    text-align: right;
    margin-block: var(--kendo-spacing-3, 0.75rem);
    margin-inline: var(--kendo-spacing-3, 0.75rem);
}


/* ==================== XER PREVIEW CONTAINER ==================== */
.xer-preview-host[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
    overflow: hidden;
    background: var(--kendo-color-surface);
    border-left: 1px solid var(--kendo-color-border);
}

/* ==================== MARKDOWN PREVIEW CONTAINER ==================== */
.markdown-preview-host[b-olvhda9dev] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    background-color: var(--kendo-color-app-surface, #ffffff);
    overflow: auto;
}

    /* Ensure the markdown viewer fills the window content area */
    .markdown-preview-host > *[b-olvhda9dev] {
        flex: 1;
        min-height: 0;
    }

/* Optional: Add subtle shadow for window title bar enhancement */
.k-window-title-text[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Optional: Style for the preview button in toolbar */
.k-toolbar .k-button[title*="preview document"][b-olvhda9dev] {
    color: var(--kendo-color-info, #0a7eff);
}

    .k-toolbar .k-button[title*="preview document"]:hover[b-olvhda9dev] {
        background-color: var(--kendo-color-info-subtle, #cee5ff);
    }

/* Dark theme support */
@media (prefers-color-scheme: dark) {
    .markdown-preview-host[b-olvhda9dev] {
        background-color: var(--kendo-color-app-surface, #0d1117);
    }
}

/* Image Preview Host - Match Markdown Viewer Pattern */
.image-preview-host[b-olvhda9dev] {
    width: 100%;
    height: calc(80vh - 76px); 
    overflow: hidden;    
    display: flex;
    flex-direction: column;
}

/* Existing Markdown Preview Host (for reference) */
.markdown-preview-host[b-olvhda9dev] {
    width: 100%;
    height: calc(80vh - 4px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}


/* Document Intelligence Model Picker Styles */
.k-window-content[b-olvhda9dev] {
    overflow: hidden;
}

.doc-intel-model-section[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-2);
}

.current-model-display[b-olvhda9dev],
.no-model-assigned[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
    padding: var(--kendo-spacing-2);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-md);
}

.model-badge[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-1);
    padding: var(--kendo-spacing-0\.5) var(--kendo-spacing-1\.5);
    background: transparent;
    color: var(--kendo-color-on-app-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-sm);
    font-weight: 500;
    font-size: var(--kendo-font-size-sm);
}

.model-actions[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
    margin-left: auto;
}

.doc-intel-picker-window .k-window-content[b-olvhda9dev] {
    padding: 0;
}

.doc-intel-picker-content[b-olvhda9dev] {
    gap: var(--kendo-spacing-3);
    padding: var(--kendo-spacing-4);
}

.picker-header[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    background-color: var(--kendo-color-surface);
    gap: var(--kendo-spacing-2);
}

.search-box[b-olvhda9dev] {
    width: 100%;
}

.picker-info[b-olvhda9dev] {
    height: 96px;
    padding: var(--kendo-spacing-3);
    background: var(--kendo-color-surface);
    border-left: 6px solid var(--kendo-color-info);
    border-right: 1px solid var(--kendo-color-info);
    border-top: 1px solid var(--kendo-color-info);
    border-bottom: 1px solid var(--kendo-color-info);
    border-radius: var(--kendo-border-radius-md);    
}

    .picker-info .picker-info-header h4[b-olvhda9dev] {
        color: var(--kendo-color-info);
    }

.models-grid-container[b-olvhda9dev] {
    
}

.doc-intel-models-grid[b-olvhda9dev] {
    
}

.selection-indicator[b-olvhda9dev] {
    color: var(--kendo-color-success);
}

.model-id-cell[b-olvhda9dev] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-1);
}

.model-id-text[b-olvhda9dev] {
    font-family: var(--kendo-font-family-monospace, 'Courier New', monospace);
    font-weight: 600;
}

.model-description[b-olvhda9dev] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.api-version-badge[b-olvhda9dev] {
    display: inline-block;
    padding: var(--kendo-spacing-0\.5) var(--kendo-spacing-1\.5);
    background: var(--kendo-color-base-subtle);
    border-radius: var(--kendo-border-radius-sm);
    color: var(--kendo-color-primary);
    font-size: var(--kendo-font-size-xs);
    font-family: var(--kendo-font-family-monospace, 'Courier New', monospace);
}

.date-cell[b-olvhda9dev] {
    font-size: var(--kendo-font-size-sm);
}

.no-results-message[b-olvhda9dev],
.no-models-message[b-olvhda9dev] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--kendo-spacing-6);
    text-align: center;
    color: var(--kendo-color-subtle);
}

    .no-results-message h3[b-olvhda9dev],
    .no-models-message h3[b-olvhda9dev] {
        margin: var(--kendo-spacing-2) 0 var(--kendo-spacing-1) 0;
        color: var(--kendo-color-on-app-surface);
    }

.selected-model-summary[b-olvhda9dev] {
    padding: var(--kendo-spacing-3);
    height: 96px;
    background: var(--kendo-color-surface-alt);
    border-left: 6px solid var(--kendo-color-success);
    border-right: 1px solid var(--kendo-color-success);
    border-top: 1px solid var(--kendo-color-success);
    border-bottom: 1px solid var(--kendo-color-success);
    border-radius: var(--kendo-border-radius-md);
    color: var(--kendo-color-on-success);
}

.selected-model-summary .summary-label[b-olvhda9dev],
.selected-model-summary .summary-value[b-olvhda9dev] {
    color: var(--kendo-color-on-app-surface);
}

.selected-model-summary .summary-header h4[b-olvhda9dev] {
    color: var(--kendo-color-success);
}

/* Dark theme specific overrides for better contrast */
@media (prefers-color-scheme: dark) {
    .selected-model-summary[b-olvhda9dev] {
        background: var(--kendo-color-app-surface, rgba(76, 175, 80, 0.15));
        border-color: var(--kendo-color-success, #4CAF50);
    }

    .selected-model-summary .summary-label[b-olvhda9dev] {
        color: var(--kendo-color-on-app-surface, #E0E0E0);
        opacity: 0.9;
    }

    .selected-model-summary .summary-value[b-olvhda9dev] {
        color: var(--kendo-color-on-app-surface, #FFFFFF);
    }

    .selected-model-summary .summary-header h4[b-olvhda9dev] {
        color: var(--kendo-color-success, #81C784);
    }
}

/* ==================== DOCUMENT INTELLIGENCE MODEL PICKER ==================== */

/* Custom Model Indicator - Simple & Clean */
.custom-model-indicator[b-olvhda9dev] {
    display: inline-flex;
    align-items: center;
    gap: var(--kendo-spacing-1);
    padding: var(--kendo-spacing-1) var(--kendo-spacing-2);
    background: var(--kendo-color-primary-subtle);
    color: var(--kendo-color-primary-on-subtle);
    border: 1px solid var(--kendo-color-primary);
    border-radius: var(--kendo-border-radius-md);
    font-size: var(--kendo-font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

    .custom-model-indicator .k-icon[b-olvhda9dev],
    .custom-model-indicator .k-svg-icon[b-olvhda9dev] {
        color: var(--kendo-color-primary);
    }

/* Default Model Indicator - Distinguished Style */
.default-model-indicator[b-olvhda9dev] {
    display: inline-flex;
    align-items: center;
    gap: var(--kendo-spacing-1);
    padding: var(--kendo-spacing-1) var(--kendo-spacing-2);
    background: var(--kendo-color-warning-subtle);
    color: var(--kendo-color-warning-on-subtle);
    border: 1px solid var(--kendo-color-warning);
    border-radius: var(--kendo-border-radius-md);
    font-size: var(--kendo-font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

    .default-model-indicator .k-icon[b-olvhda9dev],
    .default-model-indicator .k-svg-icon[b-olvhda9dev] {
        color: var(--kendo-color-warning);
    }

/* Prebuilt Model Indicator - Standard Style (for reference) */
.prebuilt-model-indicator[b-olvhda9dev] {
    display: inline-flex;
    align-items: center;
    gap: var(--kendo-spacing-1);
    padding: var(--kendo-spacing-1) var(--kendo-spacing-2);
    background: var(--kendo-color-base-subtle);
    color: var(--kendo-color-subtle);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    font-size: var(--kendo-font-size-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

    .prebuilt-model-indicator .k-icon[b-olvhda9dev],
    .prebuilt-model-indicator .k-svg-icon[b-olvhda9dev] {
        color: var(--kendo-color-subtle);
        opacity: 0.8;
    }

/* ==================== DARK THEME SUPPORT ==================== */

@media (prefers-color-scheme: dark) {
    /* Custom Model - Dark Theme */
    .custom-model-indicator[b-olvhda9dev] {
        background: rgba(var(--kendo-color-primary-rgb), 0.15);
        color: var(--kendo-color-primary-lighter);
        border-color: var(--kendo-color-primary);
    }

        .custom-model-indicator .k-icon[b-olvhda9dev],
        .custom-model-indicator .k-svg-icon[b-olvhda9dev] {
            color: var(--kendo-color-primary-lighter);
        }

    /* Default Model - Dark Theme */
    .default-model-indicator[b-olvhda9dev] {
        background: rgba(var(--kendo-color-warning-rgb), 0.15);
        color: var(--kendo-color-warning-lighter);
        border-color: var(--kendo-color-warning);
    }

        .default-model-indicator .k-icon[b-olvhda9dev],
        .default-model-indicator .k-svg-icon[b-olvhda9dev] {
            color: var(--kendo-color-warning-lighter);
        }

    /* Prebuilt Model - Dark Theme */
    .prebuilt-model-indicator[b-olvhda9dev] {
        background: rgba(255, 255, 255, 0.05);
        color: var(--kendo-color-on-app-surface);
        border-color: rgba(255, 255, 255, 0.15);
    }

        .prebuilt-model-indicator .k-icon[b-olvhda9dev],
        .prebuilt-model-indicator .k-svg-icon[b-olvhda9dev] {
            color: var(--kendo-color-on-app-surface);
            opacity: 0.7;
        }
}

/* ==================== GRID INTEGRATION ==================== */

/* Subtle hover effect on parent row */
.doc-intel-models-grid tbody tr:hover .custom-model-indicator[b-olvhda9dev],
.doc-intel-models-grid tbody tr:hover .default-model-indicator[b-olvhda9dev],
.doc-intel-models-grid tbody tr:hover .prebuilt-model-indicator[b-olvhda9dev] {
    opacity: 0.9;
}

/* Selected row state */
.doc-intel-models-grid tbody tr.k-selected .custom-model-indicator[b-olvhda9dev] {
    background: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
    border-color: var(--kendo-color-primary-emphasis);
}

.doc-intel-models-grid tbody tr.k-selected .default-model-indicator[b-olvhda9dev] {
    background: var(--kendo-color-warning);
    color: var(--kendo-color-on-warning);
    border-color: var(--kendo-color-warning-emphasis);
}

.doc-intel-models-grid tbody tr.k-selected .prebuilt-model-indicator[b-olvhda9dev] {
    background: var(--kendo-color-base-active);
    color: var(--kendo-color-on-base);
    border-color: var(--kendo-color-border-alt);
}

/* ==================== ACCESSIBILITY ==================== */

/* Focus states for keyboard navigation */
.custom-model-indicator:focus-visible[b-olvhda9dev],
.default-model-indicator:focus-visible[b-olvhda9dev],
.prebuilt-model-indicator:focus-visible[b-olvhda9dev] {
    outline: 2px solid var(--kendo-color-primary);
    outline-offset: 2px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .custom-model-indicator[b-olvhda9dev],
    .default-model-indicator[b-olvhda9dev],
    .prebuilt-model-indicator[b-olvhda9dev] {
        border-width: 2px;
    }
}
/* /Components/Pages/Modules/Financials/AccountingProjects/Index.razor.rz.scp.css */
body[b-il2boo7kdj] {
}
/* /Components/Pages/Modules/Financials/Accounts/Index.razor.rz.scp.css */
body[b-ex5j8z6kr9] {
}
/* /Components/Pages/Modules/Financials/Contracts/Detail.razor.rz.scp.css */
body[b-6hfynb2ykz] {
}
/* /Components/Pages/Modules/Financials/Contracts/Index.razor.rz.scp.css */
body[b-ba88u5wboi] {
}
/* /Components/Pages/Modules/Financials/Invoicing/Detail.razor.rz.scp.css */
body[b-yz6k16tws3] {
}
/* /Components/Pages/Modules/Financials/Invoicing/Index.razor.rz.scp.css */
body[b-1p2sjaxjfz] {
}
/* /Components/Pages/Modules/Financials/Jobs/Detail.razor.rz.scp.css */
body[b-t2eo2au45d] {
}
/* /Components/Pages/Modules/Financials/Jobs/Index.razor.rz.scp.css */
body[b-ry90mt56dc] {
}
/* /Components/Pages/Modules/Financials/PurchaseOrders/Detail.razor.rz.scp.css */
body[b-vhts9zbrhw] {
}
/* /Components/Pages/Modules/Financials/PurchaseOrders/Index.razor.rz.scp.css */
body[b-zkbzzv5n54] {
}
/* /Components/Pages/Modules/Financials/Vendors/Index.razor.rz.scp.css */
body[b-jjyun6yrby] {
}
/* /Components/Pages/Modules/Help/Index.razor.rz.scp.css */
/* ================================================================
   INDEX.RAZOR.CSS (HELP & SUPPORT PAGE)
   Comprehensive styling for PIM Suite Help Center
   Theme-aware design using Kendo UI CSS variables
   ================================================================ */

/* ================================================================
   SCROLLER & CONTAINER
   ================================================================ */
.help-scroller[b-89q1w0rs5u] {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.help-container[b-89q1w0rs5u] {
    max-width: 1400px;
    margin: 0 auto;
    padding: var(--kendo-spacing-4, 1rem);
    font-family: var(--kendo-font-family, inherit);
    line-height: var(--kendo-line-height, 1.4285714286);
}

/* ================================================================
   SECTION TITLES
   ================================================================ */
.section-title[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size-2xl, 1.5rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
    text-align: center;
    position: relative;
    padding-bottom: var(--kendo-spacing-3, 0.75rem);
}

    .section-title[b-89q1w0rs5u]::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 60px;
        height: 3px;
        background: var(--kendo-color-primary, #0078d4);
        border-radius: var(--kendo-border-radius-full, 9999px);
    }

.section-subtitle[b-89q1w0rs5u] {
    text-align: center;
    max-width: 700px;
    margin: var(--kendo-spacing-4, 1rem) auto var(--kendo-spacing-6, 1.5rem);
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.6;
}

/* ================================================================
   HERO SECTION
   ================================================================ */
.help-hero-section[b-89q1w0rs5u] {
    margin-bottom: var(--kendo-spacing-6, 1.5rem);
}

    .help-hero-section .k-messagebox[b-89q1w0rs5u] {
        border-left: 4px solid var(--kendo-color-primary, #0078d4);
        background: linear-gradient(135deg, var(--kendo-color-primary-subtle, #deecf9) 0%, var(--kendo-color-base-subtle, #f3f2f1) 100%);
    }

.help-hero-content[b-89q1w0rs5u] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-4, 1rem);
    padding: var(--kendo-spacing-4, 1rem);
}

.help-hero-icon[b-89q1w0rs5u] {
    width: 64px;
    height: 64px;
    min-width: 64px;
    background: var(--kendo-color-primary, #0078d4);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-xl, 2rem);
    height: var(--kendo-icon-size-xl, 2rem);
    color: var(--kendo-color-on-primary, #ffffff);
}

.help-hero-text[b-89q1w0rs5u] {
    flex: 1;
}

.help-hero-title[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size-xl, 1.25rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
}

.help-hero-description[b-89q1w0rs5u] {
    margin: 0;
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-on-app-surface, #323130);
    line-height: 1.6;
}

/* ================================================================
   QUICK ACTIONS BAR
   ================================================================ */
.help-quick-actions[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
    margin-bottom: var(--kendo-spacing-6, 1.5rem);
}

.quick-action-card[b-89q1w0rs5u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    padding: var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 2px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    cursor: pointer;
    transition: var(--kendo-transition);
    position: relative;
}

    .quick-action-card:hover[b-89q1w0rs5u] {
        transform: translateY(-2px);
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
    }

    .quick-action-card.primary[b-89q1w0rs5u] {
        border-color: var(--kendo-color-primary, #0078d4);
        background: var(--kendo-color-primary-subtle, #deecf9);
    }

        .quick-action-card.primary:hover[b-89q1w0rs5u] {
            background: var(--kendo-color-primary, #0078d4);
        }

            .quick-action-card.primary:hover .quick-action-icon[b-89q1w0rs5u],
            .quick-action-card.primary:hover .quick-action-label[b-89q1w0rs5u] {
                color: var(--kendo-color-on-primary, #ffffff);
            }

    .quick-action-card.success[b-89q1w0rs5u] {
        border-color: var(--kendo-color-success, #107c10);
        background: var(--kendo-color-success-subtle, #dff6dd);
    }

        .quick-action-card.success:hover[b-89q1w0rs5u] {
            background: var(--kendo-color-success, #107c10);
        }

            .quick-action-card.success:hover .quick-action-icon[b-89q1w0rs5u],
            .quick-action-card.success:hover .quick-action-label[b-89q1w0rs5u] {
                color: var(--kendo-color-on-primary, #ffffff);
            }

    .quick-action-card.info[b-89q1w0rs5u] {
        border-color: var(--kendo-color-info, #0a7eff);
        background: #e8f4fd;
    }

        .quick-action-card.info:hover[b-89q1w0rs5u] {
            background: var(--kendo-color-info, #0a7eff);
        }

            .quick-action-card.info:hover .quick-action-icon[b-89q1w0rs5u],
            .quick-action-card.info:hover .quick-action-label[b-89q1w0rs5u] {
                color: var(--kendo-color-on-primary, #ffffff);
            }

    .quick-action-card.warning[b-89q1w0rs5u] {
        border-color: var(--kendo-color-warning, #ffc80a);
        background: #fff8e1;
    }

        .quick-action-card.warning:hover[b-89q1w0rs5u] {
            background: var(--kendo-color-warning, #ffc80a);
        }

    .quick-action-card.disabled[b-89q1w0rs5u] {
        opacity: 0.7;
        cursor: not-allowed;
        border-color: var(--kendo-color-border, #8a8886);
    }

        .quick-action-card.disabled:hover[b-89q1w0rs5u] {
            transform: none;
            box-shadow: none;
        }

.quick-action-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-xl, 2rem);
    height: var(--kendo-icon-size-xl, 2rem);
    color: var(--kendo-color-primary, #0078d4);
}

.quick-action-card.success .quick-action-icon[b-89q1w0rs5u] {
    color: var(--kendo-color-success, #107c10);
}

.quick-action-card.info .quick-action-icon[b-89q1w0rs5u] {
    color: var(--kendo-color-info, #0a7eff);
}

.quick-action-card.warning .quick-action-icon[b-89q1w0rs5u] {
    color: #f59e0b;
}

.quick-action-label[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.login-required-badge[b-89q1w0rs5u] {
    position: absolute;
    top: -8px;
    right: -8px;
    background: var(--kendo-color-error, #a80000);
    color: var(--kendo-color-on-primary, #ffffff);
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    padding: 2px 6px;
    border-radius: var(--kendo-border-radius-full, 9999px);
}

/* ================================================================
   TICKET FORM SECTION
   ================================================================ */
.ticket-form-section[b-89q1w0rs5u] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 2px solid var(--kendo-color-success, #107c10);
    border-radius: var(--kendo-border-radius-lg, 0.5rem);
    margin-bottom: var(--kendo-spacing-6, 1.5rem);
    overflow: hidden;
}

.ticket-form-header[b-89q1w0rs5u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-success-subtle, #dff6dd);
    border-bottom: 1px solid var(--kendo-color-success, #107c10);
}

.ticket-header-content[b-89q1w0rs5u] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3, 0.75rem);
}

.ticket-header-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-xl, 2rem);
    height: var(--kendo-icon-size-xl, 2rem);
    color: var(--kendo-color-success, #107c10);
}

.ticket-header-content h4[b-89q1w0rs5u] {
    margin: 0;
    font-size: var(--kendo-font-size-lg, 1rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.ticket-header-content p[b-89q1w0rs5u] {
    margin: 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-subtle, #605e5c);
}

.ticket-form-body[b-89q1w0rs5u] {
    padding: var(--kendo-spacing-6, 1.5rem);
}

.ticket-form-actions[b-89q1w0rs5u] {
    display: flex;
    gap: var(--kendo-spacing-3, 0.75rem);
    margin-top: var(--kendo-spacing-4, 1rem);
}

.ticket-success-message[b-89q1w0rs5u] {
    display: flex;
    align-items: flex-start;
    gap: var(--kendo-spacing-3, 0.75rem);
    margin-top: var(--kendo-spacing-4, 1rem);
    padding: var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-success-subtle, #dff6dd);
    border: 1px solid var(--kendo-color-success, #107c10);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
}

.success-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
    color: var(--kendo-color-success, #107c10);
    flex-shrink: 0;
    margin-top: 2px;
}

.ticket-success-message strong[b-89q1w0rs5u] {
    display: block;
    color: var(--kendo-color-success, #107c10);
    margin-bottom: var(--kendo-spacing-1, 0.25rem);
}

.ticket-success-message p[b-89q1w0rs5u] {
    margin: 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-on-app-surface, #323130);
}

/* ================================================================
   CATEGORIES SECTION
   ================================================================ */
.help-categories-section[b-89q1w0rs5u] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.categories-grid[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.category-card[b-89q1w0rs5u] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    transition: var(--kendo-transition);
}

    .category-card:hover[b-89q1w0rs5u] {
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
        border-color: var(--kendo-color-primary, #0078d4);
    }

.category-icon-wrapper[b-89q1w0rs5u] {
    width: 48px;
    height: 48px;
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--kendo-spacing-3, 0.75rem);
}

    .category-icon-wrapper.technical[b-89q1w0rs5u] {
        background: var(--kendo-color-primary-subtle, #deecf9);
    }

    .category-icon-wrapper.training[b-89q1w0rs5u] {
        background: #e6f7e9;
    }

    .category-icon-wrapper.features[b-89q1w0rs5u] {
        background: #fff4e5;
    }

    .category-icon-wrapper.data[b-89q1w0rs5u] {
        background: #f3e8fd;
    }

    .category-icon-wrapper.integration[b-89q1w0rs5u] {
        background: #e8f4fd;
    }

    .category-icon-wrapper.admin[b-89q1w0rs5u] {
        background: #fce7f3;
    }

.category-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
}

.category-icon-wrapper.technical .category-icon[b-89q1w0rs5u] {
    color: var(--kendo-color-primary, #0078d4);
}

.category-icon-wrapper.training .category-icon[b-89q1w0rs5u] {
    color: #10b981;
}

.category-icon-wrapper.features .category-icon[b-89q1w0rs5u] {
    color: #f97316;
}

.category-icon-wrapper.data .category-icon[b-89q1w0rs5u] {
    color: #8b5cf6;
}

.category-icon-wrapper.integration .category-icon[b-89q1w0rs5u] {
    color: #0a7eff;
}

.category-icon-wrapper.admin .category-icon[b-89q1w0rs5u] {
    color: #ec4899;
}

.category-card h5[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.category-card > p[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.5;
}

.category-items[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
    padding-left: var(--kendo-spacing-4, 1rem);
    list-style-type: disc;
}

    .category-items li[b-89q1w0rs5u] {
        font-size: var(--kendo-font-size-xs, 0.6875rem);
        color: var(--kendo-color-on-app-surface, #323130);
        margin-bottom: var(--kendo-spacing-1, 0.25rem);
    }

.category-response[b-89q1w0rs5u] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    padding-top: var(--kendo-spacing-3, 0.75rem);
    border-top: 1px solid var(--kendo-color-border, #8a8886);
}

.response-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-sm, 0.875rem);
    height: var(--kendo-icon-size-sm, 0.875rem);
    color: var(--kendo-color-success, #107c10);
}

.category-response span[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    font-weight: var(--kendo-font-weight-medium, 500);
    color: var(--kendo-color-success, #107c10);
}

/* ================================================================
   ISSUES SECTION
   ================================================================ */
.help-issues-section[b-89q1w0rs5u] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.issues-grid[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.issue-card[b-89q1w0rs5u] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    overflow: hidden;
}

    .issue-card.urgent[b-89q1w0rs5u] {
        border-color: var(--kendo-color-error, #a80000);
        border-width: 2px;
    }

.issue-card-header[b-89q1w0rs5u] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-surface, #faf9f8);
    border-bottom: 1px solid var(--kendo-color-border, #8a8886);
}

.issue-card.urgent .issue-card-header[b-89q1w0rs5u] {
    background: #fef2f2;
    border-bottom-color: var(--kendo-color-error, #a80000);
}

.issue-header-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
}

    .issue-header-icon.urgent[b-89q1w0rs5u] {
        color: var(--kendo-color-error, #a80000);
    }

    .issue-header-icon.info[b-89q1w0rs5u] {
        color: var(--kendo-color-info, #0a7eff);
    }

.issue-card-header h5[b-89q1w0rs5u] {
    margin: 0;
    flex: 1;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.urgency-badge[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    padding: 2px 8px;
    border-radius: var(--kendo-border-radius-full, 9999px);
}

    .urgency-badge.urgent[b-89q1w0rs5u] {
        background: var(--kendo-color-error, #a80000);
        color: var(--kendo-color-on-primary, #ffffff);
    }

    .urgency-badge.standard[b-89q1w0rs5u] {
        background: var(--kendo-color-primary, #0078d4);
        color: var(--kendo-color-on-primary, #ffffff);
    }

.issue-card-content[b-89q1w0rs5u] {
    padding: var(--kendo-spacing-4, 1rem);
}

    .issue-card-content > p[b-89q1w0rs5u] {
        margin: 0 0 var(--kendo-spacing-3, 0.75rem) 0;
        font-size: var(--kendo-font-size-sm, 0.75rem);
        color: var(--kendo-color-subtle, #605e5c);
        line-height: 1.5;
    }

.issue-list[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-4, 1rem) 0;
    padding: 0;
    list-style: none;
}

    .issue-list li[b-89q1w0rs5u] {
        display: flex;
        align-items: center;
        gap: var(--kendo-spacing-2, 0.5rem);
        margin-bottom: var(--kendo-spacing-2, 0.5rem);
        font-size: var(--kendo-font-size-sm, 0.75rem);
        color: var(--kendo-color-on-app-surface, #323130);
    }

.issue-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size, 1rem);
    height: var(--kendo-icon-size, 1rem);
    flex-shrink: 0;
}

    .issue-icon.urgent[b-89q1w0rs5u] {
        color: var(--kendo-color-error, #a80000);
    }

    .issue-icon.info[b-89q1w0rs5u] {
        color: var(--kendo-color-info, #0a7eff);
    }

.urgent-contact[b-89q1w0rs5u],
.standard-contact[b-89q1w0rs5u] {
    text-align: center;
}

.urgent-call-button[b-89q1w0rs5u],
.standard-email-button[b-89q1w0rs5u] {
    width: 100%;
}

/* ================================================================
   CONTACT SECTION
   ================================================================ */
.help-contact-section[b-89q1w0rs5u] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.contact-grid[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: var(--kendo-spacing-4, 1rem);
}

.contact-card[b-89q1w0rs5u] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    overflow: hidden;
}

.contact-card-header[b-89q1w0rs5u] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-surface, #faf9f8);
    border-bottom: 1px solid var(--kendo-color-border, #8a8886);
}

.contact-card-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
    color: var(--kendo-color-primary, #0078d4);
}

.contact-card-header h5[b-89q1w0rs5u] {
    margin: 0;
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.contact-card-content[b-89q1w0rs5u] {
    padding: var(--kendo-spacing-4, 1rem);
}

/* Contact Person */
.contact-person[b-89q1w0rs5u] {
    display: flex;
    gap: var(--kendo-spacing-3, 0.75rem);
    padding: var(--kendo-spacing-3, 0.75rem);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    margin-bottom: var(--kendo-spacing-3, 0.75rem);
    background: var(--kendo-color-surface, #faf9f8);
}

    .contact-person:last-child[b-89q1w0rs5u] {
        margin-bottom: 0;
    }

.contact-avatar[b-89q1w0rs5u] {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 50%;
    background: var(--kendo-color-primary, #0078d4);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--kendo-color-on-primary, #ffffff);
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-bold, 700);
}

.contact-info[b-89q1w0rs5u] {
    flex: 1;
}

    .contact-info strong[b-89q1w0rs5u] {
        display: block;
        font-size: var(--kendo-font-size, 0.875rem);
        color: var(--kendo-color-on-app-surface, #323130);
    }

.contact-title[b-89q1w0rs5u] {
    display: block;
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
    margin-bottom: var(--kendo-spacing-2, 0.5rem);
}

.contact-methods[b-89q1w0rs5u] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1, 0.25rem);
}

.contact-link[b-89q1w0rs5u] {
    display: inline-flex;
    align-items: center;
    gap: var(--kendo-spacing-1, 0.25rem);
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-primary, #0078d4);
    text-decoration: none;
    transition: var(--kendo-transition);
}

    .contact-link:hover[b-89q1w0rs5u] {
        color: var(--kendo-color-primary-hover, #106ebe);
        text-decoration: underline;
    }

.contact-method-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-sm, 0.875rem);
    height: var(--kendo-icon-size-sm, 0.875rem);
}

/* Hours Grid */
.hours-grid[b-89q1w0rs5u] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-3, 0.75rem);
    margin-bottom: var(--kendo-spacing-4, 1rem);
}

.hours-item[b-89q1w0rs5u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--kendo-spacing-2, 0.5rem);
    background: var(--kendo-color-surface, #faf9f8);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
}

.hours-day[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.hours-time[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-primary, #0078d4);
}

.hours-note[b-89q1w0rs5u] {
    display: flex;
    align-items: flex-start;
    gap: var(--kendo-spacing-2, 0.5rem);
    padding: var(--kendo-spacing-3, 0.75rem);
    background: var(--kendo-color-primary-subtle, #deecf9);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
}

.note-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size, 1rem);
    height: var(--kendo-icon-size, 1rem);
    color: var(--kendo-color-primary, #0078d4);
    flex-shrink: 0;
    margin-top: 2px;
}

.hours-note span[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-on-app-surface, #323130);
    line-height: 1.4;
}

/* SLA Grid */
.sla-grid[b-89q1w0rs5u] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-2, 0.5rem);
}

.sla-item[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--kendo-spacing-1, 0.25rem);
    padding: var(--kendo-spacing-2, 0.5rem);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    border-left: 3px solid;
}

    .sla-item.critical[b-89q1w0rs5u] {
        background: #fef2f2;
        border-color: var(--kendo-color-error, #a80000);
    }

    .sla-item.high[b-89q1w0rs5u] {
        background: #fff4e5;
        border-color: #f97316;
    }

    .sla-item.medium[b-89q1w0rs5u] {
        background: var(--kendo-color-primary-subtle, #deecf9);
        border-color: var(--kendo-color-primary, #0078d4);
    }

    .sla-item.low[b-89q1w0rs5u] {
        background: var(--kendo-color-success-subtle, #dff6dd);
        border-color: var(--kendo-color-success, #107c10);
    }

.sla-priority[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
}

.sla-time[b-89q1w0rs5u] {
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-primary, #0078d4);
    text-align: right;
}

.sla-desc[b-89q1w0rs5u] {
    grid-column: span 2;
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
}

/* ================================================================
   SPECIALISTS SECTION
   ================================================================ */
.help-specialists-section[b-89q1w0rs5u] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.specialists-grid[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.specialist-card[b-89q1w0rs5u] {
    display: flex;
    gap: var(--kendo-spacing-3, 0.75rem);
    padding: var(--kendo-spacing-4, 1rem);
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    transition: var(--kendo-transition);
}

    .specialist-card:hover[b-89q1w0rs5u] {
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
        border-color: var(--kendo-color-primary, #0078d4);
    }

.specialist-avatar[b-89q1w0rs5u] {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--kendo-color-primary, #0078d4) 0%, var(--kendo-color-primary-hover, #106ebe) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .specialist-avatar span[b-89q1w0rs5u] {
        color: var(--kendo-color-on-primary, #ffffff);
        font-size: var(--kendo-font-size, 0.875rem);
        font-weight: var(--kendo-font-weight-bold, 700);
        letter-spacing: 0.5px;
    }

.specialist-info[b-89q1w0rs5u] {
    flex: 1;
    min-width: 0;
}

    .specialist-info strong[b-89q1w0rs5u] {
        display: block;
        font-size: var(--kendo-font-size, 0.875rem);
        font-weight: var(--kendo-font-weight-semibold, 600);
        color: var(--kendo-color-on-app-surface, #323130);
        margin-bottom: var(--kendo-spacing-1, 0.25rem);
    }

.specialist-title[b-89q1w0rs5u] {
    display: block;
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
    margin-bottom: var(--kendo-spacing-2, 0.5rem);
    line-height: 1.4;
}

.specialist-methods[b-89q1w0rs5u] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1, 0.25rem);
}

.specialist-link[b-89q1w0rs5u] {
    display: inline-flex;
    align-items: center;
    gap: var(--kendo-spacing-1, 0.25rem);
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-primary, #0078d4);
    text-decoration: none;
    transition: var(--kendo-transition);
}

    .specialist-link:hover[b-89q1w0rs5u] {
        color: var(--kendo-color-primary-hover, #106ebe);
        text-decoration: underline;
    }

.specialist-method-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-sm, 0.875rem);
    height: var(--kendo-icon-size-sm, 0.875rem);
    flex-shrink: 0;
}

/* ================================================================
   FAQ SECTION
   ================================================================ */
.help-faq-section[b-89q1w0rs5u] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.faq-grid[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.faq-category[b-89q1w0rs5u] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    overflow: hidden;
}

.faq-category-title[b-89q1w0rs5u] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    margin: 0;
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    font-size: var(--kendo-font-size, 0.875rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
    background: var(--kendo-color-surface, #faf9f8);
    border-bottom: 1px solid var(--kendo-color-border, #8a8886);
}

.faq-category-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size, 1rem);
    height: var(--kendo-icon-size, 1rem);
    color: var(--kendo-color-primary, #0078d4);
}

.faq-panelbar[b-89q1w0rs5u] {
    border: none;
}

.faq-answer[b-89q1w0rs5u] {
    padding: var(--kendo-spacing-3, 0.75rem);
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: var(--kendo-color-on-app-surface, #323130);
    line-height: 1.6;
    background: var(--kendo-color-surface, #faf9f8);
}

/* ================================================================
   RESOURCES SECTION
   ================================================================ */
.help-resources-section[b-89q1w0rs5u] {
    margin-bottom: var(--kendo-spacing-8, 2rem);
}

.resources-grid[b-89q1w0rs5u] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: var(--kendo-spacing-4, 1rem);
}

.resource-card[b-89q1w0rs5u] {
    background: var(--kendo-color-surface-alt, #ffffff);
    border: 1px solid var(--kendo-color-border, #8a8886);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: var(--kendo-spacing-4, 1rem);
    text-align: center;
    cursor: pointer;
    transition: var(--kendo-transition);
    position: relative;
}

    .resource-card:hover[b-89q1w0rs5u] {
        transform: translateY(-2px);
        box-shadow: var(--kendo-elevation-4, 0 1.2px 3.6px rgba(0, 0, 0, 0.1), 0 6.4px 14.4px rgba(0, 0, 0, 0.13));
        border-color: var(--kendo-color-primary, #0078d4);
    }

.resource-icon-wrapper[b-89q1w0rs5u] {
    width: 48px;
    height: 48px;
    margin: 0 auto var(--kendo-spacing-3, 0.75rem);
    border-radius: 50%;
    background: var(--kendo-color-primary-subtle, #deecf9);
    display: flex;
    align-items: center;
    justify-content: center;
}

.resource-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-lg, 1.25rem);
    height: var(--kendo-icon-size-lg, 1.25rem);
    color: var(--kendo-color-primary, #0078d4);
}

.resource-card h6[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-1, 0.25rem) 0;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #323130);
}

.resource-card p[b-89q1w0rs5u] {
    margin: 0;
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.4;
}

.coming-soon-badge[b-89q1w0rs5u] {
    display: inline-block;
    margin-top: var(--kendo-spacing-2, 0.5rem);
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    padding: 2px 8px;
    background: var(--kendo-color-warning, #ffc80a);
    color: #000;
    border-radius: var(--kendo-border-radius-full, 9999px);
    font-weight: var(--kendo-font-weight-semibold, 600);
}

.status-badge[b-89q1w0rs5u] {
    display: inline-block;
    margin-top: var(--kendo-spacing-2, 0.5rem);
    font-size: var(--kendo-font-size-xs, 0.6875rem);
    padding: 2px 8px;
    border-radius: var(--kendo-border-radius-full, 9999px);
    font-weight: var(--kendo-font-weight-semibold, 600);
}

    .status-badge.operational[b-89q1w0rs5u] {
        background: var(--kendo-color-success, #107c10);
        color: var(--kendo-color-on-primary, #ffffff);
    }

/* ================================================================
   CTA SECTION
   ================================================================ */
.help-cta-section[b-89q1w0rs5u] {
    text-align: center;
    padding: var(--kendo-spacing-8, 2rem) var(--kendo-spacing-6, 1.5rem);
    background: linear-gradient(135deg, var(--kendo-color-primary-subtle, #deecf9) 0%, var(--kendo-color-surface, #faf9f8) 100%);
    border-radius: var(--kendo-border-radius-lg, 0.5rem);
    border: 1px solid var(--kendo-color-border, #8a8886);
}

.cta-content[b-89q1w0rs5u] {
    max-width: 600px;
    margin: 0 auto;
}

.cta-icon[b-89q1w0rs5u] {
    width: var(--kendo-icon-size-2xl, 2.5rem);
    height: var(--kendo-icon-size-2xl, 2.5rem);
    color: var(--kendo-color-primary, #0078d4);
    margin-bottom: var(--kendo-spacing-4, 1rem);
}

.cta-content h5[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-2, 0.5rem) 0;
    font-size: var(--kendo-font-size-xl, 1.25rem);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-color-on-app-surface, #323130);
}

.cta-content > p[b-89q1w0rs5u] {
    margin: 0 0 var(--kendo-spacing-6, 1.5rem) 0;
    font-size: var(--kendo-font-size, 0.875rem);
    color: var(--kendo-color-subtle, #605e5c);
    line-height: 1.6;
}

.cta-buttons[b-89q1w0rs5u] {
    display: flex;
    justify-content: center;
    gap: var(--kendo-spacing-4, 1rem);
}

.cta-button[b-89q1w0rs5u] {
    min-width: 160px;
}

/* ================================================================
   DARK THEME SUPPORT
   ================================================================ */
[data-theme="dark"] .help-hero-section .k-messagebox[b-89q1w0rs5u] {
    background: linear-gradient(135deg, rgba(0, 120, 212, 0.15) 0%, var(--kendo-color-base-subtle, #1b1a19) 100%);
}

/* Quick Action Cards - Dark Theme */
[data-theme="dark"] .quick-action-card.primary[b-89q1w0rs5u] {
    background: rgba(0, 120, 212, 0.2);
}

[data-theme="dark"] .quick-action-card.success[b-89q1w0rs5u] {
    background: rgba(16, 124, 16, 0.2);
}

[data-theme="dark"] .quick-action-card.info[b-89q1w0rs5u] {
    background: rgba(10, 126, 255, 0.2);
}

[data-theme="dark"] .quick-action-card.warning[b-89q1w0rs5u] {
    background: rgba(245, 158, 11, 0.2);
}

/* Ticket Form - Dark Theme */
[data-theme="dark"] .ticket-form-header[b-89q1w0rs5u] {
    background: rgba(16, 124, 16, 0.2);
}

[data-theme="dark"] .ticket-success-message[b-89q1w0rs5u] {
    background: rgba(16, 124, 16, 0.15);
}

/* ================================================================
   CATEGORY ICON WRAPPERS - DARK THEME
   ================================================================ */
[data-theme="dark"] .category-icon-wrapper.technical[b-89q1w0rs5u] {
    background: rgba(0, 120, 212, 0.25);
}

[data-theme="dark"] .category-icon-wrapper.training[b-89q1w0rs5u] {
    background: rgba(16, 185, 129, 0.25);
}

[data-theme="dark"] .category-icon-wrapper.features[b-89q1w0rs5u] {
    background: rgba(249, 115, 22, 0.25);
}

[data-theme="dark"] .category-icon-wrapper.data[b-89q1w0rs5u] {
    background: rgba(139, 92, 246, 0.25);
}

[data-theme="dark"] .category-icon-wrapper.integration[b-89q1w0rs5u] {
    background: rgba(10, 126, 255, 0.25);
}

[data-theme="dark"] .category-icon-wrapper.admin[b-89q1w0rs5u] {
    background: rgba(236, 72, 153, 0.25);
}

/* ================================================================
   ISSUE CARDS - DARK THEME
   ================================================================ */
[data-theme="dark"] .issue-card-header[b-89q1w0rs5u] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

[data-theme="dark"] .issue-card.urgent .issue-card-header[b-89q1w0rs5u] {
    background: rgba(168, 0, 0, 0.2);
}

/* ================================================================
   CONTACT & HOURS - DARK THEME
   ================================================================ */
[data-theme="dark"] .contact-card-header[b-89q1w0rs5u] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

[data-theme="dark"] .contact-person[b-89q1w0rs5u],
[data-theme="dark"] .hours-item[b-89q1w0rs5u] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

[data-theme="dark"] .hours-note[b-89q1w0rs5u] {
    background: rgba(0, 120, 212, 0.2);
}

/* ================================================================
   SLA ITEMS - DARK THEME
   ================================================================ */
[data-theme="dark"] .sla-item.critical[b-89q1w0rs5u] {
    background: rgba(168, 0, 0, 0.15);
}

[data-theme="dark"] .sla-item.high[b-89q1w0rs5u] {
    background: rgba(249, 115, 22, 0.15);
}

[data-theme="dark"] .sla-item.medium[b-89q1w0rs5u] {
    background: rgba(0, 120, 212, 0.15);
}

[data-theme="dark"] .sla-item.low[b-89q1w0rs5u] {
    background: rgba(16, 124, 16, 0.15);
}

/* ================================================================
   SPECIALISTS SECTION - DARK THEME
   ================================================================ */
[data-theme="dark"] .specialist-card[b-89q1w0rs5u] {
    background: var(--kendo-color-surface-alt, #252423);
}

[data-theme="dark"] .specialist-avatar[b-89q1w0rs5u] {
    background: linear-gradient(135deg, rgba(0, 120, 212, 0.8) 0%, rgba(16, 110, 190, 0.8) 100%);
}

/* ================================================================
   FAQ - DARK THEME
   ================================================================ */
[data-theme="dark"] .faq-category-title[b-89q1w0rs5u] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

[data-theme="dark"] .faq-answer[b-89q1w0rs5u] {
    background: var(--kendo-color-base-subtle, #1b1a19);
}

/* ================================================================
   RESOURCE ICON WRAPPER - DARK THEME
   ================================================================ */
[data-theme="dark"] .resource-icon-wrapper[b-89q1w0rs5u] {
    background: rgba(0, 120, 212, 0.25);
}

/* ================================================================
   CTA SECTION - DARK THEME
   ================================================================ */
[data-theme="dark"] .help-cta-section[b-89q1w0rs5u] {
    background: linear-gradient(135deg, rgba(0, 120, 212, 0.15) 0%, var(--kendo-color-base-subtle, #1b1a19) 100%);
}

/* ================================================================
   RESPONSIVE BREAKPOINTS
   ================================================================ */
@media (max-width: 1200px) {
    .help-quick-actions[b-89q1w0rs5u] {
        grid-template-columns: repeat(2, 1fr);
    }

    .categories-grid[b-89q1w0rs5u] {
        grid-template-columns: repeat(2, 1fr);
    }

    .contact-grid[b-89q1w0rs5u] {
        grid-template-columns: 1fr;
    }

    .resources-grid[b-89q1w0rs5u] {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .specialists-grid[b-89q1w0rs5u] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 1024px) {
    .faq-grid[b-89q1w0rs5u] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .help-center-container[b-89q1w0rs5u] {
        padding: var(--kendo-spacing-2, 0.5rem);
    }

    .help-hero-content[b-89q1w0rs5u] {
        flex-direction: column;
        text-align: center;
    }

    .help-quick-actions[b-89q1w0rs5u] {
        grid-template-columns: 1fr;
    }

    .categories-grid[b-89q1w0rs5u] {
        grid-template-columns: 1fr;
    }

    .issues-grid[b-89q1w0rs5u] {
        grid-template-columns: 1fr;
    }

    .resources-grid[b-89q1w0rs5u] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .specialists-grid[b-89q1w0rs5u] {
        grid-template-columns: 1fr;
    }

    .cta-buttons[b-89q1w0rs5u] {
        flex-direction: column;
        align-items: center;
    }

    .cta-button[b-89q1w0rs5u] {
        width: 100%;
        max-width: 280px;
    }

    .ticket-form-body[b-89q1w0rs5u] {
        padding: var(--kendo-spacing-4, 1rem);
    }
}

@media (max-width: 480px) {
    .resources-grid[b-89q1w0rs5u] {
        grid-template-columns: 1fr;
    }

    .ticket-header-content[b-89q1w0rs5u] {
        flex-direction: column;
        text-align: center;
    }
}


/* ================================================================
   ACCESSIBILITY
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
    .quick-action-card[b-89q1w0rs5u],
    .category-card[b-89q1w0rs5u],
    .resource-card[b-89q1w0rs5u] {
        transition: none;
    }

        .quick-action-card:hover[b-89q1w0rs5u],
        .resource-card:hover[b-89q1w0rs5u] {
            transform: none;
        }
}

.quick-action-card:focus-visible[b-89q1w0rs5u],
.category-card:focus-visible[b-89q1w0rs5u],
.resource-card:focus-visible[b-89q1w0rs5u] {
    outline: 2px solid var(--kendo-color-primary, #0078d4);
    outline-offset: 2px;
}

@media (prefers-contrast: high) {
    .quick-action-card[b-89q1w0rs5u],
    .category-card[b-89q1w0rs5u],
    .issue-card[b-89q1w0rs5u],
    .contact-card[b-89q1w0rs5u],
    .faq-category[b-89q1w0rs5u],
    .resource-card[b-89q1w0rs5u] {
        border-width: 2px;
    }

    .sla-item[b-89q1w0rs5u] {
        border-left-width: 5px;
    }
}

/* ================================================================
   PRINT STYLES
   ================================================================ */
@media print {
    .help-scroller[b-89q1w0rs5u] {
        height: auto;
        overflow: visible;
    }

    .quick-action-card:hover[b-89q1w0rs5u],
    .category-card:hover[b-89q1w0rs5u],
    .resource-card:hover[b-89q1w0rs5u] {
        transform: none;
        box-shadow: none;
    }

    .ticket-form-section[b-89q1w0rs5u],
    .help-cta-section[b-89q1w0rs5u] {
        display: none;
    }
}
/* /Components/Pages/Modules/MeetingSchedules/Calendar.razor.rz.scp.css */
/* Meeting Calendar Component Styles with Blazor CSS Isolation */
/* Using ::deep for CSS isolation compatibility */

/* Header Styles */
[b-sv9p6kjd75] .calendar-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

    [b-sv9p6kjd75] .calendar-header h3 {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 0;
        font-size: 1.5rem;
        font-weight: 500;
    }

[b-sv9p6kjd75] .header-subtitle {
    font-size: 0.875rem;
    opacity: 0.7;
    font-weight: normal;
}

/* Main Container */
[b-sv9p6kjd75] .meeting-calendar-container {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 180px);
    background: var(--kendo-color-surface);
    border-radius: var(--kendo-border-radius-lg);
    overflow: hidden;
    position: relative;
}

/* Controls Bar */
[b-sv9p6kjd75] .calendar-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: var(--kendo-color-surface-alt);
    border-bottom: 1px solid var(--kendo-color-border);
    gap: 1rem;
    flex-wrap: wrap;
    flex-shrink: 0;
}

[b-sv9p6kjd75] .controls-left,
[b-sv9p6kjd75] .controls-center,
[b-sv9p6kjd75] .controls-right {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Add margin to account for side panel toggle */
[b-sv9p6kjd75] .controls-right {
    margin-right: 60px; /* Space for collapsed side panel toggle */
}

[b-sv9p6kjd75] .current-date-display {
    font-size: 1.125rem;
    font-weight: 500;
    color: var(--kendo-color-on-app-surface);
    padding: 0 1rem;
}

/* Calendar Content Area */
[b-sv9p6kjd75] .calendar-content-area {
    flex: 1;
    display: flex;
    position: relative;
    overflow: hidden;
    min-height: 0;
}

/* Scheduler Wrapper */
[b-sv9p6kjd75] .scheduler-wrapper {
    flex: 1;
    position: relative;
    overflow: hidden;
    display: flex;
    min-width: 0;
}

/* Telerik Scheduler Customizations */
[b-sv9p6kjd75] .meeting-scheduler {
    flex: 1;
    border: none;
    width: 100%;
    height: 100%;
}

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler {
        border: none;
        height: 100%;
    }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-layout {
        border: none;
        height: 100%;
    }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-head {
        background: var(--kendo-color-surface-alt);
        border-bottom: 2px solid var(--kendo-color-border);
    }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-table {
        table-layout: fixed;
    }

        [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-table td,
        [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-table th {
            border-color: var(--kendo-color-border);
            position: relative;
        }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-content {
        overflow: auto;
    }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-datecolumn {
        background: var(--kendo-color-surface-alt);
        font-weight: 500;
    }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-times th {
        background: var(--kendo-color-surface-alt);
        font-size: 0.75rem;
        color: var(--kendo-color-subtle);
    }

    /* Fix for calendar cell alignment */
    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-monthview .k-scheduler-table td {
        vertical-align: top;
        height: auto;
        min-height: 80px;
    }

/* Event Templates */
[b-sv9p6kjd75] .meeting-event-template {
    padding: 0.25rem 0.5rem;
    border-radius: var(--kendo-border-radius-md);
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    position: relative;
}

    [b-sv9p6kjd75] .meeting-event-template:hover {
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        z-index: 10;
    }

[b-sv9p6kjd75] .event-time {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    opacity: 0.8;
}

[b-sv9p6kjd75] .event-title {
    font-weight: 500;
    font-size: 0.875rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

[b-sv9p6kjd75] .event-location {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    opacity: 0.7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-sv9p6kjd75] .event-indicator {
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
    opacity: 0.6;
}

/* All-Day Event Template */
[b-sv9p6kjd75] .all-day-event-template {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem;
    border-radius: var(--kendo-border-radius-md);
    font-size: 0.875rem;
    font-weight: 500;
    height: 100%;
}

/* Event Status Classes */
[b-sv9p6kjd75] .meeting-event.current-meeting {
    border-left: 3px solid var(--kendo-color-success);
    background: linear-gradient(90deg, rgba(var(--kendo-color-success-rgb), 0.1) 0%, transparent 100%);
}

[b-sv9p6kjd75] .meeting-event.cancelled-meeting {
    opacity: 0.6;
    text-decoration: line-through;
}

[b-sv9p6kjd75] .meeting-event.has-attachments::after {
    content: "📎";
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
    font-size: 0.75rem;
}

/* Side Panel */
[b-sv9p6kjd75] .side-panel {
    position: absolute;
    right: 0;
    top: 173px;
    height: calc(100% - 172px);
    background: var(--kendo-color-surface);
    border-left: 1px solid var(--kendo-color-border);
    transition: width 0.3s ease;
    z-index: 100;
    display: flex;
    flex-direction: column;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.1);

}

    [b-sv9p6kjd75] .side-panel.expanded {
        width: 320px;
    }

    [b-sv9p6kjd75] .side-panel.collapsed {
        width: 24px;
        margin-right: 24px; /* Hide the panel when collapsed */
    }

[b-sv9p6kjd75] .panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0rem;
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface-alt);
    flex-shrink: 0;
}

    [b-sv9p6kjd75] .panel-header h4 {
        margin: 0;
        font-size: 1rem;
        display: none;
    }

[b-sv9p6kjd75] .side-panel.expanded .panel-header h4 {
    display: block;
}

[b-sv9p6kjd75] .panel-content {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

[b-sv9p6kjd75] .detail-section {
    margin-bottom: 1.5rem;
}

    [b-sv9p6kjd75] .detail-section h5 {
        margin: 0 0 0.5rem 0;
        font-size: 1.125rem;
        color: var(--kendo-color-on-app-surface);
    }

    [b-sv9p6kjd75] .detail-section label {
        display: block;
        font-size: 0.75rem;
        font-weight: 500;
        color: var(--kendo-color-subtle);
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 0.25rem;
    }

    [b-sv9p6kjd75] .detail-section p {
        margin: 0.25rem 0;
        color: var(--kendo-color-on-app-surface);
    }

[b-sv9p6kjd75] .detail-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

[b-sv9p6kjd75] .panel-actions {
    display: flex;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--kendo-color-border);
}

/* Status Chips */
[b-sv9p6kjd75] .chip-new {
    background: var(--kendo-color-info-subtle);
    color: var(--kendo-color-info-on-subtle);
}

[b-sv9p6kjd75] .chip-active {
    background: var(--kendo-color-success-subtle);
    color: var(--kendo-color-success-on-subtle);
}

[b-sv9p6kjd75] .chip-closed {
    background: var(--kendo-color-base-subtle);
    color: var(--kendo-color-on-base);
}

[b-sv9p6kjd75] .chip-cancelled {
    background: var(--kendo-color-error-subtle);
    color: var(--kendo-color-error-on-subtle);
}

/* Context Menu */
[b-sv9p6kjd75] .context-menu-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 1rem;
    min-width: 150px;
}

    [b-sv9p6kjd75] .context-menu-item:hover {
        background: var(--kendo-color-base-hover);
    }

/* Meeting Form Dialog */
[b-sv9p6kjd75] .meeting-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0.5rem;
}

[b-sv9p6kjd75] .form-group {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    [b-sv9p6kjd75] .form-group label {
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--kendo-color-on-app-surface);
    }

[b-sv9p6kjd75] .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

[b-sv9p6kjd75] .recurrence-options {
    padding: 1rem;
    background: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
    margin-top: 0.5rem;
}

/* Loading State */
[b-sv9p6kjd75] .loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 1rem;
}

    [b-sv9p6kjd75] .loading-container p {
        color: var(--kendo-color-subtle);
        font-size: 0.875rem;
    }

/* Fix for scrollbar issues */
[b-sv9p6kjd75] .k-scheduler-layout {
    display: flex;
    flex-direction: column;
    height: 100%;
}

[b-sv9p6kjd75] .k-scheduler-content-wrap {
    flex: 1;
    min-height: 0;
    position: relative;
}

/* Prevent unnecessary scrollbars */
[b-sv9p6kjd75] .k-scheduler-monthview {
    overflow: hidden;
}

    [b-sv9p6kjd75] .k-scheduler-monthview .k-scheduler-content {
        overflow: auto;
    }

/* Responsive Design */
@media (max-width: 768px) {
    [b-sv9p6kjd75] .calendar-controls {
        flex-direction: column;
        align-items: stretch;
    }

    [b-sv9p6kjd75] .controls-left,
    [b-sv9p6kjd75] .controls-center,
    [b-sv9p6kjd75] .controls-right {
        justify-content: center;
    }

    [b-sv9p6kjd75] .controls-right {
        margin-right: 0; /* Remove margin on mobile */
    }

    [b-sv9p6kjd75] .side-panel.expanded {
        width: 100%;
        position: fixed;
    }

    [b-sv9p6kjd75] .current-date-display {
        font-size: 1rem;
    }

    [b-sv9p6kjd75] .meeting-calendar-container {
        height: calc(100vh - 120px);
    }
}

/* Dark Theme Overrides */
@media (prefers-color-scheme: dark) {
    [b-sv9p6kjd75] .meeting-calendar-container {
        background: var(--kendo-color-surface);
    }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-table {
        background: var(--kendo-color-surface);
    }

    [b-sv9p6kjd75] .meeting-scheduler .k-scheduler-nonwork {
        background: rgba(var(--kendo-color-base-rgb), 0.05);
    }

    [b-sv9p6kjd75] .meeting-event-template:hover {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    }

    [b-sv9p6kjd75] .side-panel {
        box-shadow: -2px 0 8px rgba(0, 0, 0, 0.3);
    }
}

/* Animations */
@keyframes slideIn-b-sv9p6kjd75 {
    from {
        transform: translateX(100%);
    }

    to {
        transform: translateX(0);
    }
}

[b-sv9p6kjd75] .side-panel.expanded {
    animation: slideIn-b-sv9p6kjd75 0.3s ease;
}

/* Print Styles */
@media print {
    [b-sv9p6kjd75] .calendar-controls,
    [b-sv9p6kjd75] .side-panel {
        display: none;
    }

    [b-sv9p6kjd75] .meeting-calendar-container {
        border: none;
        box-shadow: none;
        height: auto;
    }

    [b-sv9p6kjd75] .meeting-scheduler {
        height: auto !important;
    }

    [b-sv9p6kjd75] .calendar-content-area {
        height: auto;
        overflow: visible;
    }
}
/* /Components/Pages/Modules/MeetingSchedules/Index.razor.rz.scp.css */
body[b-0t9qw7o8kv] {
}



.hidden-form form[b-0t9qw7o8kv] {
    display: none;
}

div.modal-wizard[b-0t9qw7o8kv] {
    height: calc(80vh) !important;
    width: calc(100vw - 120px) !important;
}
/* /Components/Pages/Modules/Personalization/UserProfileDetail.razor.rz.scp.css */
[b-ljgni9gvsn] .profile-banner-compact {
    display: flex;
    align-items: center;
    gap: 1rem;
    height: 48px;
    padding: 0 1rem;
}

[b-ljgni9gvsn] .profile-avatar-mini {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kendo-color-primary-subtle);
    border: 2px solid var(--kendo-color-primary);
    flex-shrink: 0;
}

    [b-ljgni9gvsn] .profile-avatar-mini img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

[b-ljgni9gvsn] .profile-info-compact {
    flex: 1;
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    min-width: 0;
}

[b-ljgni9gvsn] .profile-name-compact {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--kendo-color-on-surface);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-ljgni9gvsn] .profile-email-compact {
    color: var(--kendo-color-subtle);
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-ljgni9gvsn] .profile-completion-chip {
    margin-left: auto;
    flex-shrink: 0;
}

/* Remove old banner styles */
[b-ljgni9gvsn] .profile-banner {
    display: none;
}

[b-ljgni9gvsn] .profile-avatar-section {
    display: none;
}

[b-ljgni9gvsn] .profile-avatar {
    display: none;
}

[b-ljgni9gvsn] .avatar-edit-btn {
    display: none;
}

[b-ljgni9gvsn] .profile-info {
    display: none;
}

[b-ljgni9gvsn] .profile-name {
    display: none;
}

[b-ljgni9gvsn] .profile-subtitle {
    display: none;
}

[b-ljgni9gvsn] .profile-email {
    display: none;
}

[b-ljgni9gvsn] .profile-status-chip {
    display: none;
}

/* Toolbar Styles */
[b-ljgni9gvsn] .profile-toolbar {
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface);
}

/* Content Area */
[b-ljgni9gvsn] .profile-content {
    height: calc(100vh - 320px);
    overflow-y: auto;
    padding: 1.5rem;
}

/* Tabs */
[b-ljgni9gvsn] .profile-tabs {
    height: 100%;
}

    [b-ljgni9gvsn] .profile-tabs .k-tabstrip-items-wrapper {
        background: var(--kendo-color-surface);
        border-bottom: 1px solid var(--kendo-color-border);
    }

    [b-ljgni9gvsn] .profile-tabs .k-tabstrip-content {
        height: calc(100% - 48px);
        overflow-y: auto;
        background: transparent;
    }

[b-ljgni9gvsn] .tab-content {
    padding: 1.5rem;
    max-width: 1200px;
}

/* Form Groups */
[b-ljgni9gvsn] .k-form-group {
    margin-bottom: 2rem;
    background: var(--kendo-color-surface);
    border-radius: var(--kendo-border-radius-lg);
    padding: 1.5rem;
    border: 1px solid var(--kendo-color-border);
}

[b-ljgni9gvsn] .k-form-group-label {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: var(--kendo-color-on-surface);
}

/* Persona Selection */
[b-ljgni9gvsn] .persona-selection {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

[b-ljgni9gvsn] .persona-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

[b-ljgni9gvsn] .persona-chip {
    cursor: pointer;
    transition: all 0.2s ease;
}

    [b-ljgni9gvsn] .persona-chip:hover {
        transform: translateY(-2px);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    }

    [b-ljgni9gvsn] .persona-chip.k-chip-selected {
        background: var(--kendo-color-primary);
        color: var(--kendo-color-on-primary);
    }

/* Notification Settings */
[b-ljgni9gvsn] .notification-settings {
    padding: 0.75rem 0;
}

    [b-ljgni9gvsn] .notification-settings .k-switch-label-on,
    [b-ljgni9gvsn] .notification-settings .k-switch-label-off {
        min-width: 200px;
    }

/* Security Info */
[b-ljgni9gvsn] .security-info {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

[b-ljgni9gvsn] .info-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.5rem 0;
}

[b-ljgni9gvsn] .info-label {
    font-weight: 500;
    min-width: 150px;
    color: var(--kendo-color-subtle);
}

[b-ljgni9gvsn] .info-value {
    color: var(--kendo-color-on-surface);
}

/* Data Actions */
[b-ljgni9gvsn] .data-actions {
    display: flex;
    gap: 1rem;
    padding: 1rem 0;
}

/* Avatar Upload */
[b-ljgni9gvsn] .avatar-upload {
    padding: 1rem;
}

/* AI Insights */
[b-ljgni9gvsn] .ai-insights {
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-ljgni9gvsn] .insights-content {
    padding: 1rem;
}

    [b-ljgni9gvsn] .insights-content h3,
    [b-ljgni9gvsn] .insights-content h4 {
        color: var(--kendo-color-primary);
        margin-bottom: 0.75rem;
    }

    [b-ljgni9gvsn] .insights-content ul {
        list-style: none;
        padding: 0;
    }

    [b-ljgni9gvsn] .insights-content li {
        padding: 0.5rem 0;
        border-bottom: 1px solid var(--kendo-color-border);
    }

        [b-ljgni9gvsn] .insights-content li:last-child {
            border-bottom: none;
        }

/* Delete Warning */
[b-ljgni9gvsn] .delete-warning {
    text-align: center;
    padding: 2rem;
}

    [b-ljgni9gvsn] .delete-warning p {
        margin: 1rem 0;
        color: var(--kendo-color-error);
    }

/* Profile Actions */
[b-ljgni9gvsn] .profile-actions {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    border-top: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface);
    justify-content: flex-end;
    position: sticky;
    bottom: 0;
    z-index: 10;
}

/* Dark Theme Overrides */
@media (prefers-color-scheme: dark) {
    [b-ljgni9gvsn] .profile-banner {
        background: var(--kendo-color-surface);
    }

    [b-ljgni9gvsn] .profile-avatar {
        background: var(--kendo-color-base);
    }

    [b-ljgni9gvsn] .k-form-group {
        background: var(--kendo-color-base);
    }

    [b-ljgni9gvsn] .profile-content {
        background: var(--kendo-color-surface);
    }
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    [b-ljgni9gvsn] .profile-banner {
        flex-direction: column;
        text-align: center;
    }

    [b-ljgni9gvsn] .profile-avatar-section {
        margin: 0 auto;
    }

    [b-ljgni9gvsn] .profile-subtitle {
        justify-content: center;
    }

    [b-ljgni9gvsn] .data-actions {
        flex-direction: column;
    }

    [b-ljgni9gvsn] .persona-chips {
        justify-content: center;
    }
}

/* Compact Mode */
.form-body-container-compact[b-ljgni9gvsn]  .profile-content {
    padding: 1rem;
}

.form-body-container-compact[b-ljgni9gvsn]  .k-form-group {
    padding: 1rem;
    margin-bottom: 1rem;
}

.form-body-container-compact[b-ljgni9gvsn]  .tab-content {
    padding: 1rem;
}

/* Animation Classes */
@keyframes pulse-b-ljgni9gvsn {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

[b-ljgni9gvsn] .profile-status-chip {
    animation: pulse-b-ljgni9gvsn 2s infinite;
}

/* Tooltip Styling */
[b-ljgni9gvsn] .k-tooltip {
    background: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
    border-radius: var(--kendo-border-radius-md);
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
}


/* AI Assistant Prompt Text Area Styling */
[b-ljgni9gvsn] .ai-prompt-textarea {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', monospace;
    font-size: 0.875rem;
    line-height: 1.5;
    min-height: 150px;
    max-height: 400px;
    resize: vertical;
    padding: 0.75rem;
    border-radius: var(--kendo-border-radius-md);
    transition: all 0.2s ease;
}

    [b-ljgni9gvsn] .ai-prompt-textarea:focus {
        box-shadow: 0 0 0 2px rgba(var(--kendo-color-primary-rgb), 0.2);
        border-color: var(--kendo-color-primary);
    }

    [b-ljgni9gvsn] .ai-prompt-textarea::placeholder {
        color: var(--kendo-color-subtle);
        font-style: italic;
        opacity: 0.7;
    }

/* Prompt field footer with character count and actions */
[b-ljgni9gvsn] .prompt-field-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--kendo-color-border-alt);
    font-size: 0.75rem;
}

[b-ljgni9gvsn] .character-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-ljgni9gvsn] .char-count {
    color: var(--kendo-color-subtle);
    font-weight: 500;
}

[b-ljgni9gvsn] .char-warning {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--kendo-color-warning);
    font-weight: 500;
}

[b-ljgni9gvsn] .prompt-actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

/* Enhanced form item styling for AI prompt field */
[b-ljgni9gvsn] .k-form-field-wrap:has(.ai-prompt-textarea) {
    grid-column: span 2;
}

    [b-ljgni9gvsn] .k-form-field-wrap:has(.ai-prompt-textarea) .k-form-label {
        font-weight: 600;
        color: var(--kendo-color-on-app-surface);
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

        [b-ljgni9gvsn] .k-form-field-wrap:has(.ai-prompt-textarea) .k-form-label::before {
            content: "🤖";
            font-size: 1rem;
        }

    [b-ljgni9gvsn] .k-form-field-wrap:has(.ai-prompt-textarea) .k-form-hint {
        color: var(--kendo-color-subtle);
        font-style: italic;
        margin-top: 0.25rem;
        font-size: 0.875rem;
    }

/* Responsive adjustments */
@media (max-width: 768px) {
    [b-ljgni9gvsn] .prompt-field-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    [b-ljgni9gvsn] .prompt-actions {
        align-self: flex-end;
    }

    [b-ljgni9gvsn] .ai-prompt-textarea {
        font-size: 1rem; /* Better for mobile */
        min-height: 120px;
    }
}

/* Dark theme specific adjustments */
@media (prefers-color-scheme: dark) {
    [b-ljgni9gvsn] .ai-prompt-textarea {
        background-color: var(--kendo-color-base);
        color: var(--kendo-color-on-base);
    }

    [b-ljgni9gvsn] .char-warning {
        color: var(--kendo-color-warning-emphasis);
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    [b-ljgni9gvsn] .ai-prompt-textarea {
        border-width: 2px;
    }

        [b-ljgni9gvsn] .ai-prompt-textarea:focus {
            border-width: 3px;
            box-shadow: none;
        }
}

/* Animation for smooth transitions */
[b-ljgni9gvsn] .ai-prompt-textarea {
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

    /* Custom scrollbar styling for webkit browsers */
    [b-ljgni9gvsn] .ai-prompt-textarea::-webkit-scrollbar {
        width: 8px;
    }

    [b-ljgni9gvsn] .ai-prompt-textarea::-webkit-scrollbar-track {
        background: var(--kendo-color-base-hover);
        border-radius: 4px;
    }

    [b-ljgni9gvsn] .ai-prompt-textarea::-webkit-scrollbar-thumb {
        background: var(--kendo-color-border);
        border-radius: 4px;
    }

        [b-ljgni9gvsn] .ai-prompt-textarea::-webkit-scrollbar-thumb:hover {
            background: var(--kendo-color-border-alt);
        }

.ai-prompt-help[b-ljgni9gvsn] {
    background: var(--kendo-color-surface-alt, #f8f9fa);
    border: 1px solid var(--kendo-color-border, #dee2e6);
    border-radius: var(--kendo-border-radius-md, 4px);
    padding: 16px;
    margin-bottom: 16px;
}

.help-header[b-ljgni9gvsn] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.help-icon[b-ljgni9gvsn] {
    color: var(--kendo-color-primary, #0078d4);
    flex-shrink: 0;
}

.help-title[b-ljgni9gvsn] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--kendo-color-on-app-surface, #323130);
}

.help-intro[b-ljgni9gvsn] {
    margin: 0 0 12px 0;
    color: var(--kendo-color-on-app-surface, #323130);
    line-height: 1.4;
}

.help-expandable[b-ljgni9gvsn] {
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
}

    .help-expandable.collapsed[b-ljgni9gvsn] {
        max-height: 0;
    }

    .help-expandable.expanded[b-ljgni9gvsn] {
        max-height: 2000px;
    }

.help-full-content[b-ljgni9gvsn] {
    padding-top: 8px;
}

    .help-full-content h5[b-ljgni9gvsn] {
        margin: 16px 0 8px 0;
        font-size: 13px;
        font-weight: 600;
        color: var(--kendo-color-primary, #0078d4);
    }

    .help-full-content h6[b-ljgni9gvsn] {
        margin: 12px 0 6px 0;
        font-size: 12px;
        font-weight: 600;
        color: var(--kendo-color-on-app-surface, #323130);
    }

    .help-full-content p[b-ljgni9gvsn] {
        margin: 0 0 12px 0;
        line-height: 1.4;
        color: var(--kendo-color-on-app-surface, #323130);
    }

.help-list[b-ljgni9gvsn] {
    margin: 8px 0 12px 20px;
    padding: 0;
}

    .help-list li[b-ljgni9gvsn] {
        margin-bottom: 6px;
        line-height: 1.4;
        color: var(--kendo-color-on-app-surface, #323130);
    }

.example-comparison[b-ljgni9gvsn] {
    margin: 12px 0;
}

.example-generic[b-ljgni9gvsn],
.example-specialized[b-ljgni9gvsn] {
    margin-bottom: 16px;
}

.example-comparison blockquote[b-ljgni9gvsn] {
    margin: 6px 0 0 0;
    padding: 12px;
    background: var(--kendo-color-surface, #ffffff);
    border-left: 3px solid var(--kendo-color-border, #dee2e6);
    font-style: italic;
    color: var(--kendo-color-subtle, #605e5c);
}

.example-specialized blockquote[b-ljgni9gvsn] {
    border-left-color: var(--kendo-color-success, #107c10);
}

.help-bottom-line[b-ljgni9gvsn] {
    background: var(--kendo-color-primary-lighter, #f3f9ff);
    border: 1px solid var(--kendo-color-primary-subtle, #c7e0f4);
    border-radius: var(--kendo-border-radius-sm, 2px);
    padding: 12px;
    margin: 16px 0 0 0;
    font-size: 13px;
    line-height: 1.4;
}

.help-toggle[b-ljgni9gvsn] {
    margin-top: 8px;
}

    .help-toggle .k-button-text[b-ljgni9gvsn] {
        font-size: 12px;
    }
/* /Components/Pages/Modules/Requests/Index.razor.rz.scp.css */
/* /Components/Pages/Modules/Schedule/XERViewer/XerGanttViewer.razor.rz.scp.css */
/* ==========================================================================
   XER Gantt Viewer - Final Design Treatment
   Modern, engaging schedule analytics with refined visual hierarchy
   ========================================================================== */

/* ---------------------- Design System Foundation ------------------------- */
:root[b-3yq7osuapa],
:host[b-3yq7osuapa] {
    /* Spacing - Golden ratio based */
    --xer-spacing-xs: .382rem;
    --xer-spacing-sm: .618rem;
    --xer-spacing-md: 1rem;
    --xer-spacing-lg: 1.618rem;
    /* Radius - Subtle contemporary curves */
    --xer-radius-sm: 6px;
    --xer-radius-md: 10px;
    --xer-radius-lg: 16px;
    /* Shadows - Multi-layer depth system */
    --xer-shadow-xs: 0 1px 3px rgba(0,0,0,.04), 0 1px 2px rgba(0,0,0,.06);
    --xer-shadow-sm: 0 2px 4px rgba(0,0,0,.04), 0 2px 8px rgba(0,0,0,.08);
    --xer-shadow-md: 0 4px 6px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.10);
    --xer-shadow-lg: 0 8px 12px rgba(0,0,0,.04), 0 8px 32px rgba(0,0,0,.12);
    --xer-shadow-focus: 0 0 0 3px rgba(99,102,241,.15);
    /* Surfaces - Refined neutrals */
    --xer-surface: #ffffff;
    --xer-surface-alt: #fafbfc;
    --xer-surface-muted: #f4f6f8;
    --xer-surface-raised: #ffffff;
    /* Borders - Subtle definition */
    --xer-border: #e1e4e8;
    --xer-border-strong: #d1d5da;
    --xer-border-focus: #6366f1;
    /* Text - Optimized contrast hierarchy */
    --xer-text: #24292f;
    --xer-text-secondary: #57606a;
    --xer-text-tertiary: #848d97;
    --xer-text-muted: #acb4bf;
    /* Semantic colors - Refined palette */
    --xer-critical: #dc3545;
    --xer-warning: #ffa500;
    --xer-success: #28a745;
    --xer-info: #17a2b8;
    --xer-accent: #6366f1;
    --xer-accent-hover: #5558e3;
    --xer-accent-soft: rgba(99,102,241,.08);
    --xer-accent-glow: rgba(99,102,241,.24);
    /* Animation - Fluid transitions */
    --xer-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --xer-transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --xer-transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);
    /* KPI specific enhancements */
    --kpi-track-light: linear-gradient(90deg, #f0f2f5 0%, #e9ecef 100%);
    --kpi-track-depth: inset 0 1px 3px rgba(0,0,0,.08);
    --kpi-fill-glow: 0 2px 8px;
    /* Grid refinements */
    --xer-grid-header-bg: linear-gradient(180deg, #fafbfc 0%, #f6f8fa 100%);
    --xer-grid-row-hover: rgba(99,102,241,.04);
    --xer-grid-row-selected: rgba(99,102,241,.08);
}

/* Dark theme - Premium dark interface */
@media (prefers-color-scheme: dark) {
    :root[b-3yq7osuapa],
    :host[b-3yq7osuapa] {
        --xer-surface: #0d1117;
        --xer-surface-alt: #161b22;
        --xer-surface-muted: #21262d;
        --xer-surface-raised: #1c2128;
        --xer-border: #30363d;
        --xer-border-strong: #484f58;
        --xer-border-focus: #7c7fff;
        --xer-text: #f0f6fc;
        --xer-text-secondary: #b1bac4;
        --xer-text-tertiary: #8b949e;
        --xer-text-muted: #6e7681;
        --xer-shadow-xs: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.18);
        --xer-shadow-sm: 0 2px 4px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.24);
        --xer-shadow-md: 0 4px 6px rgba(0,0,0,.12), 0 4px 16px rgba(0,0,0,.30);
        --xer-shadow-lg: 0 8px 12px rgba(0,0,0,.12), 0 8px 32px rgba(0,0,0,.36);
        --xer-shadow-focus: 0 0 0 3px rgba(124,127,255,.25);
        --kpi-track-light: linear-gradient(90deg, #1c2128 0%, #21262d 100%);
        --kpi-track-depth: inset 0 1px 3px rgba(0,0,0,.24);
        --xer-grid-header-bg: linear-gradient(180deg, #161b22 0%, #0d1117 100%);
        --xer-grid-row-hover: rgba(124,127,255,.08);
        --xer-grid-row-selected: rgba(124,127,255,.16);
        --xer-accent-soft: rgba(124,127,255,.12);
        --xer-accent-glow: rgba(124,127,255,.32);
    }
}

/* ---------------------- Container Architecture --------------------------- */
.xer-viewer-container[b-3yq7osuapa] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    position: relative;
    background: var(--xer-surface-alt);
    color: var(--xer-text);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    overflow: hidden;
}

    .xer-viewer-container.embedded[b-3yq7osuapa] {
        background: transparent;
        border: 1px solid var(--xer-border);
        border-radius: var(--xer-radius-lg);
        overflow: hidden;        
    }

    /* Loading state container enhancement */
    .xer-viewer-container.is-loading[b-3yq7osuapa] {
        min-height: 500px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

/* ---------------------- Header Design Treatment -------------------------- */
.xer-header[b-3yq7osuapa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--xer-spacing-lg) calc(var(--xer-spacing-lg) * 1.5);
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    box-shadow: var(--xer-shadow-md);
    position: relative;
    overflow: hidden;
}

    /* Subtle animated gradient overlay */
    .xer-header[b-3yq7osuapa]::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, transparent, rgba(255,255,255,.05), transparent);
        animation: shimmer-b-3yq7osuapa 8s ease-in-out infinite;
    }

@keyframes shimmer-b-3yq7osuapa {
    0%, 100% {
        transform: translateX(-100%);
    }

    50% {
        transform: translateX(100%);
    }
}

.xer-title-section[b-3yq7osuapa] {
    display: flex;
    align-items: center;
    gap: var(--xer-spacing-md);
    z-index: 1;
    position: relative;
}

.xer-title-content[b-3yq7osuapa] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.xer-main-title[b-3yq7osuapa] {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: -.02em;
    margin: 0;
    text-shadow: 0 2px 4px rgba(0,0,0,.1);
}

.xer-subtitle[b-3yq7osuapa] {
    font-size: .875rem;
    opacity: .9;
    margin: 0;
    font-weight: 400;
}

.xer-actions[b-3yq7osuapa] {
    display: flex;
    gap: var(--xer-spacing-sm);
    align-items: center;
    z-index: 1;
}

/* ---------------------- KPI Dashboard Excellence ------------------------- */
.xer-kpi-dashboard[b-3yq7osuapa] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--xer-spacing-md);
    padding: var(--xer-spacing-lg);
    background: var(--xer-surface-alt);
}

.kpi-card[b-3yq7osuapa] {
    position: relative;
    background: var(--xer-surface-raised);
    border: 1px solid var(--xer-border);
    border-radius: var(--xer-radius-md);
    box-shadow: var(--xer-shadow-sm);
    transition: all var(--xer-transition-base);
    overflow: hidden;
}

    .kpi-card:hover[b-3yq7osuapa] {
        box-shadow: var(--xer-shadow-md);
        transform: translateY(-2px);
        border-color: var(--xer-accent-soft);
    }

    .kpi-card[b-3yq7osuapa]  .k-card-header {
        padding: var(--xer-spacing-sm) var(--xer-spacing-md);
        background: transparent;
        border-bottom: 1px solid var(--xer-border);
        font-size: .75rem;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: var(--xer-text-tertiary);
    }

    .kpi-card[b-3yq7osuapa]  .k-card-body {
        padding: var(--xer-spacing-md);
        display: flex;
        flex-direction: column;
        gap: var(--xer-spacing-sm);
    }

/* KPI value with refined typography */
.kpi-value[b-3yq7osuapa] {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.03em;
    color: var(--xer-text);
    display: flex;
    align-items: baseline;
    gap: .25rem;
    font-variant-numeric: tabular-nums;
}

.kpi-unit[b-3yq7osuapa] {
    font-size: .875rem;
    font-weight: 400;
    color: var(--xer-text-secondary);
    margin-left: .125rem;
}

.kpi-detail[b-3yq7osuapa] {
    font-size: .75rem;
    color: var(--xer-text-tertiary);
}

/* Enhanced progress bars with depth */
.kpi-progress-bar[b-3yq7osuapa] {
    position: relative;
    height: 8px;
    border-radius: 999px;
    background: var(--kpi-track-light);
    box-shadow: var(--kpi-track-depth);
    overflow: hidden;
}

.kpi-progress-fill[b-3yq7osuapa] {
    position: absolute;
    inset: 0;
    width: calc(var(--p, 0) * 1%);
    max-width: 100%;
    border-radius: inherit;
    transition: width .6s cubic-bezier(0.4, 0, 0.2, 1);
    transform-origin: left center;
    animation: fillEnter-b-3yq7osuapa .6s ease-out;
}

@keyframes fillEnter-b-3yq7osuapa {
    from {
        transform: scaleX(0);
        opacity: 0;
    }

    to {
        transform: scaleX(1);
        opacity: 1;
    }
}

/* Gradient fills with glow effects */
.kpi-progress-fill.accent[b-3yq7osuapa] {
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
    box-shadow: var(--kpi-fill-glow) rgba(102,126,234,.3);
}

.kpi-progress-fill.positive[b-3yq7osuapa] {
    background: linear-gradient(90deg, #11998e 0%, #38ef7d 100%);
    box-shadow: var(--kpi-fill-glow) rgba(56,239,125,.3);
}

.kpi-progress-fill.negative[b-3yq7osuapa] {
    background: linear-gradient(90deg, #eb3349 0%, #f45c43 100%);
    box-shadow: var(--kpi-fill-glow) rgba(244,92,67,.3);
}

/* Refined inline chips */
.kpi-inline-chip[b-3yq7osuapa] {
    position: absolute;
    right: var(--xer-spacing-xs);
    top: 50%;
    transform: translateY(-50%);
    padding: 2px 8px;
    border-radius: 999px;
    font-size: .625rem;
    font-weight: 600;
    letter-spacing: .025em;
    backdrop-filter: blur(8px);
    z-index: 2;
}

    .kpi-inline-chip.positive[b-3yq7osuapa] {
        background: rgba(40,167,69,.12);
        color: #28a745;
        border: 1px solid rgba(40,167,69,.2);
    }

    .kpi-inline-chip.negative[b-3yq7osuapa] {
        background: rgba(220,53,69,.12);
        color: #dc3545;
        border: 1px solid rgba(220,53,69,.2);
    }

/* ---------------------- Tab System Refinement ---------------------------- */
.xer-tabs[b-3yq7osuapa] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--xer-surface);
    border-radius: var(--xer-radius-lg) var(--xer-radius-lg) 0 0;
    box-shadow: var(--xer-shadow-sm);
    margin-top: -1px;
    overflow: hidden;
}

    .xer-tabs[b-3yq7osuapa]  .k-tabstrip-items-wrapper {
        background: var(--xer-surface-muted);
        border-bottom: 1px solid var(--xer-border);
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .xer-tabs[b-3yq7osuapa]  .k-tabstrip-items {
        padding: 0 var(--xer-spacing-lg);
        min-height: 48px;
    }

    .xer-tabs[b-3yq7osuapa]  .k-tabstrip-item {
        font-size: .875rem;
        font-weight: 500;
        color: var(--xer-text-secondary);
        padding: 0 var(--xer-spacing-md);
        margin: 0 2px;
        transition: all var(--xer-transition-fast);
        border-radius: var(--xer-radius-sm) var(--xer-radius-sm) 0 0;
    }

        .xer-tabs[b-3yq7osuapa]  .k-tabstrip-item:hover {
            background: var(--xer-surface);
            color: var(--xer-text);
        }

        .xer-tabs[b-3yq7osuapa]  .k-tabstrip-item.k-active {
            background: var(--xer-surface);
            color: var(--xer-accent);
            border-bottom: 2px solid var(--xer-accent);
            font-weight: 600;
        }

    /* Critical: Tab content area with proper scroll handling */
    .xer-tabs[b-3yq7osuapa]  .k-tabstrip-content {
        flex: 1;
        min-height: 0;
        background: var(--xer-surface);
        padding: 0;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    /* Each tab panel becomes scrollable container */
    .xer-tabs[b-3yq7osuapa]  .k-tabstrip-tabpanel {
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
        padding: var(--xer-spacing-lg);
    }

        /* Custom scrollbar styling */
        .xer-tabs[b-3yq7osuapa]  .k-tabstrip-tabpanel::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }

        .xer-tabs[b-3yq7osuapa]  .k-tabstrip-tabpanel::-webkit-scrollbar-track {
            background: var(--xer-surface-muted);
            border-radius: 4px;
        }

        .xer-tabs[b-3yq7osuapa]  .k-tabstrip-tabpanel::-webkit-scrollbar-thumb {
            background: var(--xer-border-strong);
            border-radius: 4px;
        }

            .xer-tabs[b-3yq7osuapa]  .k-tabstrip-tabpanel::-webkit-scrollbar-thumb:hover {
                background: var(--xer-accent);
            }

/* ---------------------- Section Headers with Impact ---------------------- */
.section-header[b-3yq7osuapa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--xer-spacing-sm) var(--xer-spacing-md);
    background: var(--xer-grid-header-bg);
    border: 1px solid var(--xer-border);
    border-radius: var(--xer-radius-sm);
    margin-bottom: var(--xer-spacing-md);
    position: sticky;
    top: 0;
    z-index: 10;
    backdrop-filter: blur(8px);
}

.section-title[b-3yq7osuapa] {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--xer-text-secondary);
}

.section-actions[b-3yq7osuapa] {
    display: flex;
    gap: var(--xer-spacing-xs);
    align-items: center;
}

/* ---------------------- Data Grids & Tables ------------------------------ */
.gantt-container[b-3yq7osuapa],
.resource-container[b-3yq7osuapa],
.critical-path-container[b-3yq7osuapa],
.wbs-container[b-3yq7osuapa] {
    background: var(--xer-surface);
    border: 1px solid var(--xer-border);
    border-radius: var(--xer-radius-md);
    box-shadow: var(--xer-shadow-xs);
    overflow: hidden;    
}

    /* Gantt specific enhancements */
    .gantt-container[b-3yq7osuapa]  .k-gantt {
        border: none;
        font-size: .875rem;        
    }

    .gantt-container[b-3yq7osuapa]  .k-gantt-toolbar {
        background: var(--xer-grid-header-bg);
        border-bottom: 1px solid var(--xer-border);
        padding: var(--xer-spacing-sm);
    }

    .gantt-container[b-3yq7osuapa]  .k-gantt-treelist .k-table-row:hover {
        background: var(--xer-grid-row-hover);
    }

    .gantt-container[b-3yq7osuapa]  .k-gantt-treelist .k-table-row.k-selected {
        background: var(--xer-grid-row-selected);        
    }

/* Grid headers refinement */
[b-3yq7osuapa] .k-grid-header,
[b-3yq7osuapa] .k-treelist-header {
    background: var(--xer-grid-header-bg);
    border-bottom: 1px solid var(--xer-border-strong);
}

    [b-3yq7osuapa] .k-grid-header th,
    [b-3yq7osuapa] .k-treelist-header th {
        font-weight: 600;
        font-size: .75rem;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: var(--xer-text-secondary);
    }

/* --- WBS Enhancements ---------------------------------------------------- */
.wbs-actions[b-3yq7osuapa] {
    display: flex;
    gap: var(--xer-spacing-xs);
    flex-wrap: wrap;
}

.wbs-container.wbs-density-compact[b-3yq7osuapa] {
    height: clamp(340px,56vh,720px);
    overflow:auto;
}

.wbs-container.wbs-density-compact .wbs-node[b-3yq7osuapa] {
    padding: .35rem .5rem;
    gap: .35rem;
    line-height: .15;    
}

.wbs-container.wbs-density-comfort .wbs-node[b-3yq7osuapa] {
    padding: .55rem .75rem;
}

.wbs-tree[b-3yq7osuapa]  .k-treeview-leaf,
.wbs-tree[b-3yq7osuapa]  .k-treeview-mid,
.wbs-tree[b-3yq7osuapa]  .k-treeview-top,
.wbs-tree[b-3yq7osuapa]  .k-treeview-bot {
    background: transparent;    
}

/* Node wrapper */
.wbs-node[b-3yq7osuapa] {
    position: relative;
    display: flex;
    flex-direction: column;
    border-left: 3px solid transparent;
    border-radius: 6px;
    transition: background var(--xer-transition-fast), border-color var(--xer-transition-fast);
    cursor: pointer;
    --depth-indent: calc(var(--wbs-depth, 0) * 12px);
    margin-left: var(--depth-indent);
}

/* Depth guide subtle vertical rule */
.wbs-node-main[b-3yq7osuapa] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;    
}

.wbs-depth-guide[b-3yq7osuapa] {
    position: absolute;
    inset: 0 auto 0 0;
    width: 2px;
    background: linear-gradient(to bottom, var(--xer-border) 20%, transparent 95%);
    opacity: .35;
    transform: translateX(calc(-1 * (var(--wbs-depth, 0) * 0px)));
    pointer-events: none;
}

/* Hierarchical salience (font-weight + subtle color scaling) */
.wbs-node[style*="--wbs-depth:0"] .wbs-name[b-3yq7osuapa] {
    font-weight: 600;
    font-size: 1.0rem;
}

.wbs-node[style*="--wbs-depth:1"] .wbs-name[b-3yq7osuapa] {
    font-weight: 600;
}

.wbs-node[style*="--wbs-depth:2"] .wbs-name[b-3yq7osuapa] {
    font-weight: 500;
}

.wbs-node[style*="--wbs-depth:3"] .wbs-name[b-3yq7osuapa] {
    font-weight: 500;
    opacity: .95;
}

.wbs-node[style*="--wbs-depth:4"] .wbs-name[b-3yq7osuapa] {
    font-weight: 500;
    opacity: .90;
}

.wbs-node[style*="--wbs-depth:5"] .wbs-name[b-3yq7osuapa] {
    font-weight: 500;
    opacity: .85;
}

.wbs-code[b-3yq7osuapa] {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: 2px 6px;
    background: var(--xer-surface-muted);
    border: 1px solid var(--xer-border);
    border-radius: 4px;
    color: var(--xer-text-tertiary);
}

.wbs-name[b-3yq7osuapa] {
    white-space: nowrap;
    font-size: 1rem;
    max-width: 420px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Metrics cluster */
.wbs-primary-metrics[b-3yq7osuapa] {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
    font-size: 0.9rem;
}

.wbs-chip[b-3yq7osuapa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .725rem;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 999px;
    line-height: 1.1;
    letter-spacing: .025em;
    background: var(--xer-surface-muted);
    border: 1px solid var(--xer-border);
    position: relative;
}

    .wbs-chip.progress[b-3yq7osuapa] {
        padding-right: 6px;
    }

        .wbs-chip.progress .bar[b-3yq7osuapa] {
            position: relative;
            width: 48px;
            height: 6px;
            background: var(--kpi-track-light);
            border-radius: 4px;
            overflow: hidden;
        }

        .wbs-chip.progress .fill[b-3yq7osuapa] {
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg,#667eea,#764ba2);
            transition: width .5s;
        }

        .wbs-chip.progress .val[b-3yq7osuapa] {
            font-size: .6rem;
            font-weight: 600;
        }

    .wbs-chip.duration[b-3yq7osuapa] {
        background: rgba(99,102,241,.08);
        border-color: rgba(99,102,241,.25);
        color: var(--xer-accent);
    }

    .wbs-chip.variance.cv-positive[b-3yq7osuapa] {
        background: rgba(40,167,69,.15);
        border-color: rgba(40,167,69,.35);
        color: #1e8040;
    }

    .wbs-chip.variance.cv-negative[b-3yq7osuapa] {
        background: rgba(220,53,69,.15);
        border-color: rgba(220,53,69,.35);
        color: #b01f2d;
    }

/* Critical / At-Risk visual emphasis */
.wbs-node.is-critical[b-3yq7osuapa] {
    border-left-color: #dc3545;
    background: linear-gradient(90deg, rgba(220,53,69,.10), transparent);
}

.wbs-node.is-at-risk:not(.is-critical)[b-3yq7osuapa] {
    border-left-color: #ffa500;
    background: linear-gradient(90deg, rgba(255,165,0,.10), transparent);
}

.wbs-node:hover[b-3yq7osuapa] {
    background: var(--xer-surface-muted);
}

/* Secondary metrics panel (progressively disclosed) */
.wbs-node-secondary[b-3yq7osuapa] {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(120px,1fr));
    gap: .35rem .75rem;
    margin-top: .25rem;
    padding-left: calc(var(--wbs-depth,0)*12px);
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity var(--xer-transition-fast), max-height var(--xer-transition-fast);
    font-size: .65rem;
}

.wbs-node:hover .wbs-node-secondary[b-3yq7osuapa] {
    opacity: 1;
    max-height: 80px;
}

.wbs-node-secondary label[b-3yq7osuapa] {
    font-size: .55rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--xer-text-tertiary);
    margin-right: 2px;
    font-weight: 600;
}

.wbs-detail-card .detail-grid .detail-item[b-3yq7osuapa] {
    display: flex;
    gap: .35rem;
    align-items: center;
    font-size: .75rem;
}

.wbs-detail-card .detail-item label[b-3yq7osuapa] {
    font-size: .625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--xer-text-tertiary);
    width: 90px;
}

.mini-progress[b-3yq7osuapa] {
    display: flex;
    align-items: center;
    gap: .4rem;
}

    .mini-progress .track[b-3yq7osuapa] {
        width: 110px;
        height: 6px;
        background: var(--kpi-track-light);
        border-radius: 4px;
        position: relative;
        overflow: hidden;
    }

    .mini-progress .fill[b-3yq7osuapa] {
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg,#667eea,#764ba2);
        transition: width .6s;
    }

/* Density adjustments */
.wbs-density-compact .wbs-node[b-3yq7osuapa] {
    font-size: .70rem;
}

.wbs-density-compact .wbs-chip[b-3yq7osuapa] {
    font-size: .55rem;
}

.wbs-density-compact .wbs-node-secondary[b-3yq7osuapa] {
    font-size: .58rem;
}

/* Focus ring accessibility */
.wbs-node:focus-within[b-3yq7osuapa],
.wbs-node:focus[b-3yq7osuapa] {
    outline: 2px solid var(--xer-accent);
    outline-offset: 2px;
}

/* Dark theme tweaks inherit existing palette */
@media (prefers-color-scheme: dark) {
    .wbs-node-secondary label[b-3yq7osuapa] {
        color: var(--xer-text-tertiary);
    }
}

/* ---------------------- Float/Status Badges ------------------------------ */
.float-negative[b-3yq7osuapa],
.float-critical[b-3yq7osuapa],
.float-near-critical[b-3yq7osuapa],
.float-normal[b-3yq7osuapa] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: .625rem;
    font-weight: 600;
    line-height: 1.2;
    min-width: 36px;
    text-align: center;
    letter-spacing: .025em;
}

.float-negative[b-3yq7osuapa] {
    background: rgba(220,53,69,.12);
    color: #dc3545;
    border: 1px solid rgba(220,53,69,.2);
}

.float-critical[b-3yq7osuapa] {
    background: rgba(255,165,0,.12);
    color: #ffa500;
    border: 1px solid rgba(255,165,0,.2);
}

.float-near-critical[b-3yq7osuapa] {
    background: rgba(255,193,7,.12);
    color: #ffc107;
    border: 1px solid rgba(255,193,7,.2);
}

.float-normal[b-3yq7osuapa] {
    background: rgba(40,167,69,.12);
    color: #28a745;
    border: 1px solid rgba(40,167,69,.2);
}

/* ---------------------- Loading State Animation -------------------------- */
.xer-loading-overlay[b-3yq7osuapa] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--xer-surface-alt);
    backdrop-filter: blur(8px);
    z-index: 100;
}

.loading-panel[b-3yq7osuapa] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--xer-spacing-md);
    padding: calc(var(--xer-spacing-lg) * 1.5);
    background: var(--xer-surface-raised);
    border: 1px solid var(--xer-border);
    border-radius: var(--xer-radius-lg);
    box-shadow: var(--xer-shadow-lg);
}

.loading-text[b-3yq7osuapa] {
    font-size: .875rem;
    color: var(--xer-text-secondary);
    animation: pulse-b-3yq7osuapa 2s ease-in-out infinite;
}

@keyframes pulse-b-3yq7osuapa {
    0%, 100% {
        opacity: .5;
    }

    50% {
        opacity: 1;
    }
}

/* ---------------------- Interaction States ------------------------------- */
.busy-overlay[b-3yq7osuapa] {
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,.8);
    backdrop-filter: blur(4px);
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn var(--xer-transition-fast);
}

    .busy-overlay.transient[b-3yq7osuapa] {
        background: rgba(255,255,255,.4);
    }

.busy-content[b-3yq7osuapa] {
    display: flex;
    align-items: center;
    gap: var(--xer-spacing-sm);
    padding: var(--xer-spacing-sm) var(--xer-spacing-md);
    background: var(--xer-surface-raised);
    border: 1px solid var(--xer-border);
    border-radius: var(--xer-radius-md);
    box-shadow: var(--xer-shadow-md);
    font-size: .875rem;
    color: var(--xer-text-secondary);
}

/* ---------------------- Responsive & Polish ------------------------------ */
@media (max-width: 768px) {
    .xer-kpi-dashboard[b-3yq7osuapa] {
        grid-template-columns: 1fr;
        padding: var(--xer-spacing-md);
    }

    .kpi-value[b-3yq7osuapa] {
        font-size: 1.75rem;
    }

    .xer-header[b-3yq7osuapa] {
        flex-direction: column;
        gap: var(--xer-spacing-md);
        text-align: center;
    }
}

/* Focus states for accessibility */
:focus-visible[b-3yq7osuapa] {
    outline: 2px solid var(--xer-border-focus);
    outline-offset: 2px;
    border-radius: var(--xer-radius-sm);
}

/* Smooth animations */
*[b-3yq7osuapa] {
    scroll-behavior: smooth;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *[b-3yq7osuapa],
    *[b-3yq7osuapa]::before,
    *[b-3yq7osuapa]::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Print optimization */
@media print {
    .xer-header[b-3yq7osuapa],
    .section-actions[b-3yq7osuapa],
    .busy-overlay[b-3yq7osuapa] {
        display: none !important;
    }

    .xer-viewer-container[b-3yq7osuapa] {
        background: white;
    }
}

/* Final polish: subtle texture overlay for depth */
.xer-viewer-container[b-3yq7osuapa]::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: repeating-linear-gradient( 45deg, transparent, transparent 35px, rgba(255,255,255,.01) 35px, rgba(255,255,255,.01) 70px );
    pointer-events: none;
    opacity: 0.5;
}
/* /Components/Pages/Modules/Schedule/XERViewer/XERViewer.razor.rz.scp.css */
/* Wrapper page specific overrides (optional) */
:root[b-ikswporqii] {
}
/* /Components/Pages/Modules/Search/Index.razor.rz.scp.css */
body[b-j5a72ohlbv] {
}
/* /Components/Pages/Modules/Submittals/Detail.razor.rz.scp.css */
/* /Components/Pages/NotFound.razor.rz.scp.css */
/* 404 Not Found Page - Enterprise Grade Styling */
.notfound-page[b-91pmlomnm1] {
    --nf-bg: var(--kendo-color-surface);
    --nf-fg: var(--kendo-color-on-app-surface);
    --nf-muted: var(--kendo-color-subtle);
    --nf-border: var(--kendo-color-border);
    --nf-accent: #f59e0b;
    --nf-accent-light: #fbbf24;
    --nf-card-bg: var(--kendo-color-surface-alt);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: linear-gradient(135deg, color-mix(in oklab, var(--nf-bg), transparent 60%) 0%, color-mix(in oklab, var(--nf-accent), transparent 95%) 100%);
}

/* Main Container */
.notfound-container[b-91pmlomnm1] {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* Hero Section */
.notfound-hero[b-91pmlomnm1] {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 4rem;
    align-items: center;
    margin-bottom: 3rem;
}

/* Illustration Container */
.illustration-container[b-91pmlomnm1] {
    position: relative;
    width: 100%;
    max-width: 500px;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notfound-illustration[b-91pmlomnm1] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.1));
    animation: float-b-91pmlomnm1 6s ease-in-out infinite;
}

.illustration-overlay[b-91pmlomnm1] {
    position: absolute;
    inset: -20%;
    background: radial-gradient(circle at center, color-mix(in oklab, var(--nf-accent), transparent 90%) 0%, transparent 70%);
    filter: blur(60px);
    opacity: 0.3;
    animation: pulse-b-91pmlomnm1 4s ease-in-out infinite;
}

/* Content Section */
.notfound-content[b-91pmlomnm1] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.notfound-badge[b-91pmlomnm1] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.5rem 1rem;
    background: color-mix(in oklab, var(--nf-accent), transparent 85%);
    color: var(--nf-accent);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    border-radius: 100px;
    animation: slideIn-b-91pmlomnm1 0.6s ease-out;
}

.notfound-title[b-91pmlomnm1] {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    color: var(--nf-fg);
    line-height: 1.2;
    letter-spacing: -0.02em;
    animation: slideIn-b-91pmlomnm1 0.6s ease-out 0.1s both;
}

.notfound-description[b-91pmlomnm1] {
    font-size: 1.125rem;
    line-height: 1.7;
    color: var(--nf-muted);
    max-width: 600px;
    animation: slideIn-b-91pmlomnm1 0.6s ease-out 0.2s both;
}

/* URL Card */
.url-card[b-91pmlomnm1] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.5rem;
    background: var(--nf-card-bg);
    border: 1px solid var(--nf-border);
    border-radius: 12px;
    animation: slideIn-b-91pmlomnm1 0.6s ease-out 0.3s both;
}

.url-label[b-91pmlomnm1] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--nf-muted);
    letter-spacing: 0.05em;
}

.url-value[b-91pmlomnm1] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .url-value code[b-91pmlomnm1] {
        font-family: ui-monospace, "SF Mono", "Cascadia Code", monospace;
        font-size: 1rem;
        color: var(--nf-fg);
        word-break: break-all;
        flex: 1;
    }

.copy-btn[b-91pmlomnm1] {
    opacity: 0.7;
    transition: opacity 0.2s;
}

    .copy-btn:hover[b-91pmlomnm1] {
        opacity: 1;
    }

/* Action Section */
.action-section[b-91pmlomnm1] {
    display: flex;
    gap: 1rem;
    margin-bottom: 4rem;
    animation: slideIn-b-91pmlomnm1 0.6s ease-out 0.4s both;
}

.action-btn[b-91pmlomnm1] {
    min-width: 180px;
    height: 48px;
    font-weight: 600;
}

    .action-btn.primary[b-91pmlomnm1] {
        background: var(--nf-accent);
        color: white;
    }

        .action-btn.primary:hover[b-91pmlomnm1] {
            background: color-mix(in oklab, var(--nf-accent), black 10%);
        }

/* Info Section */
.info-section[b-91pmlomnm1] {
    margin-bottom: 3rem;
    animation: fadeIn-b-91pmlomnm1 0.8s ease-out 0.5s both;
}

.info-grid[b-91pmlomnm1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.info-card[b-91pmlomnm1] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    background: var(--nf-card-bg);
    border: 1px solid var(--nf-border);
    border-radius: 12px;
    transition: transform 0.2s, box-shadow 0.2s;
}

    .info-card:hover[b-91pmlomnm1] {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }

.info-icon[b-91pmlomnm1] {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: var(--nf-accent);
}

.info-content[b-91pmlomnm1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.info-label[b-91pmlomnm1] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--nf-muted);
    letter-spacing: 0.05em;
}

.info-value[b-91pmlomnm1] {
    font-size: 1rem;
    color: var(--nf-fg);
    font-weight: 500;
}

/* Quick Links Section */
.quicklinks-section[b-91pmlomnm1] {
    padding: 2rem;
    background: var(--nf-card-bg);
    border: 1px solid var(--nf-border);
    border-radius: 16px;
    animation: fadeIn-b-91pmlomnm1 0.8s ease-out 0.6s both;
}

.quicklinks-title[b-91pmlomnm1] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--nf-fg);
    margin-bottom: 1.5rem;
}

.quicklinks-grid[b-91pmlomnm1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.quicklink-item[b-91pmlomnm1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--nf-bg);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.875rem;
    color: var(--nf-muted);
}

    .quicklink-item:hover[b-91pmlomnm1] {
        background: color-mix(in oklab, var(--nf-accent), transparent 90%);
        color: var(--nf-fg);
        transform: translateX(4px);
    }

.quicklink-icon[b-91pmlomnm1] {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: var(--nf-accent);
    transition: color 0.2s;
}

.quicklink-item:hover .quicklink-icon[b-91pmlomnm1] {
    color: var(--nf-accent);
}

/* Development Section */
.dev-section[b-91pmlomnm1] {
    margin-top: 4rem;
    width: 100%;
    max-width: 1200px;
    animation: fadeIn-b-91pmlomnm1 0.8s ease-out 0.7s both;
}

.dev-card[b-91pmlomnm1] {
    border: 2px dashed var(--nf-accent);
    background: color-mix(in oklab, var(--nf-card-bg), transparent 50%);
}

.dev-header[b-91pmlomnm1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.dev-icon[b-91pmlomnm1] {
    color: var(--nf-accent);
}

.dev-title[b-91pmlomnm1] {
    flex: 1;
    font-weight: 600;
    color: var(--nf-fg);
}

.dev-grid[b-91pmlomnm1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.dev-detail[b-91pmlomnm1] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.5rem;
    background: var(--nf-bg);
    border-radius: 6px;
}

.dev-label[b-91pmlomnm1] {
    font-size: 0.875rem;
    color: var(--nf-muted);
    font-weight: 500;
}

.dev-detail code[b-91pmlomnm1] {
    font-family: ui-monospace, "SF Mono", "Cascadia Code", monospace;
    font-size: 0.875rem;
    color: var(--nf-fg);
    word-break: break-all;
}

.dev-actions[b-91pmlomnm1] {
    display: flex;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--nf-border);
}

/* Animations */
@keyframes float-b-91pmlomnm1 {
    0%, 100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-20px);
    }
}

@keyframes pulse-b-91pmlomnm1 {
    0%, 100% {
        opacity: 0.3;
        transform: scale(1);
    }

    50% {
        opacity: 0.5;
        transform: scale(1.1);
    }
}

@keyframes slideIn-b-91pmlomnm1 {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeIn-b-91pmlomnm1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Responsive Design */
@media (max-width: 968px) {
    .notfound-hero[b-91pmlomnm1] {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 2rem;
    }

    .illustration-container[b-91pmlomnm1] {
        max-width: 350px;
        margin: 0 auto;
    }

    .notfound-content[b-91pmlomnm1] {
        align-items: center;
    }

    .notfound-description[b-91pmlomnm1] {
        text-align: center;
    }

    .url-card[b-91pmlomnm1] {
        align-self: center;
    }

    .action-section[b-91pmlomnm1] {
        justify-content: center;
        flex-wrap: wrap;
    }

    .info-grid[b-91pmlomnm1] {
        grid-template-columns: 1fr;
    }

    .quicklinks-grid[b-91pmlomnm1] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 480px) {
    .notfound-page[b-91pmlomnm1] {
        padding: 1rem;
    }

    .notfound-hero[b-91pmlomnm1] {
        gap: 1.5rem;
    }

    .action-btn[b-91pmlomnm1] {
        width: 100%;
    }

    .quicklinks-grid[b-91pmlomnm1] {
        grid-template-columns: 1fr;
    }

    .url-value[b-91pmlomnm1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .copy-btn[b-91pmlomnm1] {
        align-self: flex-start;
    }
}

/* Dark Theme Adjustments */
@media (prefers-color-scheme: dark) {
    .notfound-page[b-91pmlomnm1] {
        --nf-accent: #fbbf24;
        --nf-accent-light: #fde68a;
    }

    .notfound-illustration[b-91pmlomnm1] {
        opacity: 0.9;
    }
}
/* /Components/Shared/AIAgentConsole.razor.rz.scp.css */
/* ===================================================================
   AI AGENT CONSOLE COMPONENT STYLES
   Organization: Base → Layout → Components → States → Themes
   =================================================================== */

/* ===================================================================
   BASE STYLES
   =================================================================== */
.ai-agent-console[b-7n9vcli85f] {
    height: 100%;
    width: 100%;
    display: flex;
    background: var(--kendo-color-surface);
}

/* ===================================================================
   LAYOUT STRUCTURE
   =================================================================== */

/* Chat Container Layout */
.chat-container[b-7n9vcli85f] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Header Section */
.chat-header[b-7n9vcli85f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface-alt);
}

.chat-title[b-7n9vcli85f] {
    flex: 0 0 auto;
    font-weight: 600;
    font-size: 1.1rem;
}

.chat-header-controls[b-7n9vcli85f] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    justify-content: flex-end;
}

.message-author[b-7n9vcli85f] {
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
}

.message-time[b-7n9vcli85f] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

/* ===================================================================
   HEADER COMPONENTS
   =================================================================== */

/* System Selector */
.system-selector-wrapper[b-7n9vcli85f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ai-system-dropdown[b-7n9vcli85f] {
    min-width: 180px;
}

/* Prompt Picker */
.prompt-picker-wrapper[b-7n9vcli85f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.prompt-template-dropdown[b-7n9vcli85f] {
    min-width: 200px;
}

/* Dropdown Styling */
[b-7n9vcli85f] .prompt-group-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-weight: 600;
    background: var(--kendo-color-base-subtle);
    color: var(--kendo-color-on-app-surface);
    border-bottom: 1px solid var(--kendo-color-border);
    pointer-events: none;
}

[b-7n9vcli85f] .prompt-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

    [b-7n9vcli85f] .prompt-item:hover {
        background: var(--kendo-color-base-hover);
    }

[b-7n9vcli85f] .k-list-item.k-disabled .prompt-item {
    cursor: default;
    opacity: 0.6;
    font-style: italic;
}

    [b-7n9vcli85f] .k-list-item.k-disabled .prompt-item:hover {
        background: transparent;
    }

/* ===================================================================
   CHAT MESSAGES AREA
   =================================================================== */

.chat-messages[b-7n9vcli85f] {
    flex: 1;
    overflow-y: auto;
    padding: 0rem;
    background: var(--kendo-color-app-surface);
}

.message-item-container[b-7n9vcli85f] {
    background: var(--kendo-color-app-surface);
}

/* Message Container */
.message-item[b-7n9vcli85f] {
    display: flex;
    gap: 0.75rem;
    padding: .75rem;
    margin-bottom: 1.5rem;
    animation: fadeIn-b-7n9vcli85f 0.3s ease-in;
}

.user-message[b-7n9vcli85f] {
    flex-direction: row-reverse;
}

/* Message Avatar */
.message-avatar[b-7n9vcli85f] {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
}

.ai-message .message-avatar[b-7n9vcli85f] {
    background: var(--kendo-color-primary-subtle);
    color: var(--kendo-color-on-app-surface);
}

/* Message Content */
.message-content[b-7n9vcli85f] {
    flex: 1;
    max-width: 70%;
}

.user-message .message-content[b-7n9vcli85f] {
    text-align: right;
}

.message-header[b-7n9vcli85f] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

.user-message .message-header[b-7n9vcli85f] {
    justify-content: flex-end;
}

/* Message Text Bubble */
.message-text[b-7n9vcli85f] {
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background: var(--kendo-color-base-subtle);
    color: var(--kendo-color-on-app-surface);
    word-wrap: break-word;
}

.user-message .message-text[b-7n9vcli85f] {
    background: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
}

/* Message Attachments */
.message-attachments[b-7n9vcli85f] {
    margin-top: 0.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.user-message .message-attachments[b-7n9vcli85f] {
    justify-content: flex-end;
}

/* ===================================================================
   MARKDOWN CONTENT STYLES
   =================================================================== */

[b-7n9vcli85f] .message-text.markdown-content {
    line-height: 1.6;
}

    /* Headings */
    [b-7n9vcli85f] .message-text.markdown-content h1,
    [b-7n9vcli85f] .message-text.markdown-content h2,
    [b-7n9vcli85f] .message-text.markdown-content h3,
    [b-7n9vcli85f] .message-text.markdown-content h4,
    [b-7n9vcli85f] .message-text.markdown-content h5,
    [b-7n9vcli85f] .message-text.markdown-content h6 {
        margin-top: 1em;
        margin-bottom: 0.5em;
        font-weight: 600;
        line-height: 1.25;
    }

    [b-7n9vcli85f] .message-text.markdown-content h1 {
        font-size: 1.5em;
    }

    [b-7n9vcli85f] .message-text.markdown-content h2 {
        font-size: 1.3em;
    }

    [b-7n9vcli85f] .message-text.markdown-content h3 {
        font-size: 1.1em;
    }

    /* Paragraphs */
    [b-7n9vcli85f] .message-text.markdown-content p {
        margin-top: 0;
        margin-bottom: 0.75em;
    }

        [b-7n9vcli85f] .message-text.markdown-content p:last-child {
            margin-bottom: 0;
        }

    /* Code */
    [b-7n9vcli85f] .message-text.markdown-content code {
        background-color: rgba(0, 0, 0, 0.08);
        padding: 0.2em 0.4em;
        border-radius: 3px;
        font-family: 'Courier New', Courier, monospace;
        font-size: 0.85em;
    }

    [b-7n9vcli85f] .message-text.markdown-content pre {
        background-color: rgba(0, 0, 0, 0.05);
        padding: 0.75em;
        border-radius: 6px;
        overflow-x: auto;
        margin: 0.75em 0;
    }

        [b-7n9vcli85f] .message-text.markdown-content pre code {
            background-color: transparent;
            padding: 0;
            font-size: 0.85em;
        }

    /* Blockquotes */
    [b-7n9vcli85f] .message-text.markdown-content blockquote {
        border-left: 3px solid var(--kendo-color-primary);
        margin: 0.75em 0;
        padding-left: 0.75em;
        color: inherit;
        opacity: 0.8;
    }

    /* Lists */
    [b-7n9vcli85f] .message-text.markdown-content ul,
    [b-7n9vcli85f] .message-text.markdown-content ol {
        margin: 0.5em 0;
        padding-left: 1.5em;
    }

    [b-7n9vcli85f] .message-text.markdown-content li {
        margin-bottom: 0.25em;
    }

    /* Tables */
    [b-7n9vcli85f] .message-text.markdown-content table {
        border-collapse: collapse;
        width: 100%;
        margin: 0.75em 0;
    }

        [b-7n9vcli85f] .message-text.markdown-content table th,
        [b-7n9vcli85f] .message-text.markdown-content table td {
            border: 1px solid var(--kendo-color-border);
            padding: 0.5em;
            text-align: left;
        }

        [b-7n9vcli85f] .message-text.markdown-content table th {
            background-color: rgba(0, 0, 0, 0.05);
            font-weight: 600;
        }

    /* Horizontal Rules */
    [b-7n9vcli85f] .message-text.markdown-content hr {
        border: 0;
        border-top: 1px solid var(--kendo-color-border);
        margin: 1em 0;
    }

    /* Links */
    [b-7n9vcli85f] .message-text.markdown-content a {
        color: var(--kendo-color-primary);
        text-decoration: underline;
    }

        [b-7n9vcli85f] .message-text.markdown-content a:hover {
            text-decoration: none;
        }

    /* Text Formatting */
    [b-7n9vcli85f] .message-text.markdown-content strong {
        font-weight: 600;
    }

    [b-7n9vcli85f] .message-text.markdown-content em {
        font-style: italic;
    }

/* ===================================================================
   CHAT INPUT SECTION
   =================================================================== */

.chat-input-container[b-7n9vcli85f] {
    border-top: 1px solid var(--kendo-color-border);
    padding: 1rem 1.5rem 1.5rem;
    background: var(--kendo-color-surface);
}

.processing-indicator[b-7n9vcli85f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    color: var(--kendo-color-primary);
}

/* Chat Input Wrapper - Grid Layout */
.chat-input-wrapper.grid-3x2[b-7n9vcli85f] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas:
        "input input input"
        "left  center right";
    gap: 8px 8px;
    padding: 6px 10px;
    border-radius: 24px;
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

    .chat-input-wrapper.grid-3x2:focus-within[b-7n9vcli85f] {
        border-color: var(--kendo-color-primary);
        box-shadow: 0 2px 12px rgba(var(--kendo-color-primary-rgb), 0.15);
    }

/* Grid areas */
.ci-input[b-7n9vcli85f] {
    grid-area: input;
}

.ci-left[b-7n9vcli85f] {
    grid-area: left;
    display: flex;
    align-items: center;
    gap: 6px;
    align-self: end;
}

.ci-center[b-7n9vcli85f] {
    grid-area: center;
    min-height: 1px;
}

.ci-right[b-7n9vcli85f] {
    grid-area: right;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-end;
    align-self: end;
}

/* Textarea */
.ci-input[b-7n9vcli85f]  .chat-textarea-auto,
.ci-input[b-7n9vcli85f]  .k-textarea,
.ci-input[b-7n9vcli85f]  .k-input-inner {
    width: 100%;
    resize: vertical;
    min-height: 48px;
    max-height: 200px;
    padding: 6px 2px;
    background: transparent;
    border: none;
    color: var(--kendo-color-on-app-surface);
}

/* Buttons */
.ci-btn[b-7n9vcli85f] {
    min-width: 32px;
    padding: 4px 6px;
    line-height: 1;
}

.send-btn[b-7n9vcli85f] {
    box-shadow: 0 0 0 1px var(--kendo-color-primary);
}

    .send-btn:hover:not(.k-disabled)[b-7n9vcli85f] {
        transform: scale(1.05);
    }

.deep-reasoning-active[b-7n9vcli85f] {
    outline: 1px solid var(--kendo-color-tertiary);
}

/* Dividers */
.chat-divider[b-7n9vcli85f] {
    width: 1px;
    height: 20px;
    background: var(--kendo-color-border);
    margin: 0 4px;
}

/* Model Indicator */
.chat-model-indicator[b-7n9vcli85f] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.7rem;
    padding: 4px 8px;
    border-radius: 8px;
    background: var(--kendo-color-base-subtle);
    color: var(--kendo-color-subtle);
    cursor: pointer;
    transition: background 0.15s ease;
    margin-left: 4px;
}

    .chat-model-indicator:hover[b-7n9vcli85f] {
        background: var(--kendo-color-base-hover);
    }

/* Pending Files */
.pending-files.compact[b-7n9vcli85f] {
    margin-top: 0.5rem;
    padding: 0.5rem;
    background: var(--kendo-color-base-subtle);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

/* ===================================================================
   TOOL PANELS
   =================================================================== */

.tool-pane[b-7n9vcli85f] {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: var(--kendo-color-surface-alt);
}

.tool-header[b-7n9vcli85f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

.tool-title[b-7n9vcli85f] {
    flex: 1;
    font-weight: 600;
}

.tool-content[b-7n9vcli85f] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

.tool-panel[b-7n9vcli85f] {
    width: 100%;
    height: 100%;
    transition: opacity 0.2s ease-in-out;
}

.tool-panel-active[b-7n9vcli85f] {
    display: block;
    opacity: 1;
    visibility: visible;
    position: relative;
    z-index: 1;
}

.tool-panel-hidden[b-7n9vcli85f] {
    display: none;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    pointer-events: none;
    z-index: -1;
}

/* ===================================================================
   KNOWLEDGE CALLOUT
   =================================================================== */

.knowledge-callout[b-7n9vcli85f] {
    background: var(--kendo-color-base-subtle);
    color: var(--kendo-color-on-app-surface);
    border-left: 4px solid var(--kendo-color-primary);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    margin-bottom: 1.5rem;
    padding: 1rem;
}

.callout-header[b-7n9vcli85f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.callout-title[b-7n9vcli85f] {
    flex: 1;
    font-weight: 600;
    font-size: 1rem;
}

.callout-content[b-7n9vcli85f] {
    font-size: 0.875rem;
}

.callout-message[b-7n9vcli85f] {
    margin-bottom: 0.75rem;
}

.callout-tips[b-7n9vcli85f] {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem 0;
}

    .callout-tips li[b-7n9vcli85f] {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
    }

.callout-footer[b-7n9vcli85f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--kendo-color-border);
    margin-bottom: 0.75rem;
}

.callout-note[b-7n9vcli85f] {
    color: var(--kendo-color-subtle);
    font-size: 0.8125rem;
}

.callout-actions[b-7n9vcli85f] {
    display: flex;
    gap: 1rem;
}

/* ===================================================================
   ANIMATIONS
   =================================================================== */

@keyframes fadeIn-b-7n9vcli85f {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===================================================================
   RESPONSIVE DESIGN
   =================================================================== */

@media (max-width: 900px) {
    .chat-input-wrapper.grid-3x2[b-7n9vcli85f] {
        grid-template-columns: 1fr auto;
        grid-template-areas:
            "input input"
            "center right";
    }

    .ci-left[b-7n9vcli85f] {
        display: none;
    }

    .ci-center[b-7n9vcli85f] {
        display: none;
    }

    .chat-input-right .chat-model-indicator[b-7n9vcli85f] {
        display: none;
    }
}

@media (max-width: 768px) {
    .chat-header-controls[b-7n9vcli85f] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }

    .system-selector-wrapper[b-7n9vcli85f],
    .prompt-picker-wrapper[b-7n9vcli85f] {
        width: 100%;
    }

    .ai-system-dropdown[b-7n9vcli85f],
    .prompt-template-dropdown[b-7n9vcli85f] {
        width: 100%;
    }
}

/* ===================================================================
   DARK THEME OVERRIDES
   =================================================================== */

/* Chat messages area - use app surface */
.k-theme-dark .chat-messages[b-7n9vcli85f],
[data-theme="dark"] .chat-messages[b-7n9vcli85f] {
    background: var(--kendo-color-app-surface);
}

/* Message container - transparent */
.k-theme-dark .message-item-container[b-7n9vcli85f],
[data-theme="dark"] .message-item-container[b-7n9vcli85f] {
}

/* AI message bubbles - use surface-alt */
.k-theme-dark .ai-message .message-text[b-7n9vcli85f],
[data-theme="dark"] .ai-message .message-text[b-7n9vcli85f] {
    background: var(--kendo-color-surface-alt);
    color: var(--kendo-color-on-app-surface);
    border: 1px solid var(--kendo-color-border);
}

/* User message bubbles - keep primary */
.k-theme-dark .user-message .message-text[b-7n9vcli85f],
[data-theme="dark"] .user-message .message-text[b-7n9vcli85f] {
    background: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
}

/* Chat input wrapper - use surface */
.k-theme-dark .chat-input-wrapper.grid-3x2[b-7n9vcli85f],
[data-theme="dark"] .chat-input-wrapper.grid-3x2[b-7n9vcli85f] {
    background: var(--kendo-color-surface);
    border-color: var(--kendo-color-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

    .k-theme-dark .chat-input-wrapper.grid-3x2:focus-within[b-7n9vcli85f],
    [data-theme="dark"] .chat-input-wrapper.grid-3x2:focus-within[b-7n9vcli85f] {
        border-color: var(--kendo-color-primary);
        box-shadow: 0 2px 12px rgba(var(--kendo-color-primary-rgb), 0.35);
    }

/* Model indicator */
.k-theme-dark .chat-model-indicator[b-7n9vcli85f],
[data-theme="dark"] .chat-model-indicator[b-7n9vcli85f] {
    background: var(--kendo-color-surface-alt);
    color: var(--kendo-color-subtle);
}

    .k-theme-dark .chat-model-indicator:hover[b-7n9vcli85f],
    [data-theme="dark"] .chat-model-indicator:hover[b-7n9vcli85f] {
        background: var(--kendo-color-base-hover);
    }

/* Knowledge callout */
.k-theme-dark .knowledge-callout[b-7n9vcli85f],
[data-theme="dark"] .knowledge-callout[b-7n9vcli85f] {
    background: var(--kendo-color-surface-alt);
    border-left-color: var(--kendo-color-primary);
    border-color: var(--kendo-color-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* Pending files */
.k-theme-dark .pending-files.compact[b-7n9vcli85f],
[data-theme="dark"] .pending-files.compact[b-7n9vcli85f] {
    background: var(--kendo-color-surface-alt);
    border-color: var(--kendo-color-border);
}

/* Markdown content in dark theme */
.k-theme-dark[b-7n9vcli85f]  .message-text.markdown-content code,
[data-theme="dark"][b-7n9vcli85f]  .message-text.markdown-content code {
    background-color: rgba(255, 255, 255, 0.1);
    color: #ffc857;
}

.k-theme-dark[b-7n9vcli85f]  .message-text.markdown-content pre,
[data-theme="dark"][b-7n9vcli85f]  .message-text.markdown-content pre {
    background-color: var(--kendo-color-app-surface);
    border: 1px solid var(--kendo-color-border);
    color: var(--kendo-color-on-app-surface);
}

    .k-theme-dark[b-7n9vcli85f]  .message-text.markdown-content pre code,
    [data-theme="dark"][b-7n9vcli85f]  .message-text.markdown-content pre code {
        background-color: transparent;
        color: var(--kendo-color-on-app-surface);
        border: none;
    }

/* Scrollbars */
.k-theme-dark .chat-messages[b-7n9vcli85f]::-webkit-scrollbar,
[data-theme="dark"] .chat-messages[b-7n9vcli85f]::-webkit-scrollbar {
    width: 8px;
}

.k-theme-dark .chat-messages[b-7n9vcli85f]::-webkit-scrollbar-track,
[data-theme="dark"] .chat-messages[b-7n9vcli85f]::-webkit-scrollbar-track {
    background: var(--kendo-color-app-surface);
}

.k-theme-dark .chat-messages[b-7n9vcli85f]::-webkit-scrollbar-thumb,
[data-theme="dark"] .chat-messages[b-7n9vcli85f]::-webkit-scrollbar-thumb {
    background: var(--kendo-color-border);
    border-radius: 4px;
}

    .k-theme-dark .chat-messages[b-7n9vcli85f]::-webkit-scrollbar-thumb:hover,
    [data-theme="dark"] .chat-messages[b-7n9vcli85f]::-webkit-scrollbar-thumb:hover {
        background: var(--kendo-color-border-alt);
    }

@layer Settings {

    /* Dark theme support for preview dialog */
    .k-theme-dark[b-7n9vcli85f]  .preview-parameters {
        background: var(--kendo-color-base-700);
    }

    .k-theme-dark[b-7n9vcli85f]  .rendered-prompt {
        background: var(--kendo-color-base-800);
        border-color: var(--kendo-color-border);
        color: var(--kendo-color-on-app-surface);
    }

    /* Settings Dialog styling*/
    /* Base layout and structure */
    .ai-settings-landscape-dialog .k-window-titlebar[b-7n9vcli85f] {
        padding: 0.75rem 1rem;
    }

    .ai-settings-landscape-dialog .k-window-content[b-7n9vcli85f] {
        padding: 0;
        overflow: hidden;
    }

    .ai-settings-container[b-7n9vcli85f] {
        display: flex;
        height: 100%;
    }

    .settings-column[b-7n9vcli85f] {
        flex: 0 0 38%;
        padding: 1.25rem;
        overflow-y: auto;
        border-right: 1px solid var(--kendo-color-border);
        background: var(--kendo-color-surface);
    }

    .visualization-column[b-7n9vcli85f] {
        flex: 1;
        padding: 1.25rem;
        display: flex;
        flex-direction: column;
        background: var(--kendo-color-surface-alt);
        min-width: 0;
    }

    /* Form sections */
    .form-section[b-7n9vcli85f] {
        margin-bottom: 1.25rem;
    }

    .form-label[b-7n9vcli85f] {
        display: block;
        margin-bottom: 0.5rem;
        font-weight: 500;
        color: var(--kendo-color-on-surface);
        font-size: 0.875rem;
    }

    /* Slider styling */
    .slider-container[b-7n9vcli85f] {
        margin-top: 0.5rem;
    }

    .slider-header[b-7n9vcli85f] {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        margin-bottom: 0.5rem;
    }

    .slider-subtitle[b-7n9vcli85f] {
        font-size: 0.75rem;
        color: var(--kendo-color-subtle);
    }

    .slider-value[b-7n9vcli85f] {
        font-weight: 600;
        font-size: 0.875rem;
    }

    .zone-info[b-7n9vcli85f] {
        padding: 0.625rem 0.875rem;
        background: var(--kendo-color-app-surface);
        border-radius: var(--kendo-border-radius-md);
        margin-top: 1rem;
        border-left: 3px solid var(--kendo-color-primary);
    }

    .zone-label[b-7n9vcli85f] {
        font-weight: 600;
        color: var(--kendo-color-on-surface);
        margin-bottom: 0.25rem;
        font-size: 0.8125rem;
    }

    .zone-description[b-7n9vcli85f] {
        font-size: 0.75rem;
        color: var(--kendo-color-subtle);
        line-height: 1.4;
    }

    .response-size-zone[b-7n9vcli85f] {
        border-left-color: var(--kendo-color-info);
    }

    .info-text[b-7n9vcli85f] {
        font-size: 0.6875rem;
        color: var(--kendo-color-subtle);
        margin-top: 0.375rem;
    }

    .persona-textarea[b-7n9vcli85f] {
        min-height: 100px;
    }

    /* Heat map visualization */
    .heat-map-container[b-7n9vcli85f] {
        flex: 1;
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .heat-map-title[b-7n9vcli85f] {
        font-weight: 600;
        margin-bottom: 0.75rem;
        color: var(--kendo-color-on-surface);
        font-size: 1rem;
        margin-top: -24px;
    }

    .heat-map-wrapper[b-7n9vcli85f] {
        flex: 1;
        display: flex;
        align-items: stretch;
        min-height: 300px;
        position: relative;
    }

    .axis-label-container[b-7n9vcli85f] {
        display: flex;
        flex-direction: column;
    }

        .axis-label-container.y-axis[b-7n9vcli85f] {
            position: relative;
            width: 96px;
            padding-right: 1rem;
            justify-content: space-between;
        }

        .axis-label-container.x-axis[b-7n9vcli85f] {
            margin-top: .25rem;
        }

    .axis-title[b-7n9vcli85f] {
        font-weight: 600;
        color: var(--kendo-color-on-surface);
        font-size: 0.8125rem;
        white-space: nowrap;
    }

    .y-axis .axis-title[b-7n9vcli85f] {
        position: absolute;
        left: 8px;
        top: 50%;
        transform: rotate(-90deg) translateY(-50%);
        transform-origin: center center;
        width: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .x-axis .axis-title[b-7n9vcli85f] {
        text-align: center;
        margin-top: 0.5rem;
    }

    .y-axis .axis-labels[b-7n9vcli85f] {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
        margin-left: 2rem;
    }

    .x-axis .axis-labels[b-7n9vcli85f] {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    .axis-label[b-7n9vcli85f] {
        font-size: 0.6875rem;
        font-weight: 500;
        color: var(--kendo-color-subtle);
        padding: 0.25rem 0;
        text-align: right;
        white-space: nowrap;
    }

    .x-axis .axis-label[b-7n9vcli85f] {
        text-align: center;
        padding: 0.25rem;
    }

    .heat-map-grid-container[b-7n9vcli85f] {
        flex: 1;
        display: flex;
        flex-direction: column;
    }

    .heat-map[b-7n9vcli85f] {
        flex: 1;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        grid-template-rows: repeat(5, 1fr);
        gap: 1px;
        background: var(--kendo-color-border);
        border: 1px solid var(--kendo-color-border);
    }

    .heat-cell[b-7n9vcli85f] {
        position: relative;
        background: var(--kendo-color-surface);
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 0.375rem;
        cursor: pointer;
        transition: all 0.2s ease;
        overflow: hidden;
        min-height: 0;
    }

        .heat-cell:hover[b-7n9vcli85f] {
            transform: scale(1.05);
            z-index: 10;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
        }

        .heat-cell.current[b-7n9vcli85f] {
            box-shadow: inset 0 0 0 2px var(--kendo-color-primary);
            z-index: 5;
        }

    .cell-text[b-7n9vcli85f] {
        font-weight: var(--cell-font-weight, 400);
        font-size: var(--cell-font-size, 0.625rem);
        position: relative;
        z-index: 1;
        line-height: 1.2;
        word-break: break-word;
        text-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
    }

    /* Current behavior display */
    .current-behavior[b-7n9vcli85f] {
        margin-top: 1rem;
        padding: 0.875rem;
        background: var(--kendo-color-app-surface);
        border-radius: var(--kendo-border-radius-md);
        border: 1px solid var(--kendo-color-border);
    }

    .current-behavior-header[b-7n9vcli85f] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.5rem;
    }

    .current-behavior-title[b-7n9vcli85f] {
        font-weight: 600;
        color: var(--kendo-color-on-surface);
        font-size: 0.875rem;
    }

    .response-length-badge[b-7n9vcli85f] {
        display: inline-flex;
        align-items: center;
        padding: 0.25rem 0.625rem;
        background: var(--kendo-color-info-subtle);
        color: var(--kendo-color-info-on-subtle);
        border-radius: var(--kendo-border-radius-md);
        font-size: 0.6875rem;
        font-weight: 500;
    }

    .current-behavior-text[b-7n9vcli85f] {
        color: var(--kendo-color-subtle);
        font-size: 0.75rem;
        line-height: 1.4;
    }

    /* Tooltip styling */
    .heat-cell-tooltip[b-7n9vcli85f] {
        padding: 0.625rem;
        max-width: 280px;
    }

    .tooltip-title[b-7n9vcli85f] {
        font-weight: 600;
        margin-bottom: 0.375rem;
        font-size: 0.8125rem;
    }

    .tooltip-description[b-7n9vcli85f] {
        font-size: 0.75rem;
        margin-bottom: 0.625rem;
        line-height: 1.4;
        color: var(--kendo-color-subtle);
    }

    .tooltip-info[b-7n9vcli85f] {
        display: flex;
        gap: 0.375rem;
        font-size: 0.6875rem;
        padding-top: 0.375rem;
        border-top: 1px solid var(--kendo-color-border);
    }

    .tooltip-label[b-7n9vcli85f] {
        font-weight: 500;
    }

    .tooltip-value[b-7n9vcli85f] {
        color: var(--kendo-color-primary);
        font-weight: 600;
    }

    /* Theme-aware slider gradients */
    .temperature-slider .k-slider-track-wrapper .k-slider-track[b-7n9vcli85f] {
        background: linear-gradient(90deg, var(--kendo-color-info) 0%, var(--kendo-color-primary) 50%, var(--kendo-color-warning) 100%);
        opacity: 0.8;
    }

    .top-p-slider .k-slider-track-wrapper .k-slider-track[b-7n9vcli85f] {
        background: linear-gradient(90deg, var(--kendo-color-success) 0%, var(--kendo-color-primary) 50%, var(--kendo-color-error) 100%);
        opacity: 0.8;
    }

    .token-slider .k-slider-track-wrapper .k-slider-track[b-7n9vcli85f] {
        background: linear-gradient(90deg, var(--kendo-color-tertiary) 0%, var(--kendo-color-primary) 50%, var(--kendo-color-secondary) 100%);
        opacity: 0.8;
    }

    /* Responsive adjustments */
    @media (max-width: 1400px) {
        .settings-column[b-7n9vcli85f] {
            flex: 0 0 42%;
        }

        .axis-label-container.y-axis[b-7n9vcli85f] {
            width: 85px;
        }

        .axis-label[b-7n9vcli85f] {
            font-size: 0.625rem;
        }

        .cell-text[b-7n9vcli85f] {
            font-size: var(--cell-font-size, 0.5625rem);
        }
    }

    @media (max-width: 1200px) {
        .form-section[b-7n9vcli85f] {
            margin-bottom: 1rem;
        }

        .settings-column[b-7n9vcli85f] {
            padding: 1rem;
        }

        .visualization-column[b-7n9vcli85f] {
            padding: 1rem;
        }

        .persona-textarea[b-7n9vcli85f] {
            min-height: 80px;
        }
    }

    /* Dark theme specific adjustments */
    .k-theme-dark .heat-cell[b-7n9vcli85f],
    [data-theme="dark"] .heat-cell[b-7n9vcli85f] {
        background-blend-mode: screen;
    }

    .k-theme-dark .cell-text[b-7n9vcli85f],
    [data-theme="dark"] .cell-text[b-7n9vcli85f] {
        text-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
    }

    .k-theme-dark .heat-cell.current[b-7n9vcli85f],
    [data-theme="dark"] .heat-cell.current[b-7n9vcli85f] {
        box-shadow: inset 0 0 0 2px var(--kendo-color-primary-hover);
    }

    .k-theme-dark .response-length-badge[b-7n9vcli85f],
    [data-theme="dark"] .response-length-badge[b-7n9vcli85f] {
        background: var(--kendo-color-info-subtle);
        color: var(--kendo-color-base-subtle);
    }

    /* High opacity cells in dark theme need better contrast */
    .k-theme-dark .heat-cell[style*="opacity: 0.8"][b-7n9vcli85f],
    .k-theme-dark .heat-cell[style*="opacity: 0.9"][b-7n9vcli85f],
    .k-theme-dark .heat-cell[style*="opacity: 1"][b-7n9vcli85f],
    [data-theme="dark"] .heat-cell[style*="opacity: 0.8"][b-7n9vcli85f],
    [data-theme="dark"] .heat-cell[style*="opacity: 0.9"][b-7n9vcli85f],
    [data-theme="dark"] .heat-cell[style*="opacity: 1"][b-7n9vcli85f] {
        color: white !important;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
    }

    @media (prefers-color-scheme: dark) {
        .heat-cell[b-7n9vcli85f] {
            background-blend-mode: screen;
        }

        .cell-text[b-7n9vcli85f] {
            text-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
        }

        .heat-cell.current[b-7n9vcli85f] {
            box-shadow: inset 0 0 0 2px var(--kendo-color-primary-hover);
        }

        .response-length-badge[b-7n9vcli85f] {
            background: var(--kendo-color-info-subtle);
            color: var(--kendo-color-on-app-surface);
        }

        /* High opacity cells in dark theme need better contrast */
        .heat-cell[style*="opacity: 0.8"][b-7n9vcli85f],
        .heat-cell[style*="opacity: 0.9"][b-7n9vcli85f],
        .heat-cell[style*="opacity: 1"][b-7n9vcli85f] {
            color: white !important;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
        }
    }

    /* Model Details Window Styles */
    .model-details-window .k-window-content[b-7n9vcli85f] {
        padding: 0;
        overflow: hidden;
    }

    .model-details-container[b-7n9vcli85f] {
        height: 100%;
        padding: 1.5rem;
        padding-bottom: 32px;
    }

    /* Header Section */
    .model-header-section[b-7n9vcli85f] {
        margin-bottom: 1.5rem;
        padding-bottom: 1rem;
        border-bottom: 2px solid var(--kendo-color-border);
    }

    .model-title-row[b-7n9vcli85f] {
        display: flex;
        align-items: center;
        gap: 1rem;
        margin-bottom: 0.5rem;
    }

    .model-name[b-7n9vcli85f] {
        margin: 0;
        font-size: 1.5rem;
        font-weight: 600;
        color: var(--kendo-color-on-surface);
    }

    .model-description[b-7n9vcli85f] {
        margin: 0;
        color: var(--kendo-color-subtle);
        line-height: 1.5;
    }

    /* Metrics Grid */
    .model-metrics-grid[b-7n9vcli85f] {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 1.25rem;
        margin-bottom: 2rem;
    }

    .metric-card[b-7n9vcli85f] {
        background: var(--kendo-color-base-subtle);
        border: 1px solid var(--kendo-color-border);
        border-radius: var(--kendo-border-radius-lg);
        padding: 1rem;
    }

    .metric-title[b-7n9vcli85f] {
        margin: 0 0 1rem 0;
        font-size: 0.875rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: var(--kendo-color-on-surface);
    }

    /* Radar Chart */
    .radar-card[b-7n9vcli85f] {
        grid-column: span 1;
        
    }

    .radar-chart-container[b-7n9vcli85f] {
        font-size: 12px; /* Can increase to 13px if desired */
        position: relative;
        width: 100%;
        max-width: 320px; /* Increased from 280px */
        margin: 0 auto;
        background: var(--kendo-color-surface);
        border: 1px solid var(--kendo-color-border);
        border-radius: var(--kendo-border-radius-lg);
        color: var(--kendo-color-on-app-surface);
    }

    .radar-chart[b-7n9vcli85f] {
        width: 100%;
        height: auto;        
    }

    .radar-grid-circle[b-7n9vcli85f] {
        fill: none;
        stroke: var(--kendo-color-border);
        stroke-width: 0.5px;
        opacity: 0.3;
    }

    .radar-axis[b-7n9vcli85f] {
        stroke: var(--kendo-color-border);
        stroke-width: 0.5px;
        opacity: 0.5;
    }

    .radar-polygon[b-7n9vcli85f] {
        fill: var(--kendo-color-primary);
        fill-opacity: 0.25;
        stroke: var(--kendo-color-primary);
        stroke-width: 2.5px; /* Slightly thicker for larger chart */
    }

    .radar-point[b-7n9vcli85f] {
        fill: var(--kendo-color-primary);
        stroke: white;
        stroke-width: 1.5px; /* Slightly thicker border */
    }

    .radar-label[b-7n9vcli85f] {
        fill: var(--kendo-color-on-surface);        
        font-weight: 400;       
        letter-spacing: 0.2px;
    }

    /* Capabilities */
    .capabilities-list[b-7n9vcli85f] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        margin-bottom: 1rem;
    }

    .capability-badge[b-7n9vcli85f] {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.25rem 0.75rem;
        border-radius: var(--kendo-border-radius-md);
        font-size: 0.75rem;
        font-weight: 500;
    }

        .capability-badge.specialty-rag[b-7n9vcli85f] {
            background: var(--kendo-color-info-subtle);
            color: var(--kendo-color-info-on-subtle);
        }

        .capability-badge.specialty-reasoning[b-7n9vcli85f] {
            background: var(--kendo-color-primary-subtle);
            color: var(--kendo-color-primary-on-subtle);
        }

        .capability-badge.specialty-coding[b-7n9vcli85f] {
            background: var(--kendo-color-success-subtle);
            color: var(--kendo-color-success-on-subtle);
        }

        .capability-badge.specialty-embedding[b-7n9vcli85f] {
            background: var(--kendo-color-tertiary-subtle);
            color: var(--kendo-color-tertiary-on-subtle);
        }

    /* Modalities */
    .modalities-section[b-7n9vcli85f] {
        padding-top: 0.75rem;
        border-top: 1px solid var(--kendo-color-border);
    }

        .modalities-section h5[b-7n9vcli85f] {
            margin: 0 0 0.5rem 0;
            font-size: 0.75rem;
            color: var(--kendo-color-subtle);
        }

    .modality-row[b-7n9vcli85f] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .modality-label[b-7n9vcli85f] {
        min-width: 50px;
        font-size: 0.75rem;
        color: var(--kendo-color-subtle);
    }

    .modality-badges[b-7n9vcli85f] {
        display: flex;
        gap: 0.25rem;
    }

    /* Context & Pricing */
    .context-visual[b-7n9vcli85f] {
        margin-bottom: 1rem;
    }

    .context-bar-container[b-7n9vcli85f] {
        height: 32px;
        background: var(--kendo-color-base-hover);
        border-radius: var(--kendo-border-radius-md);
        position: relative;
        overflow: hidden;
    }

    .context-bar[b-7n9vcli85f] {
        height: 100%;
        background: linear-gradient(90deg, var(--kendo-color-primary) 0%, var(--kendo-color-primary-hover) 100%);
        display: flex;
        align-items: center;
        padding: 0 0.75rem;
        transition: width 0.3s ease;
    }

    .context-value[b-7n9vcli85f] {
        color: white;
        font-size: 0.75rem;
        font-weight: 600;
    }

    .context-comparison[b-7n9vcli85f] {
        margin-top: 0.5rem;
        font-size: 0.75rem;
        color: var(--kendo-color-subtle);
    }

    /* Pricing */
    .pricing-grid[b-7n9vcli85f] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
        margin: 0.75rem 0;
    }

    .pricing-item[b-7n9vcli85f] {
        display: flex;
        justify-content: space-between;
        padding: 0.5rem;
        background: var(--kendo-color-base-hover);
        border-radius: var(--kendo-border-radius-sm);
    }

    .pricing-label[b-7n9vcli85f] {
        font-size: 0.75rem;
        color: var(--kendo-color-subtle);
    }

    .pricing-value[b-7n9vcli85f] {
        font-weight: 600;
        color: var(--kendo-color-on-surface);
    }

    .cost-indicator[b-7n9vcli85f] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-top: 0.75rem;
    }

    .cost-label[b-7n9vcli85f] {
        color: var(--kendo-color-subtle);
        margin-right: 0.5rem;
    }

    .cost-bar-container[b-7n9vcli85f] {
        flex: 1;
        height: 20px;
        background: var(--kendo-color-base-hover);
        border-radius: var(--kendo-border-radius-sm);
        position: relative;
        overflow: hidden; /* ensures inner bar stays clipped */
    }

    .cost-bar[b-7n9vcli85f] {
        height: 100%;
        width: 100%; /* ensures bar spans container */
        display: flex;
        align-items: center;
        border-radius: var(--kendo-border-radius-sm);
        padding-right: 0.5rem;
        /* background/width will be set dynamically via @GetCostBarStyle */
    }

    .cost-multiplier[b-7n9vcli85f] {
        font-size: 0.75rem;
        font-weight: 600;
        margin-left: auto; /* pushes it to the right */
        color: white; /* ensure contrast if bar is colored */
    }

    /* Performance Scores */
    .score-item[b-7n9vcli85f] {
        margin-bottom: 1rem;
    }

    .score-header[b-7n9vcli85f] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.5rem;
    }

    .score-label[b-7n9vcli85f] {
        font-size: 0.8125rem;
        color: var(--kendo-color-subtle);
    }

    .score-value[b-7n9vcli85f] {
        font-weight: 600;
    }

        .score-value.high-quality[b-7n9vcli85f] {
            color: var(--kendo-color-success);
        }

        .score-value.medium-quality[b-7n9vcli85f] {
            color: var(--kendo-color-warning);
        }

    .score-bar-container[b-7n9vcli85f] {
        height: 8px;
        background: var(--kendo-color-base-hover);
        border-radius: 4px;
        overflow: hidden;
    }

    .score-bar[b-7n9vcli85f] {
        height: 100%;
        background: linear-gradient(90deg, var(--kendo-color-primary) 0%, var(--kendo-color-success) 100%);
        transition: width 0.3s ease;
    }

    .score-stars[b-7n9vcli85f] {
        display: flex;
        gap: 0.25rem;
    }

    .star-icon[b-7n9vcli85f] {
        color: var(--kendo-color-base-hover);
    }

        .star-icon.star-filled[b-7n9vcli85f] {
            color: var(--kendo-color-warning);
        }

    .speed-indicator[b-7n9vcli85f] {
        display: flex;
        gap: 0.25rem;
    }

    .speed-bar[b-7n9vcli85f] {
        flex: 1;
        height: 12px;
        background: var(--kendo-color-base-hover);
        border-radius: 2px;
        transition: all 0.3s ease;
    }

        .speed-bar.active[b-7n9vcli85f] {
            background: var(--kendo-color-success);
            transform: scaleY(1.2);
        }

    /* Comparison Table */
    .model-comparison-section[b-7n9vcli85f] {
        margin: 2rem 0;
    }

    .comparison-table[b-7n9vcli85f] {
        background: var(--kendo-color-base);
        border: 1px solid var(--kendo-color-border);
        border-radius: var(--kendo-border-radius-md);
        overflow: hidden;
    }

    .comparison-row[b-7n9vcli85f] {
        display: grid;
        grid-template-columns: 2fr 1fr 1fr;
        border-bottom: 1px solid var(--kendo-color-border);
    }

        .comparison-row:last-child[b-7n9vcli85f] {
            border-bottom: none;
        }

        .comparison-row.header[b-7n9vcli85f] {
            background: var(--kendo-color-base-hover);
            font-weight: 600;
        }

    .comparison-cell[b-7n9vcli85f] {
        padding: 0.75rem;
        font-size: 0.875rem;
    }

        .comparison-cell.better[b-7n9vcli85f] {
            color: var(--kendo-color-success);
            font-weight: 600;
        }

        .comparison-cell.worse[b-7n9vcli85f] {
            color: var(--kendo-color-error);
        }

    /* Use Cases */
    .use-case-section[b-7n9vcli85f] {
        margin-top: 2rem;
    }

    .use-case-grid[b-7n9vcli85f] {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: 0.75rem;
    }

    .use-case-item[b-7n9vcli85f] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem 0.75rem;
        background: var(--kendo-color-base);
        border: 1px solid var(--kendo-color-border);
        border-radius: var(--kendo-border-radius-md);
        font-size: 0.8125rem;
    }

        .use-case-item.excellent[b-7n9vcli85f] {
            background: var(--kendo-color-success-subtle);
            border-color: var(--kendo-color-success);
            color: var(--kendo-color-success-on-subtle);
        }

        .use-case-item.good[b-7n9vcli85f] {
            background: var(--kendo-color-primary-subtle);
            border-color: var(--kendo-color-primary);
            color: var(--kendo-color-primary-on-subtle);
        }

    /* Dark theme adjustments */
    .k-theme-dark .metric-card[b-7n9vcli85f] {
        background: var(--kendo-color-base-700);
    }

    .k-theme-dark .radar-polygon[b-7n9vcli85f] {
        fill-opacity: 0.3;
    }

    .k-theme-dark .context-bar[b-7n9vcli85f],
    .k-theme-dark .cost-bar[b-7n9vcli85f],
    .k-theme-dark .score-bar[b-7n9vcli85f] {
        opacity: 0.9;
    }

    /* Responsive */
    @media (max-width: 768px) {
        .model-metrics-grid[b-7n9vcli85f] {
            grid-template-columns: 1fr;
        }

        .use-case-grid[b-7n9vcli85f] {
            grid-template-columns: 1fr;
        }
    }

    .selected-model-summary[b-7n9vcli85f] {
        margin-top: 12px;
        padding: 12px;
        background: var(--kendo-color-surface-alt, #f8f9fa);
        border: 1px solid var(--kendo-color-border, #e0e0e0);
        border-radius: 6px;
        font-size: 13px;
    }

    .model-summary-header[b-7n9vcli85f] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
    }

    .model-summary-title[b-7n9vcli85f] {
        display: flex;
        align-items: center;
        gap: 6px;
        font-weight: 600;
    }

        .model-summary-title .model-name[b-7n9vcli85f] {
            color: var(--kendo-color-primary, #0078d4);
        }

    .model-summary-metrics[b-7n9vcli85f] {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 8px;
    }

    .metric-badge[b-7n9vcli85f] {
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 4px 8px;
        border-radius: 4px;
        background: var(--kendo-color-surface);
        border: 1px solid var(--kendo-color-border, #e0e0e0);
        font-size: 12px;
        font-weight: 500;
    }

        .metric-badge.quality[b-7n9vcli85f] {
            border-left: 3px solid var(--kendo-color-success, #28a745);
        }

        .metric-badge.speed[b-7n9vcli85f] {
            border-left: 3px solid var(--kendo-color-info, #17a2b8);
        }

        .metric-badge.reasoning[b-7n9vcli85f] {
            border-left: 3px solid var(--kendo-color-tertiary, #6f42c1);
        }

        .metric-badge.context[b-7n9vcli85f] {
            border-left: 3px solid var(--kendo-color-primary, #0078d4);
        }

        .metric-badge.cost[b-7n9vcli85f] {
            border-left: 3px solid var(--kendo-color-warning, #ffc107);
        }

            .metric-badge.cost.low-cost[b-7n9vcli85f] {
                border-left-color: var(--kendo-color-success, #28a745);
            }

            .metric-badge.cost.high-cost[b-7n9vcli85f] {
                border-left-color: var(--kendo-color-error, #dc3545);
            }

    .model-summary-specialties[b-7n9vcli85f] {
        display: flex;
        gap: 6px;
        flex-wrap: wrap;
    }

    .specialty-chip[b-7n9vcli85f] {
        font-size: 11px;
    }

    .specialty-chip-more[b-7n9vcli85f] {
        background: var(--kendo-color-base-subtle, #f0f0f0);
        font-size: 11px;
    }

    .model-details-trigger[b-7n9vcli85f] {
        opacity: 0.7;
        transition: opacity 0.2s;
    }

        .model-details-trigger:hover[b-7n9vcli85f] {
            opacity: 1;
        }

    .model-defaults-box[b-7n9vcli85f] {
        display: flex;
        align-items: flex-start;
        gap: 1rem;
        margin-top: 1rem;
        padding: 0.875rem;
        background: var(--kendo-color-base);
        border: 1px solid var(--kendo-color-border);
        border-radius: var(--kendo-border-radius-md);
        box-shadow: none;
    }

    .model-defaults-icon[b-7n9vcli85f] {
        flex-shrink: 0;
        color: var(--kendo-color-info);
        display: flex;
        align-items: center;
        margin-top: 0.125rem;
    }

    .model-defaults-content[b-7n9vcli85f] {
        flex: 1;
    }

    .model-defaults-title[b-7n9vcli85f] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.5rem;
        font-weight: 600;
        color: var(--kendo-color-on-surface);
        font-size: 0.875rem;
    }

    .model-defaults-description[b-7n9vcli85f] {
        margin: 0;
        font-size: 0.75rem;
        line-height: 1.4;
        color: var(--kendo-color-subtle);
    }

        .model-defaults-description strong[b-7n9vcli85f] {
            font-weight: 600;
            color: var(--kendo-color-info-emphasis);
        }

    /* Add informational badge styling similar to response-length-badge */
    .model-defaults-badge[b-7n9vcli85f] {
        display: inline-flex;
        align-items: center;
        padding: 0.25rem 0.625rem;
        background: var(--kendo-color-info-subtle);
        color: var(--kendo-color-info-on-subtle);
        border-radius: var(--kendo-border-radius-md);
        font-size: 0.6875rem;
        font-weight: 500;
    }


}
/* /Components/Shared/AIAgentItemDisplay.razor.rz.scp.css */
.item-display[b-he9kd10e2s] {
    height: 100%;
    padding: 1rem;
}

.preview-image[b-he9kd10e2s] {
    max-width: 100%;
    height: auto;
    margin-top: 1rem;
}

.preview-pdf[b-he9kd10e2s] {
    width: 100%;
    height: 600px;
    border: none;
    margin-top: 1rem;
}

.generic-item-display pre[b-he9kd10e2s] {
    background: var(--kendo-color-base-200);
    padding: 1rem;
    border-radius: 0.25rem;
    overflow: auto;
}
/* /Components/Shared/AIAgentKnowledgeLibraryPicker.razor.rz.scp.css */
.knowledge-library-picker[b-0v2uet96qu] {
    display: flex;
    flex-direction: column;
    height: calc(100% - 4px);
    background: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
}

.picker-header[b-0v2uet96qu] {
    padding: 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface-alt);
}

    .picker-header h4[b-0v2uet96qu] {
        margin: 0;
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: var(--kendo-color-on-app-surface);
    }

.picker-subtitle[b-0v2uet96qu] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    margin-top: 0.25rem;
    display: block;
}

.picker-toolbar[b-0v2uet96qu] {
    padding: 0.5rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface);
}

.picker-stats[b-0v2uet96qu] {
    margin-left: auto;
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
}

.picker-content[b-0v2uet96qu] {
    flex: 1;
    overflow-y: auto;
    min-height: 300px;
    background: var(--kendo-color-surface);
}

.list-header[b-0v2uet96qu] {
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--kendo-color-base-subtle);
    border-bottom: 1px solid var(--kendo-color-border);
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
}

.workspace-item[b-0v2uet96qu] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface);
    transition: background-color 0.2s ease;
}

    .workspace-item:hover[b-0v2uet96qu] {
        background: var(--kendo-color-base-hover);
    }

    .workspace-item.selected[b-0v2uet96qu] {
        background: var(--kendo-color-primary-subtle);
    }

.workspace-checkbox[b-0v2uet96qu] {
    flex-shrink: 0;
}

.workspace-icon[b-0v2uet96qu] {
    flex-shrink: 0;
    color: var(--kendo-color-primary);
}

.workspace-details[b-0v2uet96qu] {
    flex: 1;
    min-width: 0;
}

.workspace-name[b-0v2uet96qu] {
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
    color: var(--kendo-color-on-app-surface);
}

.workspace-description[b-0v2uet96qu] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    margin-bottom: 0.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-metadata[b-0v2uet96qu] {
    display: flex;
    gap: 1rem;
    font-size: 0.75rem;
    color: var(--kendo-color-subtle);
}

.metadata-item[b-0v2uet96qu] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.workspace-actions[b-0v2uet96qu] {
    flex-shrink: 0;
}

.picker-footer[b-0v2uet96qu] {
    padding: 1rem;
    border-top: 1px solid var(--kendo-color-border);
    background: var(--kendo-color-surface-alt);
}

.selection-summary[b-0v2uet96qu] {
    font-size: 0.875rem;
    color: var(--kendo-color-subtle);
    text-align: center;
}

.empty-state[b-0v2uet96qu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    color: var(--kendo-color-subtle);
}

    .empty-state p[b-0v2uet96qu] {
        margin: 1rem 0;
        color: var(--kendo-color-subtle);
    }

/* Filter Dialog Styles */
.filter-options[b-0v2uet96qu] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.filter-group[b-0v2uet96qu] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

    .filter-group label[b-0v2uet96qu] {
        font-weight: 600;
        font-size: 0.875rem;
        color: var(--kendo-color-on-app-surface);
    }

/* Details Window Styles */
.workspace-details-view[b-0v2uet96qu] {
    height: 100%;
}

.details-section[b-0v2uet96qu] {
    padding: 1rem;
}

    .details-section h5[b-0v2uet96qu] {
        margin-top: 0;
        margin-bottom: 1rem;
        color: var(--kendo-color-primary);
    }

    .details-section dl[b-0v2uet96qu] {
        display: grid;
        grid-template-columns: 150px 1fr;
        gap: 0.5rem 1rem;
        margin: 0;
    }

    .details-section dt[b-0v2uet96qu] {
        font-weight: 600;
        color: var(--kendo-color-subtle);
    }

    .details-section dd[b-0v2uet96qu] {
        margin: 0;
        color: var(--kendo-color-on-app-surface);
    }

/* Dark theme specific adjustments */
.k-theme-dark .knowledge-library-picker[b-0v2uet96qu],
[data-theme="dark"] .knowledge-library-picker[b-0v2uet96qu] {
    background: var(--kendo-color-base-800, #1f1f1f);
}

.k-theme-dark .picker-header[b-0v2uet96qu],
[data-theme="dark"] .picker-header[b-0v2uet96qu] {
    background: var(--kendo-color-base-700, #2d2d2d);
    border-bottom-color: var(--kendo-color-border);
}

.k-theme-dark .picker-toolbar[b-0v2uet96qu],
[data-theme="dark"] .picker-toolbar[b-0v2uet96qu] {
    background: var(--kendo-color-base-800, #1f1f1f);
    border-bottom-color: var(--kendo-color-border);
}

.k-theme-dark .picker-content[b-0v2uet96qu],
[data-theme="dark"] .picker-content[b-0v2uet96qu] {
    background: var(--kendo-color-base-800, #1f1f1f);
}

.k-theme-dark .list-header[b-0v2uet96qu],
[data-theme="dark"] .list-header[b-0v2uet96qu] {
    background: var(--kendo-color-base-700, #2d2d2d);
    color: var(--kendo-color-on-app-surface);
    border-bottom-color: var(--kendo-color-border);
}

.k-theme-dark .workspace-item[b-0v2uet96qu],
[data-theme="dark"] .workspace-item[b-0v2uet96qu] {
    background: var(--kendo-color-base-800, #1f1f1f);
    border-bottom-color: var(--kendo-color-border);
}

    .k-theme-dark .workspace-item:hover[b-0v2uet96qu],
    [data-theme="dark"] .workspace-item:hover[b-0v2uet96qu] {
        background: var(--kendo-color-base-700, #2d2d2d);
    }

    .k-theme-dark .workspace-item.selected[b-0v2uet96qu],
    [data-theme="dark"] .workspace-item.selected[b-0v2uet96qu] {
        background: var(--kendo-color-primary-900, #003d6b);
    }

.k-theme-dark .workspace-name[b-0v2uet96qu],
[data-theme="dark"] .workspace-name[b-0v2uet96qu] {
    color: var(--kendo-color-on-app-surface);
}

.k-theme-dark .workspace-description[b-0v2uet96qu],
[data-theme="dark"] .workspace-description[b-0v2uet96qu] {
    color: var(--kendo-color-subtle);
}

.k-theme-dark .picker-footer[b-0v2uet96qu],
[data-theme="dark"] .picker-footer[b-0v2uet96qu] {
    background: var(--kendo-color-base-700, #2d2d2d);
    border-top-color: var(--kendo-color-border);
}

.k-theme-dark .empty-state[b-0v2uet96qu],
[data-theme="dark"] .empty-state[b-0v2uet96qu] {
    color: var(--kendo-color-subtle);
}

/* Force proper text color in dark theme for all text elements */
.k-theme-dark .knowledge-library-picker *[b-0v2uet96qu],
[data-theme="dark"] .knowledge-library-picker *[b-0v2uet96qu] {
    color: inherit;
}

/* Ensure icons maintain proper colors */
.k-theme-dark .workspace-icon[b-0v2uet96qu],
[data-theme="dark"] .workspace-icon[b-0v2uet96qu] {
    color: var(--kendo-color-primary);
}

/* Fix checkbox visibility in dark theme */
.k-theme-dark .workspace-checkbox .k-checkbox[b-0v2uet96qu],
[data-theme="dark"] .workspace-checkbox .k-checkbox[b-0v2uet96qu] {
    background: var(--kendo-color-base-700, #2d2d2d);
    border-color: var(--kendo-color-border);
}

    .k-theme-dark .workspace-checkbox .k-checkbox:checked[b-0v2uet96qu],
    [data-theme="dark"] .workspace-checkbox .k-checkbox:checked[b-0v2uet96qu] {
        background: var(--kendo-color-primary);
        border-color: var(--kendo-color-primary);
    }
/* /Components/Shared/AIAgentPluginList.razor.rz.scp.css */
body[b-ssfidpllc0] {
}

.ai-plugin-list[b-ssfidpllc0] {
    display: flex;
    flex-direction: column;
    height: calc(100% - 8px);
    background-color: var(--kendo-color-surface);
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
}

.plugin-header[b-ssfidpllc0] {
    padding: 1.5rem;
    border-bottom: 1px solid var(--kendo-color-border);
    background-color: var(--kendo-color-surface-alt);
}

.plugin-header h4[b-ssfidpllc0] {
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--kendo-color-on-app-surface);
}

.plugin-subtitle[b-ssfidpllc0] {
    color: var(--kendo-color-subtle);
    font-size: 0.875rem;
}

.plugin-toolbar[b-ssfidpllc0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--kendo-color-border);
    background-color: var(--kendo-color-app-surface);
}

.plugin-stats[b-ssfidpllc0] {
    margin-left: auto;
    color: var(--kendo-color-subtle);
    font-size: 0.875rem;
}

.plugin-content[b-ssfidpllc0] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

.empty-state[b-ssfidpllc0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    color: var(--kendo-color-subtle);
}

.empty-state p[b-ssfidpllc0] {
    margin: 1rem 0;
}

.plugin-card[b-ssfidpllc0] {
    margin-bottom: 1rem;
    transition: all 0.2s ease;
}

.plugin-card.enabled[b-ssfidpllc0] {
    border-color: var(--kendo-color-primary);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.plugin-card.disabled[b-ssfidpllc0] {
    opacity: 0.8;
}

.plugin-card-header[b-ssfidpllc0] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.plugin-toggle[b-ssfidpllc0] {
    flex-shrink: 0;
}

.plugin-title[b-ssfidpllc0] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.plugin-title h5[b-ssfidpllc0] {
    margin: 0;
    color: var(--kendo-color-on-app-surface);
}

.plugin-description[b-ssfidpllc0] {
    color: var(--kendo-color-subtle);
    font-size: 0.875rem;
    margin-left: 0.5rem;
}

.plugin-actions[b-ssfidpllc0] {
    flex-shrink: 0;
}

.plugin-metadata[b-ssfidpllc0] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.plugin-functions[b-ssfidpllc0] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--kendo-color-border);
    overflow: visible;
    min-height: 100px;
}

.plugin-functions.expanded[b-ssfidpllc0] {
    animation: expandDown-b-ssfidpllc0 0.3s ease-out;
}

@keyframes expandDown-b-ssfidpllc0 {
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 1000px;
    }
}

.plugin-functions-grid[b-ssfidpllc0] {
    min-height: 200px;
}

.plugin-functions-grid .k-grid[b-ssfidpllc0] {
    border: none;
}

.plugin-functions-grid .k-grid-content[b-ssfidpllc0] {
    min-height: 150px;
}

.function-name[b-ssfidpllc0] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.parameter-tooltip[b-ssfidpllc0] {
    padding: 0.5rem;
    max-width: 400px;
}

.parameter-detail[b-ssfidpllc0] {
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--kendo-color-border-alt);
}

.parameter-detail:last-child[b-ssfidpllc0] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.param-type[b-ssfidpllc0] {
    color: var(--kendo-color-primary);
    font-family: 'Cascadia Code', 'Consolas', monospace;
    font-size: 0.875rem;
    margin-left: 0.5rem;
}

.param-desc[b-ssfidpllc0] {
    color: var(--kendo-color-subtle);
    font-size: 0.875rem;
}

.return-type[b-ssfidpllc0] {
    color: var(--kendo-color-primary);
    font-family: 'Cascadia Code', 'Consolas', monospace;
    font-size: 0.875rem;
}

.no-functions[b-ssfidpllc0] {
    text-align: center;
    color: var(--kendo-color-subtle);
    padding: 2rem;
    margin: 0;
}

.plugin-footer[b-ssfidpllc0] {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--kendo-color-border);
    background-color: var(--kendo-color-surface-alt);
}

.selection-summary[b-ssfidpllc0] {
    color: var(--kendo-color-subtle);
    font-size: 0.875rem;
}

/* Filter Dialog Styles */
.filter-options[b-ssfidpllc0] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.filter-group[b-ssfidpllc0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-ssfidpllc0] {
    font-weight: 600;
    color: var(--kendo-color-on-app-surface);
    font-size: 0.875rem;
}

/* Grid customizations */
.k-grid-header[b-ssfidpllc0] {
    background-color: var(--kendo-color-surface-alt);
}

.k-grid td[b-ssfidpllc0] {
    vertical-align: middle;
}

/* Animation support */
.k-animation-container[b-ssfidpllc0] {
    overflow: visible !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .plugin-card-header[b-ssfidpllc0] {
        flex-direction: column;
        align-items: stretch;
    }

    .plugin-title[b-ssfidpllc0] {
        margin-top: 0.5rem;
    }

    .plugin-toolbar[b-ssfidpllc0] {
        flex-wrap: wrap;
    }

    .plugin-stats[b-ssfidpllc0] {
        width: 100%;
        margin-top: 0.5rem;
        text-align: center;
    }
}

/* Dark theme support */
@media (prefers-color-scheme: dark) {
    .plugin-card.enabled[b-ssfidpllc0] {
        background-color: rgba(var(--kendo-color-primary-rgb), 0.1);
    }
}

/* Hover effects */
.plugin-card:hover[b-ssfidpllc0] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Loading state */
.k-loader-container[b-ssfidpllc0] {
    min-height: 200px;
}

/* Truncated description styling */
.truncated-description[b-ssfidpllc0] {
    display: inline-block;
    cursor: help;
    position: relative;
    text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-color: var(--kendo-color-subtle);
    text-underline-offset: 3px;
}

.truncated-description:hover[b-ssfidpllc0] {
    text-decoration-color: var(--kendo-color-primary);
}

/* E-reader style tooltip */
.description-tooltip[b-ssfidpllc0] {
    /* Typography */
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.6;
    letter-spacing: 0.01em;
    text-align: left;
    
    /* Spacing */
    padding: 1.25rem 1.5rem;
    max-width: 600px;
    
    /* Colors - High contrast for readability */
    background-color: var(--kendo-color-app-surface);
    color: var(--kendo-color-on-app-surface);
    
    /* Border and shadow for depth */
    border: 1px solid var(--kendo-color-border);
    border-radius: var(--kendo-border-radius-md);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12),
                0 2px 4px rgba(0, 0, 0, 0.08);
}

/* Enhanced readability with subtle background */
.description-tooltip[b-ssfidpllc0]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        rgba(var(--kendo-color-primary-rgb), 0.02) 100%
    );
    border-radius: inherit;
    pointer-events: none;
}

/* Dark theme adjustments */
@media (prefers-color-scheme: dark) {
    .description-tooltip[b-ssfidpllc0] {
        /* Slightly warmer background for reduced eye strain */
        background-color: color-mix(in srgb, var(--kendo-color-app-surface) 98%, #fff4e6 2%);
        
        /* Stronger shadow for better separation */
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3),
                    0 2px 4px rgba(0, 0, 0, 0.2),
                    inset 0 1px 0 rgba(255, 255, 255, 0.05);
    }
    
    .description-tooltip[b-ssfidpllc0]::before {
        background: linear-gradient(
            to bottom,
            rgba(255, 255, 255, 0.02) 0%,
            transparent 100%
        );
    }
}

/* Focus visible for accessibility */
.truncated-description:focus-visible[b-ssfidpllc0] {
    outline: 2px solid var(--kendo-color-primary);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Ensure tooltip appears above other elements */
.k-animation-container .k-tooltip[b-ssfidpllc0] {
    z-index: 10002;
}

/* Smooth text rendering */
.description-tooltip[b-ssfidpllc0] {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Optional: Add reading mode indicator */
.description-tooltip[b-ssfidpllc0]::after {
    content: '';
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: 6px;
    height: 6px;
    background-color: var(--kendo-color-success);
    border-radius: 50%;
    opacity: 0.6;
}
/* /Components/Shared/AuthenticationRequiredContent.razor.rz.scp.css */
body[b-qqebwhzatg] {
}


/* Define base colors for the light theme */
:root[b-qqebwhzatg] {
    --bg-color: #ffffff;
    --text-color: #333333;
    --accent-color: #007acc;
    --card-bg: #f8f8f8;
}

/* Switch to dark theme based on user's preference */
@media (prefers-color-scheme: dark) {
    : root[b-qqebwhzatg] {
        --bg-color: #121212;
        --text-color: #e0e0e0;
        --accent-color: #82aaff;
        --card-bg: #1e1e1e;
    }
}

/* Global styles for a clean, centered layout */
body[b-qqebwhzatg] {
    background-color: var(--bg-color);
    color: var(--text-color);
    margin: 0;
    padding: 0;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    display: flex;
    min-height: 100vh;
    align-items: center;
    justify-content: center;
}

/* The access denied card container */
.access-denied-container[b-qqebwhzatg] {
    max-width: 500px;
    width: 90%;
    padding: 2rem;
    background-color: var(--card-bg);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    text-align: center;
    margin-bottom:48px;
}

    /* Heading styling */
    .access-denied-container h1[b-qqebwhzatg] {
        font-size: 2rem;
        margin-bottom: 0.5rem;
    }

    /* Informative text styling */
    .access-denied-container p[b-qqebwhzatg] {
        font-size: 1.125rem;
        margin-bottom: 1.5rem;
        line-height: 1.6;
    }

    /* Login button style */
    .access-denied-container a[b-qqebwhzatg] {
        text-decoration: none;
        background-color: var(--accent-color);
        color: var(--bg-color);
        padding: 0.75rem 1.5rem;
        border-radius: 4px;
        font-size: 1rem;
        transition: background-color 0.3s ease, filter 0.3s ease;
    }

        .access-denied-container a:hover[b-qqebwhzatg] {
            filter: brightness(90%);
        }
/* /Components/Shared/BICModulePopUp.razor.rz.scp.css */
body[b-sqd6qr7t7q] {
}
/* /Components/Shared/FilesAttachmentDisplayGrid.razor.rz.scp.css */
body[b-u2kckz2j9s] {
}
/* /Components/Shared/JournalEntriesList.razor.rz.scp.css */
/* JournalEntries.razor.css */

/* Container for the overall journal entries list */
.journal-entries[b-iwuawh6xq1] {
    margin: 1rem;
    padding: 0;
    overflow-y: auto;
}

/* Base journal entry styling using Kendo card conventions */
.journal-entry[b-iwuawh6xq1] {
    margin-bottom: 1rem;
    /* Use a Kendo-like card style */
    border: 1px solid #d4d4d4;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

    /* Mimic a Kendo card header */
    .journal-entry .card-header[b-iwuawh6xq1],
    .journal-entry .k-card-header[b-iwuawh6xq1] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.75rem 1rem;
        background-color: #f9f9f9;
        border-bottom: 1px solid #e0e0e0;
        font-size: 1.1rem;
        font-weight: 600;
    }

    /* Mimic a Kendo card body */
    .journal-entry .card-body[b-iwuawh6xq1],
    .journal-entry .k-card-body[b-iwuawh6xq1] {
        padding: 1rem;
        color: #333;
    }

    /* Style for the display name/title */
    .journal-entry .card-title[b-iwuawh6xq1] {
        margin: 0;
        font-size: 1.25rem;
        font-weight: bold;
    }

    /* Style for the description or text content */
    .journal-entry .card-text[b-iwuawh6xq1] {
        margin-top: 0.5rem;
        font-size: 1rem;
        color: #666;
    }

    /* Styling for action links (Reply, Edit, Delete) using a Kendo link style */
    .journal-entry a.card-link[b-iwuawh6xq1] {
        margin-right: 1rem;
        font-size: 0.9rem;
        color: #0054a6; /* A typical Kendo link color */
        text-decoration: none;
        cursor: pointer;
        transition: color 0.2s ease;
    }

        .journal-entry a.card-link:hover[b-iwuawh6xq1],
        .journal-entry a.card-link:focus[b-iwuawh6xq1] {
            color: #003d80;
            text-decoration: underline;
        }

    /* Style the timestamp text; uses a muted tone similar to Kendo UI standards */
    .journal-entry small.text-muted[b-iwuawh6xq1] {
        font-size: 0.85rem;
        color: #888;
    }

/* Additional styling for nested child entries */
.child-entries[b-iwuawh6xq1] {
    padding-left: 1.5rem;
    margin-top: 0.75rem;
    border-left: 2px solid #e8e8e8;
}

/* Optional: Styling for improved responsiveness */
@media (max-width: 768px) {
    .journal-entry .card-header[b-iwuawh6xq1],
    .journal-entry .k-card-header[b-iwuawh6xq1],
    .journal-entry .card-body[b-iwuawh6xq1],
    .journal-entry .k-card-body[b-iwuawh6xq1] {
        padding: 0.5rem;
    }

    .journal-entry .card-title[b-iwuawh6xq1] {
        font-size: 1.1rem;
    }
}
/* /Components/Shared/JournalEntryComponent.razor.rz.scp.css */
/* Define default properties for the light theme */
:root[b-3vzyf1ww40] {
    --je-card-bg: #ffffff;
    --je-card-border: #e0e0e0;
    --je-shadow-hover: rgba(0, 0, 0, 0.1);
    --je-card-text: #555555;
    --je-card-title: #333333;
    --je-link-primary: #0056b3;
    --je-link-primary-hover: #003d80;
    --je-link-warning: #d39e00;
    --je-link-warning-hover: #b58900;
    --je-link-danger: #b21f2d;
    --je-link-danger-hover: #a31a1e;
    --je-child-border: #dddddd;
}

/* Override variables for the dark theme */
[data-theme="dark"][b-3vzyf1ww40] {
    --je-card-bg: #2a2a2a;
    --je-card-border: #444444;
    --je-shadow-hover: rgba(255, 255, 255, 0.1);
    --je-card-text: #cccccc;
    --je-card-title: #ffffff;
    --je-link-primary: #4e9af1;
    --je-link-primary-hover: #4679ce;
    --je-link-warning: #e6b563;
    --je-link-warning-hover: #d0a144;
    --je-link-danger: #ff7373;
    --je-link-danger-hover: #ff5555;
    --je-child-border: #666666;
}

/* Base card styling with a gentle modern look */
.journal-entry[b-3vzyf1ww40] {
    border: 1px solid var(--je-card-border);
    background-color: var(--je-card-bg);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

    .journal-entry:hover[b-3vzyf1ww40] {
        transform: translateY(-3px);
        box-shadow: 0 0.5rem 1rem var(--je-shadow-hover);
    }

/* Spacing and typography for the card body */
.card-body[b-3vzyf1ww40] {
    padding: 1rem;
}

/* Title styling for clarity and impact */
.card-title[b-3vzyf1ww40] {
    font-weight: 600;
    font-size: 1rem;
    color: var(--je-card-title);
    margin-bottom: 0.25rem;
}

/* Creator info styling (sub header) */
.card-body small[b-3vzyf1ww40] {
    font-size: 0.85rem;
    color: var(--je-card-text);
}

/* Description text styling for readability */
.card-text[b-3vzyf1ww40] {
    font-size: 0.9rem;
    color: var(--je-card-text);
    margin-top: 0.5rem;
}

/* Action link styling; using Kendo-inspired colors */
.card-link[b-3vzyf1ww40] {
    cursor: pointer;
    margin-right: 1rem;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease-in-out;
}

    .card-link.text-primary:hover[b-3vzyf1ww40] {
        color: var(--je-link-primary-hover);
    }

    .card-link.text-warning:hover[b-3vzyf1ww40] {
        color: var(--je-link-warning-hover);
    }

    .card-link.text-danger:hover[b-3vzyf1ww40] {
        color: var(--je-link-danger-hover);
    }

/* Styling for nested child entries (thread reply style) */
.child-entries[b-3vzyf1ww40] {
    border-left: 2px solid var(--je-child-border);
    padding-left: 1rem;
    margin-top: 1rem;
}

/* Responsive tweaks */
@media (max-width: 768px) {
    .card-body[b-3vzyf1ww40] {
        padding: 0.75rem;
    }

    .card-title[b-3vzyf1ww40] {
        font-size: 1.15rem;
    }
}
/* /Components/Shared/JournalEntryDialog.razor.rz.scp.css */
body[b-za6dwk4r0r] {
}
/* /Components/Shared/PIMRecurrence.razor.rz.scp.css */
.pct-recurrence-input[b-cnga07ycrv] {
    margin-bottom:12px;
}
/* /Components/Shared/TreeItemPicker.razor.rz.scp.css */
.tree-item-picker[b-i50i1mvhbf] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-2);
    width: 100%;
}

    .tree-item-picker.compact[b-i50i1mvhbf] {
        gap: var(--kendo-spacing-1);
    }

/* Search Section */
.picker-search[b-i50i1mvhbf] {
    position: relative;
}

/* Selection Info Section */
.picker-selection-info[b-i50i1mvhbf] {
    background-color: var(--kendo-color-base-subtle);
    border: 1px solid var(--kendo-component-border);
    border-radius: var(--kendo-border-radius-md);
    padding: var(--kendo-spacing-2);
    transition: all 0.2s ease;
}

.tree-item-picker.compact .picker-selection-info[b-i50i1mvhbf] {
    padding: var(--kendo-spacing-1);
}

.selection-summary[b-i50i1mvhbf] {
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-1);
}

.selection-single[b-i50i1mvhbf] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
}

.selection-label[b-i50i1mvhbf] {
    font-weight: 600;
    color: var(--kendo-color-on-base);
    flex-shrink: 0;
}

.selection-path[b-i50i1mvhbf] {
    color: var(--kendo-color-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.no-selection[b-i50i1mvhbf] {
    color: var(--kendo-subtle-text);
    font-style: italic;
}

/* Chips Display */
.selected-chips[b-i50i1mvhbf] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kendo-spacing-1);
    align-items: center;
}

.selection-chip[b-i50i1mvhbf] {
    max-width: 200px;
    cursor: pointer;
}

    .selection-chip[b-i50i1mvhbf]  .k-chip-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.more-items[b-i50i1mvhbf] {
    color: var(--kendo-subtle-text);
    font-size: 0.875em;
    padding: 0 var(--kendo-spacing-2);
    cursor: help;
    border-bottom: 1px dotted var(--kendo-subtle-text);
}

/* Tooltip Styling */
.chip-tooltip[b-i50i1mvhbf] {
    max-width: 400px;
    padding: var(--kendo-spacing-1);
    font-size: 0.875em;
    line-height: 1.4;
}

    .chip-tooltip strong[b-i50i1mvhbf] {
        color: var(--kendo-color-primary);
    }

/* Node Tooltip Scorecard - Base styles that work for both themes */
.node-tooltip-scorecard[b-i50i1mvhbf] {
    min-width: 280px;
    max-width: 360px;
    padding: 0;
    border-radius: var(--kendo-border-radius-md);
    overflow: hidden;
    box-shadow: var(--kendo-box-shadow-depth-4);
    background-color: var(--kendo-component-bg);
    border: 1px solid var(--kendo-component-border);
}

.scorecard-header[b-i50i1mvhbf] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2);
    padding: var(--kendo-spacing-2) var(--kendo-spacing-3);
    background-color: var(--kendo-color-base-subtle);
    border-bottom: 1px solid var(--kendo-component-border);
}

.scorecard-title[b-i50i1mvhbf] {
    font-weight: 600;
    color: var(--kendo-component-text);
    flex-grow: 1;
    font-size: 0.875rem;
}

.scorecard-content[b-i50i1mvhbf] {
    padding: var(--kendo-spacing-3);
    display: flex;
    flex-direction: column;
    gap: var(--kendo-spacing-2);
    background-color: var(--kendo-component-bg);
}

.scorecard-row[b-i50i1mvhbf] {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: var(--kendo-spacing-2);
    align-items: start;
}

    .scorecard-row.full-width[b-i50i1mvhbf] {
        grid-template-columns: 1fr;
    }

        .scorecard-row.full-width .scorecard-label[b-i50i1mvhbf] {
            margin-bottom: var(--kendo-spacing-1);
        }

.scorecard-label[b-i50i1mvhbf] {
    font-size: 0.625rem;
    font-weight: 600;
    color: var(--kendo-subtle-text);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.scorecard-value[b-i50i1mvhbf] {
    font-size: 0.875rem;
    color: var(--kendo-component-text);
    font-weight: 500;
}

    .scorecard-value.description[b-i50i1mvhbf] {
        line-height: 1.4;
        color: var(--kendo-component-text);
        font-weight: 400;
    }

    .scorecard-value.parent[b-i50i1mvhbf] {
        display: flex;
        align-items: center;
        gap: var(--kendo-spacing-1);
        color: var(--kendo-link-text);
    }

    .scorecard-value.type-badge[b-i50i1mvhbf] {
        display: inline-block;
        padding: var(--kendo-spacing-0\.5) var(--kendo-spacing-2);
        background-color: var(--kendo-color-base-subtle);
        border-radius: var(--kendo-border-radius-full);
        font-size: 0.75rem;
        font-weight: 500;
        color: var(--kendo-component-text);
    }

/* Tree Container */
.picker-tree-container[b-i50i1mvhbf] {
    border: 1px solid var(--kendo-component-border);
    border-radius: var(--kendo-border-radius-md);
    overflow: auto;
    background-color: var(--kendo-component-bg);
    position: relative;
}

    .picker-tree-container:focus-within[b-i50i1mvhbf] {
        border-color: var(--kendo-color-primary);
        box-shadow: 0 0 0 0.25rem rgba(var(--kendo-color-primary-rgb), 0.25);
    }

/* Tree Styling */
.modern-tree[b-i50i1mvhbf] {
    padding: var(--kendo-spacing-1);
}

.tree-item-content[b-i50i1mvhbf] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-1);
    padding: var(--kendo-spacing-0\.5) 0;
    cursor: pointer;
}

.tree-item-text[b-i50i1mvhbf] {
    flex-grow: 1;
}

    .tree-item-text.highlighted mark[b-i50i1mvhbf] {
        background-color: var(--kendo-color-warning-subtle);
        color: var(--kendo-color-on-app-surface);
        padding: 0 2px;
        border-radius: 2px;
    }

.item-count[b-i50i1mvhbf] {
    color: var(--kendo-subtle-text);
    font-size: 0.875em;
}

/* Search Match Highlighting */
.modern-tree[b-i50i1mvhbf]  .k-treeview-item.search-match > .k-treeview-bot > .k-treeview-mid {
    background-color: var(--kendo-color-primary-subtle);
    border-radius: var(--kendo-border-radius-sm);
}

/* Empty State */
.empty-state[b-i50i1mvhbf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--kendo-subtle-text);
    gap: var(--kendo-spacing-2);
}

    .empty-state p[b-i50i1mvhbf] {
        margin: 0;
    }

/* Dark Theme Support */
@media (prefers-color-scheme: dark) {
    .picker-selection-info[b-i50i1mvhbf] {
        background-color: rgba(255, 255, 255, 0.04);
    }

    .tree-item-text.highlighted mark[b-i50i1mvhbf] {
        background-color: rgba(255, 193, 7, 0.3);
    }

    .chip-tooltip[b-i50i1mvhbf] {
        background-color: var(--kendo-color-surface);
        color: var(--kendo-color-on-surface);
    }
}

/* Responsive Design */
@media (max-width: 576px) {
    .selection-chip[b-i50i1mvhbf] {
        max-width: 150px;
    }

    .tree-item-picker:not(.compact)[b-i50i1mvhbf] {
        gap: var(--kendo-spacing-1);
    }

    .chip-tooltip[b-i50i1mvhbf],
    .node-tooltip-scorecard[b-i50i1mvhbf] {
        max-width: 250px;
    }
}

/* Animation */
.picker-selection-info[b-i50i1mvhbf],
.picker-tree-container[b-i50i1mvhbf] {
    animation: fadeIn-b-i50i1mvhbf 0.3s ease-out;
}

@keyframes fadeIn-b-i50i1mvhbf {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tooltip Animation Override for smoother appearance */
[b-i50i1mvhbf] .k-animation-container.k-animation-container-shown {
    animation: tooltipFadeIn-b-i50i1mvhbf 0.2s ease-out;
}

@keyframes tooltipFadeIn-b-i50i1mvhbf {
    from {
        opacity: 0;
        transform: translateY(-2px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Hover effect for tree items */
.tree-item-content:hover[b-i50i1mvhbf] {
    background-color: var(--kendo-hover-bg);
    border-radius: var(--kendo-border-radius-sm);
}
/* /Components/Shared/Viewers/ImageViewer.razor.rz.scp.css */
/* Container Modes */
.image-viewer-container[b-71nc9o0crs] {
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    user-select: none;
}

.image-viewer-inline[b-71nc9o0crs] {
    border: 1px solid var(--kendo-color-border-alt, #D1D1D1);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    background-color: var(--kendo-color-app-surface, #ffffff);
}

.image-viewer-modal[b-71nc9o0crs],
.image-viewer-fullscreen[b-71nc9o0crs] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10500;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-viewer-overlay[b-71nc9o0crs] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(4px);
    z-index: -1;
}

.image-viewer-wrapper[b-71nc9o0crs] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    box-shadow: var(--kendo-elevation-6, 0 2.4px 7.2px rgba(0, 0, 0, 0.18));
    overflow: hidden;
}

.image-viewer-modal .image-viewer-wrapper[b-71nc9o0crs] {
    width: 90vw;
    max-width: 1400px;
    height: 85vh;
    max-height: 900px;
}

.image-viewer-fullscreen .image-viewer-wrapper[b-71nc9o0crs] {
    width: 100vw;
    height: 100vh;
    border-radius: 0;
}

/* Toolbar */
.image-viewer-toolbar[b-71nc9o0crs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(10px);
    flex-shrink: 0;
}

.image-viewer-toolbar-left[b-71nc9o0crs],
.image-viewer-toolbar-right[b-71nc9o0crs] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-3, 0.75rem);
}

.image-viewer-title[b-71nc9o0crs] {
    margin: 0;
    font-size: var(--kendo-font-size-lg, 1.125rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: #ffffff;
}

.image-viewer-metadata-badge[b-71nc9o0crs] {
    padding: var(--kendo-spacing-1, 0.25rem) var(--kendo-spacing-2, 0.5rem);
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    font-size: var(--kendo-font-size-sm, 0.75rem);
    color: rgba(255, 255, 255, 0.7);
}

.image-viewer-zoom-level[b-71nc9o0crs] {
    min-width: 48px;
    text-align: center;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: #ffffff;
}

.image-viewer-gallery-counter[b-71nc9o0crs] {
    padding: var(--kendo-spacing-1, 0.25rem) var(--kendo-spacing-2, 0.5rem);
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    font-size: var(--kendo-font-size-sm, 0.75rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: #ffffff;
}

.image-viewer-toolbar-button[b-71nc9o0crs] {
    min-width: auto;
    padding: var(--kendo-spacing-2, 0.5rem);
    background-color: transparent;
    color: #ffffff;
}

    .image-viewer-toolbar-button:hover[b-71nc9o0crs] {
        background-color: rgba(255, 255, 255, 0.1);
    }

.image-viewer-close-button[b-71nc9o0crs] {
    color: var(--kendo-color-error, #ef4444);
}

/* Content Area */
.image-viewer-content[b-71nc9o0crs] {
    flex: 1;
    position: relative;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.95);
}

/* Loading State */
.image-viewer-loader[b-71nc9o0crs] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--kendo-spacing-4, 1rem);
    color: rgba(255, 255, 255, 0.7);
}

/* Empty State */
.image-viewer-empty[b-71nc9o0crs] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--kendo-spacing-2, 0.5rem);
    color: rgba(255, 255, 255, 0.5);
}

/* Image Container */
.image-viewer-image-container[b-71nc9o0crs] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.image-viewer-image[b-71nc9o0crs] {
    display: block;
    max-width: none;
    transform-origin: center center;
}

/* Image Fit Modes */
.image-fit-contain[b-71nc9o0crs] {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.image-fit-cover[b-71nc9o0crs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.image-fit-actual[b-71nc9o0crs] {
    width: auto;
    height: auto;
}

.image-fit-fill[b-71nc9o0crs] {
    width: 100%;
    height: 100%;
    object-fit: fill;
}

/* Gallery Navigation */
.image-viewer-gallery-controls[b-71nc9o0crs] {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    padding: 0 var(--kendo-spacing-4, 1rem);
}

.image-viewer-nav-button[b-71nc9o0crs] {
    pointer-events: auto;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #ffffff;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.7;
    transition: opacity 0.2s ease, background-color 0.2s ease;
}

    .image-viewer-nav-button:hover:not(:disabled)[b-71nc9o0crs] {
        opacity: 1;
        background-color: rgba(0, 0, 0, 0.8);
    }

    .image-viewer-nav-button:disabled[b-71nc9o0crs] {
        opacity: 0.3;
        cursor: not-allowed;
    }

/* Caption */
.image-viewer-caption[b-71nc9o0crs] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
    color: #ffffff;
    font-size: var(--kendo-font-size-sm, 0.75rem);
    text-align: center;
}

/* Thumbnails */
.image-viewer-thumbnails[b-71nc9o0crs] {
    display: flex;
    gap: var(--kendo-spacing-2, 0.5rem);
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    background-color: rgba(0, 0, 0, 0.8);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    overflow-x: auto;
    overflow-y: hidden;
    flex-shrink: 0;
}

.image-viewer-thumbnail[b-71nc9o0crs] {
    flex-shrink: 0;
    width: 80px;
    height: 60px;
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color 0.2s ease, transform 0.2s ease;
}

    .image-viewer-thumbnail:hover[b-71nc9o0crs] {
        border-color: rgba(255, 255, 255, 0.3);
        transform: scale(1.05);
    }

    .image-viewer-thumbnail.active[b-71nc9o0crs] {
        border-color: var(--kendo-color-primary, #8155B9);
    }

    .image-viewer-thumbnail img[b-71nc9o0crs] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

/* Light Theme Overrides (when displayed in light theme context) */
.image-viewer-theme-light.image-viewer-inline .image-viewer-wrapper[b-71nc9o0crs] {
    background-color: var(--kendo-color-app-surface, #ffffff);
}

.image-viewer-theme-light.image-viewer-inline .image-viewer-content[b-71nc9o0crs] {
    background-color: var(--kendo-color-surface-alt, #f8f8f8);
}

.image-viewer-theme-light.image-viewer-inline .image-viewer-toolbar[b-71nc9o0crs] {
    background-color: var(--kendo-color-surface-alt, #f8f8f8);
    border-bottom-color: var(--kendo-color-border-alt, #D1D1D1);
}

.image-viewer-theme-light.image-viewer-inline .image-viewer-title[b-71nc9o0crs],
.image-viewer-theme-light.image-viewer-inline .image-viewer-zoom-level[b-71nc9o0crs],
.image-viewer-theme-light.image-viewer-inline .image-viewer-gallery-counter[b-71nc9o0crs] {
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

.image-viewer-theme-light.image-viewer-inline .image-viewer-toolbar-button[b-71nc9o0crs] {
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

    .image-viewer-theme-light.image-viewer-inline .image-viewer-toolbar-button:hover[b-71nc9o0crs] {
        background-color: var(--kendo-color-base-hover, #e0e0e0);
    }

/* Responsive Design */
@media (max-width: 768px) {
    .image-viewer-modal .image-viewer-wrapper[b-71nc9o0crs] {
        width: 100vw;
        height: 100vh;
        border-radius: 0;
    }

    .image-viewer-toolbar[b-71nc9o0crs] {
        flex-direction: column;
        align-items: stretch;
        gap: var(--kendo-spacing-2, 0.5rem);
    }

    .image-viewer-toolbar-left[b-71nc9o0crs],
    .image-viewer-toolbar-right[b-71nc9o0crs] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .image-viewer-thumbnails[b-71nc9o0crs] {
        padding: var(--kendo-spacing-2, 0.5rem);
    }

    .image-viewer-thumbnail[b-71nc9o0crs] {
        width: 60px;
        height: 45px;
    }

    .image-viewer-nav-button[b-71nc9o0crs] {
        width: 40px;
        height: 40px;
    }
}

/* Print Styles */
@media print {
    .image-viewer-toolbar[b-71nc9o0crs],
    .image-viewer-overlay[b-71nc9o0crs],
    .image-viewer-thumbnails[b-71nc9o0crs],
    .image-viewer-gallery-controls[b-71nc9o0crs] {
        display: none !important;
    }

    .image-viewer-wrapper[b-71nc9o0crs] {
        box-shadow: none;
        border: none;
        background-color: #ffffff;
    }

    .image-viewer-content[b-71nc9o0crs] {
        overflow: visible;
        height: auto;
        background-color: #ffffff;
    }

    .image-viewer-image[b-71nc9o0crs] {
        transform: none !important;
        max-width: 100% !important;
        max-height: 100% !important;
    }
}

/* Accessibility */
.image-viewer-toolbar-button:focus-visible[b-71nc9o0crs],
.image-viewer-nav-button:focus-visible[b-71nc9o0crs],
.image-viewer-thumbnail:focus-visible[b-71nc9o0crs] {
    outline: 2px solid var(--kendo-color-primary, #8155B9);
    outline-offset: 2px;
}
/* /Components/Shared/Viewers/MarkdownViewer.razor.rz.scp.css */
/* ============================================
   MarkdownViewer Component Styles
   Document-oriented presentation for Word/PDF-like content
   
   BLAZOR CSS ISOLATION NOTES:
   - Styles for elements directly in .razor template work normally
   - Styles for dynamically injected HTML (Markdig output) require ::deep
   - ::deep must be placed before the selector needing to pierce isolation
   ============================================ */

/* ============================================
   Component Structure (Direct Template Elements)
   These elements are in the .razor file and receive scope attributes
   ============================================ */

.markdown-viewer-container[b-zfmoqst6lb] {
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.markdown-viewer-inline[b-zfmoqst6lb] {
    border: 1px solid var(--kendo-color-border-alt, #D1D1D1);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    background-color: var(--kendo-color-app-surface, #ffffff);
}

.markdown-viewer-modal[b-zfmoqst6lb],
.markdown-viewer-fullscreen[b-zfmoqst6lb] {
    position: fixed;
    inset: 0;
    z-index: 10500;
    display: flex;
    align-items: center;
    justify-content: center;
}

.markdown-viewer-overlay[b-zfmoqst6lb] {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    z-index: -1;
}

.markdown-viewer-wrapper[b-zfmoqst6lb] {
    display: flex;
    flex-direction: column;
    height: 100%;
    background-color: var(--kendo-color-app-surface, #ffffff);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    box-shadow: var(--kendo-elevation-6, 0 2.4px 7.2px rgba(0, 0, 0, 0.18));
}

.markdown-viewer-modal .markdown-viewer-wrapper[b-zfmoqst6lb] {
    width: 90vw;
    max-width: 1200px;
    height: 85vh;
    max-height: 900px;
}

.markdown-viewer-fullscreen .markdown-viewer-wrapper[b-zfmoqst6lb] {
    width: 100vw;
    height: 100vh;
    border-radius: 0;
}

/* Toolbar */
.markdown-viewer-toolbar[b-zfmoqst6lb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--kendo-spacing-3, 0.75rem) var(--kendo-spacing-4, 1rem);
    border-bottom: 1px solid var(--kendo-color-border-alt, #D1D1D1);
    background-color: var(--kendo-color-surface-alt, #f8f8f8);
    border-radius: var(--kendo-border-radius-md, 0.25rem) var(--kendo-border-radius-md, 0.25rem) 0 0;
    flex-shrink: 0;
}

.markdown-viewer-toolbar-left[b-zfmoqst6lb],
.markdown-viewer-toolbar-right[b-zfmoqst6lb] {
    display: flex;
    align-items: center;
    gap: var(--kendo-spacing-2, 0.5rem);
}

.markdown-viewer-title[b-zfmoqst6lb] {
    margin: 0;
    font-size: var(--kendo-font-size-lg, 1.125rem);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

.markdown-viewer-toolbar-button[b-zfmoqst6lb] {
    min-width: auto;
    padding: var(--kendo-spacing-2, 0.5rem);
}

.markdown-viewer-close-button[b-zfmoqst6lb] {
    color: var(--kendo-color-error, #ef4444);
}

/* Content Area */
.markdown-viewer-content[b-zfmoqst6lb] {
    flex: 1;
    overflow-y: auto;
    padding: var(--kendo-spacing-5, 1.25rem) var(--kendo-spacing-6, 1.5rem);
    background-color: var(--kendo-color-app-surface, #ffffff);
}

.markdown-viewer-inline .markdown-viewer-content[b-zfmoqst6lb] {
    border-radius: 0 0 var(--kendo-border-radius-md, 0.25rem) var(--kendo-border-radius-md, 0.25rem);
}

/* Loading & Empty States */
.markdown-viewer-loader[b-zfmoqst6lb],
.markdown-viewer-empty[b-zfmoqst6lb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--kendo-spacing-8, 2rem);
    color: var(--kendo-color-subtle, #6E6E6E);
    gap: var(--kendo-spacing-3, 0.75rem);
}

[b-zfmoqst6lb] .markdown-viewer-empty .k-icon {
    font-size: 2.5rem;
    opacity: 0.5;
}

/* ============================================
   Rendered Document Content (Dynamic HTML)
   These elements are injected via MarkupString and need ::deep
   ============================================ */

/* Base container for rendered content */
.markdown-viewer-rendered[b-zfmoqst6lb] {
    font-family: var(--kendo-font-family, inherit);
    font-size: var(--kendo-font-size, 0.9rem);
    line-height: 1.65;
    color: var(--kendo-color-on-app-surface, #1F1F1F);
    max-width: 100%;
}

/* --- Headers (Document Hierarchy) --- */
[b-zfmoqst6lb] .markdown-viewer-rendered h1,
[b-zfmoqst6lb] .markdown-viewer-rendered h2,
[b-zfmoqst6lb] .markdown-viewer-rendered h3,
[b-zfmoqst6lb] .markdown-viewer-rendered h4,
[b-zfmoqst6lb] .markdown-viewer-rendered h5,
[b-zfmoqst6lb] .markdown-viewer-rendered h6 {
    margin-top: 1.5em;
    margin-bottom: 0.6em;
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #1F1F1F);
    line-height: 1.3;
}

[b-zfmoqst6lb] .markdown-viewer-rendered h1 {
    font-size: 1.75rem;
    padding-bottom: 0.4em;
    border-bottom: 2px solid var(--kendo-color-primary, #8155B9);
}

[b-zfmoqst6lb] .markdown-viewer-rendered h2 {
    font-size: 1.4rem;
    padding-bottom: 0.3em;
    border-bottom: 1px solid var(--kendo-color-border-alt, #D1D1D1);
}

[b-zfmoqst6lb] .markdown-viewer-rendered h3 {
    font-size: 1.2rem;
    color: var(--kendo-color-primary, #8155B9);
}

[b-zfmoqst6lb] .markdown-viewer-rendered h4 {
    font-size: 1.05rem;
}

[b-zfmoqst6lb] .markdown-viewer-rendered h5 {
    font-size: 0.95rem;
    font-weight: var(--kendo-font-weight-medium, 500);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--kendo-color-subtle, #6E6E6E);
}

[b-zfmoqst6lb] .markdown-viewer-rendered h6 {
    font-size: 0.9rem;
    font-weight: var(--kendo-font-weight-medium, 500);
    color: var(--kendo-color-subtle, #6E6E6E);
}

/* First heading no top margin */
[b-zfmoqst6lb] .markdown-viewer-rendered > h1:first-child,
[b-zfmoqst6lb] .markdown-viewer-rendered > h2:first-child,
[b-zfmoqst6lb] .markdown-viewer-rendered > h3:first-child {
    margin-top: 0;
}

/* --- Paragraphs --- */
[b-zfmoqst6lb] .markdown-viewer-rendered p {
    margin-bottom: 1em;
}

/* --- Links --- */
[b-zfmoqst6lb] .markdown-viewer-rendered a {
    color: var(--kendo-color-primary, #8155B9);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s ease, color 0.15s ease;
}

    [b-zfmoqst6lb] .markdown-viewer-rendered a:hover {
        color: var(--kendo-color-primary-hover, #7147A6);
        border-bottom-color: currentColor;
    }

/* --- Lists --- */
[b-zfmoqst6lb] .markdown-viewer-rendered ul,
[b-zfmoqst6lb] .markdown-viewer-rendered ol {
    margin-bottom: 1em;
    padding-left: 1.75em;
}

[b-zfmoqst6lb] .markdown-viewer-rendered li {
    margin-bottom: 0.35em;
}

    [b-zfmoqst6lb] .markdown-viewer-rendered li > ul,
    [b-zfmoqst6lb] .markdown-viewer-rendered li > ol {
        margin-top: 0.35em;
        margin-bottom: 0;
    }

/* Task lists */
[b-zfmoqst6lb] .markdown-viewer-rendered input[type="checkbox"] {
    margin-right: 0.5em;
    accent-color: var(--kendo-color-primary, #8155B9);
}

/* --- Tables (Office Document Style) --- */
[b-zfmoqst6lb] .markdown-viewer-rendered table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.25em 0;
    font-size: 0.875em;
    border: 1px solid var(--kendo-color-border-alt, #D1D1D1);
}

[b-zfmoqst6lb] .markdown-viewer-rendered th,
[b-zfmoqst6lb] .markdown-viewer-rendered td {
    padding: 0.6em 0.85em;
    border: 1px solid var(--kendo-color-border-alt, #D1D1D1);
    text-align: left;
    vertical-align: top;
}

[b-zfmoqst6lb] .markdown-viewer-rendered th {
    background-color: var(--kendo-color-surface-alt, #f5f5f5);
    font-weight: var(--kendo-font-weight-semibold, 600);
    color: var(--kendo-color-on-app-surface, #1F1F1F);
}

[b-zfmoqst6lb] .markdown-viewer-rendered tr:nth-child(even) td {
    background-color: var(--kendo-color-surface-alt, rgba(0, 0, 0, 0.02));
}

[b-zfmoqst6lb] .markdown-viewer-rendered tr:hover td {
    background-color: var(--kendo-color-primary-subtle, rgba(129, 85, 185, 0.08));
}

/* --- Code --- */
[b-zfmoqst6lb] .markdown-viewer-rendered code {
    font-family: var(--kendo-font-family-monospace, 'Consolas', 'Monaco', monospace);
    font-size: 0.875em;
    background-color: var(--kendo-color-surface-alt, #f5f5f5);
    border: 1px solid var(--kendo-color-border-alt, #e0e0e0);
    border-radius: 3px;
    padding: 0.15em 0.4em;
}

[b-zfmoqst6lb] .markdown-viewer-rendered pre {
    background-color: var(--kendo-color-surface-alt, #f8f8f8);
    border: 1px solid var(--kendo-color-border-alt, #D1D1D1);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    padding: 1em;
    overflow-x: auto;
    margin: 1em 0;
    font-size: 0.85em;
    line-height: 1.5;
}

    [b-zfmoqst6lb] .markdown-viewer-rendered pre code {
        background: none;
        border: none;
        padding: 0;
        font-size: inherit;
    }

/* --- Blockquotes --- */
[b-zfmoqst6lb] .markdown-viewer-rendered blockquote {
    margin: 1em 0;
    padding: 0.75em 1em;
    border-left: 4px solid var(--kendo-color-primary, #8155B9);
    background-color: var(--kendo-color-surface-alt, #fafafa);
    color: var(--kendo-color-subtle, #555);
}

    [b-zfmoqst6lb] .markdown-viewer-rendered blockquote p:last-child {
        margin-bottom: 0;
    }

/* --- Horizontal Rule --- */
[b-zfmoqst6lb] .markdown-viewer-rendered hr {
    border: 0;
    border-top: 1px solid var(--kendo-color-border-alt, #D1D1D1);
    margin: 1.5em 0;
}

/* --- Images --- */
[b-zfmoqst6lb] .markdown-viewer-rendered img {
    max-width: 100%;
    height: auto;
    border-radius: var(--kendo-border-radius-sm, 0.125rem);
    margin: 1em 0;
}

/* --- Mermaid Diagrams --- */
[b-zfmoqst6lb] .markdown-viewer-rendered .mermaid {
    text-align: center;
    margin: 1.5em 0;
    padding: 1em;
    background-color: var(--kendo-color-surface-alt, #fafafa);
    border: 1px solid var(--kendo-color-border-alt, #D1D1D1);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    overflow-x: auto;
}

/* SVG in mermaid or inline */
[b-zfmoqst6lb] .markdown-viewer-rendered svg {
    max-width: 100%;
    height: auto;
}

/* --- Error Display --- */
[b-zfmoqst6lb] .markdown-viewer-rendered .markdown-error {
    padding: 1em;
    background-color: var(--kendo-color-error-subtle, #fde7e9);
    border: 1px solid var(--kendo-color-error, #ef4444);
    border-radius: var(--kendo-border-radius-md, 0.25rem);
    color: var(--kendo-color-error, #ef4444);
}

/* ============================================
   Dark Theme Overrides
   Using ::deep for dynamic content
   ============================================ */
[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered h3 {
    color: var(--kendo-color-primary, #a78bda);
}

[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered h5,
[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered h6 {
    color: var(--kendo-color-subtle, #aaa);
}

[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered pre,
[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered code {
    background-color: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
}

[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered th {
    background-color: rgba(255, 255, 255, 0.08);
}

[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered tr:nth-child(even) td {
    background-color: rgba(255, 255, 255, 0.03);
}

[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered tr:hover td {
    background-color: rgba(129, 85, 185, 0.15);
}

[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered blockquote {
    background-color: rgba(255, 255, 255, 0.04);
    border-left-color: var(--kendo-color-primary, #a78bda);
}

[b-zfmoqst6lb] .markdown-viewer-theme-dark .markdown-viewer-rendered .mermaid {
    background-color: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.12);
}

/* ============================================
   Responsive
   ============================================ */
@media (max-width: 768px) {
    .markdown-viewer-modal .markdown-viewer-wrapper[b-zfmoqst6lb] {
        width: 95vw;
        height: 90vh;
    }

    .markdown-viewer-toolbar[b-zfmoqst6lb] {
        flex-wrap: wrap;
        gap: var(--kendo-spacing-2, 0.5rem);
    }

    .markdown-viewer-content[b-zfmoqst6lb] {
        padding: var(--kendo-spacing-3, 0.75rem);
    }

    [b-zfmoqst6lb] .markdown-viewer-rendered table {
        font-size: 0.8em;
    }

    [b-zfmoqst6lb] .markdown-viewer-rendered th,
    [b-zfmoqst6lb] .markdown-viewer-rendered td {
        padding: 0.4em 0.5em;
    }
}

/* ============================================
   Print
   ============================================ */
@media print {
    .markdown-viewer-toolbar[b-zfmoqst6lb],
    .markdown-viewer-overlay[b-zfmoqst6lb] {
        display: none !important;
    }

    .markdown-viewer-wrapper[b-zfmoqst6lb] {
        box-shadow: none;
        border: none;
    }

    .markdown-viewer-content[b-zfmoqst6lb] {
        overflow: visible;
        height: auto;
    }

    [b-zfmoqst6lb] .markdown-viewer-rendered {
        color: #000;
    }

        [b-zfmoqst6lb] .markdown-viewer-rendered a {
            color: #000;
            text-decoration: underline;
        }

        [b-zfmoqst6lb] .markdown-viewer-rendered pre,
        [b-zfmoqst6lb] .markdown-viewer-rendered code {
            border: 1px solid #ccc;
        }

        [b-zfmoqst6lb] .markdown-viewer-rendered tr:hover td {
            background-color: inherit;
        }
}