/**
 * Member panel — dark theme tokens and legacy UI overrides.
 * Loaded after page <style> blocks; scoped to html[data-theme="dark"] so light toggle still works.
 */
html[data-theme="dark"] {
    --bg-primary: #0F1115;
    --bg-secondary: #1E2126;
    --bg-accent: #252a32;
    --text-primary: #eaecef;
    --text-secondary: #b7bdc6;
    --text-muted: #848e9c;
    --brand-primary: #F7D060;
    --brand-secondary: #B8860B;
    --success: #02c076;
    --warning: #f0b90b;
    --danger: #f6465d;
    --info: #38bdf8;
    --border: #2c3137;
    --shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] body,
html[data-theme="dark"] #page-wrapper,
html[data-theme="dark"] #wrapper {
    background-color: var(--bg-primary) !important;
    color: var(--text-primary);
}

html[data-theme="dark"] .content {
    background-color: transparent;
    color: var(--text-primary);
}

html[data-theme="dark"] .panel,
html[data-theme="dark"] .panel-bd,
html[data-theme="dark"] .panel-default > .panel-heading {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border) !important;
    color: var(--text-primary);
}

html[data-theme="dark"] .panel-body {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

html[data-theme="dark"] .view-header,
html[data-theme="dark"] .view-header .header-title {
    color: var(--text-primary);
}

html[data-theme="dark"] .table,
html[data-theme="dark"] .table > thead > tr > th,
html[data-theme="dark"] .table > tbody > tr > td {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
    border-color: var(--border) !important;
}

html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > td,
html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > th {
    background-color: #161a20;
}

html[data-theme="dark"] .form-control {
    background-color: var(--bg-accent) !important;
    color: var(--text-primary) !important;
    border-color: var(--border) !important;
}

html[data-theme="dark"] .form-control:focus {
    border-color: var(--brand-secondary) !important;
    box-shadow: 0 0 0 2px rgba(247, 208, 96, 0.22) !important;
}

html[data-theme="dark"] .input-group-addon {
    background-color: var(--bg-accent);
    border-color: var(--border);
    color: var(--text-muted);
}

html[data-theme="dark"] .dropdown-menu {
    background-color: var(--bg-secondary);
    border-color: var(--border);
}

html[data-theme="dark"] .dropdown-menu > li > a {
    color: var(--text-primary);
}

html[data-theme="dark"] .dropdown-menu > li > a:hover {
    background-color: var(--bg-accent);
    color: var(--text-primary);
}

html[data-theme="dark"] .well {
    background-color: var(--bg-accent);
    border-color: var(--border);
    color: var(--text-primary);
}

html[data-theme="dark"] .dataTables_wrapper,
html[data-theme="dark"] table.dataTable {
    color: var(--text-primary);
}

html[data-theme="dark"] .dataTables_filter input,
html[data-theme="dark"] .dataTables_length select {
    background-color: var(--bg-accent) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border) !important;
}

html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple {
    background-color: var(--bg-accent);
    border-color: var(--border);
    color: var(--text-primary);
}

html[data-theme="dark"] .select2-dropdown {
    background-color: var(--bg-secondary);
    border-color: var(--border);
    color: var(--text-primary);
}

/* Standalone auth / marketing pages */
html[data-theme="dark"] .register-wrapper {
    background: var(--bg-primary) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .form-signin {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow-lg) !important;
}

html[data-theme="dark"] .bg-overlay {
    background: rgba(11, 14, 17, 0.92) !important;
}

html[data-theme="dark"] .bg-home {
    background: #0F1115 !important;
}

html[data-theme="dark"] label {
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] .form-check-label {
    color: var(--text-muted) !important;
}

/* html[data-theme="dark"] a:not(.btn):not(.nav-item):not(.custom-logout-btn) {
    color: #a5b4fc !important;
} */

html[data-theme="dark"] a:not(.btn):not(.nav-item):not(.custom-logout-btn):hover {
    color: #c7d2fe !important;
}

html[data-theme="dark"] .content-header .header-title h1 {
    color: var(--text-primary);
}

html[data-theme="dark"] .bottom-nav {
    background: var(--card-bg, #1e2329);
    border-top: 1px solid var(--border-color, #2c3137);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .bottom-nav .nav-item {
    color: var(--text-secondary, #848e9c);
}

html[data-theme="dark"] .bottom-nav .nav-item.active,
html[data-theme="dark"] .bottom-nav .nav-item:hover {
    color: var(--accent-color, #f0b90b);
}

/* Terms page */
html[data-theme="dark"] .terms-container {
    background: var(--bg-secondary) !important;
    box-shadow: var(--shadow-lg) !important;
}

html[data-theme="dark"] .terms-header {
    background: linear-gradient(135deg, #1e2329 0%, #161a20 100%) !important;
    border-bottom-color: var(--border) !important;
}

html[data-theme="dark"] .terms-header p {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] .terms-section {
    border-bottom-color: var(--border) !important;
}

html[data-theme="dark"] .section-title {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .section-content {
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] .contact-info {
    background: var(--bg-accent) !important;
    border-color: var(--border) !important;
}

html[data-theme="dark"] .contact-info h3 {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .contact-item {
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] .last-updated {
    color: var(--text-muted) !important;
    border-top-color: var(--border) !important;
}

html[data-theme="dark"] .highlight-box {
    background: rgba(247, 208, 96, 0.1);
    border-color: rgba(247, 208, 96, 0.28);
}

html[data-theme="dark"] .highlight-box h4 {
    color: #F7D060;
}

/* Register extras */
html[data-theme="dark"] .trading-dropdown {
    background: var(--bg-secondary) !important;
    border-color: var(--border) !important;
    box-shadow: var(--shadow-lg) !important;
}