/*
 * BIC-QA browser dark theme
 *
 * This file is deliberately loaded after every feature stylesheet. The
 * project contains several generations of component styles; keeping the
 * semantic dark-mode contract here prevents late light-only declarations
 * from producing white cards with pale text in a dark browser theme.
 */

:root {
    /* Compatibility aliases used by older profile and analysis components. */
    --qa-surface: var(--qa-bg-surface, #ffffff);
    --qa-text: var(--qa-text-primary, #2a3340);
    --qa-text-muted: var(--qa-text-tertiary, #667085);
    --qa-text-900: var(--qa-text-primary, #2a3340);
    --qa-text-500: var(--qa-text-tertiary, #667085);
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;

        /* Quiet navy surfaces with softened, WCAG-AA text contrast. */
        --qa-brand-50: #172440;
        --qa-brand-100: #1d2e52;
        --qa-brand-200: #334b7d;
        --qa-brand-400: #8da3ef;
        --qa-brand-500: #7890ed;
        --qa-brand-600: #9eb0f6;
        --qa-brand-700: #bdc8fb;
        --qa-bg-canvas: #0b1220;
        --qa-bg-surface: #121c2e;
        --qa-bg-muted: #18253a;
        --qa-surface: #121c2e;
        --qa-text-primary: #e6ecf5;
        --qa-text-secondary: #b7c2d2;
        --qa-text-tertiary: #92a0b5;
        --qa-text: #e6ecf5;
        --qa-text-muted: #92a0b5;
        --qa-text-900: #e6ecf5;
        --qa-text-500: #92a0b5;
        --qa-border: #24334a;
        --qa-border-strong: #354761;
        --qa-danger: #ff8796;
        --qa-success: #56d5a5;
        --qa-shadow-card: 0 10px 28px rgba(0, 0, 0, .22);
        --qa-shadow-pop: 0 24px 64px rgba(0, 0, 0, .5);
        --qa-shadow-brand: 0 8px 20px rgba(72, 98, 210, .28);
        --qa-focus-ring: 0 0 0 3px rgba(120, 144, 237, .28);

        --profile-bg-page: var(--qa-bg-canvas);
        --profile-bg-card: var(--qa-bg-surface);
        --profile-bg-hover: #19263b;
        --profile-bg-secondary: var(--qa-bg-muted);
        --profile-accent: var(--qa-brand-500);
        --profile-accent-hover: var(--qa-brand-400);
        --profile-accent-light: var(--qa-brand-50);
        --profile-border: var(--qa-border);
        --profile-border-light: var(--qa-border);
        --profile-shadow-sm: 0 1px 2px rgba(0, 0, 0, .18);
        --profile-shadow-md: 0 8px 20px rgba(0, 0, 0, .22);
        --profile-shadow-lg: 0 22px 60px rgba(0, 0, 0, .46);
    }

    html,
    body,
    .container,
    .main-content,
    .content-area,
    .search-section {
        color: var(--qa-text-primary);
        background-color: var(--qa-bg-canvas);
    }

    body {
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
    }

    input,
    textarea,
    select {
        color: var(--qa-text-primary);
        caret-color: var(--qa-brand-400);
    }

    input::placeholder,
    textarea::placeholder {
        color: var(--qa-text-tertiary);
        opacity: 1;
    }

    /* Application shell and navigation */
    .sidebar,
    .sidebar-account-shell {
        color: var(--qa-text-primary);
        background: var(--qa-bg-surface);
        border-color: var(--qa-border);
    }

    .logo-section,
    .sidebar-history-panel,
    .sidebar-function-center {
        border-color: var(--qa-border);
    }

    .logo-icon {
        content: url('../icons/logo_dark.png') !important;
        filter: none !important;
        opacity: 1 !important;
    }

    .sidebar-history-header h2,
    .sidebar-history-question,
    .sidebar-account-trigger-copy strong,
    .sidebar-account-menu strong {
        color: var(--qa-text-secondary);
    }

    .sidebar-history-search,
    .sidebar-history-open,
    .sidebar-function-center .sidebar-action-btn,
    .sidebar-account-trigger,
    .language-select,
    .settings-button {
        color: var(--qa-text-secondary);
        background: var(--qa-bg-muted);
        border-color: var(--qa-border);
    }

    .sidebar-history-open:hover,
    .sidebar-history-item.is-active .sidebar-history-open,
    .sidebar-history-item.is-top .sidebar-history-open,
    .sidebar-function-center .sidebar-action-btn:hover,
    .sidebar-account-trigger:hover,
    .sidebar-account-trigger[aria-expanded='true'] {
        color: var(--qa-text-primary);
        background: var(--qa-brand-50);
        border-color: var(--qa-brand-200);
    }

    .sidebar-history-item.is-active .sidebar-history-open {
        box-shadow: inset 3px 0 0 var(--qa-brand-500);
    }

    .sidebar-history-menu,
    .sidebar-account-menu {
        color: var(--qa-text-primary);
        background: #152135;
        border-color: var(--qa-border-strong);
        box-shadow: var(--qa-shadow-pop);
    }

    .sidebar-account-menu-item,
    .sidebar-account-menu-header,
    .sidebar-account-menu-footer {
        color: var(--qa-text-secondary);
        border-color: var(--qa-border);
    }

    .sidebar-account-menu-item:hover {
        color: var(--qa-text-primary);
        background: var(--qa-bg-muted);
    }

    /* Daily check-in modal */
    .sidebar-checkin-panel,
    .sidebar-checkin-panel.is-auto-prompt {
        color: var(--qa-text-primary);
        background: #141f32;
        border-color: var(--qa-border-strong);
        box-shadow: 0 30px 76px rgba(0, 0, 0, .55), 0 0 0 100vmax rgba(3, 8, 18, .58);
    }

    .sidebar-checkin-panel.is-auto-prompt .sidebar-checkin-summary {
        background: linear-gradient(135deg, #192847, #172238);
        border-color: var(--qa-brand-200);
    }

    .sidebar-checkin-eyebrow,
    .sidebar-checkin-copy,
    .sidebar-checkin-status,
    .sidebar-checkin-reward small {
        color: var(--qa-text-secondary);
    }

    .sidebar-checkin-title,
    .sidebar-checkin-reward strong {
        color: var(--qa-text-primary);
    }

    .sidebar-checkin-close {
        color: var(--qa-text-tertiary);
    }

    .sidebar-checkin-close:hover {
        color: var(--qa-text-primary);
        background: var(--qa-bg-muted);
    }

    /* Composer, answer typography and supporting controls */
    .input-container,
    .composer-toolbar,
    .composer-advanced,
    .character-count,
    .composer-attachment-item,
    .attachment-preview-item {
        color: var(--qa-text-secondary);
        background: var(--qa-bg-surface);
        border-color: var(--qa-border);
    }

    .question-input,
    .question-input:focus,
    .question-input:focus-visible {
        color: var(--qa-text-primary);
        background: transparent;
        -webkit-text-fill-color: var(--qa-text-primary);
    }

    .input-title,
    .result-title,
    .result-text,
    .result-text-content,
    .ai-display,
    .bicbot-message-assistant .bicbot-message-body {
        color: var(--qa-text-primary);
    }

    .input-subtitle,
    .footer,
    .result-answer-meta,
    .bicbot-message-meta,
    .bicbot-message-role {
        color: var(--qa-text-tertiary);
    }

    .result-container,
    .result-actions,
    .result-text hr,
    .result-text-content hr {
        border-color: var(--qa-border);
    }

    .action-icon-btn {
        color: var(--qa-text-tertiary) !important;
        background: transparent !important;
    }

    .action-icon-btn:hover {
        color: var(--qa-text-primary) !important;
        background: var(--qa-bg-muted) !important;
    }

    .bicbot-message-user .bicbot-message-body {
        color: #eef3ff;
        background: #20345f;
        border-color: #38518a;
    }

    /* Restored history conversations use a full-width wrapper around the user bubble. */
    .question-display {
        color: var(--qa-text-primary);
        background: transparent !important;
        border-color: transparent !important;
        box-shadow: none !important;
    }

    .question-display .question-content {
        color: #eef3ff;
        background: linear-gradient(115deg, #203761, #1b2d4e) !important;
        border-color: #3c5688 !important;
        box-shadow: 0 8px 22px rgba(0, 0, 0, .2) !important;
    }

    .question-display .question-text {
        color: #eef3ff !important;
        -webkit-text-fill-color: #eef3ff;
    }

    .question-display .sent-mode-badge {
        color: #cbd5ff;
        background: rgba(125, 146, 237, .14);
        border-color: rgba(151, 168, 239, .3);
    }

    .question-display .copy-question-btn {
        background: rgba(12, 22, 39, .54);
    }

    .question-display .copy-question-btn:hover,
    .question-display .copy-question-btn:focus-visible {
        background: #111d31;
    }

    .bicbot-messages,
    .bicbot-message-assistant .bicbot-message-body {
        background: var(--qa-bg-surface);
        border-color: var(--qa-border);
    }

    .bicbot-thinking-panel,
    .bicbot-interleaved-stream .bicbot-thinking-panel {
        background: linear-gradient(135deg, #14233b, #111c2f);
        border-color: #304c76;
        box-shadow: 0 7px 18px rgba(0, 0, 0, .2);
    }

    .bicbot-thinking-toggle {
        color: #a9c8f4;
    }

    .bicbot-thinking-content {
        color: var(--qa-text-secondary);
        scrollbar-color: #405777 transparent;
    }

    .ai-display :is(pre, .code-block),
    .analysis-task-answer-code {
        color: #dce7f9;
        background: #09101d;
        border-color: var(--qa-border-strong);
    }

    .ai-display :not(pre) > code,
    .result-text-content :not(pre) > code {
        color: #abc1f8;
        background: #1a2941;
        border-color: #334968;
    }

    .ai-display blockquote,
    .result-text-content blockquote {
        color: var(--qa-text-secondary);
        background: #142239;
        border-left-color: var(--qa-brand-400);
    }

    .ai-display :is(table, th, td),
    .result-text-content :is(table, th, td) {
        color: var(--qa-text-secondary);
        background: var(--qa-bg-surface);
        border-color: var(--qa-border);
    }

    .ai-display th,
    .result-text-content th {
        color: var(--qa-text-primary);
        background: var(--qa-bg-muted);
    }

    /* Generated files, report links and analysis cards */
    .bicbot-stream-file,
    .analysis-task-result-file,
    .analysis-task-attachment,
    .result-text-content a[href*='/.bic/web/chats/'][href*='.html'],
    .result-text-content a[href*='/data/bic-qa/deploy/data/knowl/bic/web/chats/'][href*='.html'] {
        color: var(--qa-text-primary) !important;
        background: linear-gradient(110deg, #17243a, #131e31);
        border-color: #344b72;
        box-shadow: inset 3px 0 0 var(--qa-brand-500), 0 8px 22px rgba(0, 0, 0, .24);
    }

    .bicbot-stream-file:hover,
    .analysis-task-result-file:hover,
    .result-text-content a[href*='/.bic/web/chats/'][href*='.html']:hover,
    .result-text-content a[href*='/data/bic-qa/deploy/data/knowl/bic/web/chats/'][href*='.html']:hover {
        color: #dce6ff !important;
        background: linear-gradient(110deg, #1c2c47, #17243a);
        border-color: var(--qa-brand-400);
    }

    .bicbot-stream-file-status,
    .analysis-task-result-file-meta,
    .analysis-task-attachment-size {
        color: var(--qa-text-tertiary);
    }

    .analysis-task-card {
        color: var(--qa-text-primary);
        background: linear-gradient(135deg, #142137, #111b2d);
        border-color: var(--qa-border-strong);
        box-shadow: var(--qa-shadow-card);
    }

    .analysis-task-stage,
    .analysis-task-timing,
    .analysis-task-answer-quote {
        color: var(--qa-text-secondary);
    }

    .analysis-task-answer,
    .analysis-task-answer-heading,
    .analysis-task-answer-title {
        color: var(--qa-text-primary);
    }

    .analysis-task-progress-track,
    .analysis-task-answer-quote {
        background: var(--qa-bg-muted);
    }

    .analysis-task-answer-card {
        border-color: var(--qa-border);
    }

    /* Profile center shell */
    .profile-center-dialog {
        background: rgba(3, 8, 18, .7);
    }

    .profile-center-dialog .profile-center-container,
    .profile-center-dialog .profile-center-header,
    .profile-center-dialog .profile-center-tabs,
    .profile-center-dialog .profile-center-footer {
        color: var(--qa-text-primary);
        background: var(--qa-bg-surface) !important;
        border-color: var(--qa-border) !important;
    }

    .profile-center-dialog .profile-center-header h3 {
        color: var(--qa-text-primary) !important;
    }

    .profile-center-layout,
    .profile-center-content,
    .profile-center-dialog .profile-center-content {
        color: var(--qa-text-primary);
        background: var(--qa-bg-canvas) !important;
    }

    .profile-center-header h3,
    .profile-panel-heading h4,
    .profile-section-heading h3,
    .profile-token-intro h3,
    .profile-recharge-intro h3,
    .profile-recharge-records-intro h3,
    .profile-profile-intro h3,
    .profile-recharge-card-heading h4,
    .profile-setting-item h3,
    .profile-setting-card strong,
    .profile-binding-card h3,
    .profile-account-identity h3,
    .profile-account-details dd,
    .profile-binding-row strong {
        color: var(--qa-text-primary) !important;
    }

    .profile-token-intro p,
    .profile-recharge-intro p,
    .profile-recharge-records-intro p,
    .profile-profile-intro p,
    .profile-recharge-card-heading p,
    .profile-setting-item p,
    .profile-setting-card p,
    .profile-binding-label,
    .profile-account-details dt,
    .profile-account-identity p,
    .profile-purchase-hint,
    .profile-recharge-safe,
    .profile-ecode-hint {
        color: var(--qa-text-secondary) !important;
    }

    .profile-tab-btn {
        color: var(--qa-text-secondary);
        background: transparent;
        border-color: transparent;
    }

    .profile-tab-btn:hover {
        color: var(--qa-text-primary);
        background: var(--qa-bg-muted);
        border-color: var(--qa-border);
    }

    .profile-center-dialog .profile-tab-btn.active,
    .profile-center-dialog .profile-tab-btn[aria-selected='true'] {
        color: #c7d1ff !important;
        background: #1d2d52 !important;
        border-color: #3a528d !important;
    }

    .profile-account-hero,
    .profile-binding-card,
    .profile-account-details,
    .profile-account-info-card,
    .profile-detail-list,
    .profile-setting-card,
    .profile-setting-item,
    .profile-credential-setup,
    .profile-token-section,
    .profile-metric-card,
    .profile-distribution-card,
    .profile-token-chart-shell,
    .profile-token-table-wrap,
    .profile-recharge-records-list,
    .profile-recharge-record-card,
    .profile-purchase-card,
    .profile-redeem-card,
    .profile-recharge-result,
    .profile-invite-share-zone,
    .profile-invite-link-box,
    .profile-empty-state,
    .profile-api-key-dialog,
    .profile-api-key-row,
    .profile-order-dialog,
    .profile-order-detail-grid > div {
        color: var(--qa-text-primary);
        background: var(--qa-bg-surface) !important;
        border-color: var(--qa-border) !important;
        box-shadow: var(--qa-shadow-card) !important;
    }

    .profile-credential-setup,
    .profile-purchase-card {
        background: linear-gradient(135deg, #172640, #121d30) !important;
        border-color: #304875 !important;
    }

    .profile-token-balance-detail {
        background: linear-gradient(125deg, #172640, #121c2e);
        border-color: #304875;
    }

    .profile-binding-row,
    .profile-account-details > div,
    .profile-account-info-row,
    .profile-detail-row,
    .profile-recharge-record-row,
    .profile-token-table th,
    .profile-token-table td,
    .profile-order-detail-grid > div {
        border-color: var(--qa-border) !important;
    }

    .profile-recharge-records-list-head,
    .profile-token-table th,
    .profile-token-range-tabs,
    .profile-token-pagination,
    .profile-api-key-list-head {
        color: var(--qa-text-secondary) !important;
        background: var(--qa-bg-muted) !important;
        border-color: var(--qa-border) !important;
    }

    .profile-recharge-record-row:hover,
    .profile-token-table tbody tr:hover td,
    .profile-setting-item:hover {
        background: #17243a !important;
    }

    .profile-center-dialog .profile-token-chart,
    .profile-center-dialog .profile-token-chart-shell .profile-token-chart {
        background:
            repeating-linear-gradient(to bottom, transparent 0, transparent 43px, rgba(121, 146, 190, .15) 44px, transparent 45px),
            linear-gradient(180deg, #111d30, #0d1727) !important;
        border: 1px solid var(--qa-border) !important;
    }

    .profile-token-chart-shell .profile-chart-column i {
        background: #293a58;
    }

    .profile-token-range-btn {
        color: var(--qa-text-secondary);
    }

    .profile-token-range-btn.is-active {
        color: #c2ccff;
        background: #253755;
        box-shadow: 0 1px 4px rgba(0, 0, 0, .28);
    }

    .profile-recharge-records-search,
    .profile-recharge-records-search input,
    .profile-ecode-input-row input,
    .profile-page-size select,
    .profile-api-key-form input,
    .profile-api-key-form select {
        color: var(--qa-text-primary) !important;
        -webkit-text-fill-color: var(--qa-text-primary);
        background: var(--qa-bg-muted) !important;
        border-color: var(--qa-border-strong) !important;
    }

    .profile-center-dialog .profile-page-size {
        min-height: 36px;
        padding: 3px 4px 3px 10px;
        color: var(--qa-text-tertiary) !important;
        background: #131f32 !important;
        border-color: var(--qa-border) !important;
        border-radius: 10px;
        box-shadow: none !important;
    }

    .profile-center-dialog .profile-page-size select {
        min-height: 28px;
        padding: 4px 24px 4px 8px;
        border-radius: 7px;
    }

    .profile-center-dialog .profile-recharge-record-row .profile-token-value.is-long,
    .profile-center-dialog .profile-recharge-record-row .profile-token-value.is-compact {
        min-width: 0;
        overflow: hidden;
        color: #7ee4bd;
        font-size: 13px;
        font-variant-numeric: tabular-nums;
        letter-spacing: -.02em;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Keep submitted analysis messages compact and visually attached to their files. */
    .analysis-task-user-message {
        width: fit-content !important;
        max-width: min(86%, 760px);
        margin: 0 0 16px auto;
    }

    .analysis-task-user-head {
        width: fit-content;
        max-width: 100%;
        min-height: 0;
        padding: 8px 10px;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 7px;
        margin: 0;
        background: linear-gradient(115deg, #1a2a47, #17253d);
        border: 1px solid #30466a;
        border-radius: 14px 14px 5px 14px;
        box-shadow: 0 8px 22px rgba(0, 0, 0, .2);
    }

    .analysis-task-user-head .analysis-user-question {
        max-width: 430px;
        margin: 0;
        color: var(--qa-text-primary) !important;
        font-size: 14px;
        line-height: 20px;
    }

    .analysis-task-user-head .analysis-task-user-attachments {
        width: auto;
        max-width: 100%;
        margin: 0;
        flex: 0 1 auto;
        flex-wrap: wrap;
        gap: 6px;
    }

    .analysis-task-user-head .analysis-task-attachment {
        width: auto;
        max-width: min(220px, 100%);
        min-height: 38px;
        padding: 5px 9px 5px 5px;
        gap: 7px;
        color: var(--qa-text-primary) !important;
        background: linear-gradient(110deg, #152238, #111c2e) !important;
        border-color: #3a5278 !important;
        border-radius: 10px;
        box-shadow: none;
    }

    .analysis-task-user-head .analysis-task-attachment-type {
        width: 28px;
        height: 28px;
        border-radius: 7px;
        font-size: 8px;
    }

    .analysis-task-user-head .analysis-task-attachment-name {
        color: var(--qa-text-primary) !important;
        font-size: 11px;
        line-height: 14px;
    }

    .analysis-task-user-head .analysis-task-attachment-size {
        color: var(--qa-text-tertiary) !important;
        font-size: 9px;
        line-height: 12px;
    }

    .profile-center-dialog .profile-secondary-btn,
    .profile-center-dialog .profile-recharge-records-refresh,
    .profile-center-dialog .profile-recharge-records-search-btn,
    .profile-center-dialog .profile-invite-link-box button,
    .profile-center-dialog .profile-invite-code strong,
    .profile-center-dialog .profile-invite-steps span {
        color: #b8c5ff !important;
        background: var(--qa-brand-50) !important;
        border-color: var(--qa-brand-200) !important;
    }

    .profile-center-dialog .profile-secondary-btn:hover,
    .profile-center-dialog .profile-recharge-records-refresh:hover,
    .profile-center-dialog .profile-invite-link-box button:hover {
        color: #d8dfff !important;
        background: var(--qa-brand-100) !important;
        border-color: var(--qa-brand-400) !important;
    }

    .profile-status-badge,
    .profile-setting-badge,
    .profile-recharge-safe,
    .profile-token-increase-badge {
        color: #7ee4bd !important;
        background: rgba(40, 188, 137, .12) !important;
        border-color: rgba(86, 213, 165, .28) !important;
    }

    .profile-center-dialog .profile-danger-setting,
    .profile-center-dialog .profile-danger-btn {
        color: var(--qa-danger) !important;
        background: rgba(255, 93, 113, .08) !important;
        border-color: rgba(255, 135, 150, .25) !important;
    }

    /* QR codes and image guides need a genuinely light island for scanning. */
    .profile-purchase-qr,
    .profile-invite-qr-frame,
    .profile-ecode-guide-popover img {
        color-scheme: light;
        background: #ffffff !important;
        border-color: #6f82a7 !important;
    }

    .profile-ecode-guide-popover {
        color: var(--qa-text-primary);
        background: var(--qa-bg-surface);
        border-color: var(--qa-border-strong);
        box-shadow: var(--qa-shadow-pop);
    }

    /* Authentication, order/detail, support and utility dialogs */
    .dialog-overlay,
    .profile-api-key-modal,
    .profile-order-modal,
    .customer-support-dialog,
    .bicbot-cancel-account-overlay {
        background: rgba(3, 8, 18, .7);
    }

    .dialog-container,
    .auth-dialog,
    .profile-api-key-dialog,
    .profile-order-dialog,
    .customer-support-panel,
    .customer-support-card,
    .bicbot-delete-confirm-dialog,
    .bicbot-cancel-account-overlay .dialog-header,
    .bicbot-cancel-account-overlay .bicbot-delete-confirm-actions,
    .info-tooltip,
    .awr-tooltip {
        color: var(--qa-text-primary);
        background: var(--qa-bg-surface) !important;
        border-color: var(--qa-border-strong) !important;
    }

    .customer-support-card p,
    .customer-support-card small,
    .dialog-subtitle,
    .bicbot-login-helper,
    .bicbot-delete-confirm-warning,
    .info-tooltip p,
    .info-tooltip ol {
        color: var(--qa-text-secondary) !important;
    }

    .bicbot-login-field input,
    .dialog-container input,
    .dialog-container select,
    .dialog-container textarea {
        color: var(--qa-text-primary) !important;
        -webkit-text-fill-color: var(--qa-text-primary);
        background: var(--qa-bg-muted) !important;
        border-color: var(--qa-border-strong) !important;
    }

    .bicbot-login-field input:-webkit-autofill {
        -webkit-text-fill-color: var(--qa-text-primary) !important;
        box-shadow: 0 0 0 1000px var(--qa-bg-muted) inset !important;
    }

    .content-area > .token-registration-banner {
        background: #101a2b;
        border-bottom-color: var(--qa-border);
    }

    ::selection {
        color: #ffffff;
        background: rgba(120, 144, 237, .62);
    }
}