/* Fénix ERP · Tema claro v3 (2026-09-01)
   Solo se activa cuando el shell tiene class="light".
   Objetivo: una sola identidad clara, cálida y premium en TODO el ERP.
   El modo oscuro no se toca. */

.light{
  color-scheme:light;
  --bg:#F4F3F0;
  --panel:#FFFEFC;
  --panel2:#F8F6F2;
  --side:#FFFDF9;
  --text:#1E2532;
  --sub:#707A8A;
  --line:#E5E0D9;
  --acc:#7C3AED;
  --accSoft:rgba(124,58,237,.095);
  --green:#16A34A;
  --warn:#D97706;
  --danger:#DC2626;
  --pri:#FF7A1A;
  --chip:#F7F4EF;
  --gold:#B97800;

  --sentinel-panel:#FFFEFC;
  --sentinel-panel2:#F8F6F2;
  --sentinel-line:#E3DED6;
  --sentinel-text:#1E2532;
  --sentinel-sub:#747E8D;

  --ops-bg:linear-gradient(160deg,#F6F4F0 0%,#F2F3F6 58%,#FFF7EC 100%);
  --ops-card-gradient:linear-gradient(160deg,#FFFEFC 0%,#FFF8EF 100%);
  --ops-card-gradient-2:linear-gradient(160deg,#FFFEFC 0%,#F7F5F1 100%);
  --ops-card:#FFFEFC;
  --ops-card-2:#F8F6F2;
  --ops-text:#1E2532;
  --ops-sub:#707A8A;
  --ops-muted:#8A93A1;
  --ops-soft:#566174;
  --ops-line:rgba(31,37,50,.10);
  --ops-line-strong:rgba(31,37,50,.14);

  --fenix-light-orange:#FF7A1A;
  --fenix-light-gold:#FFC14D;
  --fenix-light-purple:#7C3AED;
  --fenix-light-shadow:rgba(33,39,52,.075);
}

/* Lienzo general. Evita el aspecto blanco plano y conserva profundidad. */
.light{
  background-color:var(--bg) !important;
  background-image:
    radial-gradient(circle at 88% 4%,rgba(255,193,77,.12),transparent 25%),
    radial-gradient(circle at 8% 0%,rgba(124,58,237,.055),transparent 22%),
    linear-gradient(180deg,#F7F5F1 0%,#F3F3F4 72%,#F8F5F0 100%) !important;
}
.light .card{
  background:linear-gradient(180deg,#FFFEFC 0%,#FFFFFF 100%);
  border-color:var(--line);
  box-shadow:0 8px 24px var(--fenix-light-shadow),0 1px 2px rgba(33,39,52,.035);
}
.light .fld,
.light input.fld,
.light select.fld,
.light textarea.fld{
  background:#FFFEFC;
  border-color:#E2DDD6;
  color:var(--text);
  box-shadow:0 1px 2px rgba(33,39,52,.025),inset 0 1px 0 rgba(255,255,255,.92);
}
.light .fld:focus,
.light input.fld:focus,
.light select.fld:focus,
.light textarea.fld:focus{
  border-color:rgba(255,122,26,.70);
  box-shadow:0 0 0 3px rgba(255,122,26,.095);
}
.light .kbd{background:#F5F2ED;border-color:#E1DCD5;color:#667287;}
.light h3{color:#687487;}

/* Navegación. */
.light .nav{color:#687487;}
.light .nav:hover{
  background:linear-gradient(90deg,rgba(255,122,26,.055),rgba(124,58,237,.052));
  color:#202735;
}
.light .nav.on{
  color:#6E3AD6;
  background:linear-gradient(90deg,rgba(255,122,26,.09),rgba(124,58,237,.09));
  box-shadow:inset 3px 0 0 #FF7A1A;
}

/* Acciones primarias. */
.light .grad{
  background:linear-gradient(135deg,#FF7A1A 0%,#FF9B28 48%,#F4BE49 100%);
  box-shadow:0 8px 20px rgba(255,122,26,.15);
}
.light .grad:hover{filter:brightness(1.015);}

/* Modales y scroll. */
.light .ov{background:rgba(28,34,46,.26);backdrop-filter:blur(4px);}
.light .spin{border-color:rgba(255,122,26,.20);border-top-color:#FF7A1A;}
.light ::-webkit-scrollbar-thumb{background:#D9D5CF;}
.light ::-webkit-scrollbar-track{background:transparent;}

/* POS cobro. */
.light .fenix-cobro-overlay{background:rgba(28,34,46,.24) !important;backdrop-filter:blur(5px) !important;}
.light .fenix-cobro-card{
  border-color:rgba(255,122,26,.25) !important;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,193,77,.11),transparent 34%),
    radial-gradient(circle at 88% 100%,rgba(124,58,237,.055),transparent 34%),
    #FFFEFC !important;
  box-shadow:0 24px 68px rgba(33,39,52,.15),0 0 0 1px rgba(255,255,255,.9) inset !important;
}
.light .fenix-cobro-total{color:#7C3AED !important;}
.light .fenix-cobro-method{background:#FFFEFC !important;box-shadow:0 5px 14px rgba(33,39,52,.05) !important;}
.light .fenix-cobro-method.is-active{
  background:linear-gradient(145deg,rgba(255,122,26,.075),rgba(124,58,237,.055)) !important;
  border-color:rgba(255,122,26,.58) !important;
  color:#6F3AD3 !important;
}
.light .fenix-cobro-input{background:#FFFEFC !important;}
.light .fenix-cobro-error{background:#FFF1F2 !important;color:#B42318 !important;}

/* POS postventa. */
.light .ov.fenix-pos-done-overlay{
  background:rgba(28,34,46,.23) !important;
  backdrop-filter:blur(7px) saturate(.96) !important;
  -webkit-backdrop-filter:blur(7px) saturate(.96) !important;
}
.light .fenix-pos-done{
  border-color:rgba(255,122,26,.44) !important;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,193,77,.13),transparent 34%),
    radial-gradient(circle at 88% 100%,rgba(124,58,237,.065),transparent 36%),
    linear-gradient(155deg,#FFFEFC 0%,#FFFFFF 56%,#FFF8EE 100%) !important;
  color:#1E2532 !important;
  box-shadow:0 30px 80px rgba(33,39,52,.16),0 0 0 1px rgba(255,255,255,.92) inset,0 0 30px rgba(255,122,26,.07) !important;
}
.light .fenix-pos-done::after{color:#535D6C !important;}
.light .fenix-pos-done > div:nth-child(2){color:#1E2532 !important;}
.light .fenix-pos-done > div:nth-child(3){color:#8490A0 !important;}
.light .fenix-pos-done > div:has(> b){border-top-color:#E8E2DB !important;color:#1E2532 !important;}
.light .fenix-pos-done > div:has(> b) > b{color:#FF820C !important;text-shadow:0 0 24px rgba(255,193,77,.22),0 8px 26px rgba(255,122,26,.11) !important;}
.light .fenix-pos-done button.card{
  border-color:#E3DED7 !important;
  background:linear-gradient(180deg,#FFFEFC,#F9F6F1) !important;
  color:#202735 !important;
  box-shadow:0 9px 20px rgba(33,39,52,.085),0 1px 0 rgba(255,255,255,.9) inset !important;
}
.light .fenix-pos-done button.card:hover{border-color:rgba(255,154,60,.58) !important;background:linear-gradient(180deg,#FFFFFF,#FFF6EA) !important;box-shadow:0 12px 26px rgba(33,39,52,.10),0 0 22px rgba(255,122,26,.065) !important;}
.light .fenix-pos-done > label{border-color:#E5E0D9 !important;background:#FAF7F2 !important;color:#8490A0 !important;}
.light .fenix-pos-done > label select.fld{border-color:rgba(255,154,60,.46) !important;background:#FFFEFC !important;color:#1E2532 !important;}

/* ═══════════════════════════════════════════════════════════════
   SENTINEL CLARO REAL
   v2 dejaba el lienzo de arriba negro porque Sentinel trae un fondo
   oscuro fijo propio. El hotfix v3 etiqueta su raíz con
   .fenix-sentinel-root y aquí se rehace el módulo completo en claro.
   ═══════════════════════════════════════════════════════════════ */
.light .fenix-sentinel-root{
  min-height:100% !important;
  color:var(--text) !important;
  background:
    radial-gradient(circle at 54% -8%,rgba(255,187,73,.15),transparent 27%),
    radial-gradient(circle at 5% 9%,rgba(124,58,237,.055),transparent 22%),
    linear-gradient(180deg,#F6F4F0 0%,#F1F2F5 62%,#F5F2ED 100%) !important;
}
.light .fenix-sentinel-root .fx-font{color:#1E2532 !important;}
.light .fenix-sentinel-root .sentinel-modulo-card{
  background:linear-gradient(160deg,#FFFEFC 0%,#FAF7F2 100%) !important;
  border-color:#E2DDD6 !important;
  box-shadow:0 10px 26px rgba(33,39,52,.075),0 1px 0 rgba(255,255,255,.92) inset !important;
}
.light .fenix-sentinel-root .sentinel-modulo-card:hover{
  transform:translateY(-3px);
  border-color:rgba(255,122,26,.34) !important;
  box-shadow:0 15px 34px rgba(33,39,52,.11),0 0 24px rgba(255,122,26,.055) !important;
}
.light .fenix-sentinel-root .sentinel-modulo-card > div:nth-child(2){color:#222936 !important;}
.light .fenix-sentinel-root .sentinel-modulo-card > div:nth-child(3){color:#7B8492 !important;}
.light .fenix-sentinel-root .sentinel-modulo-card > div:nth-child(2) > div:first-child{color:#222936 !important;}
.light .fenix-sentinel-root .sentinel-modulo-card > div:nth-child(2) > div:last-child{color:#7B8492 !important;}
.light .fenix-sentinel-root .sentinel-card{
  background:linear-gradient(180deg,#FFFEFC,#FFFFFF) !important;
  border-color:#E3DED7 !important;
  box-shadow:0 10px 28px rgba(33,39,52,.065) !important;
}
.light .fenix-sentinel-root .sentinel-resumen-btn{
  background:linear-gradient(90deg,rgba(255,122,26,.085),rgba(124,58,237,.055)) !important;
  border-color:rgba(124,58,237,.22) !important;
  box-shadow:0 9px 24px rgba(33,39,52,.06) !important;
}
.light .fenix-sentinel-root .sentinel-resumen-btn > span{color:#252C39 !important;}
.light .fenix-sentinel-root .sentinel-fade-up[style*="background"]{
  background:linear-gradient(160deg,#FFFEFC 0%,#FAF7F2 100%) !important;
  border-color:#E2DDD6 !important;
  color:#1E2532 !important;
}
.light .fenix-sentinel-root .fld{background:#FFFEFC !important;color:#1E2532 !important;border-color:#E1DCD5 !important;}
.light .fenix-sentinel-root .sentinel-hablar-btn{animation-name:sentinelPulseGlowLight;}
@keyframes sentinelPulseGlowLight{
  0%,100%{box-shadow:0 0 0 0 rgba(255,122,26,.25),0 0 32px 5px rgba(255,193,77,.18);}
  50%{box-shadow:0 0 0 12px rgba(255,122,26,0),0 0 42px 8px rgba(124,58,237,.14);}
}

/* Paneles operativos premium. */
.light .pr-kpi,.light .pr-chip{box-shadow:0 6px 18px rgba(33,39,52,.055);}
.light .pr-kpi:hover{border-color:rgba(255,122,26,.24) !important;}
.light .pr-row:hover{background:rgba(255,122,26,.035) !important;}
.light .pr-btn-secundario:hover{background:#FFF6EA !important;border-color:rgba(255,122,26,.22) !important;}
.light .pr-seg:hover{color:#2A3344;}

/* Tablas. */
.light table{color:var(--text);}
.light thead{background:#F7F4EF;}
.light th{color:#657184;}
.light hr{border-color:var(--line);}

.light :focus-visible{outline:2px solid rgba(255,122,26,.70);outline-offset:2px;}
.light ::selection{background:rgba(124,58,237,.17);color:#1E2532;}