/* 2Ø2 Procurement · estilos base. Mismos tokens y componentes que 202-pos css/pos.css (tema monocromo 2Ø2: negro con texto blanco en claro y
   blanco con texto negro en oscuro, --pri-tx), solo lo que usa index.html: botones, tarjetas, chips, tabla, avisos. Lo propio de la página está en su <style>. */
:root{
  --f-b:"Geist","Inter","SF Pro Text",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --fondo:#f5f5f4; --panel:#ffffff; --panel-2:#f7f7f6; --hover:#efefed; --linea:#e7e7e4; --linea-2:#d7d7d3;
  --tinta:#0a0a0b; --suave:#6e6e73; --sub:#6e6e73; --tenue:#a1a1a6;
  --pri:#0a0a0b; --pri-tx:#fff;
  --ok:#16a34a; --mal:#e11d48; --av:#f59e0b;
  --ok-t:#15803d; --mal-t:#be123c; --av-t:#b45309; --pri-t:#3f3f46;
  --radio:16px; --radio-s:12px;
  --sombra:0 1px 2px rgba(10,10,11,.04),0 2px 8px rgba(10,10,11,.05); --sombra-2:0 12px 32px rgba(10,10,11,.12),0 2px 6px rgba(10,10,11,.06);
  font-family:var(--f-b); color:var(--tinta); font-size:15px; color-scheme:light; -webkit-font-smoothing:antialiased;
}
@media (prefers-color-scheme:dark){
  :root:not([data-tema="claro"]){
    --fondo:#050506; --panel:#0f0f10; --panel-2:#141416; --hover:#1c1c1e; --linea:#232325; --linea-2:#303033;
    --tinta:#f5f5f4; --suave:#a1a1a6; --sub:#a1a1a6; --tenue:#6e6e73; --pri:#f5f5f4; --pri-tx:#0a0a0b;
    --ok-t:#86efac; --mal-t:#fda4af; --av-t:#fcd34d; --pri-t:#d4d4d8;
    --sombra:0 1px 2px rgba(0,0,0,.4),0 2px 10px rgba(0,0,0,.25); --sombra-2:0 18px 40px rgba(0,0,0,.55); color-scheme:dark;
  }
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--fondo)}
body{-webkit-tap-highlight-color:transparent;color:var(--tinta)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid color-mix(in srgb,var(--pri) 45%,transparent);outline-offset:2px}
[hidden]{display:none !important}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 16px;border-radius:14px;border:1px solid var(--linea);background:var(--panel);cursor:pointer;font-weight:600;white-space:nowrap;text-decoration:none;user-select:none;transition:background .15s,border-color .15s,transform .05s;box-shadow:var(--sombra)}
.btn:hover{background:var(--hover)} .btn:active{transform:scale(.98)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn.primario{background:var(--pri);border-color:transparent;color:var(--pri-tx);box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 6px 18px rgba(10,10,11,.16)}
.btn.primario:hover{background:color-mix(in srgb,var(--pri) 86%,var(--panel))}
.btn.peligro{background:var(--panel);border-color:color-mix(in srgb,var(--mal) 35%,var(--linea));color:var(--mal-t)} .btn.peligro:hover{background:color-mix(in srgb,var(--mal) 9%,var(--panel))}
.btn.ghost{background:transparent;box-shadow:none} .btn.ghost:hover{background:var(--hover)}
.btn.chico{min-height:36px;padding:0 11px;font-size:13px;border-radius:10px}

/* Tarjetas, notas y chips */
.p-card{background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);padding:16px;box-shadow:var(--sombra)}
.p-card h3{margin:0 0 10px;font-size:15px;display:flex;gap:8px;align-items:center}
.p-nota{color:var(--suave);font-size:13.5px;margin:6px 0 12px;line-height:1.5}
.p-vacio{color:var(--suave);text-align:center;padding:32px 12px;list-style:none}
.p-chip{display:inline-flex;align-items:center;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:600;background:var(--hover);color:var(--suave);white-space:nowrap}
.p-chip.verde{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok-t)} .p-chip.rojo{background:color-mix(in srgb,var(--mal) 14%,transparent);color:var(--mal-t)}
.p-chip.azul{background:color-mix(in srgb,var(--pri) 10%,transparent);color:var(--pri-t)} .p-chip.amarillo{background:color-mix(in srgb,var(--av) 18%,transparent);color:var(--av-t)}

/* Tabla */
.pt-scroll{overflow:auto;background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio)}
.pt{width:100%;border-collapse:collapse;font-size:14px}
.pt th{background:var(--panel-2);text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--suave);padding:11px 12px;border-bottom:1px solid var(--linea);white-space:nowrap;font-weight:600}
.pt td{padding:11px 12px;border-bottom:1px solid var(--linea);vertical-align:top}
.pt tbody tr:last-child td{border-bottom:0}

/* Avisos */
#pos-toasts{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:200;pointer-events:none}
.pt-toast{background:#111827;color:#fff;padding:12px 18px;border-radius:12px;box-shadow:var(--sombra-2);font-weight:600;max-width:92vw;animation:tIn .2s ease-out}
.pt-toast.error{background:var(--mal)}
@keyframes tIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}