/* ==================================================================
   DCS Conciliador · Sistema de temas v2 (tipografía contable + paletas)
   ------------------------------------------------------------------
   Se carga DESPUÉS de dashboard.css → sobreescribe por orden de cascada.
   No toca dashboard.css. Cada tema redefine los MISMOS tokens que ya usa
   el panel (--bg-app, --primary, --text-main, …) + tokens de fuente.

   Tipografía pensada para contabilidad / lectura sin confusiones:
   - Cuerpo: Atkinson Hyperlegible / IBM Plex Sans / Source Sans 3
     (desambiguan 0·O, 1·l·I, 5·S, b·d).
   - Números/importes/códigos: monoespaciada con CERO diferenciado
     (IBM Plex Mono = cero con barra, JetBrains Mono = cero con punto)
     + figuras tabulares (alineación de columnas).
   ================================================================== */

/* Tokens de fuente para los temas Clásico (claro = :root, oscuro) */
:root{
  --font-sans:'Outfit',system-ui,sans-serif;
  --font-display:'Outfit',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
}

/* ---------- Nítido (claro · papel cálido · máxima legibilidad) ---------- */
[data-theme="nitido"]{
  --font-sans:'Atkinson Hyperlegible',system-ui,sans-serif;
  --font-display:'Atkinson Hyperlegible',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --bg-app:#f6f5f1; --bg-panel:#fffffe; --bg-panel-header:#f1efe9; --bg-card:#fffffe; --bg-card-hover:#f1efe9;
  --border-color:#e5e2db; --border-hover:#d3cfc6;
  --text-main:#1b1a17; --text-muted:#6c6a62; --text-highlight:#bf4d1f;
  --primary:#1b1a17; --primary-hover:#33312c;
  --accent:#bf4d1f; --accent-bg:rgba(191,77,31,.12); --accent-bg-light:rgba(191,77,31,.07);
  --success:#3f7d4e; --success-bg:rgba(63,125,78,.13);
  --warning:#8c5e12; --warning-bg:rgba(140,94,18,.13);
  --danger:#a83232; --danger-bg:rgba(168,50,50,.12);
  --info:#36657f; --info-bg:rgba(54,101,127,.12);
  --glass-bg:rgba(255,255,254,.92); --glass-border:#e5e2db;
  --shadow-premium:0 1px 2px rgba(20,18,14,.05),0 1px 1px rgba(20,18,14,.04);
  --shadow-glow-success:0 1px 2px rgba(20,18,14,.06); --shadow-glow-warning:0 1px 2px rgba(20,18,14,.06); --shadow-glow-danger:0 1px 2px rgba(20,18,14,.06);
  --scrollbar-thumb:#d3cfc6; --scrollbar-thumb-hover:#bdb8ad;
}

/* ---------- Mesa (oscuro · mesa de operaciones · datos primero) ---------- */
[data-theme="mesa"]{
  --font-sans:'IBM Plex Sans',system-ui,sans-serif;
  --font-display:'IBM Plex Sans',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  --bg-app:#0a0e14; --bg-panel:#10151d; --bg-panel-header:#1a212d; --bg-card:#141b25; --bg-card-hover:#1a212d;
  --border-color:#222b38; --border-hover:#303b4a;
  --text-main:#e6edf3; --text-muted:#8b97a8; --text-highlight:#d9a441;
  --primary:#1a212d; --primary-hover:#232c3a;
  --accent:#3fb27f; --accent-bg:rgba(63,178,127,.16); --accent-bg-light:rgba(63,178,127,.10);
  --success:#3fb27f; --success-bg:rgba(63,178,127,.15);
  --warning:#d9a441; --warning-bg:rgba(217,164,65,.16);
  --danger:#e5534b; --danger-bg:rgba(229,83,75,.16);
  --info:#4a9eda; --info-bg:rgba(74,158,218,.15);
  --glass-bg:rgba(16,21,29,.85); --glass-border:#222b38;
  --shadow-premium:0 1px 0 rgba(0,0,0,.45),0 4px 14px rgba(0,0,0,.35);
  --shadow-glow-success:0 1px 0 rgba(0,0,0,.45); --shadow-glow-warning:0 1px 0 rgba(0,0,0,.45); --shadow-glow-danger:0 1px 0 rgba(0,0,0,.45);
  --scrollbar-thumb:#222b38; --scrollbar-thumb-hover:#303b4a;
}

/* ---------- Sobrio (claro premium · titulares serif · acero contenido) ---------- */
[data-theme="sobrio"]{
  --font-sans:'Source Sans 3',system-ui,sans-serif;
  --font-display:'Fraunces',Georgia,serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  --bg-app:#f3f4f6; --bg-panel:#ffffff; --bg-panel-header:#eef0f3; --bg-card:#ffffff; --bg-card-hover:#eef0f3;
  --border-color:#e2e5ea; --border-hover:#cdd2da;
  --text-main:#16202c; --text-muted:#566273; --text-highlight:#2f5d8a;
  --primary:#2f5d8a; --primary-hover:#25496e;
  --accent:#2f5d8a; --accent-bg:rgba(47,93,138,.12); --accent-bg-light:rgba(47,93,138,.07);
  --success:#2e7d5b; --success-bg:rgba(46,125,91,.12);
  --warning:#8c5e12; --warning-bg:rgba(140,94,18,.12);
  --danger:#b3433a; --danger-bg:rgba(179,67,58,.12);
  --info:#2f5d8a; --info-bg:rgba(47,93,138,.12);
  --glass-bg:rgba(255,255,255,.92); --glass-border:#e2e5ea;
  --shadow-premium:0 1px 3px rgba(22,32,44,.07),0 1px 2px rgba(22,32,44,.04);
  --shadow-glow-success:0 1px 3px rgba(22,32,44,.08); --shadow-glow-warning:0 1px 3px rgba(22,32,44,.08); --shadow-glow-danger:0 1px 3px rgba(22,32,44,.08);
  --scrollbar-thumb:#cdd2da; --scrollbar-thumb-hover:#b4bbc6;
}

/* ---------- Forwarder (industrial · azul marino + ámbar carga) ---------- */
[data-theme="forwarder"]{
  --font-sans:'IBM Plex Sans',system-ui,sans-serif;
  --font-display:'Saira',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --bg-app:#e9edf1; --bg-panel:#ffffff; --bg-panel-header:#dde3ea; --bg-card:#ffffff; --bg-card-hover:#dde3ea;
  --border-color:#cfd7df; --border-hover:#b3bfca;
  --text-main:#0f2233; --text-muted:#4f5f6e; --text-highlight:#14385c;
  --primary:#14385c; --primary-hover:#0d273f;
  --accent:#c2640f; --accent-bg:rgba(194,100,15,.13); --accent-bg-light:rgba(194,100,15,.08);
  --success:#2c6e49; --success-bg:rgba(44,110,73,.13);
  --warning:#a4640f; --warning-bg:rgba(164,100,15,.14);
  --danger:#a3342b; --danger-bg:rgba(163,52,43,.12);
  --info:#14385c; --info-bg:rgba(20,56,92,.12);
  --glass-bg:rgba(255,255,255,.92); --glass-border:#cfd7df;
  --shadow-premium:0 1px 2px rgba(15,34,51,.09),0 2px 8px rgba(15,34,51,.06);
  --shadow-glow-success:0 1px 2px rgba(15,34,51,.1); --shadow-glow-warning:0 1px 2px rgba(15,34,51,.1); --shadow-glow-danger:0 1px 2px rgba(15,34,51,.1);
  --scrollbar-thumb:#b3bfca; --scrollbar-thumb-hover:#9aa8b5;
}

/* ---------- Carbón (oscuro elegante cálido · sin neón · editorial) ---------- */
[data-theme="carbon"]{
  --font-sans:'Source Sans 3',system-ui,sans-serif;
  --font-display:'Fraunces',Georgia,serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --bg-app:#17151b; --bg-panel:#1f1d25; --bg-panel-header:#2c2935; --bg-card:#26232e; --bg-card-hover:#2c2935;
  --border-color:#332f3c; --border-hover:#443f4f;
  --text-main:#ece8f1; --text-muted:#9c97a7; --text-highlight:#c0a07a;
  --primary:#2c2733; --primary-hover:#38323f;
  --accent:#86a98f; --accent-bg:rgba(134,169,143,.16); --accent-bg-light:rgba(134,169,143,.10);
  --success:#86a98f; --success-bg:rgba(134,169,143,.15);
  --warning:#c9a878; --warning-bg:rgba(201,168,120,.16);
  --danger:#d98a82; --danger-bg:rgba(217,138,130,.16);
  --info:#8aa6c2; --info-bg:rgba(138,166,194,.15);
  --glass-bg:rgba(31,29,37,.85); --glass-border:#332f3c;
  --shadow-premium:0 2px 6px rgba(0,0,0,.32),0 6px 18px rgba(0,0,0,.28);
  --shadow-glow-success:0 2px 6px rgba(0,0,0,.3); --shadow-glow-warning:0 2px 6px rgba(0,0,0,.3); --shadow-glow-danger:0 2px 6px rgba(0,0,0,.3);
  --scrollbar-thumb:#332f3c; --scrollbar-thumb-hover:#443f4f;
}

/* ====================== Aplicación de tipografía ====================== */
/* Cuerpo: sigue el tema (cae a Outfit si un tema no define --font-sans). */
*{ font-family: var(--font-sans, 'Outfit', sans-serif); }
/* Titulares: fuente display del tema. */
h1,h2,h3,h4,.section-title,.panel-title,.jobs-detail-title,.nav-brand-name{
  font-family: var(--font-display, var(--font-sans));
}
/* Números, importes, códigos y fechas: SIEMPRE monoespaciada del tema,
   con cero diferenciado (zero) + figuras tabulares (tnum) → contabilidad. */
.invoice-num,.amount-info,.invoice-date,.invoice-entrada,.container-num,.stat-value,
.invoice-card .ic-exp-val,
.invoice-card.job-card .jc-exp,
.invoice-card.job-card .jc-amount-expected,
.invoice-card.job-card .jc-amount-actual,
.jc-entrada,.mono,.tabular{
  font-family: var(--font-mono, ui-monospace, monospace) !important;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "zero" 1;
  letter-spacing: .01em;
}

/* ====================== Selector de tema (nav) ====================== */
.theme-select{
  font-family: var(--font-sans);
  font-size: .78rem;
  font-weight: 500;
  color: var(--text-main);
  background: var(--bg-panel);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: .42rem 1.7rem .42rem .65rem;
  cursor: pointer;
  outline: none;
  transition: border-color .15s, background .15s;
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.4'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat: no-repeat; background-position: right .55rem center;
}
.theme-select:hover{ border-color: var(--border-hover); }
.theme-select:focus-visible{ border-color: var(--text-highlight); }

/* ====================== Anti-degradado + menos ruido ======================
   Decisión de diseño: sin degradados. Todos los `linear-gradient` del panel
   (logo, badge-ai morado→rosa, botones, nav activa, demurrage) pasan a
   superficie PLANA con tokens del tema. */
.logo-icon{ background: var(--primary) !important; }
.badge-ai{ background: var(--accent-bg) !important; color: var(--accent) !important; }
.btn-download-json, .btn-download-json:hover{ background: var(--primary) !important; color:#fff !important; }
.btn-bulk-reconcile-compact{ background: var(--primary) !important; color:#fff !important; }
.nav-view-btn.active{ background: var(--accent-bg) !important; color: var(--text-highlight) !important; box-shadow:none !important; }
.demurrage-card{ background: var(--bg-card) !important; }
.demurrage-safe{ background: var(--success) !important; }
.demurrage-warning{ background: var(--warning) !important; }
.demurrage-danger{ background: var(--danger) !important; }

/* Pestañas IDP innecesarias: Hitos y Comunicaciones e Historial (decisión: el ciclo
   se maneja sin salir a Expedientes; quedan ocultas, su contenido no se carga). */
#tab-btn-milestones, #tab-btn-comms{ display: none !important; }

/* Unificación Datos+Conciliación: la comparación partida↔previsión + el bloque de previsión
   se relocan al bloque de Datos (#datos-recon-host); la pestaña Conciliación se oculta porque
   su contenido vive ahora en la misma pantalla de Datos. El estado/Validar/Rechazar siguen en
   el panel superior derecho. */
#tab-btn-reconciliation{ display: none !important; }
#datos-recon-host:empty{ display: none; }
#datos-recon-host{ display: flex; flex-direction: column; gap: 12px; }

/* La tabla simple "Partidas de la factura" es redundante con la comparación lado a lado
   (que ya lista cada partida con su previsión sugerida + escandallo). Se oculta. */
#card-partidas-simple{ display: none !important; }

/* Nº de expediente clicable (abre la vista Expedientes). Por eso la pestaña "Expediente DCS"
   del panel de datos se oculta: se navega al expediente completo desde el propio número. */
[data-clickexp]{ cursor: pointer; }
[data-clickexp]:hover{ filter: brightness(1.15); text-decoration: underline; }
#tab-btn-job{ display: none !important; }
