/* GROWTH_G5B1_CENTRAL_APPEARANCE_CSS_V1 */

:root{
    --k-brand-primary:#5a3472;
    --k-brand-primary-strong:#3c2450;
    --k-brand-primary-soft:#f3e8ff;
    --k-brand-accent:#7c4dff;

    --k-surface-page:#faf7fc;
    --k-surface-card:#ffffff;
    --k-surface-raised:#ffffff;
    --k-surface-muted:#f6f0f8;

    --k-text-primary:#2b1838;
    --k-text-secondary:#6f6079;
    --k-text-inverse:#ffffff;

    --k-border:#eadff3;
    --k-focus:rgba(124,77,255,.28);
    --k-overlay:rgba(31,18,40,.55);

    --k-success:#16a34a;
    --k-warning:#d97706;
    --k-danger:#dc2626;

    --k-shadow-card:
        0 14px 34px rgba(31,18,40,.10);

    --k-shadow-raised:
        0 22px 55px rgba(31,18,40,.18);

    --k-radius-sm:12px;
    --k-radius-md:18px;
    --k-radius-lg:28px;

    color-scheme:light;
}

html[data-k-theme="dark"]{
    --k-brand-primary:#b98bd4;
    --k-brand-primary-strong:#e2c6f1;
    --k-brand-primary-soft:#2b1a34;
    --k-brand-accent:#b59aff;

    --k-surface-page:#130d17;
    --k-surface-card:#1d1422;
    --k-surface-raised:#271b2e;
    --k-surface-muted:#211627;

    --k-text-primary:#f7effb;
    --k-text-secondary:#c9b9d1;
    --k-text-inverse:#170d1c;

    --k-border:#493653;
    --k-focus:rgba(181,154,255,.34);
    --k-overlay:rgba(0,0,0,.72);

    --k-success:#4ade80;
    --k-warning:#fbbf24;
    --k-danger:#fb7185;

    --k-shadow-card:
        0 16px 38px rgba(0,0,0,.34);

    --k-shadow-raised:
        0 24px 64px rgba(0,0,0,.48);

    color-scheme:dark;
}

.k-appearance-surface{
    background-color:
        var(--k-surface-page);

    color:
        var(--k-text-primary);

    transition:
        background-color .2s ease,
        color .2s ease;
}

.k-appearance-surface input,
.k-appearance-surface select,
.k-appearance-surface textarea{
    color:
        var(--k-text-primary);

    background-color:
        var(--k-surface-card);

    border-color:
        var(--k-border);
}

.k-appearance-surface input:focus,
.k-appearance-surface select:focus,
.k-appearance-surface textarea:focus,
.k-appearance-surface button:focus-visible,
.k-appearance-surface a:focus-visible{
    outline:
        3px solid var(--k-focus);

    outline-offset:2px;
}

.k-appearance-settings{
    margin-top:24px;
    padding:22px;
    border:
        1px solid var(--k-border);
    border-radius:
        var(--k-radius-lg);
    background:
        var(--k-surface-card);
    color:
        var(--k-text-primary);
    box-shadow:
        var(--k-shadow-card);
}

.k-appearance-settings__header{
    margin-bottom:18px;
}

.k-appearance-settings__header h2{
    margin:0;
    color:
        var(--k-text-primary);
}

.k-appearance-settings__header p{
    margin:7px 0 0;
    color:
        var(--k-text-secondary);
    line-height:1.9;
}

.k-appearance-settings__grid{
    display:grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        );
    gap:16px;
}

.k-appearance-settings__field{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.k-appearance-settings__field label{
    color:
        var(--k-text-primary);
    font-weight:800;
}

.k-appearance-settings__field select{
    min-height:46px;
    padding:0 13px;
    border:
        1px solid var(--k-border);
    border-radius:
        var(--k-radius-sm);
}

.k-appearance-settings__check{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:46px;
    padding:11px 13px;
    border:
        1px solid var(--k-border);
    border-radius:
        var(--k-radius-sm);
    background:
        var(--k-surface-muted);
}

.k-appearance-settings__check input{
    width:19px;
    height:19px;
    accent-color:
        var(--k-brand-primary);
}

.k-appearance-switch{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-top:18px;
    padding:14px;
    border:
        1px solid var(--k-border);
    border-radius:
        var(--k-radius-md);
    background:
        var(--k-surface-muted);
}

.k-appearance-switch__label{
    color:
        var(--k-text-primary);
    font-weight:900;
}

.k-appearance-switch__options{
    display:inline-flex;
    gap:5px;
    padding:4px;
    border-radius:999px;
    background:
        var(--k-surface-card);
    box-shadow:
        inset 0 0 0 1px var(--k-border);
}

.k-appearance-switch__button{
    min-height:36px;
    padding:0 13px;
    border:0;
    border-radius:999px;
    background:transparent;
    color:
        var(--k-text-secondary);
    cursor:pointer;
    font-family:inherit;
    font-weight:800;
}

.k-appearance-switch__button.is-active,
.k-appearance-switch__button[aria-pressed="true"]{
    background:
        var(--k-brand-primary);
    color:
        var(--k-text-inverse);
}

.k-appearance-switch__button:disabled{
    cursor:not-allowed;
    opacity:.55;
}

.k-appearance-switch__help{
    color:
        var(--k-text-secondary);
}

@media(max-width:720px){
    .k-appearance-settings__grid{
        grid-template-columns:1fr;
    }

    .k-appearance-switch{
        align-items:stretch;
        flex-direction:column;
    }

    .k-appearance-switch__options{
        display:grid;
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }
}

@media(prefers-reduced-motion:reduce){
    .k-appearance-surface,
    .k-appearance-surface *,
    .k-appearance-surface *::before,
    .k-appearance-surface *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        scroll-behavior:auto !important;
        transition-duration:.01ms !important;
    }
}

@media print{
    :root,
    html[data-k-theme="dark"]{
        --k-surface-page:#ffffff;
        --k-surface-card:#ffffff;
        --k-surface-raised:#ffffff;
        --k-surface-muted:#ffffff;
        --k-text-primary:#000000;
        --k-text-secondary:#333333;
        --k-border:#cccccc;
        color-scheme:light;
    }

    .k-appearance-switch{
        display:none !important;
    }
}

/* GROWTH_G5B3_SHARED_SIDEBAR_APPEARANCE_CSS_V1 */

.k-sidebar-appearance{
    margin:0 0 14px;
    border:
        1px solid rgba(255,255,255,.16);
    border-radius:18px;
    background:
        rgba(255,255,255,.08);
    overflow:hidden;
}

.k-sidebar-appearance__summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
    min-height:43px;
    padding:9px 12px;
    color:#fff;
    cursor:pointer;
    font-family:inherit;
    font-size:13.5px;
    font-weight:900;
    line-height:1.8;
    list-style:none;
    user-select:none;
}

.k-sidebar-appearance__summary::-webkit-details-marker{
    display:none;
}

.k-sidebar-appearance__summary:focus-visible{
    outline:
        3px solid rgba(255,255,255,.52);
    outline-offset:-3px;
}

.k-sidebar-appearance__icon{
    display:inline-grid;
    place-items:center;
    width:26px;
    height:26px;
    flex:0 0 26px;
    border-radius:999px;
    background:
        rgba(255,255,255,.14);
    font-size:17px;
}

.k-sidebar-appearance__chevron{
    margin-inline-start:auto;
    font-size:21px;
    line-height:1;
    transition:
        transform .18s ease;
}

.k-sidebar-appearance[open]
.k-sidebar-appearance__chevron{
    transform:rotate(-90deg);
}

.k-sidebar-appearance__panel{
    padding:0 9px 9px;
}

.k-sidebar-appearance
.k-appearance-switch{
    display:grid;
    align-items:stretch;
    gap:9px;
    margin:0;
    padding:10px;
    border:
        1px solid rgba(255,255,255,.13);
    border-radius:14px;
    background:
        rgba(255,255,255,.09);
}

.k-sidebar-appearance
.k-appearance-switch__label{
    color:#fff;
    font-size:12.5px;
}

.k-sidebar-appearance
.k-appearance-switch__options{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    width:100%;
    background:
        rgba(255,255,255,.11);
    box-shadow:
        inset 0 0 0 1px
        rgba(255,255,255,.13);
}

.k-sidebar-appearance
.k-appearance-switch__button{
    min-width:0;
    min-height:34px;
    padding:0 7px;
    color:
        rgba(255,255,255,.82);
    font-size:11.5px;
}

.k-sidebar-appearance
.k-appearance-switch__button:hover:not(:disabled){
    color:#fff;
    background:
        rgba(255,255,255,.10);
}

.k-sidebar-appearance
.k-appearance-switch__button.is-active,
.k-sidebar-appearance
.k-appearance-switch__button[aria-pressed="true"]{
    background:#fff;
    color:
        var(--k-brand-primary-strong);
}

.k-sidebar-appearance
.k-appearance-switch__help{
    color:
        rgba(255,255,255,.76);
    font-size:11.5px;
    line-height:1.9;
}

@media(max-width:720px){
    .k-sidebar-appearance{
        margin-bottom:12px;
    }

    .k-sidebar-appearance__summary{
        min-height:41px;
    }
}

@media(prefers-reduced-motion:reduce){
    .k-sidebar-appearance__chevron{
        transition:none;
    }
}

@media print{
    .k-sidebar-appearance{
        display:none !important;
    }
}

/* GROWTH_G5B5C_VERIFIED_CENTRAL_DARK_COMPATIBILITY_V1 */

/*
 * Scope contract:
 * - Dark Theme only.
 * - Appearance-enabled surfaces only.
 * - No View, Status, Banner or Payment meaning changes.
 */

html[data-k-theme="dark"] body.k-appearance-surface{
    background:
        radial-gradient(
            circle at top right,
            rgba(185,139,212,.11),
            transparent 34%
        ),
        radial-gradient(
            circle at bottom left,
            rgba(181,154,255,.08),
            transparent 34%
        ),
        var(--k-surface-page) !important;

    color:
        var(--k-text-primary) !important;
}

/* Verified neutral cards, boxes and panels. */
html[data-k-theme="dark"] .k-appearance-surface :is(
    .k-preview-card,
    .k-basic-card,
    .k-order-info-box,
    .k-order-price-box,
    .k-summary-row,
    .k-address-box,
    .k-status-card,
    .k-summary-card,
    .k-admin-card,
    .k-admin-stat,
    .k-admin-setting-card,
    .k-admin-wallet-stat,
    .k-admin-filter-panel,
    .k-admin-booklets-filter,
    .k-admin-booklets-count,
    .k-course-filter-box,
    .k-pagination,
    .k-course-live-box > div,
    .k-discount-edit-details,
    .k-admin-empty,
    .k-course-no-result,
    .k-admin-image-empty,
    .k-preview-empty,
    .k-discount-card,
    .box,
    .k-dashboard-notification-dialog,
    .k-student-delete-dialog
){
    background:
        var(--k-surface-card) !important;

    color:
        var(--k-text-primary) !important;

    border-color:
        var(--k-border) !important;
}

/* Raised and read-only neutral surfaces. */
html[data-k-theme="dark"] .k-appearance-surface :is(
    .k-delivery-setting-fixed,
    .k-admin-input[readonly],
    .k-admin-select[readonly]
){
    background:
        var(--k-surface-muted) !important;

    color:
        var(--k-text-secondary) !important;

    border-color:
        var(--k-border) !important;
}

/* Tables: preserve Badges and Status colors inside cells. */
html[data-k-theme="dark"] .k-appearance-surface .k-admin-table th{
    background:
        var(--k-surface-muted) !important;

    color:
        var(--k-text-primary) !important;

    border-color:
        var(--k-border) !important;
}

html[data-k-theme="dark"] .k-appearance-surface .k-admin-table td{
    background:
        var(--k-surface-card) !important;

    color:
        var(--k-text-primary) !important;

    border-color:
        var(--k-border) !important;
}

html[data-k-theme="dark"] .k-appearance-surface
.k-admin-op-table
tbody
tr:not(.k-admin-op-source-row),
html[data-k-theme="dark"] .k-appearance-surface
.k-admin-op-table
tbody
tr:not(.k-admin-op-source-row)
td{
    background:
        var(--k-surface-card) !important;

    color:
        var(--k-text-primary) !important;

    border-color:
        var(--k-border) !important;
}

/* Form controls with exclusions for semantic Button-like inputs. */
html[data-k-theme="dark"] .k-appearance-surface :is(
    input:not(
        [type="hidden"]
    ):not(
        [type="checkbox"]
    ):not(
        [type="radio"]
    ):not(
        [type="range"]
    ):not(
        [type="color"]
    ):not(
        [type="button"]
    ):not(
        [type="submit"]
    ):not(
        [type="reset"]
    ):not(
        [type="image"]
    ),
    select,
    textarea,
    .k-admin-input,
    .k-admin-select,
    .k-course-filter-input,
    .k-course-filter-select,
    .k-input,
    .k-ajax-qty-input
){
    background:
        var(--k-surface-raised) !important;

    color:
        var(--k-text-primary) !important;

    border-color:
        var(--k-border) !important;

    caret-color:
        var(--k-text-primary);

    color-scheme:
        dark;
}

html[data-k-theme="dark"] .k-appearance-surface :is(
    input,
    textarea
)::placeholder{
    color:
        var(--k-text-secondary) !important;

    opacity:
        .82;
}

html[data-k-theme="dark"] .k-appearance-surface :is(
    input,
    select,
    textarea
):disabled,
html[data-k-theme="dark"] .k-appearance-surface :is(
    input,
    textarea
)[readonly]{
    background:
        var(--k-surface-muted) !important;

    color:
        var(--k-text-secondary) !important;

    opacity:
        1;
}

html[data-k-theme="dark"] .k-appearance-surface :is(
    select,
    option,
    optgroup
){
    background-color:
        var(--k-surface-raised);

    color:
        var(--k-text-primary);
}

/* Verified text that was hard-coded for Light surfaces. */
html[data-k-theme="dark"] .k-appearance-surface :is(
    .k-order-item-title,
    .k-order-info-box strong,
    .k-status-row strong,
    .k-booklet-title-cell strong,
    .k-dashboard-discount-info strong,
    .k-admin-op-table-title
){
    color:
        var(--k-text-primary) !important;
}

html[data-k-theme="dark"] .k-appearance-surface :is(
    .k-order-info-box span,
    .k-status-row span,
    .k-summary-row span
){
    color:
        var(--k-text-secondary) !important;
}

/* Neutral Copy controls only; Status Buttons remain untouched. */
html[data-k-theme="dark"] .k-appearance-surface .k-copy-btn{
    background:
        var(--k-surface-muted) !important;

    color:
        var(--k-text-primary) !important;

    border-color:
        var(--k-border) !important;
}

/* Avatar placeholder, not actual uploaded images. */
html[data-k-theme="dark"] .k-appearance-surface
.k-profile-avatar-empty{
    background:
        var(--k-surface-muted) !important;

    color:
        var(--k-text-secondary) !important;

    border-color:
        var(--k-border) !important;
}

html[data-k-theme="dark"] .k-appearance-surface
.k-profile-avatar{
    border-color:
        var(--k-border) !important;
}

/* Keyboard visibility across all Appearance-enabled surfaces. */
html[data-k-theme="dark"] .k-appearance-surface :is(
    a,
    button,
    input,
    select,
    textarea,
    summary,
    [tabindex]
):focus-visible{
    outline:
        3px solid var(--k-brand-accent) !important;

    outline-offset:
        3px;

    box-shadow:
        0 0 0 4px var(--k-focus);
}

/*
 * Windows High Contrast support.
 * Browser-managed colors remain authoritative.
 */
@media (forced-colors:active){
    .k-appearance-surface :is(
        a,
        button,
        input,
        select,
        textarea,
        summary,
        [tabindex]
    ):focus-visible{
        outline:
            2px solid Highlight !important;

        box-shadow:
            none !important;
    }

    .k-appearance-switch__button,
    .k-sidebar-appearance{
        border:
            1px solid ButtonText !important;
    }
}

/* GROWTH_G5B5E_FINAL_PRINT_CASCADE_RESET_V1 */

@media print{
    html[data-k-theme="dark"]{
        color-scheme:
            light !important;
    }

    html[data-k-theme="dark"]
    body.k-appearance-surface{
        background:
            #ffffff !important;

        color:
            #000000 !important;

        color-scheme:
            light !important;

        box-shadow:
            none !important;
    }

    html[data-k-theme="dark"]
    .k-appearance-surface :is(
        input,
        select,
        textarea,
        option,
        optgroup
    ){
        background:
            #ffffff !important;

        color:
            #000000 !important;

        border-color:
            #cccccc !important;

        color-scheme:
            light !important;

        box-shadow:
            none !important;
    }
}
