/* ============================================
   DARK-MODE.CSS — Variables y ajustes de tema.
   ============================================ */

/* Transición suave al cambiar tema */
body {
    transition: background-color 0.25s ease, color 0.25s ease;
}

/* ============================================
   DARK MODE
   ============================================ */
[data-bs-theme="dark"] {
    /* Colores de marca en dark */
    --brand-primary: #60a5fa;
    --brand-primary-hover: #93c5fd;
    --brand-primary-subtle: rgba(96, 165, 250, 0.22);
    --brand-primary-strong: #dbeafe;
    --brand-heading: #f8fafc;
    --surface-page: #0b1220;
    --surface-panel: #1c2430;
    --surface-muted: #262f3d;
    --surface-accent: #323d4d;
    --text-strong: #f8fafc;
    --text-muted: #cdd6e4;
    --border-data: #6f7f95;
    --border-soft: #59687d;
    --border-strong: #95a6be;
    --shadow-soft: 0 18px 36px rgba(2, 6, 23, 0.42);
    --shadow-soft-hover: 0 22px 42px rgba(2, 6, 23, 0.52);
    --shadow-card: 0 4px 14px rgba(0, 0, 0, 0.28);
    --shadow-card-hover: 0 10px 22px rgba(0, 0, 0, 0.42);
    --page-top-glow: rgba(30, 64, 175, 0.18);
    /* Bootstrap primary en dark */
    --bs-primary: #60a5fa;
    --bs-primary-rgb: 96, 165, 250;
    --bs-link-color: #93c5fd;
    --bs-link-color-rgb: 147, 197, 253;
    --bs-link-hover-color: #bfdbfe;
    --bs-link-hover-color-rgb: 191, 219, 254;
    /* Bootstrap body tokens — controlan la mayoría de componentes */
    --bs-body-bg: #0b1220;
    --bs-body-bg-rgb: 11, 18, 32;
    --bs-body-color: #f4f7ff;
    --bs-body-color-rgb: 244, 247, 255;
    --bs-secondary-color: #cdd6e4;
    --bs-secondary-color-rgb: 205, 214, 228;
    --bs-emphasis-color: #f8fafc;
    --bs-emphasis-color-rgb: 248, 250, 252;
    --bs-tertiary-bg: #1c2430;
    --bs-tertiary-bg-rgb: 28, 36, 48;
    --bs-secondary-bg: #262f3d;
    --bs-secondary-bg-rgb: 38, 47, 61;
    --bs-border-color: #59687d;
    --bs-border-color-translucent: rgba(115, 132, 156, 0.5);
}

    [data-bs-theme="dark"] .theme-toggle-btn .icon-moon {
        display: none;
    }

    [data-bs-theme="dark"] .theme-toggle-btn .icon-sun {
        display: inline-block;
    }

    [data-bs-theme="dark"] .site-navbar,
    [data-bs-theme="dark"] .site-footer {
        background-color: rgba(11, 18, 32, 0.96);
    }

        [data-bs-theme="dark"] .site-navbar .nav-link,
        [data-bs-theme="dark"] .footer-title,
        [data-bs-theme="dark"] .page-intro,
        [data-bs-theme="dark"] .text-body-secondary {
            color: var(--bs-secondary-color) !important;
        }

    [data-bs-theme="dark"] .card {
        --bs-card-border-color: var(--border-data);
    }

    [data-bs-theme="dark"] .bg-gradient {
        background: linear-gradient(180deg, #222d3b 0%, #263244 100%) !important;
    }

    [data-bs-theme="dark"] a .card {
        border-color: #72839a !important;
    }

        [data-bs-theme="dark"] a:hover .card,
        [data-bs-theme="dark"] a:focus-visible .card {
            border-color: #cbdcf5 !important;
        }

    [data-bs-theme="dark"] .site-navbar .nav-link:hover,
    [data-bs-theme="dark"] .site-navbar .nav-link:focus-visible {
        color: var(--bs-body-color) !important;
        background-color: rgba(96, 165, 250, 0.18);
    }

    [data-bs-theme="dark"] .site-navbar .nav-link.active {
        color: var(--bs-body-color) !important;
        background-color: rgba(96, 165, 250, 0.28);
    }

    [data-bs-theme="dark"] .btn-primary:hover,
    [data-bs-theme="dark"] .btn-primary:focus-visible {
        background-color: #3b82f6;
    }

    [data-bs-theme="dark"] .site-navbar .navbar-collapse {
        background-color: rgba(11, 18, 32, 0.98);
        border-color: rgba(115, 132, 156, 0.45);
    }

    /* ============================================
   SOMBRAS EN DARK
   ============================================ */
    [data-bs-theme="dark"] .home-hero {
        border-color: var(--bs-border-color);
    }

    [data-bs-theme="dark"] .hero-summary-card,
    [data-bs-theme="dark"] .ticker-metric {
        background-color: #2e3948;
        border-color: #7788a0;
    }

    [data-bs-theme="dark"] .page-header__action-card {
        background: #222d3b;
        border-color: #4a5a70;
    }

        [data-bs-theme="dark"] .page-header__action-card h2,
        [data-bs-theme="dark"] .page-header__action-card .text-body {
            color: var(--bs-body-color) !important;
        }

        [data-bs-theme="dark"] .page-header__action-card .card-description,
        [data-bs-theme="dark"] .page-header__action-card .card-kicker {
            color: #d3dded !important;
        }

        [data-bs-theme="dark"] .page-header__action-card .card-cta {
            color: #8dbdff;
        }

    [data-bs-theme="dark"] .content-card,
    [data-bs-theme="dark"] .comparison-panel,
    [data-bs-theme="dark"] .content-card,
    [data-bs-theme="dark"] .market-status-card,
    [data-bs-theme="dark"] .empty-state-card {
        background-color: #212b38;
    }

    [data-bs-theme="dark"] .card-kicker,
    [data-bs-theme="dark"] .metric-label,
    [data-bs-theme="dark"] .ticker-metric-label {
        color: #c0cadb;
    }

    [data-bs-theme="dark"] .metric-card--primary {
        background-color: rgba(30, 64, 175, 0.18);
        border-color: rgba(96, 165, 250, 0.25) !important;
    }

    [data-bs-theme="dark"] .metric-card--success {
        background-color: rgba(22, 101, 52, 0.18);
        border-color: rgba(52, 211, 153, 0.25) !important;
    }

    [data-bs-theme="dark"] .metric-card--info {
        background-color: rgba(3, 105, 161, 0.18);
        border-color: rgba(56, 189, 248, 0.25) !important;
    }

    [data-bs-theme="dark"] .note-card {
        background-color: rgba(30, 64, 175, 0.18);
        border-color: rgba(96, 165, 250, 0.25) !important;
        color: #dbeafe;
    }

    [data-bs-theme="dark"] .breadcrumb-item,
    [data-bs-theme="dark"] .breadcrumb-item a,
    [data-bs-theme="dark"] .table,
    [data-bs-theme="dark"] .form-text,
    [data-bs-theme="dark"] .small,
    [data-bs-theme="dark"] small {
        color: var(--bs-secondary-color);
    }

        [data-bs-theme="dark"] .breadcrumb-item.active,
        [data-bs-theme="dark"] .site-title,
        [data-bs-theme="dark"] .display-5,
        [data-bs-theme="dark"] .display-6,
        [data-bs-theme="dark"] h1,
        [data-bs-theme="dark"] h2,
        [data-bs-theme="dark"] h3,
        [data-bs-theme="dark"] h4,
        [data-bs-theme="dark"] h5,
        [data-bs-theme="dark"] h6 {
            color: var(--bs-body-color);
        }

    [data-bs-theme="dark"] .btn-outline-secondary,
    [data-bs-theme="dark"] .btn-outline-primary {
        --bs-btn-color: var(--bs-body-color);
    }

    /* ============================================
   FORM CONTROLS — focus en dark
   ============================================ */
    [data-bs-theme="dark"] .form-control:focus,
    [data-bs-theme="dark"] .form-select:focus {
        border-color: var(--brand-primary);
    }

    /* ============================================
   TABLAS
   ============================================ */
    [data-bs-theme="dark"] .table-responsive .table {
        --bs-table-bg: #1e2734;
        --bs-table-color: var(--bs-body-color);
        --bs-table-striped-bg: #24303f;
        --bs-table-striped-color: var(--bs-body-color);
        --bs-table-hover-bg: #2a3647;
        --bs-table-hover-color: var(--bs-body-color);
        --bs-table-border-color: var(--border-data);
    }

    [data-bs-theme="dark"] .table.table-light,
    [data-bs-theme="dark"] .table .table-light,
    [data-bs-theme="dark"] .table-light {
        --bs-table-bg: #3a3f48;
        --bs-table-color: #f8fafc;
        --bs-table-border-color: var(--border-data);
        color: #f8fafc !important;
        border-color: var(--border-data) !important;
    }

        [data-bs-theme="dark"] .table-light th,
        [data-bs-theme="dark"] .table-light td,
        [data-bs-theme="dark"] .table thead.table-light th {
            color: #f8fafc !important;
            background-color: #3a3f48 !important;
        }

    [data-bs-theme="dark"] .table-responsive table {
        color: var(--bs-body-color) !important;
        border-color: var(--border-data) !important;
    }

        [data-bs-theme="dark"] .table-responsive table thead,
        [data-bs-theme="dark"] .table-responsive table thead tr,
        [data-bs-theme="dark"] .table-responsive table thead th {
            background: #3a3f48 !important;
            color: #f8fafc !important;
            border-color: var(--border-data) !important;
        }

        [data-bs-theme="dark"] .table-responsive table tbody td {
            background-color: #1b2330 !important;
            color: var(--bs-body-color) !important;
            border-color: var(--border-data) !important;
        }

        [data-bs-theme="dark"] .table-responsive table tbody tr.odd td {
            background-color: #1b2330 !important;
        }

        [data-bs-theme="dark"] .table-responsive table tbody tr.even td {
            background-color: #212b39 !important;
        }

        [data-bs-theme="dark"] .table-responsive table tbody tr:hover td {
            background-color: #2a3545 !important;
        }

        [data-bs-theme="dark"] .table-responsive table .text-success {
            color: #34d399 !important;
        }

        [data-bs-theme="dark"] .table-responsive table .text-danger {
            color: #ff5c73 !important;
        }

    [data-bs-theme="dark"] .calc-table thead th {
        background: rgba(23, 32, 51, 0.95) !important;
        color: var(--bs-body-color) !important;
    }

    [data-bs-theme="dark"] .dataTables_wrapper .dataTables_length,
    [data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter,
    [data-bs-theme="dark"] .dataTables_wrapper .dataTables_info,
    [data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate {
        color: var(--bs-body-color) !important;
    }

    [data-bs-theme="dark"] .dataTables_wrapper .form-select,
    [data-bs-theme="dark"] .dataTables_wrapper .form-control {
        background-color: #121a28;
        border-color: #667890;
        color: var(--bs-body-color);
    }

        [data-bs-theme="dark"] .dataTables_wrapper .form-select:focus,
        [data-bs-theme="dark"] .dataTables_wrapper .form-control:focus {
            background-color: #121a28;
            color: var(--bs-body-color);
        }

    [data-bs-theme="dark"] table.dataTable thead .sorting:before,
    [data-bs-theme="dark"] table.dataTable thead .sorting:after,
    [data-bs-theme="dark"] table.dataTable thead .sorting_asc:before,
    [data-bs-theme="dark"] table.dataTable thead .sorting_asc:after,
    [data-bs-theme="dark"] table.dataTable thead .sorting_desc:before,
    [data-bs-theme="dark"] table.dataTable thead .sorting_desc:after {
        color: #64748b !important;
    }

    /* ============================================
   LIST GROUPS EN DARK
   ============================================ */
    [data-bs-theme="dark"] .list-group-item {
        background-color: transparent;
        color: var(--bs-body-color);
        border-color: var(--bs-border-color);
    }

        [data-bs-theme="dark"] .list-group-item:hover,
        [data-bs-theme="dark"] .list-group-item:focus {
            background-color: rgba(255, 255, 255, 0.04);
        }

    [data-bs-theme="dark"] .ticker-score-box,
    [data-bs-theme="dark"] .ticker-score-chip {
        background: rgba(96, 165, 250, 0.12);
        border-color: rgba(96, 165, 250, 0.18);
    }

    /* ============================================
   EXPLANATION TEXT (SSE / AI tools)
   ============================================ */
    [data-bs-theme="dark"] .explanation-text {
        background-color: var(--bs-secondary-bg);
        color: var(--bs-body-color);
    }

    [data-bs-theme="dark"] #graphsTabs .nav-link.bg-success-subtle {
        background-color: #123d32 !important;
        border-color: transparent !important;
        box-shadow: inset 0 0 0 1px #198754 !important;
        color: #d1e7dd !important;
    }

        [data-bs-theme="dark"] #graphsTabs .nav-link.bg-success-subtle:hover,
        [data-bs-theme="dark"] #graphsTabs .nav-link.bg-success-subtle:focus-visible,
        [data-bs-theme="dark"] #graphsTabs .nav-link.bg-success-subtle.active {
            background-color: #198754 !important;
            border-color: #198754 !important;
            color: #ffffff !important;
        }

    [data-bs-theme="dark"] #graphsTabs .nav-link.bg-danger-subtle {
        background-color: #442228 !important;
        border-color: transparent !important;
        box-shadow: inset 0 0 0 1px #dc3545 !important;
        color: #f8d7da !important;
    }

        [data-bs-theme="dark"] #graphsTabs .nav-link.bg-danger-subtle:hover,
        [data-bs-theme="dark"] #graphsTabs .nav-link.bg-danger-subtle:focus-visible,
        [data-bs-theme="dark"] #graphsTabs .nav-link.bg-danger-subtle.active {
            background-color: #dc3545 !important;
            border-color: #dc3545 !important;
            color: #ffffff !important;
        }

    [data-bs-theme="dark"] #alpaca_dashboard_market_badge,
    [data-bs-theme="dark"] #alpaca_dashboard_refresh_countdown {
        background-color: #111827 !important;
        border-color: #59687d !important;
        color: #f8fafc !important;
    }

    [data-bs-theme="dark"] #alpaca_account_block .bg-light {
        background-color: #212b38 !important;
        border-color: var(--border-data) !important;
        color: var(--bs-body-color) !important;
    }

        [data-bs-theme="dark"] #alpaca_account_block .bg-light .text-dark {
            color: var(--bs-body-color) !important;
        }
