/* Fénix ERP · Light Theme 4.0 Premium
   Diseño aprobado 2026-09-22.
   Alcance: WEB únicamente. No toca lógica de ventas, caja, inventario ni APK.
   Firma visual autorizada por Raúl: “Diseño UI — ChatGPT”.
*/

.light{
  color-scheme:light;
  --bg:#F6F8FC;
  --panel:#FFFFFF;
  --panel2:#F2F5FA;
  --side:#FFFFFF;
  --text:#0B1533;
  --sub:#5F6F8C;
  --line:#DCE3EE;
  --acc:#5B2BF4;
  --accSoft:#EEE9FF;
  --green:#0E9F55;
  --warn:#D97706;
  --danger:#E11D48;
  --pri:#FF7417;
  --chip:#F5F7FB;
  --gold:#C57A00;

  --fx-bg:#F6F8FC;
  --fx-surface:#FFFFFF;
  --fx-surface-soft:#F2F5FA;
  --fx-border:#DCE3EE;
  --fx-border-strong:#C9D4E4;
  --fx-text:#0B1533;
  --fx-muted:#5F6F8C;
  --fx-muted-2:#7B879D;
  --fx-purple:#5B2BF4;
  --fx-purple-2:#7A45F7;
  --fx-purple-soft:#EEE9FF;
  --fx-orange:#FF7417;
  --fx-orange-2:#FF9A3D;
  --fx-green:#0E9F55;
  --fx-red:#E11D48;
  --fx-shadow-sm:0 2px 8px rgba(24,39,75,.055);
  --fx-shadow-md:0 10px 30px rgba(24,39,75,.085);
  --fx-shadow-lg:0 24px 70px rgba(24,39,75,.14);

  --sentinel-panel:#FFFFFF;
  --sentinel-panel2:#F4F6FA;
  --sentinel-line:#DCE3EE;
  --sentinel-text:#0B1533;
  --sentinel-sub:#66758F;

  --ops-bg:linear-gradient(180deg,#F8FAFD 0%,#F4F7FB 100%);
  --ops-card-gradient:linear-gradient(180deg,#FFFFFF 0%,#FAFBFD 100%);
  --ops-card-gradient-2:linear-gradient(180deg,#FFFFFF 0%,#F5F7FB 100%);
  --ops-card:#FFFFFF;
  --ops-card-2:#F4F6FA;
  --ops-text:#0B1533;
  --ops-sub:#66758F;
  --ops-muted:#8793A8;
  --ops-soft:#52617D;
  --ops-line:rgba(31,50,85,.10);
  --ops-line-strong:rgba(31,50,85,.16);

  background:#F6F8FC !important;
  background-image:
    radial-gradient(circle at 82% -8%,rgba(91,43,244,.045),transparent 24%),
    linear-gradient(180deg,#FAFBFD 0%,#F6F8FC 52%,#F3F6FA 100%) !important;
  color:var(--fx-text) !important;
}

/* ---------- Base y accesibilidad ---------- */
.light,
.light button,
.light input,
.light select,
.light textarea{
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

.light ::placeholder{color:#7B879D !important;opacity:1 !important;}
.light input,
.light select,
.light textarea{color:var(--fx-text) !important;}
.light small,
.light .muted{color:var(--fx-muted) !important;}
.light :focus-visible{outline:3px solid rgba(91,43,244,.24) !important;outline-offset:2px;}
.light ::selection{background:rgba(91,43,244,.16);color:#0B1533;}

.light .card{
  background:#FFFFFF !important;
  border-color:var(--fx-border) !important;
  color:var(--fx-text) !important;
  box-shadow:var(--fx-shadow-sm) !important;
}
.light .card:hover{border-color:#CDD7E6;}

.light .fld,
.light input.fld,
.light select.fld,
.light textarea.fld{
  background:#FFFFFF !important;
  color:var(--fx-text) !important;
  border-color:var(--fx-border-strong) !important;
  box-shadow:0 1px 2px rgba(24,39,75,.035) !important;
}
.light .fld:focus,
.light input.fld:focus,
.light select.fld:focus,
.light textarea.fld:focus{
  border-color:var(--fx-purple) !important;
  box-shadow:0 0 0 3px rgba(91,43,244,.11) !important;
}
.light .kbd{
  background:#F2F4F8 !important;
  border-color:#D8E0EC !important;
  color:#43516C !important;
  font-weight:800 !important;
}

.light table{color:var(--fx-text) !important;}
.light thead{background:#F2F5FA !important;}
.light th{color:#53617A !important;font-weight:850 !important;}
.light td{border-color:#E6EBF2 !important;}
.light hr{border-color:#E3E8F0 !important;}

/* ---------- Navegación ---------- */
.light .nav{color:#283653 !important;}
.light .nav:hover{
  background:#F3F0FF !important;
  color:#3517B7 !important;
}
.light .nav.on{
  background:linear-gradient(90deg,#F0EBFF 0%,#F6F3FF 100%) !important;
  color:#4E23D7 !important;
  box-shadow:inset 3px 0 0 var(--fx-purple) !important;
}
.light .nav.on i,
.light .nav.on svg{color:var(--fx-purple) !important;}

/* ---------- Acciones ---------- */
.light .grad{
  background:linear-gradient(135deg,#FF7417 0%,#FF8B2B 58%,#FF9F3F 100%) !important;
  color:#FFFFFF !important;
  border-color:#FF7417 !important;
  box-shadow:0 10px 24px rgba(255,116,23,.22) !important;
}
.light .grad:hover{filter:brightness(1.025);box-shadow:0 13px 30px rgba(255,116,23,.27) !important;}
.light button:disabled{opacity:.48 !important;filter:saturate(.55);}

/* ---------- Ventas / POS ---------- */
.light #fx-ventas-buscar{
  background:#FFFFFF !important;
  color:#0B1533 !important;
  border:2px solid var(--fx-purple) !important;
  border-radius:16px !important;
  box-shadow:0 0 0 4px rgba(91,43,244,.045),0 8px 20px rgba(34,46,78,.055) !important;
  font-weight:650 !important;
}
.light #fx-ventas-buscar::placeholder{color:#697792 !important;}

.light .fx-quick-action{
  background:#FFFFFF !important;
  color:#17223E !important;
  border:1px solid #DCE3EE !important;
  box-shadow:0 4px 12px rgba(31,47,79,.065) !important;
}
.light .fx-quick-action:hover{
  background:#F8F6FF !important;
  color:#4820C7 !important;
  border-color:#8A67F6 !important;
  box-shadow:0 8px 18px rgba(91,43,244,.12) !important;
}
.light .fx-quick-action.is-favorite{
  border-color:#9A80F7 !important;
  background:#F7F4FF !important;
}

/* ---------- Ventas web · Light Theme 4.1 ---------- */
.light .ventas-web{
  background:linear-gradient(180deg,#F7F9FD 0%,#F3F6FA 100%) !important;
  color:var(--fx-text) !important;
}
.light .ventas-catalog-pane{
  background:transparent !important;
}
.light .ventas-ticket-pane{
  background:#FFFFFF !important;
  border-left-color:#DCE3EE !important;
  box-shadow:-8px 0 28px rgba(24,39,75,.035) !important;
}
.light .ventas-product-grid{
  align-content:start;
}
.light .ventas-web .prod-tile{
  background:#FFFFFF !important;
  border-color:#DCE3EE !important;
  box-shadow:0 5px 16px rgba(24,39,75,.065) !important;
  transition:transform .14s ease,box-shadow .16s ease,border-color .16s ease !important;
}
.light .ventas-web .prod-tile:hover{
  transform:translateY(-1px);
  border-color:#B7C3D5 !important;
  box-shadow:0 10px 24px rgba(24,39,75,.10) !important;
}
.light .ventas-web .prod-tile-name{
  color:#16213A !important;
}
.light .ventas-web .prod-tile-price{
  color:#C66A00 !important;
}
.light .ventas-web .fx-quick-action,
.light .ventas-web .fx-quick-action.is-favorite,
.light .ventas-web .fx-quick-action:active,
.light .ventas-web .fx-quick-action:focus{
  opacity:1 !important;
  visibility:visible !important;
}
.light .ventas-web .fx-quick-action{
  background:#FFFFFF !important;
  color:#26344F !important;
  border-color:#D9E1EC !important;
  box-shadow:0 4px 12px rgba(31,47,79,.07) !important;
}
.light .ventas-web .fx-quick-action.is-favorite{
  background:#F4F0FF !important;
  color:#4E23D7 !important;
  border-color:#9D86F6 !important;
  box-shadow:0 5px 14px rgba(91,43,244,.11) !important;
}
.light .ventas-web .fx-quick-action:active,
.light .ventas-web .fx-quick-action:focus-visible{
  background:#EEE9FF !important;
  color:#3517B7 !important;
  border-color:#7A5AF0 !important;
}
.light .ventas-web .fx-quick-action img,
.light .ventas-web .fx-quick-action svg,
.light .ventas-web .fx-quick-action i{
  opacity:1 !important;
  visibility:visible !important;
}

/* Las tarjetas de producto no deben parecer deshabilitadas en modo claro. */
.light [style*="cursor: pointer"].card,
.light button.card{
  color:#14203B;
}
.light [style*="cursor: pointer"].card:hover{
  border-color:#C7D1E0 !important;
  box-shadow:0 10px 24px rgba(26,42,73,.10) !important;
}

/* Precio / estados operativos: contraste robusto. */
.light [style*="color: var(--pri)"],
.light [style*="color:var(--pri)"]{color:#EA580C !important;}
.light [style*="color: var(--green)"],
.light [style*="color:var(--green)"]{color:#087A43 !important;}
.light [style*="color: var(--danger)"],
.light [style*="color:var(--danger)"]{color:#BE123C !important;}
.light [style*="color: var(--sub)"],
.light [style*="color:var(--sub)"]{color:#5F6F8C !important;}

/* Ticket lateral y paneles altos: blanco limpio, no gris lavado. */
.light [style*="border-left"]{
  border-color:#E1E7F0 !important;
}
.light [style*="background: var(--panel2)"],
.light [style*="background:var(--panel2)"]{
  background:#F5F7FB !important;
}

/* ---------- Sentinel ---------- */
.light .fenix-sentinel-root,
.light div:has(> .sentinel-resumen-btn){
  min-height:100% !important;
  color:#0B1533 !important;
  background:
    radial-gradient(circle at 55% -12%,rgba(91,43,244,.055),transparent 27%),
    linear-gradient(180deg,#F9FBFE 0%,#F5F8FC 65%,#F2F5FA 100%) !important;
}

.light .fenix-sentinel-root .sentinel-modulo-card,
.light div:has(> .sentinel-resumen-btn) .sentinel-modulo-card{
  background:#FFFFFF !important;
  border:1px solid #DCE3EE !important;
  color:#0B1533 !important;
  box-shadow:0 8px 22px rgba(24,39,75,.07) !important;
}
.light .fenix-sentinel-root .sentinel-modulo-card:hover,
.light div:has(> .sentinel-resumen-btn) .sentinel-modulo-card:hover{
  transform:translateY(-2px);
  border-color:#B9A9FA !important;
  box-shadow:0 13px 30px rgba(46,35,101,.10) !important;
}
.light .fenix-sentinel-root .sentinel-modulo-card > div:nth-child(2),
.light div:has(> .sentinel-resumen-btn) .sentinel-modulo-card > div:nth-child(2){
  color:#101A35 !important;
  font-weight:850 !important;
}
.light .fenix-sentinel-root .sentinel-modulo-card > div:nth-child(3),
.light div:has(> .sentinel-resumen-btn) .sentinel-modulo-card > div:nth-child(3){
  color:#64728C !important;
}

.light .fenix-sentinel-root .sentinel-card,
.light div:has(> .sentinel-resumen-btn) .sentinel-card{
  background:#FFFFFF !important;
  border-color:#DCE3EE !important;
  box-shadow:0 6px 18px rgba(24,39,75,.06) !important;
}
.light .fenix-sentinel-root .sentinel-resumen-btn,
.light div:has(> .sentinel-resumen-btn) .sentinel-resumen-btn{
  background:#FFFFFF !important;
  border:1px solid #D9E1ED !important;
  color:#0B1533 !important;
  box-shadow:0 6px 18px rgba(24,39,75,.065) !important;
}
.light .fenix-sentinel-root .sentinel-resumen-btn:hover,
.light div:has(> .sentinel-resumen-btn) .sentinel-resumen-btn:hover{
  border-color:#A993F8 !important;
  box-shadow:0 9px 22px rgba(91,43,244,.10) !important;
}
.light .fenix-sentinel-root .sentinel-resumen-btn > span,
.light div:has(> .sentinel-resumen-btn) .sentinel-resumen-btn > span{
  color:#111A35 !important;
}

/* ---------- Postventa / Venta cobrada ---------- */
.light .ov,
.light .ov.fenix-pos-done-overlay{
  background:rgba(31,41,65,.26) !important;
  backdrop-filter:blur(8px) saturate(.9) !important;
  -webkit-backdrop-filter:blur(8px) saturate(.9) !important;
}
.light .fenix-pos-done{
  width:min(790px,calc(100vw - 40px)) !important;
  max-width:790px !important;
  padding:42px 38px 30px !important;
  border-radius:26px !important;
  border:1px solid #D7E0EC !important;
  background:#FFFFFF !important;
  color:#0B1533 !important;
  box-shadow:var(--fx-shadow-lg) !important;
}
.light .fenix-pos-done::before{
  height:0 !important;
  box-shadow:none !important;
}
.light .fenix-pos-done::after{
  content:"Diseño UI — ChatGPT" !important;
  top:auto !important;
  left:auto !important;
  right:24px !important;
  bottom:12px !important;
  color:#9AA6BA !important;
  font-size:10px !important;
  letter-spacing:.01em !important;
  font-family:Inter,system-ui,sans-serif !important;
}
.light .fenix-pos-done-close{
  width:42px !important;
  height:42px !important;
  border-radius:13px !important;
  border-color:#DCE3EE !important;
  background:#FFFFFF !important;
  color:#17223E !important;
  box-shadow:0 3px 10px rgba(24,39,75,.06) !important;
}
.light .fenix-pos-done-close:hover{
  background:#F6F3FF !important;
  color:#4E23D7 !important;
  border-color:#B9A9FA !important;
}
.light .fenix-pos-done > div:first-child{
  background:#E8FAF1 !important;
  color:#08A45B !important;
  border:1px solid #BCEED6 !important;
  box-shadow:0 0 0 8px rgba(24,189,111,.065) !important;
}
.light .fenix-pos-done > div:nth-child(2){
  color:#071334 !important;
  font-size:28px !important;
}
.light .fenix-pos-done > div:nth-child(3){
  color:#65738D !important;
  font-size:15px !important;
}
.light .fenix-pos-done > div b{
  color:#5B2BF4 !important;
  text-shadow:none !important;
}
.light .fenix-pos-done button.card{
  min-height:66px !important;
  border-radius:15px !important;
  border-color:#DCE3EE !important;
  background:#FFFFFF !important;
  color:#101A35 !important;
  box-shadow:0 3px 10px rgba(24,39,75,.045) !important;
}
.light .fenix-pos-done button.card:hover{
  background:#F6F3FF !important;
  border-color:#B29FFA !important;
  color:#4E23D7 !important;
}
.light .fenix-pos-done > label{
  background:#F8FAFD !important;
  border-color:#DCE3EE !important;
  color:#64728C !important;
}
.light .fenix-pos-done > label select.fld{
  background:#FFFFFF !important;
  color:#0B1533 !important;
  border-color:#CFD8E7 !important;
}
.light .fenix-pos-done > button.grad{
  min-height:58px !important;
  margin-bottom:8px !important;
  background:linear-gradient(90deg,#5B2BF4 0%,#6D35F5 55%,#7A45F7 100%) !important;
  border-color:#5B2BF4 !important;
  color:#FFFFFF !important;
  box-shadow:0 12px 26px rgba(91,43,244,.22) !important;
}

/* ---------- Firma discreta aprobada ---------- */
@media (min-width:900px){
  body.light::after,
  body:has(.light)::after{
    content:"Diseño UI — ChatGPT";
    position:fixed;
    right:12px;
    bottom:6px;
    z-index:2;
    pointer-events:none;
    font:500 10px/1.2 Inter,system-ui,sans-serif;
    color:rgba(78,91,117,.58);
    letter-spacing:.01em;
  }
}

/* ---------- Responsive ---------- */
@media (max-width:720px){
  .light .fenix-pos-done{
    width:calc(100vw - 22px) !important;
    padding:34px 18px 26px !important;
    border-radius:22px !important;
  }
  .light .fenix-pos-done > div:nth-child(2){font-size:23px !important;}
}

@media (prefers-reduced-motion:reduce){
  .light *{scroll-behavior:auto !important;}
}


/* ---------- Proveedores 2.1 · tema claro robusto web + móvil ---------- */
/* Proveedores puede vivir en un árbol que no herede directamente .light.
   Se cubren ambos casos: descendiente normal y módulo montado fuera del contenedor.
   Dark/Luna no se toca porque todos los selectores exigen presencia de .light. */
.light [data-proveedores-version],
body:has(.light) [data-proveedores-version]{
  color-scheme:light;
  --bg:#F6F8FC;
  --panel:#FFFFFF;
  --panel2:#F2F5FA;
  --txt:#0B1533;
  --text:#0B1533;
  --sub:#5F6F8C;
  --line:#DCE3EE;
  --acc:#5B2BF4;
  --accSoft:#EEE9FF;
  --green:#0E9F55;
  --warn:#D97706;
  --danger:#E11D48;
  --pri:#FF7417;
  --shadow:0 6px 20px rgba(24,39,75,.07);
  width:100%;
  max-width:none !important;
  min-height:calc(100dvh - 64px);
  box-sizing:border-box;
  background:
    radial-gradient(circle at 85% -5%,rgba(91,43,244,.05),transparent 28%),
    linear-gradient(180deg,#FAFBFD 0%,#F6F8FC 54%,#F3F6FA 100%) !important;
  color:#0B1533 !important;
}

.light:has([data-proveedores-version]),
body:has(.light):has([data-proveedores-version]){
  background:#F6F8FC !important;
}

.light [data-proveedores-version] .card,
body:has(.light) [data-proveedores-version] .card{
  background:#FFFFFF !important;
  color:#0B1533 !important;
  border-color:#DCE3EE !important;
  box-shadow:0 4px 14px rgba(24,39,75,.055) !important;
}

.light [data-proveedores-version] .fld,
.light [data-proveedores-version] input,
.light [data-proveedores-version] select,
.light [data-proveedores-version] textarea,
body:has(.light) [data-proveedores-version] .fld,
body:has(.light) [data-proveedores-version] input,
body:has(.light) [data-proveedores-version] select,
body:has(.light) [data-proveedores-version] textarea{
  background:#FFFFFF !important;
  color:#0B1533 !important;
  border-color:#C9D4E4 !important;
  -webkit-text-fill-color:#0B1533;
}

.light [data-proveedores-version] [style*="background: var(--panel2)"],
.light [data-proveedores-version] [style*="background:var(--panel2)"],
body:has(.light) [data-proveedores-version] [style*="background: var(--panel2)"],
body:has(.light) [data-proveedores-version] [style*="background:var(--panel2)"]{
  background:#F2F5FA !important;
}

.light [data-proveedores-version] [style*="color: var(--txt)"],
.light [data-proveedores-version] [style*="color:var(--txt)"],
body:has(.light) [data-proveedores-version] [style*="color: var(--txt)"],
body:has(.light) [data-proveedores-version] [style*="color:var(--txt)"]{
  color:#0B1533 !important;
}

@media (max-width:860px){
  .light [data-proveedores-version],
  body:has(.light) [data-proveedores-version]{
    padding:12px 11px 24px !important;
    min-height:calc(100dvh - 52px);
  }
}
