/* Tema nocturno: misma jerarquía visual que el claro, con profundidad azul.
   Solo presentación. Los roles se definen en theme.css; care.css permanece intacto. */
@media screen {
  :root[data-theme=dark] {
    background: var(--canvas);
    scrollbar-color: var(--border-control) var(--surface-base);
  }
  [data-theme=dark] body { background: var(--canvas); color: var(--text-primary); }
  [data-theme=dark] .main { background: transparent; }
  [data-theme=dark] h1 { color: var(--text-heading); }
  [data-theme=dark] :is(h2,.hero h2,.home-focus h2,.login-form h2) { color: var(--text-subheading); }
  [data-theme=dark] h3 { color: var(--text-primary); }
  [data-theme=dark] .eyebrow { color: var(--text-eyebrow); }
  [data-theme=dark] a { color: var(--text-link); }
  [data-theme=dark] ::selection { background: var(--action-primary); color: var(--on-accent); }

  /* Una familia de cristal. Avisos y tarjetas comparten exactamente el fondo. */
  [data-theme=dark] :is(.card,.hero,.notice,.modal,.signature,.form-actions,.inv-alert,.inv-critical,.inv-product),
  [data-theme=dark] .notice.info,
  [data-theme=dark] .login-form form {
    color: var(--text-primary);
    background: var(--panel-fill);
    border-color: var(--border-subtle);
    box-shadow: var(--shadow-panel);
    backdrop-filter: var(--glass-filter);
    -webkit-backdrop-filter: var(--glass-filter);
  }
  [data-theme=dark] .hero {
    background: var(--hero-fill);
    border-color: var(--border-feature);
    box-shadow: var(--shadow-hero);
  }
  [data-theme=dark] .hero h2 { color: var(--text-primary); }
  [data-theme=dark] :is(.hero p,.notice p,.setup-notice p,.modal>p) { color: var(--text-secondary); }
  [data-theme=dark] :is(.notice.setup-notice,.card.inv-notice) { border-left-color: var(--notice-accent-edge); }
  [data-theme=dark] .card.inv-critical { border-left-color: var(--critical-accent-edge); }
  [data-theme=dark] .stat {
    background: var(--stat-fill);
    /* Contorno óptico: no añade un píxel a la altura ni desplaza las cifras. */
    box-shadow: inset 1px 0 var(--edge-panel),inset -1px 0 var(--edge-panel),inset 0 1px var(--edge-panel-top),var(--shadow-panel);
  }
  [data-theme=dark] .stat:nth-child(1) { border-bottom-color: var(--action-primary-hover); }
  [data-theme=dark] .stat:nth-child(2) { border-bottom-color: var(--action-primary); }
  [data-theme=dark] .stat:nth-child(3) { border-bottom-color: var(--profile-fill); }
  [data-theme=dark] .stat:nth-child(4) { border-bottom-color: var(--brand-ocean); }
  [data-theme=dark] .stat:before { display: block; background: var(--edge-sheen); opacity: .3; }
  [data-theme=dark] .stat strong,
  [data-theme=dark] .stat:nth-child(4) strong { color: var(--text-primary); }
  [data-theme=dark] .stat small { color: var(--text-secondary); }
  [data-theme=dark] :is(.workflow-card,.inv-product) {
    background: var(--workflow-fill);
    border-top-color: var(--brand-ocean);
  }
  [data-theme=dark] .workflow-card.needs-action { border-color: var(--border-subtle); border-top-color: var(--profile-fill); }
  [data-theme=dark] .workflow-card:hover { border-color: var(--edge-interactive); }
  [data-theme=dark] .workflow-card.needs-action:hover { border-color: var(--edge-interactive-info); }
  [data-theme=dark] .datum { border-color: var(--border-subtle); }
  [data-theme=dark] .form-actions { background: var(--surface-base); box-shadow: var(--shadow-footer); }

  /* Orientación: selección menta llena, como en claro; navegación secundaria sobria. */
  [data-theme=dark] .sidebar {
    color: var(--nav-text);
    background: var(--nav-fill);
    border-right-color: var(--nav-shell-edge);
    box-shadow: var(--shadow-nav);
  }
  [data-theme=dark] .brand { color: var(--nav-text); }
  [data-theme=dark] .brand small { color: var(--nav-accent-text); }
  [data-theme=dark] .sidebar-bottom { border-color: var(--nav-border); }
  [data-theme=dark] .sidebar-bottom small { color: var(--nav-accent-text); }
  [data-theme=dark] .nav { color: var(--nav-muted); background: transparent; box-shadow: none; }
  [data-theme=dark] .nav:hover { color: var(--nav-text); background: var(--nav-hover); }
  [data-theme=dark] .nav.active,
  [data-theme=dark] .nav.active:hover {
    color: var(--nav-selected-text);
    background: var(--nav-selected-fill);
    box-shadow: var(--shadow-selected);
  }
  [data-theme=dark] .nav-count {
    color: var(--nav-badge-text); background: var(--nav-badge-fill);
    border: 0; box-shadow: var(--shadow-selected);
  }
  [data-theme=dark] .topbar {
    background: var(--topbar-fill);
    border-color: var(--border-subtle);
    box-shadow: var(--shadow-topbar);
  }
  [data-theme=dark] .topbar .eyebrow { color: var(--text-eyebrow); }
  [data-theme=dark] .profile-mark {
    color: var(--profile-text); background: var(--profile-fill);
    border: 0; box-shadow: var(--shadow-profile);
  }
  [data-theme=dark] .avatar {
    color: var(--on-accent); background: var(--avatar-fill);
    border: 0; box-shadow: var(--shadow-action);
  }
  [data-theme=dark] .tabs { border-color: var(--border-subtle); }
  [data-theme=dark] .tab { color: var(--text-secondary); background: transparent; box-shadow: none; }
  [data-theme=dark] .tab:hover { color: var(--text-primary); background: var(--surface-raised); }
  [data-theme=dark] .tab.active {
    color: var(--tab-selected-text); background: var(--tab-selected-fill);
    box-shadow: var(--shadow-selected);
  }

  /* Botones: conservar tamaños, movimiento y tiempos de care.css. */
  [data-theme=dark] .btn {
    color: var(--text-primary); background: var(--surface-raised);
    border-color: var(--border-button); box-shadow: var(--shadow-control);
  }
  [data-theme=dark] .btn:hover {
    color: var(--text-primary); background: var(--surface-hover);
    border-color: var(--edge-interactive); box-shadow: var(--shadow-selected);
  }
  [data-theme=dark] .btn.primary {
    color: var(--on-accent); background: var(--action-primary);
    border-color: var(--action-primary); box-shadow: var(--shadow-action);
  }
  [data-theme=dark] .btn.primary:hover {
    color: var(--on-accent); background: var(--action-primary-hover);
    border-color: var(--action-primary-hover); box-shadow: var(--shadow-action-hover);
  }
  [data-theme=dark] .btn.text {
    color: var(--text-link); background: transparent; border-color: transparent; box-shadow: none;
  }
  [data-theme=dark] .btn.text:hover { color: var(--text-link-hover); }
  [data-theme=dark] .btn.danger {
    color: var(--text-primary); background: var(--surface-base); border-color: var(--border-control);
  }
  [data-theme=dark] .btn.danger:hover { background: var(--surface-hover); border-color: var(--edge-control-hover); }
  [data-theme=dark] :is(button,a,summary):focus-visible,
  [data-theme=dark] .brand:focus-visible { outline-color: var(--focus-ring); }

  /* Formularios: etiquetas claras, campo hundido, borde reconocible, foco luminoso. */
  [data-theme=dark] .field>span { color: var(--text-subheading); }
  [data-theme=dark] .field .hint { color: var(--text-secondary); }
  [data-theme=dark] .field input,
  [data-theme=dark] .field select,
  [data-theme=dark] .field textarea,
  [data-theme=dark] .search {
    color: var(--text-primary); background: var(--surface-input);
    border-color: var(--border-control); box-shadow: none;
    caret-color: var(--focus-ring);
    backdrop-filter: none; -webkit-backdrop-filter: none;
  }
  [data-theme=dark] input::placeholder,
  [data-theme=dark] textarea::placeholder { color: var(--text-placeholder); opacity: 1; }
  [data-theme=dark] select option { background: var(--surface-input); color: var(--text-primary); }
  [data-theme=dark] .field input:focus,
  [data-theme=dark] .field select:focus,
  [data-theme=dark] .field textarea:focus,
  [data-theme=dark] .search:focus {
    border-color: var(--focus-ring); outline: 2px solid var(--focus-ring);
    box-shadow: var(--shadow-focus);
  }
  [data-theme=dark] input[type=checkbox],
  [data-theme=dark] input[type=radio] { accent-color: var(--action-primary); }
  [data-theme=dark] input[type=date]::-webkit-calendar-picker-indicator,
  [data-theme=dark] input[type=datetime-local]::-webkit-calendar-picker-indicator { opacity: .9; }
  [data-theme=dark] .repeat-row,
  [data-theme=dark] .inv-form fieldset { background: var(--surface-raised); border-color: var(--border-subtle); box-shadow: none; }
  [data-theme=dark] .step { color: var(--text-secondary); background: transparent; box-shadow: none; }
  [data-theme=dark] .step:hover { color: var(--text-primary); background: var(--surface-raised); }
  [data-theme=dark] .step b { color: var(--text-secondary); background: var(--surface-base); border-color: var(--border-control); }
  [data-theme=dark] .step.active {
    color: var(--text-primary); background: var(--step-selected-fill);
    box-shadow: inset 4px 0 var(--action-primary);
  }
  [data-theme=dark] .step.active b { color: var(--step-index-text); background: var(--step-index-fill); border-color: var(--step-index-fill); }
  [data-theme=dark] .step.complete:not(.active) b {
    color: var(--step-complete-text); background: var(--status-positive-fill); border-color: var(--step-complete-text);
  }
  [data-theme=dark] .step.active .step-status { color: var(--text-secondary); opacity: 1; }
  [data-theme=dark] .form-progress { background: var(--surface-raised); }
  [data-theme=dark] .form-progress span { background: var(--progress-fill); }

  /* Estados y tablas: acentos localizados, sin desbordar sobre las superficies. */
  [data-theme=dark] .tag {
    color: var(--status-positive-text); background: var(--status-positive-fill);
    box-shadow: inset 0 0 0 1px var(--status-positive-line);
  }
  [data-theme=dark] .tag.draft {
    color: var(--status-info-text); background: var(--status-info-fill);
    box-shadow: inset 0 0 0 1px var(--status-info-line);
  }
  [data-theme=dark] .required-marker { color: var(--on-accent); background: var(--action-primary-hover); }
  [data-theme=dark] .tag.superseded { color: var(--text-secondary); background: var(--surface-raised); box-shadow: inset 0 0 0 1px var(--border-subtle); }
  [data-theme=dark] :is(.tag.revoked,.tag.rejected,.tag.suspended) {
    color: var(--text-primary); background: var(--surface-raised); box-shadow: inset 0 0 0 1px var(--border-control);
  }
  [data-theme=dark] .error {
    color: var(--text-primary); background: var(--status-info-fill); border-left-color: var(--critical-accent-edge);
  }
  [data-theme=dark] th { background: var(--surface-raised); color: var(--text-subheading); }
  [data-theme=dark] tbody tr:hover { background: var(--surface-raised); }
  [data-theme=dark] .inv-metrics>div { background: var(--surface-raised); }
  [data-theme=dark] .inv-metrics>div:nth-child(1) { background: var(--status-positive-fill); }
  [data-theme=dark] .inv-metrics>div:nth-child(3) { background: var(--status-info-fill); }
  [data-theme=dark] .inv-metrics strong { color: var(--text-primary); }
  [data-theme=dark] .inv-expired { color: var(--text-primary); font-weight: 750; }
  [data-theme=dark] .inv-expired small { color: var(--text-primary); }
  [data-theme=dark] .inv-soon { color: var(--text-link); }
  [data-theme=dark] .toast {
    color: var(--text-primary); background: var(--surface-raised);
    border-left-color: var(--notice-accent-edge);
    box-shadow: inset 0 0 0 1px var(--border-subtle),var(--shadow-panel);
  }

  /* Modal opaco: la información de atrás no contamina el contraste. */
  [data-theme=dark] .modal-shade { background: var(--overlay-fill); backdrop-filter: blur(8px); }
  [data-theme=dark] .modal { background: var(--modal-fill); border-color: var(--border-feature); box-shadow: var(--shadow-modal); }
  [data-theme=dark] .login-art {
    color: var(--text-primary); background: var(--login-fill); border-right-color: var(--nav-accent-edge);
  }
  [data-theme=dark] .login-art h1 { color: var(--login-heading); }
  [data-theme=dark] .login-art p { color: var(--login-text); }
  [data-theme=dark] .login-art .eyebrow,
  [data-theme=dark] .login-art>small { color: var(--nav-accent-text)!important; }
  [data-theme=dark] .login-form { background: transparent; }
  [data-theme=dark] .btn:disabled,
  [data-theme=dark] .btn:disabled:hover {
    color: var(--disabled-text); background: var(--disabled-fill);
    border-color: var(--disabled-edge); box-shadow: none; opacity: 1; transform: none;
  }

  /* Ambientación aprobada: mismos rellenos, brillos, colores y transparencias. */
  [data-theme=dark] .bio-ambient { background: transparent; }
  [data-theme=dark] .bio-particles { opacity: .2; }
  [data-theme=dark] .bio-cell { opacity: .42; }
}
@media screen and (max-width:700px) {
  [data-theme=dark] .inv-tabs { background: var(--canvas); box-shadow: 0 1px 0 var(--border-subtle); }
  [data-theme=dark] .sidebar.open+.sidebar-scrim { background: var(--overlay-fill); }
  [data-theme=dark] .sidebar.open { box-shadow: var(--shadow-nav); }
}
