/* ══════════════════════════════════════════════════════════
   CRM Viajes TDH — Sistema de temas (Noche / Día)
   ══════════════════════════════════════════════════════════ */

/* ── LOGO VISIBILIDAD ──────────────────────────────────────── */
.logo-blanco { display: block; }
.logo-negro  { display: none;  }
[data-theme="light"] .logo-blanco { display: none;  }
[data-theme="light"] .logo-negro  { display: block; }

/* ════════════════════════════════════════════════════════════
   MODO NOCHE — hace oscuro TODO el contenido, no solo la nav
   ════════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  --bg:           #0C0B1C;
  --bg-card:      #141328;
  --border:       #252240;
  --border-light: #1C1A32;
  --text-primary:   #E8E4F5;
  --text-secondary: #8B87A2;
  --text-tertiary:  #7A7790;
  --yellow-light:   #1E1908;
  --yellow-mid:     #2F260D;
  --shadow-md:      0 4px 24px rgba(0,0,0,0.55);
}

/* Nav en noche: ligeramente más oscuro que el contenido */
[data-theme="dark"] .app-nav { background: #09091A; }

/* Elementos con background hardcodeado blanco */
[data-theme="dark"] .lead-card         { background: var(--bg-card) !important; }
[data-theme="dark"] .pv-task-card      { background: var(--bg-card) !important; }
[data-theme="dark"] .pv-top            { background: var(--bg-card) !important; }
[data-theme="dark"] .stats-bar         { background: var(--bg-card) !important; border-bottom-color: var(--border); }
[data-theme="dark"] .leads-table-card  { background: var(--bg-card); }
[data-theme="dark"] .leads-table th    { background: var(--bg); }
[data-theme="dark"] .leads-table tbody tr:hover td { background: var(--bg); }
[data-theme="dark"] .et-card           { background: var(--bg-card); }
[data-theme="dark"] .fq-card           { background: var(--bg-card); }
[data-theme="dark"] .stat-card         { background: var(--bg-card); border-color: var(--border); }
[data-theme="dark"] .login-box         { background: #1A1930; box-shadow: 0 8px 48px rgba(0,0,0,0.7); }
[data-theme="dark"] #login-screen      { background: #080817; }
[data-theme="dark"] .overlay           { background: #080817 !important; }
[data-theme="dark"] .overlay-screen    { background: #080817 !important; }
[data-theme="dark"] .box               { background: #1A1930; box-shadow: 0 8px 48px rgba(0,0,0,0.7); }

/* Formularios en modales — fondo oscuro coherente con el modal */
[data-theme="dark"] .form-input    { background: #221F38 !important; color: #E8E4F5 !important; border-color: #333060; }
[data-theme="dark"] .form-select   { background: #221F38 !important; color: #E8E4F5 !important; border-color: #333060; }
[data-theme="dark"] .form-textarea { background: #221F38 !important; color: #E8E4F5 !important; border-color: #333060; }
[data-theme="dark"] .form-input:focus    { border-color: var(--yellow) !important; background: #272444 !important; }
[data-theme="dark"] .form-textarea:focus { border-color: var(--yellow) !important; background: #272444 !important; }
[data-theme="dark"] .form-input.err          { border-color: #EF4444 !important; }
[data-theme="dark"] .form-input.error-field  { border-color: #EF4444 !important; }
[data-theme="dark"] .form-input::placeholder    { color: #5C5875 !important; }
[data-theme="dark"] .form-textarea::placeholder { color: #5C5875 !important; }
[data-theme="dark"] .pv-selector { background: #221F38 !important; color: #E8E4F5 !important; border-color: #333060; }

/* Login screen — siempre oscuro, inputs con texto blanco legible
   Prioridad máxima para no ser sobreescrito por reglas de la página */
[data-theme="dark"] #login-screen .form-input,
[data-theme="light"] #login-screen .form-input,
                     #login-screen .form-input {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,255,255,0.18) !important;
  color: rgba(255,255,255,0.92) !important;
}
#login-screen .form-input:focus {
  border-color: #F6D330 !important;
  background: rgba(255,255,255,0.14) !important;
}
#login-screen .form-input::placeholder {
  color: rgba(255,255,255,0.3) !important;
}
#login-screen .form-input:-webkit-autofill,
#login-screen .form-input:-webkit-autofill:focus {
  -webkit-text-fill-color: rgba(255,255,255,0.92) !important;
  -webkit-box-shadow: 0 0 0 1000px #1E1C32 inset !important;
}

/* Post Venta kanban */
[data-theme="dark"] .pv-kanban-col { background: var(--bg-card); border-color: var(--border); }
[data-theme="dark"] .pv-kanban-col.col-realizado { background: #0C1E14; border-color: #1A3D28; }
[data-theme="dark"] .pv-col-empty   { color: var(--text-tertiary); }
[data-theme="dark"] .pv-task-tag    { background: var(--bg); border-color: var(--border); color: var(--text-secondary); }
[data-theme="dark"] .pv-lista-badge      { background: var(--bg); border-color: var(--border); color: var(--text-secondary); }
[data-theme="dark"] .pv-lista-badge.area { background: var(--yellow-light); border-color: var(--yellow-mid); color: var(--yellow); }
[data-theme="dark"] .pv-done-section     { background: #0C1E14; border-color: #1A3D28; }
[data-theme="dark"] .pv-done-title { color: #4ADE80; }
[data-theme="dark"] .pv-done-sub   { color: #6EE7B7; }

/* Usuarios — badges de rol */
[data-theme="dark"] .role-admin     { background: #1E1540; color: #A78BFA; }
[data-theme="dark"] .role-full      { background: #0D2218; color: #4ADE80; }
[data-theme="dark"] .role-comercial { background: #261A08; color: #FCD34D; }
[data-theme="dark"] .role-apertura  { background: #0D1B33; color: #60A5FA; }
[data-theme="dark"] .board-pill     { background: var(--bg); border-color: var(--border); }
[data-theme="dark"] .board-pill.active { background: var(--yellow-light); border-color: var(--yellow-mid); color: var(--yellow); }
[data-theme="dark"] .inactive-badge { background: var(--bg); color: var(--text-tertiary); }
[data-theme="dark"] .user-row:hover { background: var(--bg); }
[data-theme="dark"] .users-card-header { border-bottom-color: var(--border); }

/* Resultados ventas */
[data-theme="dark"] .resultado-badge.vendido { background: #0C1E14; color: #4ADE80; border-color: #1A3D28; }
[data-theme="dark"] .resultado-badge.perdido  { background: #2D0F0F; color: #F87171; border-color: #5B1A1A; }

/* Etiquetas */
[data-theme="dark"] .et-card   { background: var(--bg-card); border-color: var(--border); }
[data-theme="dark"] .et-btn    { background: var(--bg); border-color: var(--border); color: var(--text-secondary); }
[data-theme="dark"] .et-usage  { color: var(--text-tertiary); }

/* Modal */
[data-theme="dark"] .modal-box    { background: #1A1930 !important; }
[data-theme="dark"] .modal-close  { background: #252240 !important; border-color: #333060 !important; color: #9691AA !important; }
[data-theme="dark"] .modal-close:hover { background: #5B1A1A !important; border-color: #7F1D1D !important; color: #FCA5A5 !important; }

/* Miscellaneous */
[data-theme="dark"] .board-placeholder-badge { background: var(--yellow-light); border-color: var(--yellow-mid); color: var(--yellow); }
[data-theme="dark"] .col-empty { color: var(--text-tertiary); }
[data-theme="dark"] .badge-yellow { background: var(--yellow); color: #0F0E1A; }

/* ── Texto sobre fondo amarillo: siempre oscuro ──────────── */
[data-theme="dark"] .btn-primary      { color: #0F0E1A; }
[data-theme="dark"] .nav-add-btn      { color: #0F0E1A; }
[data-theme="dark"] .pv-complete-btn  { color: #fff; }  /* verde, no amarillo */

/* ── Estados activos con fondo blanco: texto oscuro ─────── */
[data-theme="dark"] .board-tab.active        { color: #0F0E1A; }
[data-theme="dark"] .view-toggle-btn.active  { color: #0F0E1A; }
[data-theme="dark"] .pv-view-btn.active      { background: var(--yellow); color: #0F0E1A; }
[data-theme="dark"] .pv-view-btn             { color: var(--text-secondary); }

/* ── Botón de peligro adaptado al modo oscuro ───────────── */
[data-theme="dark"] .btn-danger { background: rgba(239,68,68,0.14); border-color: rgba(239,68,68,0.3); color: #FCA5A5; }

/* ── Hover Vendido/Perdido: fondos oscuros en vez de claros */
[data-theme="dark"] .cerrado-choice-btn.vendido:hover { background: #063D2C; border-color: #10B981; }
[data-theme="dark"] .cerrado-choice-btn.perdido:hover  { background: #5C1A1A; border-color: #EF4444; }
[data-theme="dark"] .cerrado-choice-label { color: var(--text-primary); }
[data-theme="dark"] .cerrado-choice-sub   { color: var(--text-secondary); }

/* ── Dropdown de búsqueda: fondo oscuro dentro del modal ── */
[data-theme="dark"] .contact-search-dropdown {
  background: #1E1D30;
  border-color: var(--border);
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
}
[data-theme="dark"] .contact-search-item        { color: var(--text-primary); }
[data-theme="dark"] .contact-search-item:hover  { background: var(--bg); }
[data-theme="dark"] .contact-search-item-sub    { color: var(--text-secondary); }

/* ── Botón secundario en modo oscuro ────────────────────── */
[data-theme="dark"] .btn-secondary { background: var(--bg); border-color: var(--border); color: var(--text-secondary); }

/* ── Kanban drag-over: fondo ámbar oscuro ───────────────── */
[data-theme="dark"] .kanban-col.drag-over { background: #201B08; border-color: var(--yellow); }

/* ── Lead card: colores específicos ─────────────────────── */
[data-theme="dark"] .lead-card:hover { border-color: var(--yellow); box-shadow: 0 2px 12px rgba(246,211,48,0.15); }
[data-theme="dark"] .lead-card-notes { color: var(--text-tertiary); }
[data-theme="dark"] .lead-card-date  { color: var(--text-tertiary); }

/* ── Stage pills en modal ───────────────────────────────── */
[data-theme="dark"] .stage-pill:not(.active) { background: #221F38; border-color: #333060; color: #A09CBD; }
[data-theme="dark"] .stage-pill:not(.active):hover { background: #2C2848; border-color: var(--yellow-mid); color: var(--text-primary); }

/* ── Stats bar items ────────────────────────────────────── */
[data-theme="dark"] .stat-item { border-right-color: var(--border); }
[data-theme="dark"] .stat-label { color: var(--text-secondary); }
[data-theme="dark"] .stat-count { color: var(--text-primary); }

/* ── Col header ─────────────────────────────────────────── */
[data-theme="dark"] .col-header   { border-bottom-color: var(--border-light); }
[data-theme="dark"] .col-title    { color: var(--text-primary); }
[data-theme="dark"] .col-count    { background: var(--bg); border-color: var(--border); color: var(--text-secondary); }

/* ── Pv progress background ─────────────────────────────── */
[data-theme="dark"] .pv-progress-bg  { background: var(--border); }
[data-theme="dark"] .pv-progress-label { color: var(--text-secondary); }

/* ── Pv kanban col header ───────────────────────────────── */
[data-theme="dark"] .pv-kanban-col-header { border-bottom-color: var(--border-light); }
[data-theme="dark"] .pv-kanban-col-title  { color: var(--text-primary); }
[data-theme="dark"] .pv-kanban-col-count  { background: var(--bg); border-color: var(--border); color: var(--text-secondary); }

/* ── Pv task card: done estado ──────────────────────────── */
[data-theme="dark"] .pv-task-card.is-done .pv-task-card-text { color: var(--text-tertiary); }
[data-theme="dark"] .pv-task-card-check { border-color: var(--border); }

/* ── Lista fase: header y count ─────────────────────────── */
[data-theme="dark"] .pv-lista-phase-title { border-bottom-color: var(--border-light); color: var(--text-secondary); }
[data-theme="dark"] .pv-lista-phase-count { background: var(--bg); border-color: var(--border); color: var(--text-tertiary); }
[data-theme="dark"] .pv-lista-task:hover  { background: var(--bg); }
[data-theme="dark"] .pv-lista-task.done .pv-lista-task-text { color: var(--text-tertiary); }
[data-theme="dark"] .pv-lista-check { border-color: var(--border); }

/* ── Modal overlay backdrop ─────────────────────────────── */
[data-theme="dark"] .modal-overlay { background: rgba(0,0,0,0.72); }
[data-theme="dark"] .modal-header { border-bottom-color: var(--border); }
[data-theme="dark"] .modal-footer { border-top-color: var(--border); }
[data-theme="dark"] .modal-title  { color: var(--text-primary); }

/* ── Etiqueta pills en el modal de leads ────────────────── */
[data-theme="dark"] .et-pill-x { opacity: 0.7; }

/* ── Hint text ──────────────────────────────────────────── */
[data-theme="dark"] .hint { color: var(--text-tertiary); }

/* ── Sidebar footer ─────────────────────────────────────── */
[data-theme="dark"] .sidebar-footer-name  { color: rgba(255,255,255,.65); }
[data-theme="dark"] .sidebar-footer-label { color: rgba(255,255,255,.25); }

/* ════════════════════════════════════════════════════════════
   MODO DÍA — Nav y Sidebar claros
   ════════════════════════════════════════════════════════════ */
[data-theme="light"] .app-nav {
  background: #FFFFFF;
  border-bottom: 1.5px solid #E4E2F0;
  box-shadow: 0 2px 12px rgba(15,14,26,.06);
}
[data-theme="light"] .nav-brand-name  { color: #0F0E1A; }
[data-theme="light"] .nav-brand-sep   { color: #CBD5E1; }
[data-theme="light"] .nav-brand-title { color: #6B6880; }
[data-theme="light"] .nav-board-switcher { background: #F7F7FB; border-color: #E4E2F0; }
[data-theme="light"] .board-tab { color: #6B6880; }
[data-theme="light"] .board-tab.active { background: #0F0E1A; color: #fff; }
[data-theme="light"] .board-tab:not(.active):hover { color: #0F0E1A; background: rgba(0,0,0,.04); }
[data-theme="light"] .nav-search input { background: #F7F7FB; border-color: #E4E2F0; color: #0F0E1A; }
[data-theme="light"] .nav-search input::placeholder { color: #9691AA; }
[data-theme="light"] .nav-search-icon { color: #9691AA; }
[data-theme="light"] .nav-hamburger span { background: #6B6880; }
[data-theme="light"] .nav-hamburger:hover span { background: #0F0E1A; }
[data-theme="light"] .nav-hamburger:hover { background: rgba(0,0,0,.05); }
[data-theme="light"] .nav-icon-btn { background: #F7F7FB; border-color: #E4E2F0; color: #6B6880; }
[data-theme="light"] .nav-icon-btn:hover { border-color: #0F0E1A; color: #0F0E1A; }
[data-theme="light"] .nav-logout-btn { color: #6B6880; border-color: #E4E2F0; background: transparent; }
[data-theme="light"] .nav-export-btn { color: #6B6880; border-color: #E4E2F0; }
[data-theme="light"] .nav-export-btn:hover { border-color: #0F0E1A; color: #0F0E1A; }
[data-theme="light"] .nav-user  { color: #9691AA; }
[data-theme="light"] .sync-indicator { color: #9691AA; }
[data-theme="light"] .view-toggle { background: #F7F7FB; border-color: #E4E2F0; }
[data-theme="light"] .view-toggle-btn { color: #9691AA; }
[data-theme="light"] .view-toggle-btn.active { background: #0F0E1A; color: #fff; }
[data-theme="light"] .pv-view-btn.active { background: #0F0E1A; }
[data-theme="light"] .nav-back  { color: #6B6880; }
[data-theme="light"] .nav-back:hover { color: #0F0E1A; }
[data-theme="light"] .nav-sep   { color: #CBD5E1; }
[data-theme="light"] .nav-title { color: #C9A800; }
[data-theme="light"] #nav-user  { color: #9691AA; }

[data-theme="light"] .sidebar { background: #fff; border-right-color: #E4E2F0; }
[data-theme="light"] .sidebar-overlay { background: rgba(15,14,26,.3); }
[data-theme="light"] .sidebar-header { border-bottom-color: #E4E2F0; }
[data-theme="light"] .sidebar-brand-name { color: #0F0E1A; }
[data-theme="light"] .sidebar-brand-sep  { color: #CBD5E1; }
[data-theme="light"] .sidebar-brand-sub  { color: #6B6880; }
[data-theme="light"] .sidebar-close-btn { background: #F7F7FB; border-color: #E4E2F0; color: #6B6880; }
[data-theme="light"] .sidebar-close-btn:hover { color: #0F0E1A; border-color: #0F0E1A; }
[data-theme="light"] .sidebar-section-label { color: #9691AA; }
[data-theme="light"] .sidebar-item { color: #6B6880; }
[data-theme="light"] .sidebar-item:hover { background: #F7F7FB; color: #0F0E1A; }
[data-theme="light"] .sidebar-item.active { background: #FFFBE6; color: #C9A800; }
[data-theme="light"] .sidebar-item.danger:hover { background: #FEF2F2; color: #DC2626; }
[data-theme="light"] .sidebar-divider { border-top-color: #E4E2F0; }
[data-theme="light"] .sidebar-footer { border-top-color: #E4E2F0; }
[data-theme="light"] .sidebar-footer-name  { color: #0F0E1A; }
[data-theme="light"] .sidebar-footer-label { color: #9691AA; }
[data-theme="light"] .sidebar-sub-item { color: #6B6880; }
[data-theme="light"] .sidebar-sub-item:hover { background: rgba(0,0,0,.04); color: #0F0E1A; }
[data-theme="light"] .sidebar-sub-item.active-fq { color: #C9A800; }

/* Login de index.html siempre oscuro — no se modifica por el tema */
[data-theme="light"] #login-screen  { background: #0B0A1A !important; }
[data-theme="light"] .overlay       { background: #F0EFF8 !important; }
[data-theme="light"] .overlay-screen { background: #F0EFF8 !important; }