*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,-apple-system,sans-serif;background:#F3F4F6;color:#111827;min-height:100vh;}

/* NAV */
nav{background:#1F4E79;color:#fff;padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.2);}
.nav-brand{font-weight:700;font-size:16px;display:flex;align-items:center;gap:10px;}
.nav-badge{background:#2E75B6;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:.5px;}
.nav-user{font-size:13px;display:flex;align-items:center;gap:14px;}
.nav-role{background:rgba(255,255,255,.15);padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;}
.nav-link{color:rgba(255,255,255,.8);text-decoration:none;font-size:13px;transition:color .2s;}
.nav-link:hover{color:#fff;}
.btn-logout{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;padding:5px 12px;border-radius:6px;font-size:12px;cursor:pointer;transition:background .2s;}
.btn-logout:hover{background:rgba(255,255,255,.2);}

/* MAIN */
main{max-width:1300px;margin:0 auto;padding:28px 24px;}
h2{font-size:22px;font-weight:700;color:#1F4E79;margin-bottom:6px;}
.subtitle{font-size:14px;color:#6B7280;margin-bottom:24px;}

/* STATS */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:28px;}
.stat{background:#fff;border-radius:12px;padding:20px;box-shadow:0 1px 4px rgba(0,0,0,.08);border-left:4px solid #E5E7EB;}
.stat.total{border-color:#1F4E79;}
.stat.pendiente{border-color:#C55A11;}
.stat.en-proceso{border-color:#B8860B;}
.stat.clasificado{border-color:#548235;}
.stat-num{font-size:32px;font-weight:700;color:#111;}
.stat-label{font-size:12px;color:#6B7280;font-weight:600;margin-top:4px;text-transform:uppercase;letter-spacing:.5px;}

/* TOOLBAR */
.toolbar{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;align-items:center;}
.toolbar input[type=search]{flex:1;min-width:200px;padding:9px 14px;border:1.5px solid #D1D5DB;border-radius:8px;font-size:14px;outline:none;}
.toolbar input[type=search]:focus{border-color:#2E75B6;}
.toolbar select{padding:9px 14px;border:1.5px solid #D1D5DB;border-radius:8px;font-size:13px;background:#fff;outline:none;cursor:pointer;}
.btn{padding:9px 18px;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:6px;}
.btn-primary{background:#1F4E79;color:#fff;}
.btn-primary:hover{background:#2E75B6;}
.btn-success{background:#548235;color:#fff;}
.btn-success:hover{background:#6AAE45;}
.btn-danger{background:#DC2626;color:#fff;}
.btn-danger:hover{background:#EF4444;}
.btn-sm{padding:5px 12px;font-size:12px;}
.btn-outline{background:#fff;border:1.5px solid #D1D5DB;color:#374151;}
.btn-outline:hover{border-color:#9CA3AF;background:#F9FAFB;}
/* ── Botones de acción en tablas (estándar global) ── */
.act-wrap{display:inline-flex;align-items:center;gap:4px;}
.btn-act{display:inline-flex;align-items:center;justify-content:center;height:28px;border:none;border-radius:6px;cursor:pointer;font-size:11px;font-weight:600;transition:opacity .15s;white-space:nowrap;flex-shrink:0;}
.btn-act:hover{opacity:.82;}
.btn-act-outline{padding:0 12px;background:#fff;border:1.5px solid #D1D5DB !important;color:#374151;}
.btn-act-text{padding:0 12px;}
.btn-act-icon{width:28px;padding:0;}
.btn-act-blue{background:#1F4E79;color:#fff;}
.btn-act-navy{background:#1F4E79;color:#fff;}
.btn-act-red{background:#DC2626;color:#fff;}
.btn-act-amber{background:#D97706;color:#fff;padding:0 10px;}
.btn-act-teal{background:#0D9488;color:#fff;padding:0 10px;}

/* TABLE */
.table-wrap{background:#fff;border-radius:12px;box-shadow:0 1px 4px rgba(0,0,0,.08);overflow:auto;}
table{width:100%;border-collapse:collapse;table-layout:fixed;}
thead th{background:#1F4E79;color:#fff;padding:12px 14px;text-align:left;font-size:12px;font-weight:600;letter-spacing:.4px;white-space:nowrap;position:relative;}
thead th:first-child{border-radius:12px 0 0 0;}
thead th:last-child{border-radius:0 12px 0 0;}
thead th .col-resizer{position:absolute;right:0;top:0;width:5px;height:100%;cursor:col-resize;background:rgba(255,255,255,.15);transition:background .2s;}
thead th .col-resizer:hover{background:rgba(255,255,255,.4);}
tbody tr{border-bottom:1px solid #F3F4F6;transition:background .15s;}
tbody tr:hover{background:#E8EDF4;color:#111827;}
tbody tr:last-child{border:none;}
td{padding:12px 14px;font-size:13px;vertical-align:top;word-break:break-word;overflow:hidden;}
.sku{font-family:monospace;font-weight:700;color:#1F4E79;font-size:12px;}
.prod-name{font-weight:600;color:#111827;}
.prod-desc{font-size:11px;color:#6B7280;margin-top:2px;}

/* BADGES */
.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.3px;}
.badge-pendiente{background:#FCE4D6;color:#C55A11;}
.badge-proceso{background:#FFF3CD;color:#856404;}
.badge-clasificado{background:#D1E7DD;color:#0A3622;}
.badge-alta{background:#FEE2E2;color:#DC2626;}
.badge-media{background:#FEF3C7;color:#92400E;}
.badge-baja{background:#D1FAE5;color:#065F46;}
.ncm-code{font-family:monospace;font-weight:700;font-size:12px;color:#548235;background:#F0FDF4;padding:3px 8px;border-radius:4px;}

/* FILES icons */
.file-icons{display:flex;gap:4px;flex-wrap:wrap;}
.fi{width:26px;height:26px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;cursor:pointer;text-decoration:none;}
.fi-img{background:#DBEAFE;}
.fi-vid{background:#FEE2E2;}
.fi-cat{background:#D1FAE5;}

/* MODAL */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;display:none;align-items:flex-start;justify-content:center;padding:24px;overflow-y:auto;}
.overlay.open{display:flex;}
.modal{background:#fff;border-radius:16px;width:100%;max-width:760px;box-shadow:0 24px 80px rgba(0,0,0,.3);animation:slideIn .25s ease;}
@keyframes slideIn{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
.modal-header{padding:20px 24px 16px;border-bottom:1px solid #F3F4F6;display:flex;align-items:center;justify-content:space-between;}
.modal-title{font-size:17px;font-weight:700;color:#1F4E79;}
.modal-close{background:none;border:none;font-size:22px;cursor:pointer;color:#6B7280;line-height:1;}
.modal-body{padding:24px;max-height:72vh;overflow-y:auto;}
.modal-footer{padding:16px 24px;border-top:1px solid #F3F4F6;display:flex;gap:10px;justify-content:flex-end;}

/* FORM */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-grid.g1{grid-template-columns:1fr;}
.form-grid.g3{grid-template-columns:1fr 1fr 1fr;}
.form-field{display:flex;flex-direction:column;gap:5px;}
.form-field.span2{grid-column:span 2;}
label{font-size:12px;font-weight:600;color:#374151;}
input,select,textarea{padding:9px 12px;border:1.5px solid #D1D5DB;border-radius:8px;font-size:13px;outline:none;font-family:inherit;transition:border-color .2s;}
input:focus,select:focus,textarea:focus{border-color:#2E75B6;box-shadow:0 0 0 3px rgba(46,117,182,.1);}
textarea{resize:vertical;min-height:70px;}
.section-title{font-size:11px;font-weight:700;color:#6B7280;text-transform:uppercase;letter-spacing:.6px;padding:14px 0 6px;border-bottom:1px solid #F3F4F6;margin-bottom:2px;grid-column:1/-1;}

/* DRAG DROP */
.dropzone{border:2px dashed #D1D5DB;border-radius:10px;padding:28px;text-align:center;cursor:pointer;transition:all .2s;background:#FAFAFA;}
.dropzone.dragover{border-color:#2E75B6;background:#EFF6FF;}
.dropzone p{font-size:13px;color:#6B7280;margin-top:6px;}
.dropzone .dz-icon{font-size:28px;}
.file-list{margin-top:10px;display:flex;flex-direction:column;gap:6px;}
.file-item{display:flex;align-items:center;justify-content:space-between;background:#F9FAFB;border:1px solid #E5E7EB;border-radius:8px;padding:8px 12px;font-size:12px;}
.file-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;}
.file-rm{background:none;border:none;color:#DC2626;cursor:pointer;font-size:16px;flex-shrink:0;}

/* PRODUCT DETAIL */
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.detail-field{padding:10px 12px;background:#F9FAFB;border-radius:8px;}
.detail-field .df-label{font-size:11px;color:#6B7280;font-weight:600;margin-bottom:3px;}
.detail-field .df-value{font-size:13px;color:#111;font-weight:500;}
.detail-section{font-size:11px;font-weight:700;color:#1F4E79;text-transform:uppercase;letter-spacing:.5px;margin:16px 0 8px;padding-bottom:4px;border-bottom:2px solid #DBEAFE;}

/* IMAGES PREVIEW */
.img-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-top:10px;}
.img-thumb{position:relative;aspect-ratio:1;border-radius:8px;overflow:hidden;background:#F3F4F6;}
.img-thumb img{width:100%;height:100%;object-fit:cover;}
.img-thumb a{display:block;width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:24px;text-decoration:none;}

/* ALERT */
.alert{padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:14px;}
.alert-err{background:#FEE2E2;color:#DC2626;}
.alert-ok{background:#D1FAE5;color:#065F46;}

/* EMPTY STATE */
.empty{text-align:center;padding:60px 20px;color:#9CA3AF;}
.empty .emp-icon{font-size:48px;margin-bottom:12px;}
.empty p{font-size:15px;}

@media(max-width:640px){
  .form-grid{grid-template-columns:1fr;}
  .form-field.span2{grid-column:span 1;}
  .detail-grid{grid-template-columns:1fr;}
  main{padding:16px;}
  nav{padding:0 16px;}
  .stats{grid-template-columns:1fr 1fr;}
}
/* ── Nav active link ── */
.nav-active{color:#fff !important;font-weight:700;border-bottom:2px solid rgba(255,255,255,.6);padding-bottom:2px;}
.nav-sep{opacity:.3;margin:0 4px;}

/* ═══════════════════════════════════════════════════════════════════════
   MODO NOCHE NATIVO
   ─────────────────────────────────────────────────────────────────────
   Las páginas marcadas con <html data-theme-base="dark"> usan estos
   overrides para repintar los componentes light en versiones dark
   consistentes con el lenguaje visual de home.html (navy #0F1E35,
   cards rgba(255,255,255,.04), borders sutiles, texto blanco).

   Sin filter:invert. Sin hacks. Cada superficie controlada explícitamente.
   ═══════════════════════════════════════════════════════════════════════ */

html[data-theme-base="dark"] body {
  background: #0F1E35;
  color: rgba(255,255,255,.92);
}

/* NAV: capa apenas más clara que el body */
html[data-theme-base="dark"] nav {
  background: rgba(255,255,255,.03);
  border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow: none;
  backdrop-filter: blur(8px);
}
html[data-theme-base="dark"] .nav-link { color: rgba(255,255,255,.65); }
html[data-theme-base="dark"] .nav-link:hover { color: #fff; }
html[data-theme-base="dark"] .nav-active { border-bottom-color: rgba(255,255,255,.6); }
html[data-theme-base="dark"] .nav-role { background: rgba(255,255,255,.1); }
html[data-theme-base="dark"] .btn-logout {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.15);
}
html[data-theme-base="dark"] .btn-logout:hover { background: rgba(255,255,255,.15); }

/* HEADINGS */
html[data-theme-base="dark"] h1,
html[data-theme-base="dark"] h2,
html[data-theme-base="dark"] h3,
html[data-theme-base="dark"] h4 { color: #fff; }
html[data-theme-base="dark"] .subtitle { color: rgba(255,255,255,.55); }

/* STATS CARDS */
html[data-theme-base="dark"] .stat {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-left-width: 4px;
  box-shadow: none;
}
html[data-theme-base="dark"] .stat-num { color: #fff; }
html[data-theme-base="dark"] .stat-label { color: rgba(255,255,255,.45); }

/* INPUTS — selector amplio para cazar <input> sin atributo type explícito */
html[data-theme-base="dark"] input,
html[data-theme-base="dark"] select,
html[data-theme-base="dark"] textarea {
  background: rgba(255,255,255,.05);
  border: 1.5px solid rgba(255,255,255,.12);
  color: #fff;
}
/* Restaurar checkboxes/radios/file/range que no deben tener fondo plano */
html[data-theme-base="dark"] input[type=checkbox],
html[data-theme-base="dark"] input[type=radio] {
  background: transparent;
  border: none;
  accent-color: #2E75B6;
}
html[data-theme-base="dark"] input[type=file],
html[data-theme-base="dark"] input[type=range],
html[data-theme-base="dark"] input[type=color] {
  background: transparent;
  border: none;
  color: rgba(255,255,255,.8);
}
html[data-theme-base="dark"] input::placeholder,
html[data-theme-base="dark"] textarea::placeholder { color: rgba(255,255,255,.35); }
html[data-theme-base="dark"] input:focus,
html[data-theme-base="dark"] select:focus,
html[data-theme-base="dark"] textarea:focus {
  border-color: #2E75B6;
  box-shadow: 0 0 0 3px rgba(46,117,182,.18);
  background: rgba(255,255,255,.07);
}
html[data-theme-base="dark"] select option { background: #1A2D52; color: #fff; }
html[data-theme-base="dark"] label { color: rgba(255,255,255,.7); }

/* Inputs/divs con inline-style background light — comunes en ncm.html.
   Forzamos dark con attribute selectors */
html[data-theme-base="dark"] input[style*="background:#F9FAFB"],
html[data-theme-base="dark"] input[style*="background:#FAFBFC"],
html[data-theme-base="dark"] input[style*="background: #F9FAFB"],
html[data-theme-base="dark"] input[style*="background: #FAFBFC"] {
  background: rgba(255,255,255,.04) !important;
  color: rgba(255,255,255,.5) !important;
}
/* Info boxes naranja (NCM ref del PM) y azul (Links de referencia) */
html[data-theme-base="dark"] [style*="background:#FFF7ED"],
html[data-theme-base="dark"] [style*="background: #FFF7ED"] {
  background: rgba(217,119,6,.08) !important;
  border-color: rgba(217,119,6,.35) !important;
}
html[data-theme-base="dark"] [style*="background:#E8EDF4"],
html[data-theme-base="dark"] [style*="background: #E8EDF4"] {
  background: rgba(46,117,182,.1) !important;
  border-color: rgba(46,117,182,.35) !important;
}
/* Modales y cards page-specific con background:#fff inline */
html[data-theme-base="dark"] .ai-modal,
html[data-theme-base="dark"] .kpi-card,
html[data-theme-base="dark"] .kpi {
  background: rgba(255,255,255,.04) !important;
  color: #fff;
  box-shadow: none !important;
  border: 1px solid rgba(255,255,255,.08);
}
html[data-theme-base="dark"] .kpi-card { border-left: 3px solid #1E40AF; }
/* KPI strip de pi.html: borde superior coloreado del mismo color que en light */
html[data-theme-base="dark"] .kpi { border-top: 3px solid #0D47A1 !important; }
html[data-theme-base="dark"] .kpi.anticipo,
html[data-theme-base="dark"] .kpi.fob-pagar    { border-top-color: #F59E0B !important; }
html[data-theme-base="dark"] .kpi.saldo,
html[data-theme-base="dark"] .kpi.prioritarias { border-top-color: #EF4444 !important; }
html[data-theme-base="dark"] .kpi.pagado,
html[data-theme-base="dark"] .kpi.fob-pagado   { border-top-color: #10B981 !important; }
html[data-theme-base="dark"] .kpi.proceso      { border-top-color: #8B5CF6 !important; }
html[data-theme-base="dark"] .kpi:hover        { background: rgba(255,255,255,.07) !important; }
html[data-theme-base="dark"] .kpi.kpi-active   { box-shadow: 0 0 0 2px rgba(46,117,182,.4) !important; background: rgba(46,117,182,.1) !important; }
html[data-theme-base="dark"] .kpi.kpi-active.fob-pagar    { box-shadow: 0 0 0 2px rgba(245,158,11,.4) !important; background: rgba(245,158,11,.08) !important; }
html[data-theme-base="dark"] .kpi.kpi-active.fob-pagado   { box-shadow: 0 0 0 2px rgba(16,185,129,.4) !important; background: rgba(16,185,129,.08) !important; }
html[data-theme-base="dark"] .kpi.kpi-active.prioritarias { box-shadow: 0 0 0 2px rgba(239,68,68,.4) !important;  background: rgba(239,68,68,.08) !important; }
html[data-theme-base="dark"] .kpi.kpi-active.proceso      { box-shadow: 0 0 0 2px rgba(139,92,246,.4) !important; background: rgba(139,92,246,.08) !important; }

/* ═══════════════════════════════════════════════════════════════════════
   pi.html — overrides específicos para el módulo Finanzas
   El <style> inline del archivo está completamente diseñado en light;
   acá repintamos cada componente a dark con !important para vencerlo.
   ═══════════════════════════════════════════════════════════════════════ */

/* KPI inner text */
html[data-theme-base="dark"] .kpi-val { color: #fff !important; }
html[data-theme-base="dark"] .kpi-sub { color: rgba(255,255,255,.5) !important; }

/* PI Cards */
html[data-theme-base="dark"] .pi-card {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}
html[data-theme-base="dark"] .pi-card-header {
  background: rgba(255,255,255,.03) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
html[data-theme-base="dark"] .pi-card-header .pi-id    { color: #7BBFFF !important; }
html[data-theme-base="dark"] .pi-card-header .pi-prov  { color: #fff !important; }
html[data-theme-base="dark"] .pi-card-header .pi-total { color: #fff !important; }

html[data-theme-base="dark"] .pi-card-bank {
  background: rgba(46,117,182,.08) !important;
  color: rgba(255,255,255,.78) !important;
  border-bottom-color: rgba(255,255,255,.08) !important;
}
html[data-theme-base="dark"] .pi-card-bank .lbl { color: rgba(255,255,255,.45) !important; }

html[data-theme-base="dark"] .pi-card-footer {
  background: rgba(255,255,255,.03) !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}
html[data-theme-base="dark"] .pi-card-footer .left { color: rgba(255,255,255,.55) !important; }

/* Inner product table en cada PI */
html[data-theme-base="dark"] .prod-table th {
  background: rgba(46,117,182,.22) !important;
  color: rgba(255,255,255,.9) !important;
}
html[data-theme-base="dark"] .prod-table td {
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  color: rgba(255,255,255,.82) !important;
}
html[data-theme-base="dark"] .prod-table tbody tr:hover {
  background: rgba(255,255,255,.05) !important;
  color: #fff !important;
}

/* Payment status indicators */
html[data-theme-base="dark"] .pay-yes { color: #86EFAC !important; }
html[data-theme-base="dark"] .pay-no  {
  color: #FBBF24 !important;
  border-color: rgba(251,191,36,.5) !important;
}
html[data-theme-base="dark"] .pay-no:hover { background: rgba(251,191,36,.12) !important; }
html[data-theme-base="dark"] .est-date { color: rgba(255,255,255,.55) !important; }
html[data-theme-base="dark"] .est-date.vence-pronto { color: #FCD34D !important; }
html[data-theme-base="dark"] .est-date.vencida { color: #FCA5A5 !important; }

/* Editable date cell */
html[data-theme-base="dark"] .est-date-edit {
  border-color: rgba(255,255,255,.18) !important;
  color: rgba(255,255,255,.7) !important;
}
html[data-theme-base="dark"] .est-date-edit:hover {
  border-color: #2E75B6 !important;
  background: rgba(46,117,182,.1) !important;
}

/* pi.html badges (diferentes de los globales) */
html[data-theme-base="dark"] .badge-Pagado    { background: rgba(16,185,129,.18) !important; color: #86EFAC !important; }
html[data-theme-base="dark"] .badge-Pendiente { background: rgba(239,68,68,.18) !important;  color: #FCA5A5 !important; }
html[data-theme-base="dark"] .badge-En\ proceso { background: rgba(251,191,36,.18) !important; color: #FCD34D !important; }

/* Tabs en modal de PI */
html[data-theme-base="dark"] .tab-bar {
  border-bottom: 2px solid rgba(255,255,255,.08) !important;
}
html[data-theme-base="dark"] .tab-btn { color: rgba(255,255,255,.5) !important; }
html[data-theme-base="dark"] .tab-btn.active {
  color: #7BBFFF !important;
  border-bottom-color: #2E75B6 !important;
}

/* AI zone */
html[data-theme-base="dark"] .ai-zone {
  background: rgba(46,117,182,.08) !important;
  border-color: rgba(46,117,182,.4) !important;
}
html[data-theme-base="dark"] .ai-zone h4 { color: #7BBFFF !important; }
html[data-theme-base="dark"] .dz {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(46,117,182,.5) !important;
}
html[data-theme-base="dark"] .dz:hover,
html[data-theme-base="dark"] .dz.over {
  background: rgba(46,117,182,.12) !important;
  border-color: #2E75B6 !important;
}
html[data-theme-base="dark"] .ai-result {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(46,117,182,.4) !important;
}

/* Item rows en modal de PI */
html[data-theme-base="dark"] .item-row {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.08) !important;
}

/* Finanzas read-only banner */
html[data-theme-base="dark"] .finanzas-banner {
  background: rgba(251,191,36,.1) !important;
  border-color: rgba(251,191,36,.35) !important;
  color: #FCD34D !important;
}

/* Filter row de tabla (inputs por columna) */
html[data-theme-base="dark"] .filter-row th {
  background: rgba(255,255,255,.05) !important;
  border-bottom: 2px solid rgba(255,255,255,.1) !important;
}
html[data-theme-base="dark"] .filter-row input {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.85) !important;
}
html[data-theme-base="dark"] .filter-row input::placeholder { color: rgba(255,255,255,.3) !important; }

/* Date picker (inline calendar) */
html[data-theme-base="dark"] .dp-cal {
  background: #1A2D52 !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: 0 8px 40px rgba(0,0,0,.6) !important;
}
html[data-theme-base="dark"] .dp-dow { color: rgba(255,255,255,.45) !important; }
html[data-theme-base="dark"] .dp-day { color: rgba(255,255,255,.78) !important; }
html[data-theme-base="dark"] .dp-day:hover { background: rgba(46,117,182,.18) !important; }
html[data-theme-base="dark"] .dp-day.dp-today { color: #7BBFFF !important; }
html[data-theme-base="dark"] .dp-day.dp-other { color: rgba(255,255,255,.2) !important; }
html[data-theme-base="dark"] .dp-clear {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.7) !important;
}
html[data-theme-base="dark"] .dp-clear:hover { background: rgba(255,255,255,.08) !important; }

/* BUTTONS OUTLINE */
html[data-theme-base="dark"] .btn-outline {
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.2);
  color: rgba(255,255,255,.85);
}
html[data-theme-base="dark"] .btn-outline:hover {
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.3);
}
html[data-theme-base="dark"] .btn-act-outline {
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.2) !important;
  color: rgba(255,255,255,.85) !important;
}

/* TABLE */
html[data-theme-base="dark"] .table-wrap {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: none;
}
html[data-theme-base="dark"] thead th {
  background: rgba(46,117,182,.22);
  color: rgba(255,255,255,.9);
  border-bottom: 1px solid rgba(255,255,255,.1);
}
html[data-theme-base="dark"] tbody tr {
  border-bottom: 1px solid rgba(255,255,255,.06);
}
html[data-theme-base="dark"] tbody tr:hover {
  background: rgba(255,255,255,.05);
  color: #fff;
}
html[data-theme-base="dark"] td { color: rgba(255,255,255,.82); }
html[data-theme-base="dark"] .sku { color: #7BBFFF; }
html[data-theme-base="dark"] .prod-name { color: #fff; }
html[data-theme-base="dark"] .prod-desc { color: rgba(255,255,255,.5); }
html[data-theme-base="dark"] .ncm-code {
  color: #86EFAC;
  background: rgba(134,239,172,.1);
}

/* BADGES — repaints para legibilidad sobre dark */
html[data-theme-base="dark"] .badge-pendiente { background: rgba(197,90,17,.22);  color: #FBBF24; }
html[data-theme-base="dark"] .badge-proceso   { background: rgba(184,134,11,.2);  color: #FCD34D; }
html[data-theme-base="dark"] .badge-clasificado{ background: rgba(84,130,53,.22);  color: #86EFAC; }
html[data-theme-base="dark"] .badge-alta      { background: rgba(220,38,38,.2);   color: #FCA5A5; }
html[data-theme-base="dark"] .badge-media     { background: rgba(217,119,6,.2);   color: #FCD34D; }
html[data-theme-base="dark"] .badge-baja      { background: rgba(13,148,136,.2);  color: #5EEAD4; }

/* FILE ICONS */
html[data-theme-base="dark"] .fi-img { background: rgba(46,117,182,.22); }
html[data-theme-base="dark"] .fi-vid { background: rgba(220,38,38,.22); }
html[data-theme-base="dark"] .fi-cat { background: rgba(134,239,172,.18); }

/* MODAL */
html[data-theme-base="dark"] .overlay { background: rgba(0,0,0,.7); }
html[data-theme-base="dark"] .modal {
  background: #1A2D52;
  color: #fff;
  box-shadow: 0 24px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.08);
}
html[data-theme-base="dark"] .modal-header,
html[data-theme-base="dark"] .modal-footer {
  border-color: rgba(255,255,255,.08);
}
html[data-theme-base="dark"] .modal-title { color: #fff; }
html[data-theme-base="dark"] .modal-close { color: rgba(255,255,255,.5); }

/* FORM SECTIONS */
html[data-theme-base="dark"] .section-title {
  color: rgba(255,255,255,.5);
  border-bottom-color: rgba(255,255,255,.08);
}

/* DROPZONE / FILES */
html[data-theme-base="dark"] .dropzone {
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.18);
}
html[data-theme-base="dark"] .dropzone.dragover {
  background: rgba(46,117,182,.1);
  border-color: #2E75B6;
}
html[data-theme-base="dark"] .dropzone p { color: rgba(255,255,255,.55); }
html[data-theme-base="dark"] .file-item {
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.08);
  color: rgba(255,255,255,.85);
}

/* DETAIL FIELDS */
html[data-theme-base="dark"] .detail-field { background: rgba(255,255,255,.04); }
html[data-theme-base="dark"] .detail-field .df-label { color: rgba(255,255,255,.5); }
html[data-theme-base="dark"] .detail-field .df-value { color: #fff; }
html[data-theme-base="dark"] .detail-section {
  color: #7BBFFF;
  border-bottom-color: rgba(46,117,182,.3);
}

/* IMG PREVIEW */
html[data-theme-base="dark"] .img-thumb { background: rgba(255,255,255,.05); }

/* ALERTS */
html[data-theme-base="dark"] .alert-err {
  background: rgba(220,38,38,.15);
  color: #FCA5A5;
  border: 1px solid rgba(220,38,38,.3);
}
html[data-theme-base="dark"] .alert-ok {
  background: rgba(134,239,172,.1);
  color: #86EFAC;
  border: 1px solid rgba(134,239,172,.28);
}

/* EMPTY STATE */
html[data-theme-base="dark"] .empty { color: rgba(255,255,255,.4); }
