html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}
/* STIG check content: preserve the formatting embedded in check/fix text */
.check-text {
    white-space: pre-wrap;
    font-size: 14px;
    padding: 8px 10px;
    border-radius: 4px;
    background: var(--kendo-color-surface-alt, #F0F3F7);
    user-select: text;
}

/* Edit view: classic split layout */
/* MAUI captions: 12pt regular in the subtle color over 13-14pt values */
.meta-label {
    display: block;
    font-weight: 400;
    font-size: 12px;
    color: var(--kendo-color-subtle, #6B7A8A);
    margin-bottom: 2px;
}
/* Drawer/detail captions: 11pt bold subtle */
.meta-label-strong {
    display: block;
    font-weight: 700;
    font-size: 11px;
    color: var(--kendo-color-subtle, #6B7A8A);
    margin-bottom: 2px;
}

/* Themed scrollbars: thumb/track follow the active swatch */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--kendo-color-base-emphasis, #B9C4D1) var(--kendo-color-base-subtle, #E4EAF2);
}

*::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

*::-webkit-scrollbar-track {
    background: var(--kendo-color-base-subtle, #E4EAF2);
}

*::-webkit-scrollbar-thumb {
    background: var(--kendo-color-base-emphasis, #B9C4D1);
    border-radius: 5px;
    border: 2px solid var(--kendo-color-base-subtle, #E4EAF2);
}

    *::-webkit-scrollbar-thumb:hover {
        background: var(--kendo-color-border-alt, var(--kendo-color-border, #98A6B5));
    }

/* Severity/status chips: MAUI grid chips are radius 4, padding 8x4, bold */
/* MAUI chip model (StatusToColorConverter): 18% tint of the status color with the
   full-strength color as text, bold 14, padding 8,4, radius 4. Call sites set --chip.
   HarborBold and the High Contrast swatches use solid fills (alpha 1.0 in MAUI). */
.status-chip {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    --chip-fallback: var(--kendo-color-subtle, #6B7A8A);
    color: var(--chip, var(--chip-fallback));
    background: color-mix(in srgb, var(--chip, var(--chip-fallback)) 18%, transparent);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}
:root[data-app-theme="harborbold"] .status-chip,
:root[data-app-theme="highcontrastdark"] .status-chip,
:root[data-app-theme="highcontrastlight"] .status-chip,
:root[data-app-theme="harborbold"] .cat-chip,
:root[data-app-theme="highcontrastdark"] .cat-chip,
:root[data-app-theme="highcontrastlight"] .cat-chip {
    background: var(--chip, var(--chip-fallback));
    color: #fff;
}

/* ── MAUI button grammar (apply via TelerikButton Class) ─────────────
   Primary-subtle = tinted main actions; semantic subtle = bordered tinted
   commands; solid error/warning/success for destructive/update/Excel. */
.k-button.app-btn-primary-subtle {
    background-color: var(--kendo-color-primary-action, var(--kendo-color-primary-subtle));
    border-color: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary-action, var(--kendo-color-primary-on-subtle));
}

    .k-button.app-btn-primary-subtle:hover {
        background-color: var(--kendo-color-primary-action-active, var(--kendo-color-primary-subtle-hover));
    }

.k-button.app-btn-secondary-subtle {
    background-color: var(--kendo-color-secondary-subtle);
    border-color: var(--kendo-color-secondary);
    color: var(--kendo-color-secondary-on-subtle);
}

    .k-button.app-btn-secondary-subtle:hover {
        background-color: var(--kendo-color-secondary-subtle-hover);
    }

.k-button.app-btn-warning-subtle {
    background-color: var(--kendo-color-warning-subtle);
    border-color: var(--kendo-color-warning);
    color: var(--kendo-color-warning-on-subtle);
}

    .k-button.app-btn-warning-subtle:hover {
        background-color: var(--kendo-color-warning-subtle-hover);
    }

.k-button.app-btn-error-subtle {
    background-color: var(--kendo-color-error-subtle);
    border-color: var(--kendo-color-error);
    color: var(--kendo-color-error-on-subtle);
}

    .k-button.app-btn-error-subtle:hover {
        background-color: var(--kendo-color-error-subtle-hover);
    }

.k-button.app-btn-error {
    background-color: var(--kendo-color-error);
    border-color: var(--kendo-color-error-emphasis, var(--kendo-color-error));
    color: var(--kendo-color-on-error);
}

    .k-button.app-btn-error:hover {
        background-color: var(--kendo-color-error-hover);
    }

.k-button.app-btn-warning {
    background-color: var(--kendo-color-warning);
    border-color: var(--kendo-color-warning-emphasis, var(--kendo-color-warning));
    color: var(--kendo-color-on-warning);
}

    .k-button.app-btn-warning:hover {
        background-color: var(--kendo-color-warning-hover);
    }

.k-button.app-btn-success {
    background-color: var(--kendo-color-success);
    border-color: var(--kendo-color-success-emphasis, var(--kendo-color-success));
    color: var(--kendo-color-on-success);
}

    .k-button.app-btn-success:hover {
        background-color: var(--kendo-color-success-hover);
    }

.k-button.app-btn-emphasis {
    background-color: var(--kendo-color-base-emphasis);
    border-color: var(--kendo-color-border-alt, var(--kendo-color-border));
    color: var(--kendo-color-secondary-on-subtle, var(--kendo-color-on-surface));
}

/* Selection group: bordered chip wrapping the selection actions + count */
.app-selection-group {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 4px;
    padding: 4px;
}
/* MAUI DgkActionButtonStyle: ContentPadding 16,10 */
.app-selection-group .k-button { padding: 10px 16px; }

/* ── Acrylic dialogs (the MaterialFrame look: blur + tinted surface) ── */
.k-window {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    background-color: color-mix(in srgb, var(--kendo-color-surface, #F6F8FB) 78%, transparent);
    backdrop-filter: blur(16px) saturate(1.15);
    -webkit-backdrop-filter: blur(16px) saturate(1.15);
}

.k-window-titlebar,
.k-window-content {
    background: transparent;
}

.k-overlay {
    background-color: #000;
    opacity: 0.5;
}

/* ── Issue Summary card (MAUI treatment) ───────────────────────────── */
.issue-summary {
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 8px;
    background: var(--kendo-color-surface-alt, #fff);
    margin: 10px 0;
    overflow: hidden;
}

.issue-sev-warning { border-color: var(--kendo-color-warning); }
.issue-sev-error { border-color: var(--kendo-color-error); }
.issue-sev-success { border-color: var(--kendo-color-success); }

.issue-summary-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    cursor: pointer;
    border-bottom: 1px solid var(--kendo-color-border, #D2DAE3);
    flex-wrap: wrap;
}

/* Tinted headers pair the subtle background with its on-subtle text color,
   so dark themes stay readable. */
.issue-head-warning { background: var(--kendo-color-warning-subtle); color: var(--kendo-color-warning-on-subtle); }
.issue-head-error { background: var(--kendo-color-error-subtle); color: var(--kendo-color-error-on-subtle); }
.issue-head-success { background: var(--kendo-color-success-subtle); color: var(--kendo-color-success-on-subtle); }

.issue-accent {
    width: 4px;
    height: 20px;
    border-radius: 2px;
    flex-shrink: 0;
}

.issue-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 12px;
    padding: 5px 10px;
    color: var(--kendo-color-on-primary, #fff);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    margin-left: 6px;
}

.issue-summary-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px;
}

.issue-detail-card {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 8px;
    background: var(--kendo-color-surface-alt, #fff);
    padding: 12px;
}

.issue-border-warning { border-color: var(--kendo-color-warning); }
.issue-border-error { border-color: var(--kendo-color-error); }

.issue-glyph {
    font-size: 20px;
    flex-shrink: 0;
}

.issue-msg {
    font-size: 12px;
    color: var(--kendo-color-on-surface, #333);
}

.k-button.issue-action {
    width: 110px;
    font-size: 12px;
    justify-content: center;
    flex-shrink: 0;
}

.issue-stats {
    display: flex;
    margin-top: 6px;
}

    .issue-stats > div {
        flex: 1;
        text-align: center;
    }

.issue-stat-count {
    font-size: 24px;
    font-weight: 700;
}

.issue-stat-caption {
    font-size: 11px;
    color: var(--kendo-color-on-surface-low, #6b7280);
}

/* ── Grid chrome (MAUI BaseDataGridStyle) ──────────────────────────── */
/* Zebra rows: app-surface / surface-alt alternating */
.k-grid .k-table-row {
    background-color: var(--kendo-color-app-surface, #EBEFF5);
}

.k-grid .k-table-alt-row {
    background-color: var(--kendo-color-surface-alt, #FFFFFF);
}

/* Per-grid row heights (MAUI: Checklists/edit 50, Revisions 40, Library 35, References 32) */
.app-rows-50 .k-table-tbody .k-table-row { height: 50px; }
.app-rows-40 .k-table-tbody .k-table-row { height: 40px; }
.app-rows-35 .k-table-tbody .k-table-row { height: 35px; }
.app-rows-32 .k-table-tbody .k-table-row { height: 32px; }

/* Column banding: the stem color at 8% over cells, 16% over headers.
   Cell tints are semi-transparent so they blend with the zebra rows. */
.k-grid td.band-primary { background-color: color-mix(in srgb, var(--kendo-color-primary) 8%, transparent); }
.k-grid td.band-secondary { background-color: color-mix(in srgb, var(--kendo-color-secondary) 8%, transparent); }
.k-grid td.band-tertiary { background-color: color-mix(in srgb, var(--kendo-color-tertiary) 8%, transparent); }
.k-grid th.band-header-primary { background-color: color-mix(in srgb, var(--kendo-color-primary) 16%, transparent); }
.k-grid th.band-header-secondary { background-color: color-mix(in srgb, var(--kendo-color-secondary) 16%, transparent); }
.k-grid th.band-header-tertiary { background-color: color-mix(in srgb, var(--kendo-color-tertiary) 16%, transparent); }

/* Answers count pill (MAUI: radius 9, 10pt bold, primary) */
.count-pill {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 9px;
    background: var(--kendo-color-primary, #1E6FCB);
    color: var(--kendo-color-on-primary, #fff);
    font-size: 10px;
    font-weight: 700;
}

/* Notes column: two-line clamp with full text in the tooltip */
.notes-cell {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 13px;
    white-space: normal;
}

/* Circular action chips (MAUI: 26px edit pencil, 22px library plus) */
.app-circle-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    background: color-mix(in srgb, var(--kendo-color-on-app-surface, #1B2734) 4%, transparent);
    color: var(--kendo-color-on-app-surface, #1B2734);
    font-size: 14px;
    text-decoration: none;
    cursor: pointer;
}

    .app-circle-chip:hover {
        background: color-mix(in srgb, var(--kendo-color-on-app-surface, #1B2734) 10%, transparent);
        color: var(--kendo-color-on-app-surface, #1B2734);
    }

.app-circle-chip-sm {
    width: 22px;
    height: 22px;
    font-size: 12px;
    font-weight: 700;
}

/* Row-click details drawer, docked beside the grid (MAUI default 440px):
   the grid narrows to make room instead of being covered. Sticky so it
   stays in view while the page scrolls. */
/* MAUI drawer: 440 wide, no border/background, padding 8,4,8,8 */
.app-side-drawer {
    flex: 0 0 min(440px, 40vw);
    position: sticky;
    top: 8px;
    max-height: calc(100vh - 120px);
    padding: 4px 8px 8px 8px;
    overflow-y: auto;
}

.app-drawer-section {
    font-size: 13px;
    font-weight: 700;
    color: var(--kendo-color-primary, #1E6FCB);
    margin: 6px 0 4px 0;
}

/* Full-page drag-and-drop overlay (MAUI DragDropOverlay) */
.app-drop-overlay {
    position: fixed;
    inset: 0;
    z-index: 15000;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

    .app-drop-overlay.app-drop-active {
        display: flex;
    }

.app-drop-box {
    border: 5px dashed #fff;
    border-radius: 8px;
    padding: 64px 40px;
    margin: 24px;
    text-align: center;
    color: #fff;
    font-size: 24px;
    font-weight: 700;
}

    .app-drop-box span {
        display: block;
        font-size: 18px;
        font-weight: 400;
        margin-top: 8px;
    }

/* Textareas that fill their splitter pane */
.fill-editor {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.fill-editor .fill-textarea {
    flex: 1 1 auto;
    min-height: 0;
}

.fill-editor .fill-textarea textarea {
    height: 100%;
    resize: none;
}

/* Give stacked expanders a little breathing room */
.k-expander + .k-expander {
    margin-top: 6px;
}

/* Host Information expander: wrapped 250px field columns like the MAUI page */
.host-fields {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
}

.host-fields .host-field {
    width: 250px;
}

/* ===== SLATE theming: app surfaces on the swatch variables ===== */
body {
    background-color: var(--kendo-color-app-surface, #EBEFF5);
    color: var(--kendo-color-on-app-surface, #1B2734);
}

.text-muted {
    color: var(--kendo-color-subtle, #7A8A9A) !important;
}

.card {
    background-color: var(--kendo-color-surface-alt, #fff);
    border-color: var(--kendo-color-border, #D2DAE3);
    color: inherit;
}

hr {
    border-color: var(--kendo-color-border, #D2DAE3);
    opacity: 1;
}

/* Bootstrap badges used for counts and CCI/AP chips follow the swatch */
.badge.bg-danger {
    background-color: var(--app-status-open, #dc3545) !important;
}

.badge.bg-success {
    background-color: var(--app-status-notafinding, #198754) !important;
}

.badge.bg-warning {
    background-color: var(--kendo-color-warning, #ffc107) !important;
}

.badge.bg-secondary {
    background-color: var(--kendo-color-base-emphasis, #6c757d) !important;
    color: var(--kendo-color-on-base, #fff) !important;
}

.badge.bg-info {
    background-color: var(--kendo-color-info, #0dcaf0) !important;
}

/* Severity chips (CAT I/II/III) */
.severity-chip-cat1 { background: var(--app-severity-cati, #D43B4E); }
.severity-chip-cat2 { background: var(--app-severity-catii, #D9822B); }
.severity-chip-cat3 { background: var(--app-severity-catiii, #C9A227); }

/* Issue summary card + CAT chips + detail cards (ChecklistsPage parity) */
.issue-card {
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-left: 4px solid var(--app-status-notafinding, #33D17A);
    border-radius: 6px;
    background: var(--kendo-color-surface, #F6F8FB);
    padding: 10px 14px;
    margin-bottom: 10px;
}

.issue-card-warn {
    border-left-color: var(--app-severity-catii, #D9822B);
}

.issue-tile {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 6px;
    background: var(--kendo-color-surface-alt, #fff);
    padding: 6px 10px;
}

/* Open-findings pills: MAUI radius 10, 10pt bold */
.cat-chip {
    display: inline-block;
    padding: 3px 7px;
    border-radius: 10px;
    --chip-fallback: var(--kendo-color-subtle, #6B7A8A);
    color: var(--chip, var(--chip-fallback));
    background: color-mix(in srgb, var(--chip, var(--chip-fallback)) 18%, transparent);
    font-size: 10px;
    font-weight: 700;
    margin-right: 4px;
    white-space: nowrap;
}

.cat-chip.cat1 { --chip: var(--app-severity-cati, #D43B4E); }
.cat-chip.cat2 { --chip: var(--app-severity-catii, #D9822B); }
.cat-chip.cat3 { --chip: var(--app-severity-catiii, #C9A227); }

.detail-card {
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 6px;
    background: var(--kendo-color-surface-alt, #fff);
    padding: 10px 14px;
    min-width: 260px;
}

.detail-card .meta-label {
    display: inline-block;
    min-width: 110px;
    margin-bottom: 0;
}

/* Import dialog option groups */
.import-options {
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 6px;
    padding: 8px 12px;
    min-width: 250px;
}

.import-options legend {
    font-size: 0.9rem;
    font-weight: 600;
    float: none;
    width: auto;
    padding: 0 4px;
    margin-bottom: 2px;
}

/* Classification banner across the top of the edit page */
.classification-banner-old {
    color: #fff;
    text-align: center;
    font-weight: 700;
    padding: 2px 0;
    border-radius: 4px;
    margin-bottom: 6px;
    letter-spacing: 0.1em;
}

/* Business Rules cards */
.rules-card {
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 6px;
    background: var(--kendo-color-surface, #F6F8FB);
    padding: 12px 16px;
}

/* Note / answer cards in the panels */
.note-card {
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 6px;
    background: var(--kendo-color-surface-alt, #fff);
    padding: 8px 10px;
    margin-bottom: 6px;
}

/* Theme Settings: family cards + mock-UI previews */
.theme-cards {
    display: flex;
    flex-direction: column;
    gap: 15px;
    max-width: 720px;
}

.theme-card-active {
    border-color: var(--kendo-color-primary, #1E6FCB);
    box-shadow: 0 0 0 1px var(--kendo-color-primary, #1E6FCB);
}

.theme-preview {
    height: 150px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 8px;
    overflow: hidden;
}

.theme-preview-header {
    height: 25px;
    border-radius: 4px;
    margin-bottom: 10px;
}

.theme-preview-tiles {
    display: flex;
    gap: 8px;
}

    .theme-preview-tiles > div {
        flex: 1;
        height: 20px;
        border-radius: 3px;
    }

.theme-preview-lines {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .theme-preview-lines > div {
        height: 12px;
        border-radius: 2px;
    }

.swatch-chips {
    display: inline-flex;
    gap: 4px;
    margin-right: 8px;
    vertical-align: middle;
}

.swatch-chip {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 4px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
}

/* Command chips extracted from Check/Fix text */
.command-chips {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 6px 0;
}

.command-chip {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 4px 6px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 4px;
    background: var(--kendo-color-surface-alt, #fff);
}

.command-chip-text {
    font-family: Consolas, "Cascadia Mono", monospace;
    font-size: 12px;
    align-self: center;
    word-break: break-all;
}

/* Vulnerability tree view */
.vuln-tree {
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 6px;
    overflow: hidden;
}

.vuln-tree-toolbar {
    background: var(--kendo-color-surface, #F0F3F8);
    border-bottom: 1px solid var(--kendo-color-border, #D2DAE3);
}

.vuln-tree-list {
    overflow-y: auto;
    flex: 1;
}

.vuln-tree-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    cursor: pointer;
    border-bottom: 1px solid var(--kendo-color-border, #D2DAE3);
    background: var(--kendo-color-surface, #F0F3F8);
}

    .vuln-tree-row:hover {
        background: var(--kendo-color-base-subtle, #E4EAF2);
    }

.vuln-tree-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.vuln-tree-branches {
    padding: 2px 8px 8px 28px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.vuln-tree-branch-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    cursor: pointer;
    background: var(--kendo-color-base-subtle, #E4EAF2);
    border-radius: 4px;
}

/* Duplicate checklist rows (same host + STIG version set) */
.k-grid tr.dup-row > td {
    background: color-mix(in srgb, var(--app-severity-catiii, #C9A227) 14%, transparent);
}

/* MAUI-style busy overlay: scrim + bordered card + big spinner */
.app-busy-overlay {
    position: fixed;
    inset: 0;
    z-index: 12000;
    background: rgba(0, 0, 0, 0.376);
    display: flex;
    align-items: center;
    justify-content: center;
}

.app-busy-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    min-width: 260px;
    max-width: 450px;
    padding: 24px 20px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 10px;
    background: var(--kendo-color-app-surface, #EBEFF5);
}

.app-busy-text {
    font-size: 14px;
    text-align: center;
    color: var(--kendo-color-on-app-surface, #1B2734);
}

/* Reference Files status pills (success / warning / error tinted) */
.ref-status-pill {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 11px;
}

.ref-status-success { background: var(--kendo-color-success-subtle); color: var(--kendo-color-success-on-subtle); }
.ref-status-warning { background: var(--kendo-color-warning-subtle); color: var(--kendo-color-warning-on-subtle); }
.ref-status-error { background: var(--kendo-color-error-subtle); color: var(--kendo-color-error-on-subtle); }

/* Classification-colored combo: the wrapper paints the classification color;
   the combo itself goes transparent with bold contrasting text */
.class-combo-wrap {
    display: inline-block;
    border-radius: 4px;
    overflow: hidden;
}

    .class-combo-wrap .k-dropdownlist,
    .class-combo-wrap .k-input-inner,
    .class-combo-wrap .k-input-button {
        background: transparent !important;
        color: inherit !important;
        font-weight: 700;
    }

/* MAUI page headers: 18px bold instruction line */
.app-page-title {
    font-size: 18px;
    font-weight: 700;
    margin: 4px 0 12px 0;
}

/* Business Rules classification chip cloud (MAUI radius 14) */
.class-value-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--kendo-color-border, #D2DAE3);
    border-radius: 14px;
    padding: 4px 6px 4px 10px;
    margin: 0 6px 6px 0;
    font-size: 13px;
}

/* Group headers: value + MAUI-style "Total Records: N" aggregate */
.app-group-header { display: inline-flex; align-items: baseline; gap: 10px; }
.app-group-count { font-size: 12px; color: var(--kendo-color-subtle); font-weight: 400; }

/* ── Phase A systemic (UI-PARITY-2) ─────────────────────────────────── */
/* A5: MAUI RadCheckBox is 22x22; web 20px keeps 32px rows tidy */
.k-checkbox { width: 20px; height: 20px; }
/* A18: DataGridToolbar command chips = base-subtle fill, on-surface text, 1px border; ItemSpacing 9 */
/* Telerik 15 wraps toolbar content in a scrollable .k-toolbar-items; let it wrap so the
   search band drops to its own row (MAUI search panel under the toolbar) */
.k-grid-toolbar { overflow: visible; }
.k-grid-toolbar .k-toolbar-items { flex-wrap: wrap; gap: 9px; overflow: visible; row-gap: 6px; }
.k-grid-toolbar .app-toolbar-summary { white-space: nowrap; }
.k-grid-toolbar .k-button.k-button-solid-base:not([class*="app-btn-"]) {
    background: var(--kendo-color-base-subtle, #EEF2F6);
    border-color: var(--kendo-color-border, #D2DAE3);
    color: var(--kendo-color-on-surface, #1B2734);
}
.k-grid-toolbar .k-button.k-button-solid-base:not([class*="app-btn-"]):hover {
    background: var(--kendo-color-base-subtle-hover, #E2E8EF);
}
/* A20: the search box lives in its own band under the toolbar (MAUI search panel) */
.app-toolbar-search { flex-basis: 100%; display: flex; align-items: center; gap: 8px; }

/* Chooser popups (MAUI ChooserPopup: 350x450, radius 12, padding 20, rows 12px) */
.app-chooser-list { overflow-y: auto; }
.app-chooser-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; margin: 0; font-size: 12px; cursor: pointer; }
.app-chooser-box { border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 6px; padding: 10px; }
.app-layout-row { display: flex; align-items: center; gap: 8px; padding: 10px 8px; border-bottom: 1px solid var(--kendo-color-border, #D2DAE3); }
.app-layout-row:last-child { border-bottom: 0; }
.app-chooser-bulk { min-width: 110px; }
.app-chooser-done { min-width: 80px; }
.app-toolbar-separator { width: 1px; height: 24px; background: var(--kendo-color-border, #D2DAE3); margin: 0 2px; }
/* View panel (MAUI DataGridToolbar View dropdown: 260px, padding 14,10, 12pt bold caption, 11pt hint) */
.app-view-panel { padding: 14px 10px; display: flex; flex-direction: column; gap: 10px; }
.app-view-caption { font-size: 12px; font-weight: 700; }
.app-view-row { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 13px; }
.app-view-hint { font-size: 11px; color: var(--kendo-color-subtle, #6B7A8A); }
.k-grid.app-rows-auto .k-table-tbody .k-table-row { height: auto; }
.k-grid.app-rows-auto .k-table-td { white-space: normal; }
/* A9: header freeze pins (DataGridKit GridHeaderPins): muted when unfrozen, primary when frozen */
.app-header-pin-wrap { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.app-header-pin { display: inline-flex; cursor: pointer; color: var(--kendo-color-on-app-surface, #1B2734); opacity: 0.75; }
.app-header-pin:hover { opacity: 1; }
.app-header-pin.is-frozen { color: var(--kendo-color-primary, #1E6FCB); opacity: 1; }
.app-header-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* A24: MAUI highlights the CLICKED (drawer) row, never the checked rows */
.k-grid .k-table-row.k-selected > .k-table-td { background-color: inherit; }
.k-grid tr.app-drawer-row > td { background-color: var(--kendo-color-primary-subtle, #DCE9F8) !important; box-shadow: inset 0 1px 0 var(--kendo-color-primary, #1E6FCB), inset 0 -1px 0 var(--kendo-color-primary, #1E6FCB); }

/* ── Edit page (UI-PARITY-2 C1/C5/C6/C7 + A2) ───────────────────────── */
.app-segmented.k-button-group { height: 34px; }
.app-segmented.k-button-group .k-button { height: 34px; }
.app-segmented-mode.k-button-group .k-button { width: 82px; }
.edit-save-status { font-size: 12px; opacity: 0.75; white-space: nowrap; }
.edit-save-status.is-saved { color: var(--kendo-color-success, #1E9E6A); }
.edit-save-status.is-saving { color: var(--kendo-color-info, #1F7FD0); }
.edit-save-status.is-pending { color: var(--kendo-color-subtle, #6B7A8A); }
.edit-save-status.is-failed { color: var(--kendo-color-error, #D43B4E); }
.edit-filter-band { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 4px 8px; margin-bottom: 4px; background: var(--kendo-color-base, #EEF2F6); border-radius: 4px; }
.app-filter-clear.k-button { width: 32px; height: 32px; padding: 0; }
.app-kebab-chip.k-button { width: 34px; height: 34px; padding: 0; background: var(--kendo-color-base-subtle, #EEF2F6); border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 4px; }
.app-dropdown-120 { width: 120px; }
.app-dropdown-120 .k-button { width: 120px; justify-content: flex-end; }
.edit-override-banner { display: flex; align-items: center; gap: 10px; padding: 8px 12px; margin-bottom: 6px; border: 1px solid var(--kendo-color-warning, #D9822B); border-radius: 6px; background: var(--kendo-color-warning-subtle, #FBEBDD); }
.edit-override-glyph { font-size: 16px; color: var(--kendo-color-warning, #D9822B); }
.edit-override-title { font-size: 13px; font-weight: 700; color: var(--kendo-color-warning, #D9822B); }
.edit-override-hint { font-size: 11px; color: var(--kendo-color-warning-on-subtle, #7A4E08); }
.host-chart-title { font-weight: 700; text-align: center; margin-bottom: 4px; }
/* ── Phase B: Checklists page (UI-PARITY-2 B4-B11) ──────────────────── */
.issue-expand { width: 28px; height: 28px; padding: 0; border: 0; background: transparent; color: inherit; font-size: 12px; cursor: pointer; border-radius: 4px; }
.issue-expand:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
.issue-sev-info { border-color: var(--kendo-color-info); }
.issue-head-info { background: var(--kendo-color-info-subtle, #DCE9F8); color: var(--kendo-color-info-on-subtle, #1B4E7A); }
/* % Complete: 22px bar, surface-low track, percent-colored fill at 48% alpha, 11px bold label over it */
.pct-bar { position: relative; height: 22px; border-radius: 3px; background: var(--kendo-color-surface-low, #E4E9EF); overflow: hidden; }
.pct-fill { position: absolute; inset: 0 auto 0 0; background: color-mix(in srgb, var(--pct-color, var(--kendo-color-primary)) 48%, transparent); }
.pct-text { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: var(--kendo-color-on-app-surface, #1B2734); }
.text-subtle-11 { font-size: 11px; color: var(--kendo-color-subtle, #6B7A8A); }
/* drawer fields: 11px bold caption over a 13px value on the alt surface (read-only editor look) */
.drawer-field { margin-bottom: 8px; }
.drawer-field .meta-label-strong { margin-bottom: 2px; }
.drawer-value { font-size: 13px; padding: 6px 8px; border-radius: 4px; min-height: 30px; background: var(--kendo-color-surface-alt, #F0F3F7); user-select: text; white-space: pre-wrap; }
.app-drawer-close { width: 32px; height: 32px; border: 0; background: transparent; font-size: 18px; cursor: pointer; color: inherit; border-radius: 4px; }
.app-drawer-close:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
/* loading feedback: message + 5px bar (MAUI RadLinearProgressBar) */
.app-load-progress { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.app-load-bar.k-progressbar { height: 5px; }
/* empty workspace: the grid stays, with the MAUI DragDropOverlay prompt over it */
.app-grid-host { position: relative; }
.app-checklists-grid.k-grid { min-height: 320px; }
.app-empty-overlay { position: absolute; inset: 0; z-index: 5; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; border-radius: 6px; }
.app-empty-box { border: 5px dashed #fff; border-radius: 8px; padding: 28px 36px; color: #fff; font-size: 24px; font-weight: 700; text-align: center; max-width: 640px; }
.app-empty-box span { display: block; font-size: 18px; font-weight: 400; margin-top: 10px; opacity: 0.9; }

/* B12: Add STIG dialog cards (MAUI: radius 8, padding 12, 1px border, surface, 8px apart) */
.add-stig-card { display: flex; align-items: flex-start; gap: 10px; padding: 12px; margin: 0 0 8px 0; border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 8px; background: var(--kendo-color-surface, #F6F8FB); cursor: pointer; }
.text-subtle-12 { font-size: 12px; color: var(--kendo-color-subtle, #6B7A8A); }

/* ── Phase C-1: edit page info pane, editors, status combo, grid cells ─────── */
/* MAUI info pane: 14pt bold labels; values are read-only editors on the alt surface in 210-basis columns */
.info-fields { display: flex; flex-wrap: wrap; }
.info-field { flex: 0 1 210px; margin: 0 24px 12px 0; min-width: 0; }
.info-field-wide { flex: 0 1 320px; }
.info-label { display: block; font-size: 14px; font-weight: 700; margin-bottom: 2px; }
.info-value { font-size: 14px; padding: 6px 8px; border-radius: 4px; min-height: 32px; background: var(--kendo-color-surface-alt, #F0F3F7); user-select: text; white-space: pre-wrap; }
/* MAUI Copy / Copy Settings: 32x32 base-subtle chips with 18px glyphs, 5 apart */
.app-icon-chip.k-button { width: 32px; height: 32px; padding: 0; background: var(--kendo-color-base-subtle, #EEF2F6); border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 4px; }
.app-icon-chip.k-button .k-svg-icon { width: 18px; height: 18px; }
/* MAUI editor blocks: 16pt bold header, AI Fill 11pt/24h, kebab 24x24, editor 14pt on base-subtle with 1px border-alt */
.editor-head { display: flex; align-items: center; gap: 5px; margin-bottom: 4px; }
.editor-title { font-size: 16px; font-weight: 700; margin-right: 6px; }
.editor-ai.k-button { height: 24px; padding: 0 8px; font-size: 11px; }
.editor-kebab.k-button { width: 24px; height: 24px; padding: 0; }
.fill-textarea textarea.k-input-inner, .fill-textarea .k-input-inner { font-size: 14px; }
.fill-textarea.k-textarea { background: var(--kendo-color-base-subtle, #EEF2F6); border: 1px solid var(--kendo-color-border-alt, #C5CED8); }
.fill-textarea.k-textarea:focus-within { border-color: var(--kendo-color-primary, #1E6FCB); background: var(--kendo-color-base-subtle-hover, #E2E8EF); }
/* MAUI Finding Status combo: the combo surface itself carries the status tint */
.status-combo-wrap .k-dropdownlist { background: color-mix(in srgb, var(--chip, var(--kendo-color-subtle)) 18%, transparent); border-color: color-mix(in srgb, var(--chip, var(--kendo-color-subtle)) 40%, transparent); }
.status-combo-value { color: var(--chip, inherit); font-weight: 700; }
.status-combo-cell .k-dropdownlist { height: 36px; }
:root[data-app-theme="harborbold"] .status-combo-wrap .k-dropdownlist,
:root[data-app-theme="highcontrastdark"] .status-combo-wrap .k-dropdownlist,
:root[data-app-theme="highcontrastlight"] .status-combo-wrap .k-dropdownlist { background: var(--chip); }
:root[data-app-theme="harborbold"] .status-combo-value,
:root[data-app-theme="highcontrastdark"] .status-combo-value,
:root[data-app-theme="highcontrastlight"] .status-combo-value { color: #fff; }
/* grid-mode text cells: one line, ellipsis, tooltip (MAUI 200/250 wide) */
.cell-clip { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notes-cell { font-size: 14px; }
/* MAUI classification banner: square full-width bar, 13pt bold white, padding 0,4 */
.classification-banner { padding: 4px 0; border-radius: 0; letter-spacing: normal; font-size: 13px; font-weight: 700; color: #fff; text-align: center; margin: 0 0 6px 0; }

/* â”€â”€ Phase C-2: grid-mode drawer + tree (UI-PARITY-2 C14/C15) â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.fdp-drawer { display: flex; flex-direction: column; min-height: 0; }
.fdp-body { padding: 12px 16px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; max-height: 72vh; }
.fdp-idmode .k-input-inner { font-size: 12px; }
.tree-caption { display: block; font-size: 12px; font-weight: 700; color: var(--kendo-color-subtle, #6B7A8A); margin-bottom: 2px; }
.tree-editor.k-textarea .k-input-inner { font-size: 13px; min-height: 70px; }
.tree-ai.k-button { height: 22px; padding: 0 8px; font-size: 11px; }
.tree-ai-kebab.k-button { width: 22px; height: 22px; padding: 0; }
.tree-kebab { width: 32px; height: 32px; border: 0; background: transparent; font-size: 18px; line-height: 1; color: var(--kendo-color-subtle, #6B7A8A); cursor: pointer; border-radius: 4px; }
.tree-kebab:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
.tree-status-combo .k-dropdownlist { height: 40px; }
/* -- Phase C-3: bulk update body, notes cards, answer file form -- */
.bulk-divider { border-top: 2px solid var(--kendo-color-border, #D2DAE3); margin: 4px 0; }
.bulk-heading { font-size: 14px; font-weight: 700; }
/* MAUI note card: radius 6 on surface, base-colored header strip (padding 8,4), 13pt body, 10pt "from" line */
.note-card { border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 6px; background: var(--kendo-color-surface, #F6F8FB); margin-bottom: 8px; overflow: hidden; }
.note-head { display: flex; align-items: center; gap: 6px; padding: 4px 8px; background: var(--kendo-color-base, #EEF2F6); }
.note-stamp { font-size: 11px; color: var(--kendo-color-subtle, #6B7A8A); white-space: nowrap; }
.note-mini.k-button { height: 24px; padding: 0 8px; font-size: 11px; }
.note-body { padding: 6px 8px; }
.note-text { font-size: 13px; white-space: pre-wrap; }
.note-from { font-size: 10px; color: var(--kendo-color-subtle, #6B7A8A); margin-top: 2px; }
.note-editor.k-textarea .k-input-inner { font-size: 13px; min-height: 60px; }
/* MAUI answer form: 11pt subtle captions inline left of the inputs; Consolas validation code */
.af-inline { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.af-caption { font-size: 11px; color: var(--kendo-color-subtle, #6B7A8A); white-space: nowrap; }
.af-code.k-textarea .k-input-inner { font-family: Consolas, "Courier New", monospace; font-size: 12px; min-height: 60px; }
/* Phase D: Library options stack (MAUI: 14px regular labels, rows 10px apart, no card) */
.lib-options { display: flex; flex-direction: column; gap: 10px; }
.lib-option { display: inline-flex; align-items: center; gap: 10px; margin: 0; font-size: 14px; }
/* Phase D: grids without a fixed height keep room for the empty-state prompt */
.app-grid-min.k-grid { min-height: 320px; }

/* ── Phase E: Business Rules / AI Settings (MAUI settings pages) ─────────── */
/* 20px subtle intro, 18px bold section headers outside the cards, one card per
   setting with a 14px title over a 12px subtle description (MAUI spacing 20/10) */
.rules-page { display: flex; flex-direction: column; gap: 20px; max-width: 960px; }
.rules-intro { font-size: 20px; color: var(--kendo-color-subtle, #6B7A8A); }
.rules-section { display: flex; flex-direction: column; gap: 10px; }
.rules-section-title { font-size: 18px; font-weight: 700; margin-bottom: 5px; }
.rule-card { display: flex; align-items: flex-start; gap: 20px; margin: 0; cursor: pointer; }
.rule-card > .k-checkbox-wrap, .rule-card > .k-checkbox { margin-top: 3px; margin-left: 10px; }
.rule-card > span { display: flex; flex-direction: column; gap: 5px; }
.rule-card-inline { padding: 0; border: 0; background: transparent; }
.rule-title { font-size: 14px; }
.rule-desc { font-size: 12px; color: var(--kendo-color-subtle, #6B7A8A); }
.rule-card-stack { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.rule-card-stack > .d-flex { align-self: stretch; }
.class-chip-x { width: 30px; height: 30px; border: 0; border-radius: 15px; background: transparent; color: inherit; font-size: 11px; cursor: pointer; padding: 0; }
.class-chip-x:hover { background: color-mix(in srgb, currentColor 10%, transparent); }

/* AI Settings */
.ai-page { padding-top: 8px; }
.ai-stack-12 { gap: 12px; }
.ai-field { display: flex; flex-direction: column; gap: 4px; align-self: stretch; }
.ai-w560 { width: 560px; max-width: 100%; }
.ai-w700 { width: 700px; max-width: 100%; }
.ai-status { font-size: 12px; min-height: 16px; }
.ai-test-editor.k-textarea .k-input-inner { min-height: 60px; }
.ai-response { border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 4px; padding: 10px; min-height: 40px; font-size: 13px; white-space: pre-wrap; background: var(--kendo-color-surface-alt, #F0F3F7); }
.prompt-list { display: flex; flex-direction: column; gap: 6px; max-height: 260px; overflow-y: auto; align-self: stretch; }
.prompt-row { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 6px; background: var(--kendo-color-surface, #F6F8FB); cursor: pointer; }
.prompt-row-selected { border-color: var(--kendo-color-primary, #1E6FCB); box-shadow: inset 0 0 0 1px var(--kendo-color-primary, #1E6FCB); }
.prompt-row-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.prompt-row-name { font-size: 14px; font-weight: 700; }
.prompt-row-template { font-size: 11px; color: var(--kendo-color-subtle, #6B7A8A); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.prompt-row-delete { border: 0; background: transparent; color: inherit; font-size: 11px; padding: 4px 8px; border-radius: 4px; cursor: pointer; }
.prompt-row-delete:hover:not(:disabled) { background: color-mix(in srgb, currentColor 10%, transparent); }
.prompt-row-delete:disabled { opacity: 0.4; cursor: default; }
.prompt-editor.k-textarea { align-self: stretch; }
.prompt-editor.k-textarea .k-input-inner { min-height: 160px; }

/* EULA: full page (MAUI EulaPage, no navigation), padding 40,32 */
.eula-page { position: fixed; inset: 0; z-index: 20000; background: var(--kendo-color-app-surface, #fff); color: var(--kendo-color-on-app-surface, #1B2734); padding: 32px 40px; display: flex; flex-direction: column; }
.eula-head { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 20px; text-align: center; }
.eula-logo { height: 90px; width: auto; }
.eula-title { font-size: 20px; font-weight: 700; }
.eula-subtitle { font-size: 13px; color: var(--kendo-color-subtle, #6B7A8A); }
.eula-body { flex: 1; overflow-y: auto; white-space: pre-wrap; font-size: 13px; line-height: 1.6; border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 8px; background: var(--kendo-color-surface-alt, #F0F3F7); padding: 16px 20px; }
.eula-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 20px; }
.eula-actions .k-button { padding: 10px 20px; }

/* Grid checkbox cells: the 20px checkbox + cell padding overflowed the 40px column and
   Telerik's text-overflow painted trailing dots */
.k-grid .k-table-th:has(.k-checkbox), .k-grid .k-table-td:has(.k-grid-checkbox) {
    text-overflow: clip; padding-left: 8px; padding-right: 8px; text-align: center;
}
/* View > Auto-fit row height: clipped text cells wrap too */
.k-grid.app-rows-auto .k-table-td .cell-clip { white-space: normal; overflow: visible; text-overflow: clip; }
.k-grid.app-rows-auto .k-table-td { overflow: visible; }
/* Sections / field choosers: MAUI-style spaced checkbox rows */
.app-check-list { display: flex; flex-direction: column; gap: 8px; }
.app-check-list label { display: flex; align-items: center; gap: 8px; margin: 0; cursor: pointer; }

/* Guided tours (demo only): dim layer, spotlight cutout, popover, launcher */
.tour-layer { position: fixed; inset: 0; z-index: 16000; pointer-events: none; }
.tour-blocker { position: absolute; inset: 0; pointer-events: auto; background: transparent; }
.tour-no-target .tour-blocker { background: rgba(0, 0, 0, 0.55); }
.tour-spot {
    position: fixed; display: none; pointer-events: none; border-radius: 8px;
    box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.55), 0 0 0 3px var(--kendo-color-primary, #1E6FCB);
    transition: left 0.25s ease, top 0.25s ease, width 0.25s ease, height 0.25s ease;
}
.tour-pop {
    position: fixed; left: 50%; top: 40%; width: min(380px, calc(100vw - 24px)); pointer-events: auto;
    background: var(--kendo-color-app-surface, #FFFFFF); color: var(--kendo-color-on-app-surface, #1B2734);
    border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 10px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35); padding: 14px 16px 12px 16px;
    transition: left 0.25s ease, top 0.25s ease;
}
.tour-pop-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.tour-pop-count { font-size: 11px; color: var(--kendo-color-subtle, #6B7A8A); flex: 1; }
.tour-pop-close { width: 28px; height: 28px; border: 0; border-radius: 4px; background: transparent; color: inherit; font-size: 14px; cursor: pointer; }
.tour-pop-close:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
.tour-pop-title { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.tour-pop-text { font-size: 13px; line-height: 1.5; white-space: pre-line; }
.tour-pop-timer { height: 3px; margin-top: 12px; border-radius: 2px; overflow: hidden; background: color-mix(in srgb, var(--kendo-color-primary, #1E6FCB) 18%, transparent); }
.tour-pop-timer > span { display: block; height: 100%; width: 0; background: var(--kendo-color-primary, #1E6FCB); animation-name: tour-timer; animation-timing-function: linear; animation-fill-mode: forwards; }
@keyframes tour-timer { from { width: 0; } to { width: 100%; } }
.tour-pop-actions { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.tour-launch-intro { font-size: 13px; color: var(--kendo-color-subtle, #6B7A8A); margin-bottom: 12px; }
.tour-launch-card { border: 1px solid var(--kendo-color-border, #D2DAE3); border-radius: 8px; background: var(--kendo-color-surface, #F6F8FB); padding: 12px; margin-bottom: 10px; }
.tour-launch-title { font-size: 14px; font-weight: 700; }
.tour-launch-summary { font-size: 12px; color: var(--kendo-color-subtle, #6B7A8A); margin-top: 2px; }
.app-tour-btn.k-button { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); }
.app-topbar { position: relative; }
.tour-launcher .k-window-content { max-height: min(70vh, 640px); overflow-y: auto; }
.tour-launch-card { padding: 10px 12px; margin-bottom: 8px; }
