/* Appearance Controls, Workspace Layouts & Obsidian-Violet Dark Theme */
.appearance-controls { display: flex; align-items: center; gap: 10px; }
.language-flags { display: flex; gap: 3px; align-items: center; }
.flag-choice {
    padding: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 8px;
    transition: background 0.18s var(--ease-smooth), border-color 0.18s var(--ease-smooth), transform 0.18s var(--ease-spring);
}
.flag-choice img {
    display: block;
    width: 24px;
    height: 16px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(15, 13, 28, 0.14);
}
.flag-choice:hover { background: var(--royal-soft); transform: translateY(-1px); }
.flag-choice:active { transform: scale(0.95); }
.flag-choice.selected {
    background: var(--royal-tint);
    border-color: #c4b5fd;
    box-shadow: 0 1px 3px rgba(91, 33, 182, 0.10);
}

.theme-toggle {
    border: 1px solid var(--line);
    width: 34px;
    height: 34px;
    color: var(--ink);
    background: var(--white);
    border-radius: 9px;
    box-shadow: 0 1px 2px rgba(15, 13, 28, 0.04);
}
.theme-toggle:hover {
    background: var(--royal-soft);
    border-color: #c4b5fd;
    color: var(--royal-deep);
}
.theme-toggle span { display: flex; transition: transform 0.28s var(--ease-spring); }
.theme-toggle:hover span { transform: rotate(12deg); }
.theme-toggle .theme-sun { display: none; }
[data-theme=dark] .theme-toggle .theme-sun { display: flex; }
[data-theme=dark] .theme-toggle .theme-moon { display: none; }

.auth-appearance { position: absolute; right: 24px; top: 18px; z-index: 40; }
.login-form-wrap { padding-top: 80px; }

/* SLA Working Days & Response Template Layouts */
.working-days {
    margin: 18px 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 9px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.working-days legend { padding: 0 5px; font-size: 12px; font-weight: 600; }
.working-days .checkbox-label { font-size: 12px !important; }
.template-admin-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); gap: 24px; align-items: start; }
.template-admin-layout .filter-bar { flex-wrap: wrap; padding-top: 4px; }
.template-admin-layout .filter-bar > .search-input { min-width: 200px; }
.template-filters { display: flex; gap: 12px; padding-top: 0; }
.template-filters > .search-select, .template-filters > select { max-width: 200px; }
.response-template-picker { margin: 0 0 18px; }
.response-template-picker summary { cursor: pointer; margin-bottom: 12px; font-weight: 600; color: var(--royal-deep); }
.template-picker-controls { margin: 12px 0; }
.response-template-picker .quiet-box { margin-bottom: 12px; }
.response-template-picker .body-copy { max-height: 240px; overflow: auto; margin-top: 8px; }
@media (max-width: 1100px) { .template-admin-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) {
    .template-filters { flex-direction: column; }
    .template-filters > .search-select, .template-filters > select { max-width: none; }
}

/* Reconnect Modal Harmonization */
#components-reconnect-modal button {
    background: linear-gradient(180deg, #7c3aed 0%, #5b21b6 100%) !important;
    border-radius: 8px !important;
    padding: 8px 20px !important;
    font-weight: 600;
}
#components-reconnect-modal button:hover {
    background: linear-gradient(180deg, #6d28d9 0%, #4c1d95 100%) !important;
}
.components-rejoining-animation div {
    border-color: #7c3aed !important;
}

/* Executive Obsidian-Violet Dark Mode */
[data-theme=dark] {
    --royal: #a78bfa;
    --royal-deep: #c4b5fd;
    --royal-hover: #ddd6fe;
    --royal-vibrant: #8b5cf6;
    --royal-soft: rgba(124, 58, 237, 0.18);
    --royal-tint: rgba(124, 58, 237, 0.24);
    --royal-border: rgba(167, 139, 250, 0.34);
    --royal-glow: rgba(167, 139, 250, 0.25);
    --royal-shadow: 0 2px 8px rgba(0, 0, 0, 0.32), 0 8px 24px rgba(8, 5, 18, 0.45);
    --royal-shadow-hover: 0 12px 32px rgba(0, 0, 0, 0.48), 0 0 0 1px rgba(167, 139, 250, 0.28);

    /* Legacy variable aliases */
    --green: #a78bfa;
    --green-dark: #c4b5fd;
    --sage: rgba(124, 58, 237, 0.20);

    /* Deep Obsidian-Violet Surfaces & WCAG AA+ Neutrals */
    --ink: #f5f3ff;
    --ink-secondary: #e4dff5;
    --muted: #b5add0;
    --line: #2e2552;
    --line-strong: #3e326b;
    --border: #2e2552;
    --background: #0c0918;
    --white: #151029;
    --surface-subtle: #1e1738;
    color-scheme: dark;
}

[data-theme=dark] body { background: var(--background); color: var(--ink); }
[data-theme=dark] ::selection { background: rgba(139, 92, 246, 0.42); color: #ffffff; }

[data-theme=dark] :is(h1, h2, h3, .brand, .workspace-label strong, .profile strong, .metric-value, .ticket-title, .person, .data-table td strong, .empty-state strong, .intake-draft-title) {
    color: #f5f3ff;
}

[data-theme=dark] :is(.sidebar, .panel, .metric-card, .select-menu, .select-trigger, .select-option, .chat-composer, .prompt-card, .login-form-wrap, input, select, textarea, .theme-toggle) {
    background: #151029;
    color: #f5f3ff;
    border-color: #2e2552;
}
[data-theme=dark] .topbar {
    background: rgba(21, 16, 41, 0.86);
    border-color: #2e2552;
}
[data-theme=dark] :is(input, select, textarea, .select-trigger) {
    background: #110d22;
    border-color: #3a2e66;
    color: #f5f3ff;
}
[data-theme=dark] :is(input, select, textarea):focus,
[data-theme=dark] .select-trigger[aria-expanded=true],
[data-theme=dark] .search-input:focus-within,
[data-theme=dark] .chat-composer:focus-within {
    border-color: #a78bfa;
    box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.24);
}

[data-theme=dark] :is(.workspace-label, .tiny-label, .connection, .demo-badge, .subtle-pill, .count-badge, .ticket-table th, .data-table th, .quiet-box, .reply-form, .code-block, .select-hint, .demo-login, .prompt-card:hover) {
    background: #1e1738;
    color: #ddd6fe;
    border-color: #352a5e;
}
[data-theme=dark] .comment.internal {
    background: rgba(217, 119, 6, 0.14);
    color: #fde68a;
    border-color: rgba(245, 158, 11, 0.35);
}

[data-theme=dark] :is(.sidebar nav > a, .metric-label, .breadcrumb, .breadcrumb strong, .workspace-label small, .profile small, .page-heading p, .panel-heading p, .metric-suffix, .metric-note, .ticket-meta, .ticket-meta .mono, .source-icon, .card-meta, .data-table td, .data-table td small, .section-intro, .field-hint, .detail-list dt, .detail-list dd small, .form-aside, .form-aside p, .problem-card p, .plugin-card p, .chat-welcome p, .composer-bottom span, .chat-message h3, .pagination-note, .status-line, .setting-toggle p, .checkbox-label, .intake-summary dt, .intake-welcome p, .intake-steps, .login-form label, .login-story p, .login-story > small, .demo-login p) {
    color: #b8b0d4;
}
[data-theme=dark] .breadcrumb strong { color: #f5f3ff; }

[data-theme=dark] :is(.body-copy, .detail-list dd, .intake-summary dd, .chat-message p, .intake-conversation .chat-message p, .intake-review .checkbox-label, .benefit-list li) {
    color: #e4dff5;
}

[data-theme=dark] :is(.sidebar nav > a:hover, .ticket-table tbody tr:hover, .data-table tbody tr:hover td, .icon-button:hover, .flag-choice:hover, .recent-chat:hover, .theme-toggle:hover) {
    background: #241b45;
    color: #f5f3ff;
}

[data-theme=dark] .sidebar nav > a.active {
    background: rgba(124, 58, 237, 0.22);
    border-color: rgba(167, 139, 250, 0.36);
    color: #ddd6fe;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22);
}
[data-theme=dark] .sidebar nav > a.active svg { color: #a78bfa; }

[data-theme=dark] :is(.flag-choice.selected, .select-option:hover, .select-option.highlighted, .chat-message.user, .notice.info, .recent-chat.selected, .intake-steps .current) {
    background: rgba(124, 58, 237, 0.22);
    color: #ddd6fe;
    border-color: rgba(167, 139, 250, 0.38);
}
[data-theme=dark] :is(.solution-card, .notice.success) {
    background: rgba(5, 150, 105, 0.16);
    color: #a7f3d0;
    border-color: rgba(52, 211, 153, 0.36);
}
[data-theme=dark] .solution-card h3 { color: #6ee7b7; }
[data-theme=dark] .solution-card .body-copy { color: #d1fae5; }

[data-theme=dark] :is(.eyebrow, .green-text, .royal-text, .text-link, .back-link, .select-option[aria-selected=true], .demo-login code, .form-aside h2, .response-template-picker summary, .app-footer a) {
    color: #c4b5fd;
}
[data-theme=dark] .demo-login code {
    background: #151029;
    border-color: rgba(167, 139, 250, 0.34);
}

[data-theme=dark] :is(.assistant-mini, .insight-card) {
    background: radial-gradient(circle at 95% 5%, rgba(139, 92, 246, 0.28) 0%, transparent 58%),
                linear-gradient(145deg, #1d1538 0%, #261a4a 100%);
    border-color: rgba(167, 139, 250, 0.35);
}
[data-theme=dark] .assistant-mini::after {
    background: linear-gradient(110deg, transparent 25%, rgba(196, 181, 253, 0.16) 50%, transparent 75%);
}
[data-theme=dark] .login-story {
    background: radial-gradient(circle at 18% 15%, rgba(124, 58, 237, 0.32) 0%, transparent 50%),
                radial-gradient(circle at 88% 85%, rgba(91, 33, 182, 0.28) 0%, transparent 52%),
                linear-gradient(160deg, #120d26 0%, #1b1338 55%, #140e2b 100%);
    border-right: 1px solid #2e2552;
}
[data-theme=dark] :is(.assistant-mini strong, .assistant-mini, .insight-card h2, .insight-stat strong, .login-story h1) {
    color: #f5f3ff;
}
[data-theme=dark] :is(.insight-label, .insight-card p, .insight-stat span, .login-story .eyebrow) {
    color: #c4b5fd;
}
[data-theme=dark] .insight-card p { color: #d5cef0; }
[data-theme=dark] .insight-stat { border-color: rgba(167, 139, 250, 0.26); }
[data-theme=dark] :is(.insight-card:before, .insight-card:after) { border-color: rgba(167, 139, 250, 0.22); }

[data-theme=dark] :is(.metric-note, .ticket-table th, .ticket-table td, .data-table td, .queue-tabs, .table-footer, .time-row, .card-footer, .setting-toggle, .comment, .form-actions, .select-search, .select-hint) {
    border-color: #282047;
}
[data-theme=dark] .queue-tabs > button.active {
    color: #ddd6fe;
    border-bottom-color: #a78bfa;
}

/* Dark Mode Buttons */
[data-theme=dark] .button {
    background: #1e1738;
    color: #f5f3ff;
    border-color: #3d316b;
}
[data-theme=dark] .button:hover:not(:disabled) {
    background: #2a204d;
    border-color: #6d55b5;
}
[data-theme=dark] .button.primary {
    background: linear-gradient(180deg, #8b5cf6 0%, #7c3aed 100%);
    color: #ffffff;
    border-color: #8b5cf6;
    box-shadow: 0 4px 16px rgba(124, 58, 237, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}
[data-theme=dark] .button.primary:hover:not(:disabled) {
    background: linear-gradient(180deg, #7c3aed 0%, #6d28d9 100%);
    border-color: #a78bfa;
    box-shadow: 0 6px 22px rgba(124, 58, 237, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.26);
}
[data-theme=dark] .button.light {
    background: rgba(124, 58, 237, 0.20);
    color: #ede9fe;
    border-color: rgba(167, 139, 250, 0.40);
}
[data-theme=dark] .button.light:hover:not(:disabled) {
    background: rgba(124, 58, 237, 0.32);
    border-color: #c4b5fd;
}

/* Dark Mode Semantic Badges, Priorities & SLAs */
[data-theme=dark] :is(.badge, .sla) {
    background: #1e1738;
    color: #d5cef0;
    border-color: #3a2e66;
}
[data-theme=dark] :is(.badge.new, .badge.open, .badge.scheduled) {
    background: rgba(79, 70, 229, 0.24);
    color: #c7d2fe;
    border-color: rgba(129, 140, 248, 0.42);
}
[data-theme=dark] :is(.badge.inprogress, .badge.pending, .badge.pendingapproval, .badge.submitted, .badge.implementing, .badge.investigating, .sla.soon) {
    background: rgba(217, 119, 6, 0.20);
    color: #fcd34d;
    border-color: rgba(245, 158, 11, 0.42);
}
[data-theme=dark] :is(.badge.waitingoncustomer, .badge.identified, .badge.acknowledged) {
    background: rgba(124, 58, 237, 0.25);
    color: #ddd6fe;
    border-color: rgba(167, 139, 250, 0.44);
}
[data-theme=dark] :is(.badge.resolved, .badge.closed, .badge.approved, .badge.complete, .badge.completed, .badge.succeeded, .badge.sent, .badge.delivered, .sla.met) {
    background: rgba(5, 150, 105, 0.20);
    color: #6ee7b7;
    border-color: rgba(52, 211, 153, 0.40);
}
[data-theme=dark] :is(.badge.breached, .badge.failed, .badge.rejected, .badge.error, .sla.late) {
    background: rgba(220, 38, 38, 0.22);
    color: #fecaca;
    border-color: rgba(248, 113, 113, 0.44);
}
[data-theme=dark] .badge.priority { background: transparent; border: 0; color: #d5cef0; }
[data-theme=dark] .badge.priority.normal { color: #c4b5fd; }
[data-theme=dark] .badge.priority.normal:before { background: #a78bfa; }
[data-theme=dark] .badge.priority.high { color: #fbbf24; }
[data-theme=dark] .badge.priority.critical { color: #fca5a5; }

/* Dark Mode Avatars, Icons & Charts */
[data-theme=dark] :is(.avatar, .workspace-avatar, .avatar.lavender) {
    background: rgba(124, 58, 237, 0.26);
    color: #ddd6fe;
    border-color: rgba(167, 139, 250, 0.40);
}
[data-theme=dark] .avatar.peach {
    background: rgba(217, 119, 6, 0.22);
    color: #fcd34d;
    border-color: rgba(245, 158, 11, 0.40);
}
[data-theme=dark] :is(.avatar.mint, .metric-icon.sage) {
    background: rgba(5, 150, 105, 0.22);
    color: #6ee7b7;
    border-color: rgba(52, 211, 153, 0.38);
}
[data-theme=dark] :is(.ai-icon, .plugin-icon, .metric-icon, .metric-icon.royal, .metric-icon.indigo) {
    background: rgba(124, 58, 237, 0.24);
    color: #c4b5fd;
}
[data-theme=dark] .assistant-mini .ai-icon {
    background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
    color: #ffffff;
}
[data-theme=dark] .metric-icon.amber {
    background: rgba(217, 119, 6, 0.22);
    color: #fcd34d;
}
[data-theme=dark] .metric-card.has-alert :is(.metric-value, .metric-note) { color: #fbbf24; }
[data-theme=dark] a.metric-card:hover,
[data-theme=dark] .problem-card:hover,
[data-theme=dark] .plugin-card:hover {
    border-color: rgba(167, 139, 250, 0.48);
    box-shadow: var(--royal-shadow-hover);
}

[data-theme=dark] .bar-chart {
    border-color: #2e2552;
    background: repeating-linear-gradient(to top, transparent 0, transparent 35px, #21193d 36px, transparent 37px);
}
[data-theme=dark] .bar.created {
    background: linear-gradient(180deg, #a78bfa 0%, #7c3aed 100%);
    box-shadow: 0 2px 10px rgba(139, 92, 246, 0.30);
}
[data-theme=dark] .bar.resolved {
    background: linear-gradient(180deg, #4c3d7a 0%, #372b5c 100%);
}
[data-theme=dark] .legend-dot.pale { background: #5a488f; }
[data-theme=dark] .chart-legend .legend-dot.green,
[data-theme=dark] .legend-dot.created-dot { background: #a78bfa; }
[data-theme=dark] :is(.bar span, .day-label, .chart-legend) { color: #d5cef0; }

[data-theme=dark] .notice.error {
    background: rgba(220, 38, 38, 0.20);
    border-color: rgba(248, 113, 113, 0.42);
    color: #fecaca;
}
[data-theme=dark] .proposal {
    background: rgba(124, 58, 237, 0.16);
    border-color: rgba(167, 139, 250, 0.34);
}
[data-theme=dark] :is(.demo-login strong, .login-story em) { color: #c4b5fd; }
[data-theme=dark] :is(.linked-tickets a, .tool-chip, .queue-tabs button span, .ai-tag) {
    background: rgba(124, 58, 237, 0.24);
    border-color: rgba(167, 139, 250, 0.38);
    color: #ddd6fe;
}
[data-theme=dark] :is(.time-row small, .comment-heading time, .ticket-heading-meta, .detail-sidebar label) {
    color: #b8b0d4;
}
[data-theme=dark] :is(.proposal h4, .proposal pre) { color: #e4dff5; }
[data-theme=dark] .search-input { border-color: #3a2e66; background: #110d22; }
[data-theme=dark] .search-input input { background: transparent; }
[data-theme=dark] :is(input, textarea)::placeholder { color: #8e84b0; }

[data-theme=dark] .orbit { border-color: rgba(167, 139, 250, 0.24); }
[data-theme=dark] .orbit.two { border-color: rgba(167, 139, 250, 0.32); }
[data-theme=dark] .orbit.three { border-color: rgba(196, 181, 253, 0.40); }
[data-theme=dark] .orbit-center {
    background: linear-gradient(135deg, #8b5cf6 0%, #5b21b6 100%);
    color: #ffffff;
    box-shadow: 0 14px 36px rgba(124, 58, 237, 0.45), 0 0 0 10px rgba(167, 139, 250, 0.14);
}
[data-theme=dark] .floating-tag {
    background: rgba(25, 18, 51, 0.92);
    border-color: rgba(167, 139, 250, 0.38);
    color: #ede9fe;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
}
[data-theme=dark] .floating-tag svg { color: #34d399; }
[data-theme=dark] .floating-tag.secondary svg { color: #a78bfa; }

[data-theme=dark] #blazor-error-ui {
    background: #2b1d12;
    color: #fcd34d;
    border-color: #78501c;
}
[data-theme=dark] #components-reconnect-modal {
    background-color: #151029 !important;
    color: #f5f3ff !important;
    border: 1px solid #352a5e !important;
}

[data-theme=dark] ::-webkit-scrollbar-track { background: #0c0918; }
[data-theme=dark] ::-webkit-scrollbar-thumb { background: #3a2e66; }
[data-theme=dark] ::-webkit-scrollbar-thumb:hover { background: #564591; }

@media (max-width: 1200px) { .topbar-right > .demo-badge { display: none; } }
@media (max-width: 700px) {
    .topbar-right > .connection, .breadcrumb { display: none; }
    .topbar { justify-content: flex-end; }
    .appearance-controls { gap: 7px; }
    .flag-choice { padding: 5px; }
    .auth-appearance { right: 16px; top: 12px; }
}
@media (max-width: 360px) {
    .auth-appearance {
        position: relative;
        top: auto;
        right: auto;
        display: flex;
        justify-content: flex-end;
        padding: 10px 16px;
        background: var(--white);
    }
}

/* Ticket Productivity, Controlled RFC Workflows, Reports & Analytics */
.work-grid { display: grid; grid-template-columns: minmax(260px, 0.9fr) minmax(320px, 1.4fr); gap: 24px; align-items: start; }
.work-tools { min-width: 0; }
.work-tools details, details.work-tools {
    margin: 16px 0;
    padding-top: 12px;
    border-top: 1px solid var(--border, #e4e2f0);
}
.work-tools summary {
    cursor: pointer;
    font-weight: 650;
    margin-bottom: 12px;
    color: var(--ink);
    transition: color 0.16s var(--ease-smooth);
}
.work-tools summary:hover { color: var(--royal); }
.work-tools .wrap { flex-wrap: wrap; align-items: center; gap: 8px; }
.work-tools .wrap > input { width: 180px; }
.work-tools .wrap .search-select { min-width: 160px; flex: 1; }
.work-tools .notice { overflow-wrap: anywhere; }
.work-tools .checkbox-label { align-items: flex-start; }
.ticket-table input[type=checkbox] {
    width: 17px;
    height: 17px;
    margin-right: 10px;
    vertical-align: middle;
    accent-color: var(--royal);
}
.detail-sidebar .work-tools { margin-top: 20px; }
.work-grid .detail-list dd { overflow-wrap: anywhere; }
@media (max-width: 900px) { .work-grid { grid-template-columns: 1fr; } }

.report-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
    margin: 24px 0;
}
.report-metrics > div {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-subtle);
    transition: transform 0.22s var(--ease-spring), border-color 0.22s var(--ease-smooth), box-shadow 0.22s var(--ease-smooth);
}
.report-metrics > div:hover {
    transform: translateY(-2px);
    border-color: var(--royal-border);
    box-shadow: var(--royal-shadow);
}
.report-metrics strong { font-size: 26px; font-weight: 800; color: var(--ink); }
.report-metrics small { color: var(--muted); }
.detail-sidebar > .panel { margin-bottom: 20px; }

/* Analytics Filters */
.analytics-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr));
    gap: 12px;
    align-items: end;
}
.analytics-filters label { min-width: 0; }
.analytics-filters input { width: 100%; min-width: 0; box-sizing: border-box; }
.analytics-filters button { width: fit-content; }

/* Keyboard Keycaps & Accordion Polish */
kbd {
    display: inline-block;
    padding: 2px 6px;
    font-family: 'Cascadia Code', Consolas, monospace;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--royal-deep);
    background: var(--royal-soft);
    border: 1px solid var(--royal-border);
    border-bottom-width: 2px;
    border-radius: 5px;
}
[data-theme=dark] kbd {
    color: #ddd6fe;
    background: #1e1738;
    border-color: rgba(167, 139, 250, 0.38);
}