html[data-theme="dark"] {
    color-scheme: dark;
    --blue: #0071bc;
    --blue-dark: #f7f4f0;
    --blue-secondary: #2f91cc;
    --orange: #f98829;
    --orange-hover: #f9d53d;
    --yellow: #f9d53d;
    --white: #ffffff;
    --surface: #202127;
    --soft: #111217;
    --surface-alt: #292a31;
    --blue-soft: #182b39;
    --orange-soft: #38271c;
    --yellow-soft: #332f1d;
    --text: #f7f4f0;
    --muted: #b9bbc4;
    --danger: #ff8a80;
    --success: #71dfa5;
    --border: #454751;
    --focus: rgba(249, 213, 61, 0.88);
    --shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"] body,
html[data-theme="dark"] .app-page {
    background: var(--soft);
    color: var(--text);
}

html[data-theme="dark"] .icon-rail {
    background: #202127;
    box-shadow: 8px 0 24px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .workspace-panel,
html[data-theme="dark"] .settings-panel,
html[data-theme="dark"] .test-panel {
    color: #ffffff;
    background: #292a5f;
    box-shadow: 14px 0 38px rgba(0, 0, 0, 0.32);
}

html[data-theme="dark"] .rail-brand,
html[data-theme="dark"] .rail-icon,
html[data-theme="dark"] .rail-avatar,
html[data-theme="dark"] .workspace-close {
    color: #ffffff;
}

html[data-theme="dark"] .rail-brand {
    color: #2a2a2a;
}

html[data-theme="dark"] .workspace-link.is-active {
    color: #2a2a2a;
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] dt,
html[data-theme="dark"] th,
html[data-theme="dark"] legend,
html[data-theme="dark"] .field-group label,
html[data-theme="dark"] .dynamic-fieldset > legend,
html[data-theme="dark"] .user-dropdown-header strong {
    color: var(--text);
}

html[data-theme="dark"] .page-panel,
html[data-theme="dark"] .dashboard-tabs,
html[data-theme="dark"] .dashboard-kpi-card,
html[data-theme="dark"] .dashboard-chart-card,
html[data-theme="dark"] .dashboard-panel-list,
html[data-theme="dark"] .summary-card,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .data-card,
html[data-theme="dark"] .detail-card,
html[data-theme="dark"] .participant-summary-card,
html[data-theme="dark"] .form-section,
html[data-theme="dark"] .configuration-card,
html[data-theme="dark"] .import-card,
html[data-theme="dark"] .export-card {
    border-color: var(--border);
    background: var(--surface);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .dashboard-hero {
    background: #333376;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .quick-action-card {
    color: var(--text);
    border-color: #555763;
    background: #24252b;
    box-shadow: none;
}

html[data-theme="dark"] .quick-action-card:hover,
html[data-theme="dark"] .quick-action-card:focus {
    color: #2a2a2a;
    border-color: var(--orange);
    background: var(--orange);
}

html[data-theme="dark"] .tab-list {
    background: #1b1c21;
}

html[data-theme="dark"] .tab-button:hover,
html[data-theme="dark"] .tab-button.is-active {
    color: #ffffff;
    border-color: #5557a2;
    background: #333376;
}

html[data-theme="dark"] .tab-button:hover small,
html[data-theme="dark"] .tab-button.is-active small {
    color: #e2e2ee;
}

html[data-theme="dark"] .dashboard-panel-list a {
    color: var(--text);
    border: 1px solid transparent;
    background: var(--surface-alt);
}

html[data-theme="dark"] .dashboard-panel-list a:hover,
html[data-theme="dark"] .dashboard-panel-list a:focus {
    color: #ffffff;
    border-color: #5557a2;
    background: #333376;
}

html[data-theme="dark"] .button-primary {
    color: #ffffff;
    background: #0071bc;
}

html[data-theme="dark"] .button-primary:hover,
html[data-theme="dark"] .button-primary:focus {
    color: #ffffff;
    background: #0583d4;
}

html[data-theme="dark"] .button-secondary {
    color: #2a2a2a;
    background: var(--orange);
}

html[data-theme="dark"] .button-secondary:hover,
html[data-theme="dark"] .button-secondary:focus {
    color: #2a2a2a;
    background: var(--yellow);
}

html[data-theme="dark"] .button-light,
html[data-theme="dark"] .screen-exit-link {
    color: var(--text);
    border-color: var(--border);
    background: #292a31;
}

html[data-theme="dark"] .button-light:hover,
html[data-theme="dark"] .button-light:focus,
html[data-theme="dark"] .screen-exit-link:hover,
html[data-theme="dark"] .screen-exit-link:focus {
    border-color: #6e70c0;
    background: #33343d;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .searchable-selected,
html[data-theme="dark"] .searchable-results,
html[data-theme="dark"] .searchable-result,
html[data-theme="dark"] .user-dropdown,
html[data-theme="dark"] .user-dropdown a,
html[data-theme="dark"] .user-dropdown button {
    color: var(--text);
    border-color: var(--border);
    background: #18191e;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: #9fa2ad;
    opacity: 1;
}

html[data-theme="dark"] .searchable-result:hover,
html[data-theme="dark"] .searchable-result:focus,
html[data-theme="dark"] .user-dropdown a:hover,
html[data-theme="dark"] .user-dropdown button:hover,
html[data-theme="dark"] .user-dropdown a:focus,
html[data-theme="dark"] .user-dropdown button:focus,
html[data-theme="dark"] tbody tr:hover {
    background: #2c2e36;
}

html[data-theme="dark"] .searchable-chip,
html[data-theme="dark"] .permission-item,
html[data-theme="dark"] .configuration-tab.is-active {
    color: var(--text);
    border-color: var(--border);
    background: #2c2e36;
}

html[data-theme="dark"] .status-message,
html[data-theme="dark"] .invitation-message {
    color: #d8ffe8;
    border-color: #286747;
    background: #153326;
}

html[data-theme="dark"] .error-box,
html[data-theme="dark"] .field-error {
    color: #ffd5d1;
    background: #451b1b;
}

html[data-theme="dark"] .info-box {
    color: #d9effc;
    background: #182b39;
    border-color: #2f91cc;
}

html[data-theme="dark"] .skip-link {
    color: var(--text);
    background: #202127;
}

/* Sobre fondo oscuro el naranjo de marca sí contrasta (7,3:1). */
html[data-theme="dark"] .eyebrow {
    color: var(--orange);
}
