// ============================================================
//  DARK MODE — Widgets globales
//  SweetAlert2, toasts de BootstrapVue, badge del título,
//  header de documentos, wizard/timeline de solicitudes,
//  editores de texto / mensajes / email (new_css_2025.css).
//  Solo pantalla: al imprimir sale siempre el tema claro.
// ============================================================

@media screen {
:root[data-theme="dark"] {

  // ── SweetAlert2 (el CSS de la lib viene bundleado en app.js, sin !important) ──
  .swal2-popup {
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .swal2-title { color: var(--dm-text) !important; }
  .swal2-content, .swal2-html-container { color: var(--dm-muted) !important; }
  .swal2-input, .swal2-textarea, .swal2-select, .swal2-file {
    background-color: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .swal2-footer { border-color: var(--dm-border) !important; color: var(--dm-muted) !important; }
  .swal2-close { color: var(--dm-muted) !important; }
  .swal2-close:hover { color: var(--dm-text) !important; }
  // Los botones confirm/cancel ya tienen colores propios (primary/gray) — se dejan.

  // ── Toasts (BootstrapVue b-toast / Bootstrap .toast) ──
  .toast {
    background-color: var(--dm-surface) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .toast-header {
    background-color: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .toast-body { color: var(--dm-text) !important; }
  // Variantes coloreadas (b-toast-danger/success/...): fondo oscuro,
  // conservando el borde de color de la variante.
  [class*="b-toast-"] .toast { background-color: var(--dm-surface) !important; }
  [class*="b-toast-"] .toast-header { background-color: var(--dm-surface-2) !important; }

  // ── Badge del título de página ──
  .modern-page-title .title-badge {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: #6ea8fe !important;
  }

  // ── Header de documentos (órdenes de trabajo, soporte, etc.) ──
  // .taxes-header-top y .taxes-info-bar conservan sus gradientes de marca.
  .taxes-header-document {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-detail-panel { background: var(--dm-surface-2) !important; }
  .taxes-detail-panel .client-name,
  .taxes-detail-panel .detail-value { color: var(--dm-text) !important; }
  .taxes-detail-panel .section-title,
  .taxes-detail-panel .client-doc,
  .taxes-detail-panel .detail-label { color: var(--dm-muted) !important; }
  .taxes-description-box {
    background: rgba(245, 158, 11, .10) !important;
    border-top-color: var(--dm-border) !important;
  }
  .taxes-description-box .description-header {
    background: rgba(245, 158, 11, .18) !important;
    color: #fcd34d !important;
  }
  .taxes-description-box .description-content { color: var(--dm-text) !important; }

  // ── Wizard / timeline de solicitudes (esperando activación) ──
  .solicitud-status-card {
    // shorthand: el original es un gradiente #f6f8fb→#fff
    background: var(--dm-surface) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .4) !important;
  }
  .solicitud-subtitle { color: var(--dm-muted) !important; }
  .status-timeline::before { background: var(--dm-border) !important; }
  .timeline-dot {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  // Estados completed/active conservan sus gradientes de color.
  .timeline-item.completed .timeline-dot {
    background: linear-gradient(135deg, #48bb78 0%, #38a169 100%) !important;
    border-color: var(--dm-border) !important;
  }
  .timeline-item.active .timeline-dot {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-color: var(--dm-border) !important;
  }
  .timeline-item.pending .timeline-dot { background: var(--dm-surface-2) !important; color: var(--dm-muted) !important; }
  .timeline-content h5 { color: var(--dm-text) !important; }
  .timeline-content p { color: var(--dm-muted) !important; }
  .solicitud-info-cards .info-card {
    background: var(--dm-surface) !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, .35) !important;
  }
  .solicitud-info-cards .info-card h5 { color: var(--dm-text) !important; }
  .solicitud-info-cards .info-card p { color: var(--dm-muted) !important; }

  // ── Editores de texto / Quill ──
  .text-editor-wrapper, .editor-container {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .editor-toolbar {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .editor-container .ql-toolbar, .ql-toolbar {
    // shorthand: el original es un gradiente #f8f9fa→#fff
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .ql-container { border-color: var(--dm-border) !important; }
  .ql-editor { color: var(--dm-text) !important; }
  .ql-snow .ql-stroke { stroke: var(--dm-muted) !important; }
  .ql-snow .ql-fill { fill: var(--dm-muted) !important; }
  .ql-snow .ql-picker { color: var(--dm-text) !important; }
  .format-btn { color: var(--dm-muted) !important; }
  .format-btn:hover { background: var(--dm-surface-2) !important; color: var(--dm-text) !important; }
  .simple-editor { color: var(--dm-text) !important; }

  // ── Mensajería / emails ──
  .taxes-email-header {
    background-color: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .message-bubble {
    background: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
  }
  .edit-container {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .action-panel-card {
    // shorthand: gradiente #f8f9fa→#fff
    background: var(--dm-surface) !important;
  }
  .bg-gradient-light {
    // shorthand: gradiente #f5f7fa→#fff
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .messages-header {
    // shorthand: gradiente #f8f9fa→#fff
    background: var(--dm-surface-2) !important;
  }
  .table-modern { background: var(--dm-surface) !important; }
  .table-modern thead { background-color: var(--dm-surface-2) !important; }
  .th-modern { color: var(--dm-text) !important; }
  .info-item { background: var(--dm-surface-2) !important; }
  .status-section, .read-status, .selected-files {
    background: rgba(37, 99, 235, .12) !important;
  }
  .summary-section { background: rgba(245, 158, 11, .12) !important; }
  .preview-box { background: var(--dm-surface) !important; }
  .action-section {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }

  // ── InputSelect de búsqueda (personas/empresas) ──
  .form-control-modern {
    background-color: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .dropdown-results, .no-results {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .dropdown-item-modern { border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
  .dropdown-item-modern:hover { background: var(--dm-surface-2) !important; }
  .dropdown-results::-webkit-scrollbar-track { background: var(--dm-surface-2); }
  .dropdown-results::-webkit-scrollbar-thumb { background: var(--dm-border); }

  // ── Selector de cuentas contables ──
  .cuenta-select-container {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .cuenta-option { border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
  .cuenta-option:hover { background: var(--dm-surface-2) !important; }

  // (Nota: las clases del "calendario semanal motivacional" (.taxes-week-*,
  //  .taxes-day-*, .motivational-calendar, .hero-card, .tip-item, .news-item)
  //  son CSS muerto en new_css_2025.css — sin markup vivo en resources/ — y
  //  por eso NO se overridean acá.)
}
} // fin @media screen