/* FLYDISH · Sala viva — sistema visual común de las secciones de servicio.
   Noche de sala (fondo), pizarra (paneles), vela (lo que está vivo), latón (lo
   valioso y premium), papel de comanda (tickets), vino (urgente), albahaca (ok). */
:root{
 --sk-noche:#070b14;--sk-pizarra:#0f1522;--sk-pizarra2:#141c2c;--sk-linea:rgba(255,255,255,.085);--sk-linea2:rgba(255,255,255,.16);
 --sk-texto:#eef2f8;--sk-tenue:#93a0b5;--sk-vela:#56dfff;--sk-laton:#d9b26a;--sk-oro:#f7d77c;--sk-papel:#f2ede1;--sk-tinta:#1d1b17;
 --sk-vino:#e0566b;--sk-albahaca:#5cd69b;--sk-ambar:#f2b544;
 --sk-display:"Palatino Linotype","Book Antiqua",Palatino,"Iowan Old Style",Georgia,serif;
 --sk-cuerpo:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
 --sk-mono:"Cascadia Mono","SF Mono",Consolas,"Liberation Mono",ui-monospace,monospace;
 --sk-r:16px;--sk-r2:22px;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--sk-noche);color:var(--sk-texto);font:15px/1.5 var(--sk-cuerpo);-webkit-font-smoothing:antialiased}
body.sk{min-height:100vh;background:radial-gradient(1200px 600px at 85% -10%,rgba(86,223,255,.07),transparent 60%),radial-gradient(900px 500px at -10% 110%,rgba(217,178,106,.06),transparent 60%),var(--sk-noche)}
.sk-main{max-width:1440px;margin:0 auto;padding:22px clamp(14px,2.4vw,32px) 120px}
a{color:var(--sk-vela)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--sk-vela);outline-offset:2px;border-radius:6px}
/* ---------- cabecera ---------- */
.sk-cab{display:flex;gap:18px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--sk-linea);margin-bottom:18px}
.sk-ceja{font:600 11px/1 var(--sk-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--sk-tenue);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sk-demo{font:800 10px/1 var(--sk-mono);letter-spacing:.14em;padding:4px 7px;border-radius:6px;color:#04101e;background:var(--sk-vela)}
.sk-h1{font:400 clamp(28px,3.4vw,40px)/1.05 var(--sk-display);font-variant:small-caps;letter-spacing:.04em;margin:8px 0 6px}
.sk-rol{max-width:820px;color:#c9d2e1;margin:0}
.sk-vivo{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.sk-pulso{display:inline-flex;align-items:center;gap:8px;font:600 12px var(--sk-mono);color:var(--sk-tenue);padding:7px 11px;border:1px solid var(--sk-linea);border-radius:999px;background:rgba(255,255,255,.02)}
.sk-pulso i{width:8px;height:8px;border-radius:50%;background:var(--sk-albahaca);box-shadow:0 0 0 0 rgba(92,214,155,.6);animation:skLatido 2s infinite}
.sk-pulso.mal i{background:var(--sk-vino);animation:none}
@keyframes skLatido{70%{box-shadow:0 0 0 8px rgba(92,214,155,0)}100%{box-shadow:0 0 0 0 rgba(92,214,155,0)}}
/* ---------- conexiones (qué toca esta sección) ---------- */
.sk-conex{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px;align-items:center}
.sk-conex span{font:600 11px var(--sk-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sk-tenue);margin-right:4px}
.sk-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;border:1px solid var(--sk-linea2);color:var(--sk-texto);text-decoration:none;font-size:13px;background:rgba(255,255,255,.02)}
.sk-chip:hover{border-color:var(--sk-vela);color:#fff}
.sk-chip b{font-weight:700;color:var(--sk-vela)}
/* ---------- botones ---------- */
.sk-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:8px 14px;border-radius:11px;border:1px solid var(--sk-linea2);background:rgba(255,255,255,.04);color:var(--sk-texto);font-weight:600;font-size:14px;cursor:pointer;text-decoration:none;white-space:nowrap}
.sk-btn:hover{border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.07)}
.sk-btn:disabled{opacity:.45;cursor:not-allowed}
.sk-btn.prim{background:var(--sk-vela);border-color:var(--sk-vela);color:#04101e}
.sk-btn.prim:hover{filter:brightness(1.08)}
.sk-btn.oro{background:linear-gradient(100deg,#fff6d6,var(--sk-oro) 45%,#e5ad3b);border-color:#fff1b8;color:#2a1a00}
.sk-btn.peligro{border-color:rgba(224,86,107,.55);color:#ffb3bf}
.sk-btn.ok{border-color:rgba(92,214,155,.55);color:#b8f5d5}
.sk-btn.peq{min-height:30px;padding:5px 10px;font-size:13px;border-radius:9px}
.sk-btns{display:flex;gap:8px;flex-wrap:wrap}
/* ---------- indicadores ---------- */
.sk-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:18px}
.sk-kpi{padding:14px 16px;border-radius:var(--sk-r);background:var(--sk-pizarra);border:1px solid var(--sk-linea)}
.sk-kpi small{display:block;font:600 11px var(--sk-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sk-tenue)}
.sk-kpi b{display:block;font:500 26px/1.15 var(--sk-mono);margin-top:6px;font-variant-numeric:tabular-nums}
.sk-kpi em{display:block;font-style:normal;font-size:12px;color:var(--sk-tenue);margin-top:2px}
.sk-kpi.alerta{border-color:rgba(224,86,107,.5)} .sk-kpi.alerta b{color:#ff9fb0}
.sk-kpi.oro b{color:var(--sk-oro)}
/* ---------- paneles ---------- */
.sk-panel{background:var(--sk-pizarra);border:1px solid var(--sk-linea);border-radius:var(--sk-r2);padding:18px}
.sk-panel h2{font:400 21px/1.2 var(--sk-display);font-variant:small-caps;letter-spacing:.04em;margin:0 0 4px}
.sk-panel h3{font-size:15px;margin:0 0 6px}
.sk-sub{color:var(--sk-tenue);font-size:13px;margin:0 0 14px}
.sk-grid2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr);gap:16px;align-items:start}
.sk-grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
@media(max-width:980px){.sk-grid2{grid-template-columns:1fr}}
.sk-vacio{padding:26px;text-align:center;color:var(--sk-tenue);border:1px dashed var(--sk-linea2);border-radius:var(--sk-r)}
.sk-vacio b{display:block;color:var(--sk-texto);margin-bottom:4px}
.sk-lista{display:flex;flex-direction:column;gap:8px}
.sk-fila{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:11px 13px;border-radius:13px;background:var(--sk-pizarra2);border:1px solid var(--sk-linea)}
.sk-fila .t{min-width:0}
.sk-fila .t b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-fila .t small{color:var(--sk-tenue)}
.sk-mono{font-family:var(--sk-mono);font-variant-numeric:tabular-nums}
.sk-tenue{color:var(--sk-tenue)}
/* ---------- estados ---------- */
.sk-est{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font:700 11px/1.5 var(--sk-mono);letter-spacing:.06em;text-transform:uppercase;border:1px solid currentColor;white-space:nowrap}
.sk-est.vela{color:var(--sk-vela)} .sk-est.ok{color:var(--sk-albahaca)} .sk-est.ambar{color:var(--sk-ambar)} .sk-est.vino{color:#ff8d9f} .sk-est.tenue{color:var(--sk-tenue)} .sk-est.oro{color:var(--sk-oro)}
/* ---------- tablas ---------- */
.sk-tabla{width:100%;border-collapse:collapse;font-size:14px}
.sk-tabla th{text-align:left;font:600 11px var(--sk-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sk-tenue);padding:8px 10px;border-bottom:1px solid var(--sk-linea)}
.sk-tabla td{padding:10px;border-bottom:1px solid var(--sk-linea);vertical-align:top}
.sk-tabla tr:hover td{background:rgba(255,255,255,.02)}
.sk-scroll{overflow:auto}
/* ---------- formularios y diálogos ---------- */
.sk-campo{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.sk-campo label,.sk-campo .l{font:600 12px var(--sk-mono);letter-spacing:.06em;color:var(--sk-tenue);text-transform:uppercase}
.sk-campo input,.sk-campo select,.sk-campo textarea{width:100%;padding:10px 12px;border-radius:11px;border:1px solid var(--sk-linea2);background:#0b111d;color:var(--sk-texto)}
.sk-campo textarea{min-height:90px;resize:vertical}
.sk-check{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:8px 0}
.sk-check input{margin-top:3px;width:18px;height:18px;accent-color:var(--sk-vela)}
dialog.sk-dlg{border:1px solid var(--sk-linea2);border-radius:var(--sk-r2);background:#0c1220;color:var(--sk-texto);padding:0;width:min(560px,94vw);box-shadow:0 30px 80px rgba(0,0,0,.6)}
dialog.sk-dlg::backdrop{background:rgba(3,6,12,.72);backdrop-filter:blur(4px)}
.sk-dlg form{padding:20px}
.sk-dlg h2{font:400 22px var(--sk-display);font-variant:small-caps;margin:0 0 4px}
.sk-dlg .pie{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.sk-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:2000;max-width:min(560px,92vw)}
/* ---------- latón y papel (la firma de Sala viva) ---------- */
.sk-riel{position:relative;padding-top:18px}
.sk-riel::before{content:"";position:absolute;left:0;right:0;top:4px;height:8px;border-radius:4px;background:linear-gradient(180deg,#f3d99b,#b98a3c 55%,#7d5b22);box-shadow:0 2px 0 rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.6)}
.sk-papel{position:relative;background:var(--sk-papel);color:var(--sk-tinta);border-radius:3px 3px 10px 10px;padding:14px 14px 12px;box-shadow:0 10px 24px rgba(0,0,0,.45);font-family:var(--sk-mono)}
.sk-papel::before{content:"";position:absolute;top:-7px;left:50%;width:34px;height:12px;transform:translateX(-50%);border-radius:3px;background:linear-gradient(180deg,#e9cf8f,#a77b31);box-shadow:0 1px 2px rgba(0,0,0,.4)}
.sk-papel hr{border:0;border-top:1px dashed rgba(29,27,23,.35);margin:9px 0}
.sk-papel .sk-est{border-color:currentColor}
@media(prefers-reduced-motion:reduce){.sk-pulso i{animation:none}}
@media print{body.sk{background:#fff;color:#000}.sk-noimp,.fd-barra,.fd-dock{display:none!important}}
.sk-orbe .sk-orbe-halo{transform-origin:60px 50px;animation:skHalo 3.2s ease-in-out infinite}
.sk-orbe .sk-orbe-chispa{animation:skChispa 4s ease-in-out infinite}
.sk-orbe{filter:drop-shadow(0 6px 18px rgba(247,205,96,.35))}
@keyframes skHalo{0%,100%{opacity:.55;transform:scale(.94)}50%{opacity:1;transform:scale(1.06)}}
@keyframes skChispa{0%,100%{opacity:.2}50%{opacity:.9}}
@media(prefers-reduced-motion:reduce){.sk-orbe .sk-orbe-halo,.sk-orbe .sk-orbe-chispa{animation:none}}

@media(max-width:520px){.sk-kpis{grid-template-columns:repeat(2,1fr);gap:8px}.sk-kpi{padding:11px 12px}.sk-kpi b{font-size:21px}.sk-h1{font-size:28px}.sk-rol{font-size:14px}.sk-panel{padding:14px;border-radius:18px}}
