@charset "UTF-8";
/* 3W Operaciones · estilos principales (extraído de index.html en v4.100) */
@font-face{font-family:"Swarsh Daisy";src:url("fonts/Swarsh_Daisy-Regular.otf") format("opentype");font-weight:400;font-style:normal}
@font-face{font-family:"Swarsh Daisy";src:url("fonts/Swarsh_Daisy-Italic.otf") format("opentype");font-weight:400;font-style:italic}
:root{
  --navy:#0942A8;--royal:#2E5DA3;--sky:#93B8E0;--pale:#BED9F1;--bright:#4FA3F0;
  --ink-900:#0E0E0E;--ink-800:#1A1A1A;--ink-700:#2A2A2A;--ink-600:#3D3D3D;
  --ink-500:#5C5C5C;--ink-400:#8A8A8A;--ink-300:#B5B5B5;--ink-200:#DCDCDC;
  --ink-150:#E6EAF1;--ink-100:#ECEFF4;--ink-50:#F5F8FC;--white:#FFFFFF;
  --ok:#19773F;--warn:#9A5B00;--fail:#B72A18;
  --ok-soft:#E4F4EA;--warn-soft:#FBEFD9;--fail-soft:#F8E3DF;
  /* Paleta de TAGS/ALERTAS de toda la plataforma (decisión 12 jul 2026):
     sólidos e intensos, nada de pasteles. Texto: blanco en rojo/azul,
     tinta oscura del propio matiz en amarillo/verde (contraste AA). */
  --tag-red:#F4313F;--tag-yellow:#F9DA36;--tag-blue:#0B6FFF;--tag-green:#27C466;
  --tag-yellow-ink:#3D3400;--tag-green-ink:#05361A;
  /* Colores de estado del kanban (única fuente: CSS y JS los leen de aquí).
     Sub e imprimiendo oscurecidos un paso para legibilidad (decisión 12 jun) */
  --k-nuevo:#6C4FE0;--k-cola:#2F7FE0;--k-uvdtf:#D6439F;--k-sub:#11A0AF;
  --k-imprimiendo:#CC7E08;--k-preparando:#D96B2B;--k-terminado:#23A55E;--k-urgente:#EE5A24;
  --plan:#2E7D46;--plan-deep:#236138;--plan-soft:#E7F3EC;
  --font-sans:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --font-script:"Swarsh Daisy","Georgia",serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:clip}
*{-webkit-tap-highlight-color:transparent}
body{background:var(--ink-50);color:var(--ink-900);font-family:var(--font-sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;transition:background-color .5s cubic-bezier(0.16,1,0.3,1)}
/* Placeholders legibles (el gris default del navegador no llega a 4.5:1) */
input::placeholder,textarea::placeholder{color:var(--ink-500);opacity:1}
/* Tema Bitácoras: todo el fondo bajo el topbar en navy (solo el top nav queda claro) */
body.theme-bitacoras{background:var(--navy)}

/* ── LOGIN ── */
#login-screen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#001f42 0%,var(--navy) 50%,#1a4a8a 100%);
  padding:24px;
}
.login-card{
  background:var(--white);border-radius:26px;overflow:hidden;
  display:grid;grid-template-columns:1.05fr 1fr;
  width:min(940px,96vw);min-height:540px;box-shadow:0 30px 80px rgba(0,0,0,.35);
}
/* Escenario de los personajes (izquierda) */
.login-stage{position:relative;background:#EDF1F6;display:flex;align-items:center;justify-content:center;padding:30px}
.lg-tag{position:absolute;top:18px;left:20px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8A97AB;font-weight:600}
.lg-chars{width:100%;display:flex;justify-content:center}
/* Cada personaje se inclina hacia el cursor (solo transform, curva fuerte) */
.lg-p{transition:transform .45s cubic-bezier(.23,1,.32,1)}
.lg-p1{transform:translateX(calc(var(--lean,0)*4px))}
.lg-p2{transform:translateX(calc(var(--lean,0)*2.4px))}
.lg-p3{transform:translateX(calc(var(--lean,0)*1.6px))}
.lg-p4{transform:translateX(calc(var(--lean,0)*2px))}
/* Pupilas: siguen el cursor con las vars --lkx/--lky (sin transition: respuesta directa).
   Los brillitos de los ojos oscuros (domo/arco) se mueven a la MITAD para no salirse. */
.pups{transform:translate(var(--lkx,0px),var(--lky,0px))}
.pups.mini{transform:translate(calc(var(--lkx,0px)*.45),calc(var(--lky,0px)*.45))}
/* Switching de caras por mood (data-mood en #login-screen) */
.ojos-shy,.ojos-happy,.b-happy,.b-sad{display:none}
#login-screen[data-mood="shy"] .ojos-open{display:none}
#login-screen[data-mood="shy"] .ojos-shy{display:block}
#login-screen[data-mood="peek"] .pups{transform:translate(2.4px,-2px)}
#login-screen[data-mood="peek"] .pups.mini{transform:translate(1.1px,-1px)}
#login-screen[data-mood="happy"] .ojos-open{display:none}
#login-screen[data-mood="happy"] .ojos-happy{display:block}
#login-screen[data-mood="happy"] .b-neu{display:none}
#login-screen[data-mood="happy"] .b-happy{display:block}
#login-screen[data-mood="sad"] .b-neu{display:none}
#login-screen[data-mood="sad"] .b-sad{display:block}
#login-screen[data-mood="sad"] .lg-p1{transform:translateX(calc(var(--lean,0)*4px)) rotate(-3deg)}
/* Celebración al entrar: saltito suave de todo el grupo (solo transform) */
#login-screen[data-mood="happy"] .lg-chars{animation:lgJoy .7s cubic-bezier(.34,1.2,.4,1)}
@keyframes lgJoy{0%{transform:translateY(0)}30%{transform:translateY(-7px)}55%{transform:translateY(0)}75%{transform:translateY(-3px)}100%{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#login-screen[data-mood="happy"] .lg-chars{animation:none}}
/* Error: sacudida de la tarjeta (misma coreografía de la propuesta) */
.login-card.shake{animation:loginShake .5s cubic-bezier(.36,.07,.19,.97)}
@keyframes loginShake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}
/* Formulario (derecha) */
.login-form-col{padding:44px 46px;display:flex;flex-direction:column;justify-content:center}
/* logo-3w-login.svg = copia del logo con el viewBox RECORTADO al dibujo (el
   original trae el 3W centrado en un lienzo 1000x1000 con muchísimo aire).
   Así el tamaño es real y alinea natural con el texto, sin márgenes mágicos. */
.login-logo{height:42px;width:auto;margin:0 0 20px;display:block;align-self:flex-start}
.login-title{font-size:26px;font-weight:800;color:var(--navy);margin:0 0 4px}
.login-sub{font-size:14px;color:#7B879B;margin:0 0 24px}
.login-eye{position:absolute;right:6px;bottom:6px;background:none;border:none;cursor:pointer;padding:6px;line-height:0;border-radius:8px;transition:transform .16s cubic-bezier(.23,1,.32,1)}
.login-eye:active{transform:scale(.9)}
.login-foot{font-size:12.5px;color:#98A2B3;text-align:center;margin:18px 0 0}
.login-foot b{color:var(--navy)}
@media(max-width:720px){
  .login-card{grid-template-columns:1fr;min-height:0}
  .login-stage{display:none}
  .login-form-col{padding:40px 30px}
}
.field{margin-bottom:16px}
.field label{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-600);margin-bottom:6px}
.field input{
  width:100%;padding:11px 14px;border:1.5px solid var(--ink-200);border-radius:6px;
  font-family:var(--font-sans);font-size:14px;color:var(--ink-900);outline:none;
  transition:border-color .15s;background:var(--white);
}
.field input:focus{border-color:var(--navy)}
.btn-login{
  width:100%;padding:14px;background:var(--navy);color:var(--white);border:none;
  border-radius:999px;font-family:var(--font-sans);font-size:15px;font-weight:700;
  cursor:pointer;transition:background .2s,transform .16s cubic-bezier(.23,1,.32,1);margin-top:8px;
}
.btn-login:hover{background:#002551}
.btn-login:active:not(:disabled){transform:scale(.98)}
.btn-login:disabled{opacity:.6;cursor:not-allowed}
.login-error{
  background:var(--fail);border:none;border-radius:10px;
  padding:11px 14px;font-size:13px;font-weight:600;color:#fff;margin-bottom:16px;display:none;
}

/* ── TOPBAR ── */
.topbar{
  height:72px;background:var(--white);border-bottom:1px solid transparent;
  display:flex;align-items:center;padding:0 28px;gap:20px;
  position:sticky;top:0;z-index:50;
}
.brand{display:flex;align-items:center;gap:14px;height:100%}
.brand .logo{height:64px;width:auto;cursor:pointer;transition:opacity .15s}
.brand .logo:hover{opacity:.78}
.brand .logo:active{opacity:.55}

/* Transición suave al recargar el panel desde el logo */
body.page-reloading{transition:opacity .45s cubic-bezier(0.4,0,0.2,1), filter .45s ease}
body.page-reloading.fade-out{opacity:0;filter:blur(2px)}
.brand .sep{width:1px;height:22px;background:var(--ink-200)}
.brand .label .top{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-500);display:block}
.brand .label .bot{font-size:14px;font-weight:700;color:var(--ink-900);display:block}
.spacer{flex:1}
/* ── Nav de módulos (topbar): solo iconos; el activo despliega su nombre ── */
.icon-nav{display:flex;gap:4px;background:var(--white);border:1px solid var(--ink-200);border-radius:999px;
  padding:5px;box-shadow:0 2px 8px rgba(3,36,74,.08);overflow-x:auto;scrollbar-width:none;max-width:54vw}
.icon-nav::-webkit-scrollbar{display:none}
.icon-nav button{display:flex;align-items:center;height:40px;min-width:40px;justify-content:center;
  padding:0 10px;border:none;border-radius:999px;background:none;color:var(--ink-600);cursor:pointer;
  font-family:inherit;flex-shrink:0;transition:background-color .35s ease,color .35s ease,transform .16s cubic-bezier(.23,1,.32,1)}
.icon-nav button i{width:19px;height:19px}
.icon-nav button:not(.on):hover{background:var(--ink-50);color:var(--navy)}
.icon-nav button:active{transform:scale(.94)}
/* Despliegue del nombre: suave y leve (curva de drawer iOS, sin apuro) */
.icon-nav .nl{max-width:0;overflow:hidden;white-space:nowrap;opacity:0;font-size:13.5px;font-weight:700;margin-left:0;
  transition:max-width .55s cubic-bezier(.32,.72,0,1),opacity .42s ease,margin-left .55s cubic-bezier(.32,.72,0,1)}
.icon-nav button.on{background:var(--navy);color:#fff}
.icon-nav button.on .nl{max-width:150px;opacity:1;margin-left:8px}
body.theme-bitacoras .icon-nav{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
body.theme-bitacoras .icon-nav button{color:rgba(255,255,255,.72)}
body.theme-bitacoras .icon-nav button:not(.on):hover{background:rgba(255,255,255,.12);color:#fff}
body.theme-bitacoras .icon-nav button.on{background:#fff;color:var(--navy)}
@media(prefers-reduced-motion:reduce){.icon-nav .nl{transition:none}}
@media(max-width:1024px){.icon-nav{display:none}}
.week-badge{
  display:inline-flex;align-items:center;gap:8px;padding:7px 16px;
  background:#F7F7F7;border:none;border-radius:999px;
  color:var(--ink-700);font-size:12px;font-weight:600;
  white-space:nowrap;   /* nunca partir "SEM 29" ni la fecha en dos líneas */
}
.week-badge .pulse{width:6px;height:6px;background:var(--ok);border-radius:50%;box-shadow:0 0 0 3px rgba(31,138,76,.15)}
.week-badge .num{color:var(--navy);font-weight:700}
.week-badge .range{color:var(--ink-500);font-weight:500}
/* Cuando el topbar se aprieta, la fecha cede antes de descuadrar el chip */
@media(max-width:1150px){.week-badge .range{display:none}}
.suc-toggle{display:flex;background:#F7F7F7;border-radius:999px;padding:4px;gap:3px}
.suc-btn{padding:8px 24px;border:none;border-radius:999px;font-family:var(--font-sans);font-size:13px;font-weight:700;cursor:pointer;background:transparent;color:var(--ink-500);transition:all .2s;letter-spacing:.01em}
.suc-btn.active{background:var(--navy);color:#fff;box-shadow:0 3px 10px -2px rgba(0,51,106,.4)}
.suc-btn:not(.active){color:var(--navy)}
.suc-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500)}
.icon-btn{
  position:relative;width:34px;height:34px;display:grid;place-items:center;
  border-radius:8px;border:1px solid var(--ink-200);background:var(--white);
  color:var(--ink-600);cursor:pointer;transition:border-color .15s,color .15s,transform .12s cubic-bezier(0.23,1,0.32,1);
}
.icon-btn:hover{color:var(--navy);border-color:var(--ink-300)}
.user-chip{
  display:flex;align-items:center;gap:10px;padding:3px 12px 3px 3px;
  border:1px solid var(--ink-200);border-radius:999px;cursor:pointer;background:var(--white);
  transition:border-color .15s;
}
.user-chip:hover{border-color:var(--ink-300)}
.avatar{
  position:relative;
  width:28px;height:28px;border-radius:50%;background:var(--navy);color:var(--white);
  font-weight:700;font-size:11px;display:grid;place-items:center;letter-spacing:.02em;
}
/* Estado en planta (Odoo hr.attendance) en la esquina del avatar:
   verde = fichado · lunita gris = fuera · nada = sin dato de Odoo */
.pres-dot{position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;border:2.5px solid var(--white);box-shadow:0 1px 3px rgba(0,0,0,.25);pointer-events:none;display:grid;place-items:center}
.pres-dot.en{background:#22D366}
.pres-dot.fuera{background:var(--ink-400)}
.pres-dot.fuera svg{width:9px;height:9px;color:#fff}
.mp-avatar .pres-dot{width:18px;height:18px;border-width:3px}
.mp-avatar .pres-dot.fuera svg{width:11px;height:11px}
.rkp-card .rk-ava .pres-dot{width:20px;height:20px;border-width:3px;top:2px;right:2px}
.rkp-card .rk-ava .pres-dot.fuera svg{width:12px;height:12px}
/* El avatar grande del hub (móvil) lleva el punto más grande para que se lea */
.hub-ava .pres-dot{width:18px;height:18px;border-width:3px}
.hub-ava .pres-dot.fuera svg{width:11px;height:11px}
/* De vacaciones: solcito en vez del punto de presencia */
.pres-dot.vacaciones{background:#FF9F1C}
.pres-dot.vacaciones svg{width:10px;height:10px;color:#fff;display:block}
.mp-avatar .pres-dot.vacaciones svg,.hub-ava .pres-dot.vacaciones svg{width:12px;height:12px}
.rkp-card .rk-ava .pres-dot.vacaciones svg{width:13px;height:13px}
/* Nombre atenuado cuando la persona no está disponible (vacaciones) */
.rk-tops-nm.no-disp,.rk-nom.no-disp span{color:var(--ink-400)}
.user-chip .who{font-size:12px;font-weight:600;line-height:1;color:var(--ink-900)}
.user-chip .role{font-size:10px;color:var(--ink-500);margin-top:3px;line-height:1}

/* ── PAGE ── */
.page{max-width:1280px;margin:0 auto;padding:32px 28px 56px}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--navy);margin-bottom:12px}
.eyebrow .bar{width:18px;height:2px;background:var(--navy)}
.page-title{margin:0;font-size:36px;font-weight:700;letter-spacing:-.025em;line-height:1.05;color:var(--ink-900)}
.page-title .script{font-family:var(--font-script);font-style:italic;font-weight:400;color:var(--navy);font-size:38px;letter-spacing:0;margin:0 4px 0 5px;line-height:1;display:inline-block;vertical-align:middle}
.page-sub{margin:10px 0 0;color:var(--ink-500);font-size:14px}
.actions{display:flex;gap:8px}
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:9px 14px;white-space:nowrap;
  background:var(--white);border:1px solid var(--ink-200);border-radius:8px;
  color:var(--ink-800);font-size:13px;font-weight:600;cursor:pointer;
  transition:border-color .15s,background-color .15s,color .15s,transform .12s cubic-bezier(0.23,1,0.32,1);text-decoration:none;font-family:var(--font-sans);
}
.btn:hover{border-color:var(--ink-400);background:var(--ink-50)}
.btn.primary{background:var(--navy);color:var(--white);border-color:var(--navy)}
.btn.primary:hover{background:#002551;border-color:#002551}
.btn i{width:14px;height:14px}

/* ── TABS ── */
.tabs{display:flex;border-bottom:1px solid var(--ink-200);margin-bottom:28px;overflow-x:auto}
.tab{
  padding:14px 18px 12px;font-size:13px;font-weight:600;color:var(--ink-500);
  border:none;background:transparent;cursor:pointer;position:relative;
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  transition:color .15s;font-family:var(--font-sans);
}
.tab i{width:15px;height:15px}
.tab:hover{color:var(--ink-800)}
.tab.active{color:var(--navy)}
.tab .tab-count{background:var(--ink-100);color:var(--ink-600);font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;margin-left:2px}
.tab.active .tab-count{background:var(--navy);color:var(--white)}

/* ── CARD ── */
.card{background:var(--white);border:none;border-radius:10px;padding:22px 24px;box-shadow:0 1px 2px rgba(16,16,16,.04), 0 6px 16px -10px rgba(16,16,16,.12)}
.card.tight{padding:0}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.card-title{margin:0;font-size:14px;font-weight:700;letter-spacing:-.005em;color:var(--ink-900);display:flex;align-items:center;gap:8px}
.card-title i{width:15px;height:15px;color:var(--navy)}
.card-meta{font-size:11px;font-weight:600;color:var(--ink-500);letter-spacing:.06em;text-transform:uppercase;text-align:right}
.card-link{font-size:12px;color:var(--navy);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:4px}
.card-link:hover{text-decoration:underline}
.card-link i{width:12px;height:12px}

/* ── KPIs ── */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}
/* Equipos quedó con 3 KPIs (sin tinta): 3 en desktop; en móvil 2 columnas con Tasa a lo ancho (compacto, no más alto que el viejo 2×2) */
[data-panel="equipos"] .kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:640px){
  [data-panel="equipos"] .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  [data-panel="equipos"] #kpi-tasa-card{grid-column:1/-1}
}
/* FAB de Nuevo registro: SOLO móvil, flotante abajo-derecha SOBRE el bottom-nav (no lo estorba); vive dentro del panel equipos → solo aparece en Registros */
.eq-fab{display:none}
.prod-fab{display:none}
@media(max-width:600px){
  /* Solo en el módulo Registros (equipos activo) — el FAB vive fuera de los paneles */
  body:has(.panel[data-panel="equipos"].active) .eq-fab{display:flex;align-items:center;justify-content:center;position:fixed;right:16px;bottom:calc(108px + env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:50%;border:none;background:var(--bright);color:#fff;cursor:pointer;z-index:44;box-shadow:0 10px 24px -6px rgba(79,163,240,.6);animation:fabIn .28s cubic-bezier(.23,1,.32,1);transition:transform .12s cubic-bezier(.23,1,.32,1),background-color .15s}
  .eq-fab:active{transform:scale(.9)}
  .eq-fab i,.eq-fab svg{width:24px;height:24px}
  /* En móvil el FAB reemplaza al botón inline "Nuevo registro" (ya no tiene sentido tenerlo arriba) */
  #eq-nuevo-reg{display:none}
}
/* FAB de Nuevo pedido (v4.143): TODOS los tamaños, azul #0B6FFF, abajo a la
   derecha; solo en Producción + sub-vista Tablero. En móvil sube sobre el bottom-nav. */
body:has(.panel[data-panel="produccion"].active):has([data-prodview="tablero"].active) .prod-fab{display:flex;align-items:center;justify-content:center;position:fixed;right:24px;bottom:26px;width:60px;height:60px;border-radius:50%;border:none;background:#0B6FFF;color:#fff;cursor:pointer;z-index:44;box-shadow:0 12px 28px -6px rgba(11,111,255,.55);animation:fabIn .28s cubic-bezier(.23,1,.32,1);transition:transform .12s cubic-bezier(.23,1,.32,1),background-color .15s}
.prod-fab:hover{background:#0757CC}
.prod-fab:active{transform:scale(.9)}
.prod-fab i,.prod-fab svg{width:28px;height:28px}
@media(max-width:600px){
  body:has(.panel[data-panel="produccion"].active):has([data-prodview="tablero"].active) .prod-fab{right:16px;bottom:calc(108px + env(safe-area-inset-bottom,0px));width:56px;height:56px}
}
@keyframes fabIn{from{opacity:0;transform:scale(.6) translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.eq-fab,.prod-fab{animation:none}}
.kpi{background:var(--white);border:none;border-radius:10px;padding:18px 20px 16px;box-shadow:0 1px 2px rgba(16,16,16,.04), 0 6px 16px -10px rgba(16,16,16,.12)}
.kpi-label{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500)}
.kpi-row{display:flex;align-items:baseline;justify-content:space-between;margin-top:12px}
.kpi-num{font-size:34px;font-weight:700;letter-spacing:-.025em;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink-900)}
.kpi-unit{font-size:13px;color:var(--ink-500);font-weight:500;margin-left:4px}
.delta{display:inline-flex;align-items:center;gap:3px;font-weight:700;font-size:11px;padding:3px 7px;border-radius:3px}
.delta.up{background:var(--ok-soft);color:var(--ok)}
.delta.down{background:var(--fail-soft);color:var(--fail)}
.delta.flat{background:var(--ink-100);color:var(--ink-500)}
.delta i{width:11px;height:11px}
.kpi-foot{margin-top:10px;font-size:12px;color:var(--ink-500)}

/* ── STATUS ── */
.status{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:4px 9px 4px 8px;border-radius:3px;border:1px solid transparent}
.status .dot{width:6px;height:6px;border-radius:50%}
.status.ok{background:var(--ok-soft);color:var(--ok);border-color:#C8E6D2}
.status.ok .dot{background:var(--ok)}
.status.warn{background:var(--warn-soft);color:var(--warn);border-color:#F2DCAE}
.status.warn .dot{background:var(--warn)}
.status.fail{background:var(--fail-soft);color:var(--fail);border-color:#ECBFB8}
.status.fail .dot{background:var(--fail);animation:pulse-dot 1.5s ease-in-out infinite}
@keyframes pulse-dot{0%,100%{box-shadow:0 0 0 0 rgba(200,50,31,.45)}50%{box-shadow:0 0 0 5px rgba(200,50,31,0)}}

/* ── OP DOT ── */
.op{display:inline-flex;align-items:center;gap:8px;color:var(--ink-700);font-size:13px}
.op-dot{width:22px;height:22px;border-radius:50%;color:var(--white);font-size:10px;font-weight:700;display:grid;place-items:center;flex-shrink:0}

/* ── TWO-COL ── */
.two-col{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}

/* ── PANEL ── */
.panel{display:none}
.panel.active{display:block}

/* ── RESUMEN ── */
.quick-list{display:flex;flex-direction:column}
.quick-row{display:grid;grid-template-columns:32px 1fr auto;gap:12px;padding:14px 0;border-bottom:1px solid var(--ink-150);align-items:center}
.quick-row:last-child{border-bottom:none;padding-bottom:0}
.quick-row:first-child{padding-top:0}
.quick-ic{width:30px;height:30px;border-radius:4px;background:var(--ink-50);color:var(--ink-700);display:grid;place-items:center}
.quick-ic.fail{background:var(--fail-soft);color:var(--fail)}
.quick-ic.warn{background:var(--warn-soft);color:var(--warn)}
.quick-ic.info{background:#E4EEF8;color:var(--royal)}
.quick-ic.ok{background:var(--ok-soft);color:var(--ok)}
.quick-ic i{width:14px;height:14px}
.quick-title{font-size:13px;font-weight:600;color:var(--ink-900);line-height:1.35;margin-bottom:3px}
.quick-meta{font-size:11px;color:var(--ink-500)}
.quick-time{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-500);font-family:var(--font-mono)}
.focus-card{display:flex;flex-direction:column;gap:16px}
.focus-equipo{display:grid;grid-template-columns:44px 1fr auto;gap:14px;padding:18px 20px;background:var(--ink-50);border:none;border-radius:10px;align-items:center;cursor:pointer;transition:transform .2s cubic-bezier(0.16,1,0.3,1), box-shadow .2s ease}
.focus-equipo.fail{background:linear-gradient(135deg,#C8321F 0%,#E04D35 100%)}
.focus-equipo.warn{background:linear-gradient(135deg,#D6A21E 0%,#F2CE4C 100%)}
/* En el amarillo el texto va oscuro para que se lea bien */
.focus-equipo.warn .focus-equipo-name{color:var(--ink-900)}
.focus-equipo.warn .focus-equipo-sub{color:var(--ink-800)}
.focus-equipo:hover{transform:translateY(-3px)}
.focus-equipo.fail:hover{box-shadow:0 14px 30px -12px rgba(200,50,31,.55)}
.focus-equipo.warn:hover{box-shadow:0 14px 30px -12px rgba(214,162,30,.55)}
.focus-equipo:active{transform:translateY(-1px) scale(0.995)}
.focus-equipo:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.focus-equipo-name{font-size:15px;font-weight:700;color:#fff}
.focus-equipo-sub{font-size:12.5px;color:rgba(255,255,255,.88);margin-top:3px;line-height:1.4}
.focus-equipo-ic{width:44px;height:44px;border-radius:9px;background:var(--white);border:none;color:var(--ink-700);display:grid;place-items:center}
.focus-equipo.fail .focus-equipo-ic{color:var(--fail)}
.focus-equipo.warn .focus-equipo-ic{color:var(--warn)}
.focus-equipo-ic i{width:20px;height:20px}
/* Acciones (estado + resolver) apiladas, mismo ancho */
.focus-equipo-actions{display:flex;flex-direction:column;gap:8px;align-items:stretch;min-width:104px}
/* Badge y botón en blanco para resaltar sobre el fondo intenso */
.focus-equipo-actions .status{justify-content:center;padding:6px 12px;font-size:11px;border:none}
.focus-equipo-actions .status.fail{background:var(--white);color:var(--fail)}
.focus-equipo-actions .status.warn{background:var(--white);color:var(--warn)}
.focus-equipo-actions .btn-resolver{padding:8px 12px;font-size:12px;text-align:center;background:var(--white);border-color:var(--ok)}
.focus-equipo-actions .btn-resolver:hover{background:var(--ok);color:var(--white)}
.btn-resolver{
  padding:5px 10px;border:1.5px solid var(--ok);border-radius:5px;
  background:var(--ok-soft);color:var(--ok);
  font-family:var(--font-sans);font-size:11px;font-weight:700;cursor:pointer;
  white-space:nowrap;transition:all .15s;line-height:1;
}
.btn-resolver:hover{background:var(--ok);color:var(--white)}
.empty-state{text-align:center;padding:32px 20px;color:var(--ink-500);font-size:13px}

/* ── EQUIPOS ── */
.filter-row{display:flex;gap:8px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;background:var(--white);border:1px solid var(--ink-200);border-radius:999px;color:var(--ink-700);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;font-family:var(--font-sans)}
.chip:hover{border-color:var(--ink-400)}
.chip.active{background:var(--navy);border-color:var(--navy);color:var(--white)}
.chip i{width:12px;height:12px}
.chip-count{background:var(--ink-100);color:var(--ink-600);font-size:10px;padding:1px 6px;border-radius:999px}
.chip.active .chip-count{background:rgba(255,255,255,.18);color:var(--white)}
.search{margin-left:auto;position:relative}
.search input{padding:10px 14px 10px 36px;border:none;border-radius:999px;font-family:var(--font-sans);font-size:13px;width:240px;background:var(--ink-100);color:var(--ink-900);outline:none;transition:background .15s,box-shadow .15s}
.search input:focus{background:var(--white);box-shadow:0 0 0 3px rgba(79,163,240,.3)}
/* X para borrar la búsqueda de un toque (Producción): solo el icono, sin círculo */
.search-x{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:none;background:transparent;color:var(--ink-500);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:color .15s,transform .12s;padding:0}
.search-x:hover{color:var(--ink-900)}
.search-x:active{transform:translateY(-50%) scale(.85)}
.search-x svg{width:14px;height:14px}
.search input{padding-right:34px}
/* Equipos: búsqueda + filtros colapsables tras el icono (mismo patrón y animación que Producción) */
#eq-pf-zone{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
#eq-pf-zone #eq-period{flex-shrink:0}
#eq-pf-zone .search{flex:1 1 220px;margin-left:0;min-width:0;max-width:420px;position:relative}
#eq-pf-zone .search input{width:100%}
#eq-pf-zone .pf-btn{flex-shrink:0}
/* Chips de filtro: ocultos; al tocar el icono se despliegan INLINE junto a él (no fila completa) con la animación de Producción */
#eq-filtros{display:none;margin:0}
#eq-filtros.open{display:flex;align-items:center;gap:8px;animation:pfSlide .45s cubic-bezier(.16,1,.3,1)}
#eq-pf-dot{display:none;position:absolute;top:-2px;right:-2px;width:10px;height:10px;border-radius:50%;background:#E8590C;border:2px solid var(--white)}
/* Móvil: SEM/MES en su propia fila (ancho completo); abajo la búsqueda + el icono de filtros; los chips se despliegan en una 3ª fila */
@media(max-width:640px){
  #eq-pf-zone #eq-period{flex:0 0 100%;order:0}
  #eq-pf-zone #eq-period .period-btn{flex:1}
  #eq-pf-zone .search{flex:1 1 0;min-width:0;max-width:none;order:1}
  #eq-pf-zone .pf-btn{order:2}
  #eq-filtros.open{flex:0 0 100%;order:3;flex-wrap:wrap}
}
.search i,.search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--ink-500);pointer-events:none}
.equipos-table{background:var(--white);border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(16,16,16,.04), 0 6px 16px -10px rgba(16,16,16,.12)}
.equipos-table .row{display:grid;grid-template-columns:32px 2.2fr 1fr 1fr 1fr 110px 36px;align-items:center;gap:16px;padding:15px 20px;border-bottom:1px solid var(--ink-100);transition:background .12s}
.equipos-table .row:last-child{border-bottom:none}
.equipos-table .row:hover:not(.head){background:var(--ink-50)}
.equipos-table .head{background:var(--ink-50);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);padding:12px 20px}
.group-head{display:flex;align-items:center;gap:12px;padding:14px 20px 8px;background:transparent;font-size:11px;font-weight:700;color:var(--ink-500);letter-spacing:.1em;text-transform:uppercase}
.group-head .count{background:var(--ink-100);color:var(--ink-700);padding:1px 8px;border-radius:999px;font-size:10.5px}
.group-head .line{flex:1;height:1px;background:var(--ink-100)}
.eq-ic{width:34px;height:34px;border-radius:8px;background:var(--ink-50);color:var(--navy);display:grid;place-items:center}
.eq-ic i{width:17px;height:17px}
.eq-name{font-size:14px;font-weight:700;color:var(--ink-900);letter-spacing:-.005em}
.eq-sub{font-size:12px;color:var(--ink-500);margin-top:2px;font-family:var(--font-mono)}
.eq-cell{font-size:13px;color:var(--ink-700)}
.eq-cell.muted{color:var(--ink-500)}
.eq-time{font-size:11.5px;color:var(--ink-500);font-family:var(--font-mono)}
.eq-chev{color:var(--ink-400);width:18px;height:18px;transition:color .12s}
.equipos-table .row:hover .eq-chev{color:var(--navy)}
.equipos-table .row:not(.head){cursor:pointer}

/* ── HISTORIAL EQUIPO (detail modal) ── */
.hist-row{display:grid;grid-template-columns:86px 1fr auto;gap:12px;padding:13px 0;border-bottom:1px solid var(--ink-150);align-items:start}
.hist-row:last-child{border-bottom:none;padding-bottom:0}
.hist-row:first-child{padding-top:0}
.hist-date{font-size:11px;font-weight:700;color:var(--ink-700);font-family:var(--font-mono);padding-top:3px;text-transform:capitalize;line-height:1.4}
.hist-info{min-width:0}
.hist-op{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.hist-nota{font-size:12px;color:var(--ink-600);line-height:1.4;margin-top:3px}
.hist-time{font-size:10px;color:var(--ink-500);font-family:var(--font-mono);margin-top:5px}

/* ── CONSUMO ── */
.chart-wrap{position:relative;height:240px;margin-top:0;min-width:0}
.chart-stats{display:flex;gap:40px;flex-wrap:wrap}
.stat .label{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500)}
.stat .val{font-size:34px;font-weight:800;letter-spacing:-.03em;margin-top:6px;font-variant-numeric:tabular-nums;color:var(--ink-900);line-height:1}
.stat .val .unit{font-size:14px;color:var(--ink-500);font-weight:500;margin-left:4px}
.stat .sub{font-size:11px;color:var(--ink-500);margin-top:4px;display:flex;align-items:center;gap:6px}
/* Pill de tendencia (estilo etiqueta oscura, como el dashboard de referencia) */
.stat .delta{display:inline-flex;align-items:center;gap:4px;margin-top:8px;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--ink-900);color:#fff;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.stat .delta:empty{display:none}
/* Visualización de tinta: donut (composición) + área (tendencia) */
.tinta-viz{display:grid;grid-template-columns:236px 1fr;gap:32px;align-items:center;margin-top:24px}
.donut-wrap{position:relative;width:216px;height:216px;margin:0 auto}
.donut-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.donut-total{font-size:42px;font-weight:800;letter-spacing:-.035em;color:var(--ink-900);font-variant-numeric:tabular-nums;line-height:1}
/* ── Proyección de consumo de tinta ── */
.proy-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.proy-tile{border:1px solid var(--ink-150);border-radius:8px;padding:14px 16px;background:var(--ink-50)}
.proy-tipo{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-600);margin-bottom:8px}
.proy-tipo .sw{width:9px;height:9px;border-radius:3px;flex-shrink:0}
.proy-val{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--ink-900);font-variant-numeric:tabular-nums;line-height:1}
.proy-val .unit{font-size:12px;font-weight:600;color:var(--ink-500);margin-left:3px}
.proy-delta{display:inline-block;margin-top:8px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px}
.proy-delta.up{background:var(--warn-soft);color:var(--warn)}
.proy-delta.down{background:var(--ok-soft);color:var(--ok)}
.proy-delta.flat{background:var(--ink-150);color:var(--ink-600)}
.proy-mes{margin-top:8px;font-size:11.5px;color:var(--ink-500)}
.donut-unit{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);margin-top:7px}
/* Dashboard de materiales: gauge (composición por categoría) + barras ranking */
.mat-dash{display:grid;grid-template-columns:240px 1fr;gap:44px;align-items:start;margin-top:10px}
.mat-gaugecol{display:flex;flex-direction:column;align-items:center}
.mat-cats{display:flex;justify-content:center;flex-wrap:wrap;gap:9px 16px;margin-top:18px}
.mat-cat{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--ink-600)}
.mat-cat .dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.mat-rank{display:flex;flex-direction:column;gap:17px;min-width:0}
.rankbar-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:7px}
.rankbar-name{font-size:13px;font-weight:600;color:var(--ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rankbar-val{font-size:12px;font-weight:700;color:var(--ink-700);font-family:var(--font-mono);flex-shrink:0;font-variant-numeric:tabular-nums}
.rankbar-track{height:9px;background:var(--ink-100);border-radius:999px;overflow:hidden}
.rankbar-fill{display:block;height:100%;border-radius:999px;transition:width .5s cubic-bezier(0.16,1,0.3,1)}
.mat-rank-foot{font-size:11px;color:var(--ink-500);font-weight:600;margin-top:4px;font-family:var(--font-mono)}
@media(max-width:760px){.tinta-viz{grid-template-columns:1fr;gap:22px}.donut-wrap{width:200px;height:200px}.chart-wrap{height:220px}.mat-dash{grid-template-columns:1fr;gap:26px}}
.legend{display:flex;gap:14px;align-items:center}
.legend-item{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-600);font-weight:600}
.legend-item .sw{width:10px;height:10px;border-radius:2px}
.mat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.mat{display:grid;grid-template-columns:24px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--ink-150)}
.mat:nth-last-child(-n+2){border-bottom:none;padding-bottom:0}
.mat-ic{width:24px;height:24px;color:var(--ink-500);display:grid;place-items:center}
.mat-ic i{width:16px;height:16px}
.mat-info{display:flex;flex-direction:column;gap:7px;min-width:0}
.mat-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.mat-name{font-size:13px;font-weight:600;color:var(--ink-900)}
.mat-stock{font-size:11px;color:var(--ink-500);font-family:var(--font-mono);flex-shrink:0}
.mat-stock b{color:var(--ink-800);font-weight:600}
.bar{height:5px;background:var(--ink-100);border-radius:999px;overflow:hidden}
.bar-fill{display:block;height:100%;background:var(--navy);border-radius:999px;transition:width .3s}
.bar.warn .bar-fill{background:var(--warn)}
.bar.fail .bar-fill{background:var(--fail)}
.mat-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:4px}
.mat-bottom .pct{font-size:11px;font-weight:700;color:var(--ink-700);font-variant-numeric:tabular-nums}
.mat-bottom .pct.warn{color:var(--warn)}
.mat-bottom .pct.fail{color:var(--fail)}
.mat-bottom .week-use{font-size:11px;color:var(--ink-500);font-family:var(--font-mono)}
.ink-breakdown{display:flex;flex-direction:column;gap:14px}
.ink-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:baseline}
.ink-row-bar{grid-column:1/-1;margin-top:4px}
.ink-name{font-size:13px;font-weight:600;color:var(--ink-900)}
.ink-val{font-size:13px;font-weight:700;color:var(--ink-900);font-variant-numeric:tabular-nums;font-family:var(--font-mono)}
.ink-val .unit{color:var(--ink-500);font-weight:500;margin-left:2px}
.row-sep{border-top:1px solid var(--ink-150);margin:6px 0}

/* ── MODAL ── */
.modal-overlay{
  position:fixed;inset:0;background:rgba(8,18,38,.55);z-index:200;
  display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;pointer-events:none;transition:opacity .26s cubic-bezier(.23,1,.32,1);
}
.modal-overlay.open{opacity:1;pointer-events:all;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
/* Fondo quieto mientras hay modal abierto (fix descentrado iOS) */
body.modal-abierto{overflow:hidden}
/* Scrollbars sutiles en todo el sitio (la barra gris default se ve fea) */
*::-webkit-scrollbar{width:7px;height:7px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:rgba(0,51,106,.16);border-radius:99px}
*::-webkit-scrollbar-thumb:hover{background:rgba(0,51,106,.28)}
/* Las filas de chips/tabs que se desplazan horizontal no muestran barra */
.filter-row,.tabs,.modal-tabs{scrollbar-width:none}
.filter-row::-webkit-scrollbar,.tabs::-webkit-scrollbar,.modal-tabs::-webkit-scrollbar{display:none}
/* Entrada/salida notoria: el overlay vive por opacidad (no display), así que
   quitar .open anima el cierre solo — sube + escala con ease-out-quint */
.modal{
  background:var(--white);border-radius:22px;width:100%;max-width:520px;
  max-height:90vh;overflow-y:auto;box-shadow:0 24px 70px -12px rgba(0,0,0,.34);
  scrollbar-width:none;-ms-overflow-style:none;
  opacity:0;transform:translateY(14px) scale(.97);
  transition:opacity .15s ease, transform .19s ease;   /* salida rápida (estado base) */
}
.modal::-webkit-scrollbar{display:none}
.modal-overlay.open .modal{opacity:1;transform:none;transition:opacity .26s cubic-bezier(.16,1,.3,1), transform .42s cubic-bezier(.16,1,.3,1)}   /* entrada suave */
@media(prefers-reduced-motion:reduce){.modal{transform:none!important;transition:opacity .15s}}
.modal-header{
  padding:24px 28px 0;display:flex;align-items:center;justify-content:space-between;
  border-bottom:none;padding-bottom:14px;margin-bottom:12px;
}
.modal-title{font-size:16px;font-weight:700;color:var(--ink-900);margin:0}
.modal-close{
  width:32px;height:32px;min-width:32px;flex-shrink:0;border-radius:50%;border:none;
  background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--ink-400);
  transition:background-color .15s,color .15s,transform .12s cubic-bezier(.23,1,.32,1);
}
.modal-close:hover{background:var(--ink-150);color:var(--ink-900)}
.modal-close:active{transform:scale(.92)}
.modal-close i,.modal-close svg{width:16px;height:16px}
/* Acciones del header de Mi perfil: Salir (rojo discreto) + cerrar */
/* Salir y cerrar separados con un divisor para que no se lean pegados */
.mp-head-actions{display:flex;align-items:center;gap:10px}
.mp-head-actions::before{content:none}
.mp-head-actions .modal-close{position:relative}
.mp-head-actions .modal-close::before{content:'';position:absolute;left:-10px;top:50%;transform:translateY(-50%);width:1px;height:18px;background:var(--ink-150)}
.mp-salir{display:inline-flex;align-items:center;gap:6px;border:none;background:transparent;color:var(--fail);font-family:inherit;font-size:13px;font-weight:700;padding:7px 12px;border-radius:8px;cursor:pointer;transition:background-color .15s,transform .12s cubic-bezier(.23,1,.32,1)}
.mp-salir:hover{background:var(--fail-soft)}
.mp-salir:active{transform:scale(.96)}
.mp-salir i,.mp-salir svg{width:14px;height:14px}
.modal-body{padding:0 28px 28px}
.modal-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--ink-200);margin-bottom:24px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;-ms-overflow-style:none;
}
.modal-tabs::-webkit-scrollbar{display:none}
.modal-tab{
  padding:10px 16px 8px;font-size:12px;font-weight:600;color:var(--ink-500);
  border:none;background:transparent;cursor:pointer;position:relative;
  font-family:var(--font-sans);transition:color .15s;white-space:nowrap;flex-shrink:0;
}
.modal-tab.active{color:var(--navy)}
.modal-tab.active::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--navy)}
.form-section{display:none}
.form-section.active{display:block;animation:tabSlideIn .55s cubic-bezier(0.16,1,0.3,1)}
@keyframes tabSlideIn{from{opacity:0;transform:translateX(6px)}to{opacity:1;transform:translateX(0)}}
.form-row{margin-bottom:16px}
.form-row label{display:block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-600);margin-bottom:6px}
.form-row select.field-error,.form-row input.field-error{border-color:var(--fail)!important;background:#FEF5F4!important}
#dup-warning,#dup-warning-tinta,#dup-warning-stock{display:none}
#dup-warning[style*="block"],#dup-warning-tinta[style*="block"],#dup-warning-stock[style*="block"]{animation:dupFadeIn .45s cubic-bezier(0.16,1,0.3,1)}
@keyframes dupFadeIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.form-row label.label-error{color:var(--fail)!important}
@keyframes fieldShake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.field-shake{animation:fieldShake .35s ease}
.form-row select,.form-row input,.form-row textarea{
  width:100%;padding:10px 12px;border:1.5px solid var(--ink-200);border-radius:6px;
  font-family:var(--font-sans);font-size:13px;color:var(--ink-900);outline:none;
  transition:border-color .15s;background:var(--white);
}
.form-row select:focus,.form-row input:focus,.form-row textarea:focus{border-color:var(--navy)}
.form-row textarea{resize:vertical;min-height:80px}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* Operador auto (solo lectura): el registro lo hace el usuario logueado */
.f-op-auto{display:flex;align-items:center;gap:9px;padding:10px 0 2px;font-size:14px;font-weight:700;color:var(--ink-900)}
.f-op-auto .op-dot{width:26px;height:26px;font-size:11px}
.estado-btns{display:flex;gap:8px}
.estado-btn{
  flex:1;padding:10px 8px;border:2px solid var(--ink-200);border-radius:6px;
  background:var(--white);cursor:pointer;font-family:var(--font-sans);
  font-size:12px;font-weight:700;color:var(--ink-500);transition:all .15s;
  display:flex;align-items:center;justify-content:center;gap:6px;
}
.estado-btn.ok.sel{border-color:var(--ok);background:var(--ok-soft);color:var(--ok)}
.estado-btn.warn.sel{border-color:var(--warn);background:var(--warn-soft);color:var(--warn)}
.estado-btn.fail.sel{border-color:var(--fail);background:var(--fail-soft);color:var(--fail)}
.modal-footer{display:flex;justify-content:flex-end;gap:10px;padding-top:8px}
.btn-submit{
  padding:10px 20px;background:var(--navy);color:var(--white);border:none;
  border-radius:8px;font-family:var(--font-sans);font-size:13px;font-weight:700;
  cursor:pointer;transition:background .15s;
}
.btn-submit:hover{background:#002551}
.btn-submit:disabled{opacity:.6;cursor:not-allowed}
.toast{
  position:fixed;bottom:24px;right:24px;background:var(--ink-900);color:var(--white);
  padding:12px 20px;border-radius:6px;font-size:13px;font-weight:600;z-index:300;
  transform:translateY(80px);transition:transform .3s;pointer-events:none;
}
.toast.show{transform:translateY(0)}
.toast.ok{background:var(--ok)}
.toast.fail{background:var(--fail)}
/* Toast de ubicación — pill con ícono, color bright 3W */
.toast.loc{background:var(--bright);font-size:13px;font-weight:600;padding:10px 20px;border-radius:999px;display:flex;align-items:center;gap:8px;bottom:24px}
/* Móvil: el toast era una esquinita tapada por el bottom-nav. Ahora: pill
   centrada SOBRE la barra, más grande, con entrada spring (curva Emil) */
@media(max-width:700px){
  .toast{
    left:50%;right:auto;bottom:calc(88px + env(safe-area-inset-bottom,0px));
    width:max-content;max-width:calc(100vw - 44px);text-align:center;
    padding:13px 22px;border-radius:999px;font-size:14px;
    box-shadow:0 12px 30px -6px rgba(10,30,60,.35);
    opacity:0;transform:translate(-50%,16px) scale(.94);
    transition:transform .34s cubic-bezier(.16,1,.3,1),opacity .28s cubic-bezier(.16,1,.3,1);
  }
  .toast.show{transform:translate(-50%,0) scale(1);opacity:1}
  .toast.loc{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
}

/* ── PERIOD TOGGLE ── */
.period-toggle{display:flex;background:var(--ink-100);border-radius:5px;padding:3px;gap:2px;flex-shrink:0}
.period-btn{padding:8px 20px;border:none;border-radius:6px;font-family:var(--font-sans);font-size:13px;font-weight:700;cursor:pointer;background:transparent;color:var(--ink-500);transition:all .15s;letter-spacing:.05em;text-transform:uppercase}
.period-btn.active{background:var(--white);color:var(--navy);box-shadow:0 1px 3px rgba(0,0,0,.1)}
/* Toggle con pulgar deslizante (igual al de planta) — el blanco viaja bajo
   el botón activo en vez de saltar; ancho/posición medidos por JS */
.period-toggle.thumbed{position:relative}
.period-toggle.thumbed .tog-thumb{position:absolute;top:3px;bottom:3px;border-radius:6px;background:var(--white);box-shadow:0 1px 3px rgba(0,0,0,.12);opacity:0;z-index:0;pointer-events:none;transition:left .3s cubic-bezier(.22,1,.36,1),width .3s cubic-bezier(.22,1,.36,1),opacity .2s}
.period-toggle.thumbed .period-btn{position:relative;z-index:1;background:transparent!important;box-shadow:none!important}
@media(prefers-reduced-motion:reduce){.period-toggle.thumbed .tog-thumb{transition:opacity .15s}}

/* ── BANNER: INSTALAR APP EN iOS ── */
.ios-install{
  position:fixed;left:12px;right:12px;bottom:12px;z-index:330;
  background:var(--white);border:1px solid var(--ink-200);border-radius:12px;
  padding:14px 16px;box-shadow:0 12px 32px rgba(0,0,0,.18);
  display:none;animation:iosSlideUp .4s cubic-bezier(0.16,1,0.3,1);
  max-width:480px;margin:0 auto;
}
.ios-install.show{display:block}
.ios-install-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.ios-install-icon{width:36px;height:36px;border-radius:8px;flex-shrink:0;background:var(--navy);display:grid;place-items:center;overflow:hidden}
.ios-install-icon img{width:36px;height:36px;display:block}
.ios-install-title{font-size:13px;font-weight:700;color:var(--ink-900);line-height:1.2}
.ios-install-sub{font-size:11px;color:var(--ink-500);margin-top:2px}
.ios-install-close{margin-left:auto;background:none;border:none;color:var(--ink-500);cursor:pointer;padding:4px;border-radius:4px;flex-shrink:0}
.ios-install-close:hover{background:var(--ink-100);color:var(--ink-700)}
.ios-install-steps{font-size:12px;color:var(--ink-700);line-height:1.5;padding-left:4px}
.ios-install-steps b{color:var(--navy)}
.ios-install-share{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:1.5px solid var(--navy);border-radius:3px;color:var(--navy);font-weight:700;font-size:12px;vertical-align:middle;margin:0 2px}
@keyframes iosSlideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* ── CARD TASA OK (KPI con barra de progreso) ── */
.kpi-progress{height:6px;background:var(--ink-100);border-radius:99px;overflow:hidden;margin-top:14px;position:relative}
.kpi-progress-bar{height:100%;border-radius:99px;background:var(--ok);transition:width .5s cubic-bezier(0.16,1,0.3,1)}
.kpi-progress-bar.warn{background:var(--warn)}
.kpi-progress-bar.fail{background:var(--fail)}
.kpi-foot.celebrate{color:var(--ok);font-weight:700}
.kpi-foot.warn{color:var(--warn)}
.kpi-foot.fail{color:var(--fail)}
.kpi-num.celebrate{color:var(--ok)}

/* ── CARD INICIADOS HOY (KPI) ── */
.kpi.kpi-clickable{cursor:pointer;transition:transform .22s cubic-bezier(0.16,1,0.3,1), box-shadow .22s ease}
.kpi.kpi-clickable:hover{transform:translateY(-3px);box-shadow:0 14px 30px -12px rgba(0,51,106,.30)}
.kpi.kpi-clickable:active{transform:translateY(-1px) scale(0.995)}
.kpi-chips{display:flex;gap:6px;margin-top:14px;align-items:center;flex-wrap:nowrap;overflow:hidden;min-height:30px}
.kpi-chip{position:relative;width:30px;height:30px;border-radius:50%;background:var(--ink-50);border:2px solid var(--ink-200);display:grid;place-items:center;color:var(--ink-700);flex-shrink:0;transition:transform .15s}
.kpi-chip i,.kpi-chip svg{width:14px;height:14px}
.kpi-chip.ok{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.kpi-chip.warn{background:var(--warn-soft);border-color:var(--warn);color:var(--warn)}
.kpi-chip.fail{background:var(--fail-soft);border-color:var(--fail);color:var(--fail)}
.kpi-chip-more{width:30px;height:30px;border-radius:50%;background:var(--ink-100);border:2px dashed var(--ink-300);display:grid;place-items:center;font-size:10px;font-weight:700;color:var(--ink-500);flex-shrink:0}
.kpi-chips-empty{font-size:11px;color:var(--ink-500);margin-top:14px;font-style:italic;display:flex;align-items:center;min-height:30px}

/* ── MODAL: LISTA COMPLETA DE INICIADOS HOY ── */
.dia-list{display:flex;flex-direction:column;gap:2px}
.dia-section-lbl{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);padding:14px 0 8px;border-bottom:1px solid var(--ink-150);margin-bottom:6px}
.dia-section-lbl:first-child{padding-top:4px}
.dia-row{display:grid;grid-template-columns:36px 1fr auto;gap:12px;align-items:center;padding:10px 4px;border-bottom:1px solid var(--ink-100);cursor:default}
.dia-row:last-child{border-bottom:none}
.dia-row-ic{width:36px;height:36px;border-radius:6px;background:var(--ink-50);display:grid;place-items:center;color:var(--ink-700);border:1px solid var(--ink-150)}
.dia-row-ic i,.dia-row-ic svg{width:18px;height:18px}
.dia-row.ok .dia-row-ic{background:var(--ok-soft);color:var(--ok);border-color:#B8DCC4}
.dia-row.warn .dia-row-ic{background:var(--warn-soft);color:var(--warn);border-color:#F2DCAE}
.dia-row.fail .dia-row-ic{background:var(--fail-soft);color:var(--fail);border-color:#ECBFB8}
.dia-row-name{font-size:13px;font-weight:600;color:var(--ink-900);line-height:1.2}
.dia-row-sub{font-size:11px;color:var(--ink-500);margin-top:2px}
.dia-row-state{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 9px;border-radius:99px}
.dia-row-state.ok{background:var(--ok-soft);color:var(--ok)}
.dia-row-state.warn{background:var(--warn-soft);color:var(--warn)}
.dia-row-state.fail{background:var(--fail-soft);color:var(--fail)}
.dia-row.pending{opacity:0.42}
.dia-row.pending .dia-row-ic{background:var(--ink-50);color:var(--ink-300);border-color:var(--ink-150)}
.dia-row.pending .dia-row-name{color:var(--ink-500);font-weight:500}
.dia-row.pending .dia-row-sub{color:var(--ink-500)}
.dia-row-state.pending{background:var(--ink-100);color:var(--ink-500)}

/* ── VALLAS (bitácora) ── */
/* ═══ HUB DE BITÁCORAS — sección completa en navy ═══ */
.panel[data-panel="bitacoras"]{position:relative;overflow:hidden;background:var(--navy);border-radius:16px;padding:28px 30px 32px;box-shadow:0 18px 44px -20px rgba(0,51,106,.55)}
/* Sección inmersiva (full) al entrar a Bitácoras */
.panel[data-panel="bitacoras"]{min-height:clamp(540px,74vh,820px)}
body.theme-bitacoras .panel[data-panel="bitacoras"]{min-height:calc(100vh - 128px)}
/* El subtítulo de cada vista cede protagonismo al hero grande */
.panel[data-panel="bitacoras"] .vallas-title{font-size:18px;font-weight:700}
.bita-hero{position:relative;z-index:2;margin-bottom:30px;padding-top:6px}
.bita-eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--bright);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px}
.bita-eyebrow i,.bita-eyebrow svg{width:14px;height:14px}
.bita-hero-title{margin:0 0 24px;font-size:clamp(34px,5.2vw,60px);font-weight:800;letter-spacing:-.03em;line-height:.98;color:#fff}
.bita-script{font-family:var(--font-script);font-style:italic;font-weight:400;font-size:1.18em;line-height:.9;letter-spacing:0;color:var(--bright);padding-right:.05em}
.bita-hero-sub{margin:0 0 26px;font-size:15px;line-height:1.55;color:rgba(255,255,255,.72);max-width:600px}
/* Sub-navegación (pills) */
.bita-subnav{position:relative;display:flex;gap:14px;flex-wrap:wrap}
.bita-sub{display:inline-flex;align-items:center;gap:11px;padding:15px 30px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.10);font-family:var(--font-sans);font-size:16.5px;font-weight:600;color:rgba(255,255,255,.78);cursor:pointer;transition:background-color .2s ease,color .2s ease,box-shadow .2s ease,transform .12s ease;white-space:nowrap}
.bita-sub:hover{background:rgba(255,255,255,.18);color:#fff}
.bita-sub:active{transform:scale(.97)}
.bita-sub.active{background:var(--bright);border-color:var(--bright);color:#03244a;font-weight:700;box-shadow:0 12px 26px -8px rgba(79,163,240,.7)}
.bita-sub i,.bita-sub svg{width:19px;height:19px}
.bita-view{position:relative;z-index:2;animation:panelIn .35s cubic-bezier(0.16,1,0.3,1)}
/* Texto e íconos del contenido sobre el navy */
.panel[data-panel="bitacoras"] .vallas-title{color:#fff}
.panel[data-panel="bitacoras"] .vallas-desc{color:rgba(255,255,255,.68)}
.panel[data-panel="bitacoras"] .vallas-count-lbl{color:rgba(255,255,255,.6)}
.panel[data-panel="bitacoras"] .vallas-empty h3{color:#fff}
.panel[data-panel="bitacoras"] .vallas-empty p{color:rgba(255,255,255,.6)}
.panel[data-panel="bitacoras"] .vallas-empty .ic{background:rgba(255,255,255,.08);color:rgba(255,255,255,.5)}
.panel[data-panel="bitacoras"] .empty-state{color:rgba(255,255,255,.6)}
/* Botón primario en bright (resalta sobre navy) */
.panel[data-panel="bitacoras"] .btn.primary{background:var(--bright);border-color:var(--bright);color:#03244a}
.panel[data-panel="bitacoras"] .btn.primary:hover{background:#6cb4f3;border-color:#6cb4f3}
/* Botón de filtro: claro sobre navy; activo en bright */
.panel[data-panel="bitacoras"] .valla-filter-btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff}
.panel[data-panel="bitacoras"] .valla-filter-btn:hover{background:rgba(255,255,255,.2)}
.panel[data-panel="bitacoras"] .valla-filter-btn.active,.panel[data-panel="bitacoras"] .valla-filter-btn.open{background:var(--bright);border-color:var(--bright);color:#03244a}
/* Búsqueda glassy (sin blanco fuerte) */
.panel[data-panel="bitacoras"] .valla-search input{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18);color:#fff}
.panel[data-panel="bitacoras"] .valla-search input::placeholder{color:rgba(255,255,255,.55)}
.panel[data-panel="bitacoras"] .valla-search i,.panel[data-panel="bitacoras"] .valla-search svg{color:rgba(255,255,255,.6)}
.panel[data-panel="bitacoras"] .valla-search input:focus{border-color:var(--bright);box-shadow:0 0 0 3px rgba(79,163,240,.25);background:rgba(255,255,255,.14)}
/* Panel de filtros glassy + dropdowns glassy */
.panel[data-panel="bitacoras"] .valla-filters.open{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.14);box-shadow:none}
.panel[data-panel="bitacoras"] .vf-label{color:rgba(255,255,255,.55)}
.panel[data-panel="bitacoras"] .cs-trigger{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18);color:#fff}
.panel[data-panel="bitacoras"] .cs-trigger:hover{border-color:rgba(255,255,255,.32)}
.panel[data-panel="bitacoras"] .cs.open .cs-trigger{border-color:var(--bright);box-shadow:0 0 0 3px rgba(79,163,240,.25)}
.panel[data-panel="bitacoras"] .cs-trigger i,.panel[data-panel="bitacoras"] .cs-trigger svg{color:rgba(255,255,255,.6)}
/* Entrada de la sección (reveal navy) + cascada del contenido */
@keyframes bitaIn{from{opacity:0}to{opacity:1}}
.panel[data-panel="bitacoras"].active{animation:bitaIn .4s ease}
@keyframes bitaItemIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.panel[data-panel="bitacoras"].active .bita-eyebrow{animation:bitaItemIn .6s .06s cubic-bezier(0.16,1,0.3,1) both}
.panel[data-panel="bitacoras"].active .bita-hero-title{animation:bitaItemIn .65s .15s cubic-bezier(0.16,1,0.3,1) both}
.panel[data-panel="bitacoras"].active .bita-hero-sub{animation:bitaItemIn .6s .25s cubic-bezier(0.16,1,0.3,1) both}
.panel[data-panel="bitacoras"].active .bita-subnav{animation:bitaItemIn .6s .34s cubic-bezier(0.16,1,0.3,1) both}
.panel[data-panel="bitacoras"].active .bita-view{animation:bitaItemIn .6s .43s cubic-bezier(0.16,1,0.3,1) both}
/* El título grande "dibuja" su palabra en script un instante después */
@keyframes bitaScriptIn{from{opacity:0;transform:translateY(30px) rotate(-2deg)}to{opacity:1;transform:none}}
.panel[data-panel="bitacoras"].active .bita-script{display:inline-block;animation:bitaScriptIn .7s .42s cubic-bezier(0.16,1,0.3,1) both}
/* ═══ NAVY FULL HASTA ARRIBA — la topbar también se vuelve navy en Bitácoras ═══ */
.topbar{transition:background-color .45s cubic-bezier(0.16,1,0.3,1), border-color .45s}
body.theme-bitacoras .topbar{background:var(--navy);border-bottom-color:rgba(255,255,255,.12)}
/* Estadísticas: sin la línea gris bajo el topbar (como Arqueos/Config/Almacén) */
body.theme-reportes .topbar{border-bottom-color:transparent}
/* Ventas (cotizador embebido): página BLANCA a todo el ancho, sin tarjeta.
   El iframe llena todo bajo el topbar; su propio .wrap centra el contenido. */
body.theme-ventas{background:var(--white)}
body.theme-ventas .topbar{border-bottom-color:transparent}
body.theme-ventas .page{max-width:none!important;padding:0!important}
@media(max-width:600px){
  /* deja aire para el bottom nav flotante (área segura del iPhone incluida) */
  body.theme-ventas .page{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))!important}
}
/* Nómina (rol RRHH): misma página blanca de Ventas; nomina/nomina.css trae
   su propio .nom-wrap centrado. */
body.theme-nomina{background:var(--white)}
body.theme-nomina .topbar{border-bottom-color:transparent}
body.theme-nomina .page{max-width:none!important;padding:0!important}
/* Inicio del taller (v4.236): página BLANCA como el mockup del dueño.
   (v4.293) La regla vive AQUÍ y ya no en taller/planificador.css: ese archivo no se pide
   hasta que planificador.js (108 KB) terminó de bajar y ejecutarse, así que el módulo
   arrancaba en gris y saltaba a blanco varios cientos de ms después. ops.css bloquea el
   pintado y está en caché, así que ahora el lienzo sale blanco desde el primer frame
   (switchTab aplica la clase leyendo la sub-vista guardada). */
body.pl-fondo-blanco{background:#fff}
@media(max-width:600px){
  body.theme-nomina .page{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))!important}
}
body.theme-bitacoras .brand .logo{content:url("assets/logo-3w-white.svg")}
body.theme-bitacoras .brand .sep{background:rgba(255,255,255,.20)}
body.theme-bitacoras .brand .label .top{color:rgba(255,255,255,.55)}
body.theme-bitacoras .brand .label .bot{color:#fff}
/* Toggle de sucursal glassy */
body.theme-bitacoras .suc-toggle{background:rgba(255,255,255,.10)}
body.theme-bitacoras .suc-btn{color:rgba(255,255,255,.7)}
body.theme-bitacoras .suc-btn:hover{color:#fff}
body.theme-bitacoras .suc-btn.active{background:#fff;color:var(--navy)}
/* Badge de semana glassy */
body.theme-bitacoras .week-badge{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:rgba(255,255,255,.85)}
body.theme-bitacoras .week-badge .num{color:#fff}
body.theme-bitacoras .week-badge .range{color:rgba(255,255,255,.6)}
/* Chip de usuario glassy */
body.theme-bitacoras .user-chip{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18)}
body.theme-bitacoras .user-chip:hover{border-color:rgba(255,255,255,.32)}
body.theme-bitacoras .user-chip .who{color:#fff}
body.theme-bitacoras .user-chip .role{color:rgba(255,255,255,.6)}
/* El rol Admin es navy por defecto (invisible sobre navy) → azul claro en el tema */
body.theme-bitacoras .user-chip .role-admin{color:var(--bright)!important}
body.theme-bitacoras .user-chip svg,body.theme-bitacoras .user-chip i{color:rgba(255,255,255,.6)!important}
body.theme-bitacoras .avatar{background:var(--bright);color:#03244a}
/* Botón de logout glassy */
body.theme-bitacoras .icon-btn{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.7)}
body.theme-bitacoras .icon-btn:hover{color:#fff;border-color:rgba(255,255,255,.4)}
/* El navy "sube" hasta la barra de tabs cuando Bitácoras está activa */
.tabs{transition:background-color .45s cubic-bezier(0.16,1,0.3,1), border-color .45s, padding .45s, border-radius .45s}
body.theme-bitacoras .tabs{background:transparent;border-bottom-color:rgba(255,255,255,.12);margin-bottom:18px}
body.theme-bitacoras .tab{color:rgba(255,255,255,.6)}
body.theme-bitacoras .tab:hover{color:#fff}
body.theme-bitacoras .tab.active{color:#fff}
body.theme-bitacoras .tab.active::after{background:var(--bright)}
body.theme-bitacoras .tab .tab-count{background:rgba(255,255,255,.16);color:#fff}
body.theme-bitacoras .tab.active .tab-count{background:var(--bright);color:#03244a}
body.theme-bitacoras .panel[data-panel="bitacoras"]{background:transparent;border-radius:0;box-shadow:none;padding:6px 4px 40px}
@media(max-width:600px){.panel[data-panel="bitacoras"]{padding:22px 16px 26px;border-radius:14px}.bita-hero-title{font-size:22px}.bita-sub{font-size:15px;padding:12px 20px}}
.vallas-top{display:flex;justify-content:space-between;align-items:flex-start;gap:28px;flex-wrap:wrap;margin-bottom:22px}
.vallas-head{flex:1 1 340px;min-width:0}
.vallas-title{font-size:23px;font-weight:800;color:var(--navy);letter-spacing:-.02em;margin:0 0 7px}
.vallas-desc{font-size:13.5px;color:var(--ink-500);line-height:1.55;max-width:560px;margin:0}
.vallas-actions{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;justify-content:flex-end;flex-shrink:0}
.valla-search{flex:0 1 280px;position:relative}
.valla-search i,.valla-search svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--ink-500);pointer-events:none}
.valla-search input{width:100%;padding:11px 18px 11px 46px;border:none;border-radius:999px;background:var(--ink-100);font-family:var(--font-sans);font-size:14px;color:var(--ink-900);outline:none;transition:background .15s, box-shadow .15s}
.valla-search input::placeholder{color:var(--ink-500)}
.valla-search input:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(0,51,106,.09)}
.valla-filter-btn{width:42px;height:42px;padding:0;border-radius:999px;display:inline-grid;place-items:center;flex-shrink:0}
.valla-filter-btn i,.valla-filter-btn svg{width:18px;height:18px}
.valla-filter-btn.active,.valla-filter-btn.open{background:var(--navy);border-color:var(--navy);color:var(--white)}
.vallas-listhead{margin-bottom:12px}
.vallas-count-lbl{font-size:13px;color:var(--ink-500);font-weight:600;white-space:nowrap}
.valla-filters{display:flex;gap:26px;flex-wrap:wrap;align-items:flex-end;background:var(--white);border:1px solid var(--ink-150);border-radius:10px;box-shadow:0 6px 16px -10px rgba(16,16,16,.12);
  /* colapsado por defecto, se expande con la clase .open */
  max-height:0;opacity:0;padding:0 18px;margin-bottom:0;border-width:0;overflow:hidden;transform:translateY(-6px);
  transition:max-height .32s cubic-bezier(0.16,1,0.3,1), opacity .26s ease, padding .32s cubic-bezier(0.16,1,0.3,1), margin .32s cubic-bezier(0.16,1,0.3,1), transform .32s cubic-bezier(0.16,1,0.3,1), border-width .32s}
.valla-filters.open{max-height:320px;opacity:1;padding:16px 18px;margin-bottom:20px;border-width:1px;transform:translateY(0)}
@media(prefers-reduced-motion:reduce){.valla-filters{transition:none}}
.vf-group{display:flex;flex-direction:column;gap:8px}
.vf-label{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500)}
.vf-chips{display:flex;gap:7px;flex-wrap:wrap}
.vf-chip{padding:7px 14px;border:1px solid var(--ink-200);border-radius:999px;background:var(--white);font-family:var(--font-sans);font-size:12.5px;font-weight:600;color:var(--ink-600);cursor:pointer;transition:.15s}
.vf-chip:hover{border-color:var(--ink-300)}
.vf-chip.active{background:var(--navy);border-color:var(--navy);color:var(--white)}
.valla-filters select{padding:9px 12px;border:1px solid var(--ink-200);border-radius:8px;font-family:var(--font-sans);font-size:13px;color:var(--ink-800);background:var(--white);cursor:pointer;min-width:180px}
/* ── DROPDOWN PERSONALIZADO (.cs) ── */
.cs{position:relative;font-family:var(--font-sans)}
.cs select{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;margin:0}
.valla-filters .cs{min-width:180px}
.cs-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:10px 12px;border:1px solid var(--ink-200);border-radius:8px;background:var(--white);font-family:var(--font-sans);font-size:13px;font-weight:600;color:var(--ink-800);cursor:pointer;transition:border-color .15s,box-shadow .15s;text-align:left}
.cs-trigger span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-trigger:hover{border-color:var(--ink-300)}
.cs.open .cs-trigger{border-color:var(--navy);box-shadow:0 0 0 3px rgba(0,51,106,.09)}
.cs-trigger i,.cs-trigger svg{width:16px;height:16px;color:var(--ink-500);flex-shrink:0;transition:transform .2s}
.cs.open .cs-trigger i,.cs.open .cs-trigger svg{transform:rotate(180deg)}
/* error de validación: resalta el trigger cuando el select tiene field-error */
.cs select.field-error + .cs-trigger{border-color:var(--fail);background:#FEF5F4}
.cs-menu{position:fixed;background:var(--white);border:1px solid var(--ink-150);border-radius:10px;box-shadow:0 14px 34px -10px rgba(0,51,106,.28);padding:6px;z-index:300;max-height:300px;overflow-y:auto;display:none}
.cs-menu.open{display:block;animation:dupFadeIn .16s cubic-bezier(0.16,1,0.3,1)}
.cs-opt{padding:9px 12px;border-radius:7px;font-size:13px;font-weight:500;color:var(--ink-700);cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:8px}
/* Multi-selección: aviso suave al intentar pasar del tope (data-max) */
.cs-opt.cs-max{background:#FBE9E7;color:#C0392B}
.cs-opt:hover{background:var(--ink-50)}
.cs-opt.sel{background:var(--navy);color:var(--white);font-weight:600}
/* Buscador dentro del dropdown (selects con data-search): pegado arriba mientras
   la lista hace scroll debajo. Útil en "Solicitar material" (lista larga). */
/* Cabecera del menú: sangra hasta los bordes (márgenes negativos contra el
   padding de 6px del .cs-menu) con su hairline — así no "flota" ni se desborda */
.cs-search{position:sticky;top:-6px;background:var(--white);margin:-6px -6px 6px;padding:8px;border-bottom:1px solid var(--ink-100);border-radius:10px 10px 0 0;z-index:2}
.cs-search-in{width:100%;box-sizing:border-box;border:1px solid var(--ink-150);background:var(--ink-50);border-radius:7px;padding:8px 11px;font-family:inherit;font-size:13px;font-weight:500;color:var(--ink-900);outline:none;transition:border-color .14s ease,box-shadow .14s ease,background .14s ease}
.cs-search-in::placeholder{color:var(--ink-400)}
.cs-search-in:focus{border-color:var(--navy);background:var(--white);box-shadow:0 0 0 3px rgba(9,66,168,.14)}
.cs-opts{display:flex;flex-direction:column;gap:1px}
/* Estado vacío de vallas */
.vallas-empty{grid-column:1/-1;text-align:center;padding:56px 20px}
.vallas-empty .ic{width:60px;height:60px;border-radius:50%;background:var(--ink-50);display:grid;place-items:center;margin:0 auto 18px;color:var(--ink-300)}
.vallas-empty .ic i,.vallas-empty .ic svg{width:28px;height:28px}
.vallas-empty h3{font-size:17px;font-weight:700;color:var(--ink-800);margin:0 0 6px}
.vallas-empty p{font-size:13.5px;color:var(--ink-500);margin:0 0 20px}
.vallas-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
/* Tarjeta de valla: foto a sangre completa + texto sobre velo en degradado con blur (estilo inmersivo) */
.valla-card{position:relative;border:none;border-radius:16px;overflow:hidden;cursor:pointer;aspect-ratio:4/5;background:linear-gradient(150deg,#0a3d7a 0%,#002551 100%);box-shadow:0 1px 2px rgba(0,0,0,.28),0 12px 28px -14px rgba(0,0,0,.5);transition:transform .22s cubic-bezier(0.16,1,0.3,1),box-shadow .22s ease;animation:vallaCardIn .45s cubic-bezier(0.16,1,0.3,1) both}
@keyframes vallaCardIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.valla-card:hover{transform:translateY(-5px);box-shadow:0 20px 44px -16px rgba(0,0,0,.6)}
.valla-photo{position:absolute;inset:0;overflow:hidden}
.valla-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s cubic-bezier(0.16,1,0.3,1)}
.valla-card:hover .valla-photo img{transform:scale(1.06)}
.valla-photo .ph{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:rgba(255,255,255,.5);font-size:12px;letter-spacing:.05em;gap:8px}
/* Velo en degradado con blur progresivo (mask) para que el texto inferior siempre se lea */
.valla-scrim{position:absolute;left:0;right:0;bottom:0;height:72%;pointer-events:none;background:linear-gradient(to top,rgba(0,18,42,.95) 0%,rgba(0,18,42,.82) 20%,rgba(0,18,42,.46) 50%,rgba(0,18,42,0) 100%);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);-webkit-mask-image:linear-gradient(to top,#000 0%,#000 42%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to top,#000 0%,#000 42%,rgba(0,0,0,0) 100%)}
.valla-body{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:16px 17px 17px}
.valla-cli{font-size:18px;font-weight:700;line-height:1.14;color:#fff;text-shadow:0 1px 14px rgba(0,0,0,.4);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.valla-loc{color:rgba(255,255,255,.82);font-size:12.5px;margin-top:4px;text-shadow:0 1px 10px rgba(0,0,0,.35)}
.valla-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px;font-size:12px;align-items:center}
.valla-chip{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);border-radius:6px;padding:4px 9px;font-weight:600;color:#fff;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
/* ── Tarjetas de PERFIL (sin imagen, compactas/horizontales, glassy) ── */
.perfiles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
/* Tarjeta de perfil con degradado suave del azul bright de 3W */
.perfil-card{background:linear-gradient(135deg,#3A7FD4 0%,#23488E 100%);border-radius:16px;padding:18px 20px;cursor:pointer;display:flex;flex-direction:column;gap:9px;box-shadow:0 10px 28px -14px rgba(0,0,0,.5);transition:transform .2s cubic-bezier(0.16,1,0.3,1),box-shadow .2s ease,filter .2s ease;animation:vallaCardIn .45s cubic-bezier(0.16,1,0.3,1) both}
.perfil-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px -16px rgba(0,0,0,.6);filter:brightness(1.07)}
.perfil-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.perfil-card-title{font-size:16px;font-weight:700;color:#fff;line-height:1.2}
.perfil-card-sub{font-size:12.5px;color:rgba(255,255,255,.8)}
.perfil-card .valla-meta{margin-top:2px}
.perfil-card .valla-chip{background:rgba(255,255,255,.18)!important;border-color:rgba(255,255,255,.28)!important;color:#fff!important}
/* Tag de recurrencia: pill blanco (estilo de la referencia) sobre la tarjeta azul */
.rec-badge{flex-shrink:0;border-radius:999px;padding:5px 14px;font-size:11.5px;font-weight:700;letter-spacing:.01em;background:#fff;color:var(--navy);white-space:nowrap;box-shadow:0 3px 10px -3px rgba(0,0,0,.3)}
.perfil-view-modal .valla-view-head{padding-right:42px}
.perfil-view-modal .valla-view-info{padding-top:26px}
.valla-badge{border-radius:6px;padding:4px 9px;font-weight:700;font-size:11.5px}
.valla-badge.ok{background:var(--ok-soft);color:var(--ok)}
.valla-badge.soon{background:var(--warn-soft);color:var(--warn)}
.valla-badge.late{background:var(--fail-soft);color:var(--fail)}
.valla-badge.eventual{background:var(--ink-100);color:var(--ink-500)}
.valla-detail{padding:2px 16px 18px;animation:dupFadeIn .3s cubic-bezier(0.16,1,0.3,1)}
.valla-det-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:10px 0 4px}
.valla-det .k{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);font-weight:700}
.valla-det .v{font-size:14px;font-weight:500;margin-top:3px;color:var(--ink-900)}
/* Modal de detalle de valla (solo lectura) */
.valla-view-modal{max-width:440px;padding:0;position:relative;border-radius:16px;overflow:hidden auto;scrollbar-width:none}
.valla-view-modal::-webkit-scrollbar{display:none}
.valla-view-photo{aspect-ratio:1/1;background:var(--ink-100);overflow:hidden}
.valla-view-photo img{width:100%;height:100%;object-fit:cover;display:block}
.valla-view-photo .ph{display:flex;align-items:center;justify-content:center;height:100%;color:var(--ink-300);gap:8px;font-size:13px}
.valla-view-info{padding:24px 28px 26px}
.valla-view-head h2{margin:0;font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--ink-900);line-height:1.15}
.valla-view-head p{margin:6px 0 0;font-size:13.5px;color:var(--ink-500)}
/* Grid de specs con mejor jerarquía y aire */
.valla-view-modal .valla-det-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 26px;margin:24px 0 4px}
.valla-view-modal .valla-det .k{font-size:11px;letter-spacing:.09em;color:var(--ink-500);font-weight:700}
.valla-view-modal .valla-det .v{font-size:16px;font-weight:600;margin-top:6px;color:var(--ink-900);line-height:1.25}
.valla-view-by{font-size:11px;color:var(--ink-500);font-weight:600;margin-top:18px;display:flex;align-items:center;gap:6px}
.valla-view-by.edited{color:var(--warn);margin-top:8px}
/* Chip "editado" en las tarjetas (audita que el registro fue alterado) */
.edit-chip{display:inline-flex;align-items:center;gap:4px;background:rgba(247,181,10,.18);color:#F6C453;border:1px solid rgba(247,181,10,.32);border-radius:6px;padding:3px 9px;font-weight:700;font-size:11px}
.edit-chip i,.edit-chip svg{width:11px;height:11px}
.valla-view-by i,.valla-view-by svg{width:13px;height:13px}
.valla-view-modal .valla-det-actions{margin-top:18px}
.valla-view-modal .modal-close{position:absolute;top:14px;right:14px;z-index:3;width:36px;height:36px;border-radius:50%;border:none;background:rgba(12,24,46,.55);color:#fff;backdrop-filter:blur(6px);box-shadow:0 3px 12px rgba(0,0,0,.3)}
.valla-view-modal .modal-close:hover{background:rgba(12,24,46,.82);color:#fff}
/* El detalle de PERFIL no tiene foto (fondo claro) → la X usa el estilo limpio global, no el círculo oscuro de las fotos de vallas */
.perfil-view-modal .modal-close{width:32px;height:32px;background:transparent;color:var(--ink-400);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.perfil-view-modal .modal-close:hover{background:var(--ink-100);color:var(--ink-900)}
.valla-view-modal .modal-close i,.valla-view-modal .modal-close svg{width:16px;height:16px}
@media(max-width:480px){.valla-view-modal .valla-det-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}.valla-view-info{padding:22px 20px 22px}}
.valla-notes{background:var(--ink-50);border-radius:8px;padding:12px 14px;margin-top:14px;font-size:13.5px;line-height:1.5;color:var(--ink-800)}
.valla-det-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.valla-inc-head{display:flex;align-items:center;justify-content:space-between;margin:20px 0 10px}
.valla-inc-head h3{font-size:13px;font-weight:700;margin:0;letter-spacing:.04em;color:var(--ink-900);text-transform:uppercase}
.valla-inc{background:var(--warn-soft);border-radius:8px;padding:11px 14px;margin-bottom:8px}
.valla-inc.grave{background:var(--fail-soft)}
.valla-inc-meta{font-size:11px;color:var(--ink-500);margin-top:3px}
.valla-measure{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:8px}
.valla-drop{border:1.5px dashed var(--ink-300);border-radius:8px;padding:18px;text-align:center;cursor:pointer;background:var(--ink-50);transition:.15s}
.valla-drop:hover{border-color:var(--navy);background:var(--ink-100)}
.valla-drop span{color:var(--ink-500);font-size:13px}
.valla-drop img{max-height:170px;max-width:100%;border-radius:6px;display:block;margin:0 auto}
@media(max-width:760px){
  /* Buscador + filtro en la misma fila; botón de registro full-width abajo */
  .vallas-actions{width:100%;flex-wrap:wrap;justify-content:flex-start;gap:10px}
  .valla-search{flex:1 1 auto;min-width:0}
  .vallas-actions .btn.primary{flex:1 1 100%;justify-content:center;min-height:48px}
}
@media(max-width:600px){
  .vallas-cards{grid-template-columns:1fr}
}

/* ── SPINNER ── */
.spinner{display:inline-block;width:18px;height:18px;border:2.5px solid var(--ink-200);border-top-color:var(--navy);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-state{display:flex;align-items:center;justify-content:center;padding:48px;gap:12px;color:var(--ink-500);font-size:13px}

/* ── V1.3 ANIMACIONES Y TRANSICIONES ── */
/* Entrada de panel al cambiar de tab */
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
/* Cambio de módulo: decenas de veces al día → corto y con ease-out fuerte
   (el Inicio NO usa esta animación: sus piezas entran en cascada propia) */
.panel.active{animation:panelIn .22s cubic-bezier(0.23,1,0.32,1)}
.panel[data-panel="resumen"].active{animation:none}
/* Cascada del Inicio: cada pieza llega de más abajo y se desenfoca al entrar
   (blur leve = las dos "fotos" del crossfade se funden en un solo movimiento) */
@keyframes hubIn{from{opacity:0;transform:translateY(16px);filter:blur(3px)}to{opacity:1;transform:none;filter:blur(0)}}
.panel[data-panel="resumen"].active .hub-head{animation:hubIn .34s cubic-bezier(0.23,1,0.32,1) backwards}
.panel[data-panel="resumen"].active .hub-fecha-big{animation:hubIn .34s .05s cubic-bezier(0.23,1,0.32,1) backwards}
.panel[data-panel="resumen"].active .hub-chips{animation:hubIn .34s .09s cubic-bezier(0.23,1,0.32,1) backwards}
.panel[data-panel="resumen"].active #hub-colab{animation:hubIn .34s .13s cubic-bezier(0.23,1,0.32,1) backwards}
/* Fade-in escalonado de filas/items en listas y rankings */
@keyframes rowIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.stagger-in{animation:rowIn .4s cubic-bezier(0.16,1,0.3,1) backwards}
/* Subrayado animado de la tab activa (.tab ya es position:relative) */
.tab::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background:var(--navy);border-radius:2px;transform:scaleX(0);transform-origin:center;transition:transform .28s cubic-bezier(0.16,1,0.3,1)}
.tab.active::after{transform:scaleX(1)}
/* Feedback de press en chips, tabs y botones de nav */
.chip,.period-btn,.bnav-btn{transition:transform .12s cubic-bezier(0.16,1,0.3,1), background-color .15s, color .15s, border-color .15s}
.chip:active,.period-btn:active,.bnav-btn:active{transform:scale(0.94)}
.tab:active{transform:translateY(1px)}
/* Pulso suave al actualizar un valor (count-up) */
@keyframes valuePop{0%{transform:scale(1)}40%{transform:scale(1.04)}100%{transform:scale(1)}}
.value-pop{animation:valuePop .4s cubic-bezier(0.16,1,0.3,1)}
/* Login: entrada de la tarjeta y salida al entrar */
@keyframes loginCardIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.login-card{animation:loginCardIn .5s cubic-bezier(0.16,1,0.3,1)}
@keyframes loginOut{to{opacity:0;transform:scale(.96);filter:blur(3px)}}
#login-screen.leaving .login-card{animation:loginOut .35s cubic-bezier(0.4,0,1,1) forwards}
@keyframes appReveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#app-screen.entering{animation:appReveal .55s cubic-bezier(0.16,1,0.3,1)}

/* Respeta la preferencia del sistema de movimiento reducido */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
}

/* Edit overlay encima del detail overlay */
#edit-overlay{z-index:210}

/* ── BOTTOM NAV (solo mobile) ── */
.bottom-nav{display:none}
@media(max-width:600px){
  /* Píldora flotante navy, ahora DESLIZABLE en horizontal: el ítem activo se
     expande con su etiqueta y los demás quedan como ícono (patrón del icon-nav
     de escritorio). Antes se apiñaban todos con flex:1 → ilegible con 8+. */
  .bottom-nav{
    display:flex;position:fixed;z-index:45;
    left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));
    background:var(--navy);border:none;border-radius:999px;
    padding:5px;gap:3px;
    overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;scrollbar-width:none;
    scroll-snap-type:x mandatory;scroll-padding-inline:10px;
    box-shadow:0 12px 28px -10px rgba(0,51,106,.55);
    transition:background-color .4s cubic-bezier(0.16,1,0.3,1),border-color .4s,box-shadow .4s;
  }
  .bottom-nav::-webkit-scrollbar{display:none}
  .bnav-btn{
    flex:0 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;
    height:44px;min-width:44px;padding:0 12px;border:none;background:transparent;border-radius:999px;
    color:rgba(255,255,255,.62);font-family:var(--font-sans);font-size:13px;font-weight:700;
    cursor:pointer;position:relative;white-space:nowrap;line-height:1;scroll-snap-align:center;
    transition:color .2s,background-color .2s;
  }
  .bnav-btn i{width:21px;height:21px;flex:0 0 auto}
  /* Etiqueta colapsada; se despliega solo en el activo (como .icon-nav .nl) */
  .bnav-btn span:not(.bnav-count){max-width:0;overflow:hidden;opacity:0;margin-left:0;white-space:nowrap;
    transition:max-width .36s cubic-bezier(.23,1,.32,1),opacity .22s,margin-left .36s cubic-bezier(.23,1,.32,1)}
  .bnav-btn.active{background:#fff;color:var(--navy)}
  .bnav-btn.active span:not(.bnav-count){max-width:140px;opacity:1;margin-left:8px}
  .bnav-btn:not(.active):active{transform:scale(.9)}
  .bnav-ind{display:none}
  .bnav-count{
    position:absolute;top:1px;right:5px;
    background:var(--bright);color:#03244a;font-size:9px;font-weight:700;
    border-radius:999px;padding:1px 5px;min-width:15px;text-align:center;
    font-family:var(--font-mono);line-height:1.4;
  }
  /* Bottom-nav navy inmersivo cuando estás en Bitácoras */
  /* Sobre el fondo navy de Bitácoras la píldora se separa con un hairline */
  body.theme-bitacoras .bottom-nav{border:1px solid rgba(255,255,255,.16);box-shadow:0 12px 28px -10px rgba(0,0,0,.5)}
  /* Ocultar tabs en mobile — reemplazado por bottom nav */
  .tabs{display:none!important}
  /* Espacio para el bottom nav (incluye el área segura del iPhone en modo app) */
  .page{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))!important}
}

/* ── REPORT OVERLAY ── */
.report-overlay{
  display:none;position:fixed;inset:0;background:rgba(10,20,40,.72);
  z-index:220;overflow-y:auto;padding:24px 16px;
}
.report-overlay.open{display:block}
.report-doc{
  background:white;max-width:740px;margin:0 auto 24px;border-radius:8px;
  padding:40px 48px;box-shadow:0 24px 64px rgba(0,0,0,.3);
}
.rep-header{display:flex;align-items:center;justify-content:space-between;
  padding-bottom:18px;border-bottom:2px solid var(--navy);margin-bottom:28px}
.rep-logo{height:60px;display:block}
.rep-sucursal{font-size:18px;font-weight:700;color:var(--navy);margin:0 0 2px}
.rep-period{font-size:12px;color:var(--ink-500)}
.rep-date{text-align:right;font-size:11px;color:var(--ink-500)}
.rep-date b{display:block;font-size:13px;color:var(--ink-800);font-weight:700}
.rep-section{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--navy);margin:24px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--ink-150)}
.rep-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:4px}
.rep-kpi{border:1px solid var(--ink-150);border-radius:5px;padding:12px 14px}
.rep-kpi-label{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);margin-bottom:8px}
.rep-kpi-num{font-size:26px;font-weight:700;color:var(--ink-900);letter-spacing:-.025em;line-height:1}
.rep-kpi-sub{font-size:10px;color:var(--ink-500);margin-top:5px}
.rep-table{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:4px}
.rep-table th{background:var(--ink-50);font-size:9px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-500);padding:8px 10px;text-align:left;
  border-bottom:1px solid var(--ink-200)}
.rep-table td{padding:9px 10px;border-bottom:1px solid var(--ink-150);color:var(--ink-800);vertical-align:middle}
.rep-table tr:last-child td{border-bottom:none}
.rep-badge{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;padding:3px 7px;border-radius:3px}
.rep-badge.ok{background:#E4F4EA;color:#1F8A4C}
.rep-badge.warn{background:#FBEFD9;color:#C77600}
.rep-badge.fail{background:#F8E3DF;color:#C8321F}
.rep-dot{width:5px;height:5px;border-radius:50%;display:inline-block;margin-right:3px;vertical-align:middle}
.rep-footer{margin-top:28px;padding-top:14px;border-top:1px solid var(--ink-150);
  font-size:10px;color:var(--ink-500);display:flex;align-items:center;justify-content:space-between}
.rep-actions{display:flex;gap:10px;justify-content:flex-end;margin-bottom:16px}
@media(max-width:500px){
  .report-doc{padding:24px 20px}
  .rep-kpis{grid-template-columns:1fr 1fr}
  .rep-table th:nth-child(3),.rep-table td:nth-child(3){display:none}
}
@media print{
  .report-overlay{display:block!important;position:static!important;
    background:white!important;padding:0!important;overflow:visible!important}
  .report-doc{border-radius:0!important;box-shadow:none!important;
    padding:20px 24px!important;max-width:100%!important;margin:0!important}
  .rep-actions{display:none!important}
  body>*:not(.report-overlay){display:none!important}
  .topbar,.tabs,.bottom-nav,.modal-overlay,#toast{display:none!important}
  .report-doc{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  .report-doc *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  .rep-table tr,.rep-kpi{break-inside:avoid}
  .rep-section{break-after:avoid}
  .rep-table thead{display:table-header-group}
}
/* Tamaño de página carta (8.5" x 11") para el PDF exportado */
@page{size:8.5in 11in;margin:14mm}

/* ── EDIT BADGE / EDIT BTN ── */
/* ── ADMIN BADGE ── */
.role-admin{color:var(--navy)!important;font-weight:700!important;letter-spacing:.04em}
.role-admin::before{content:"★ ";font-size:8px}
/* ── RANKING TABLE ── */
.rank-row{display:grid;grid-template-columns:1fr 66px 66px 54px 116px;align-items:center;gap:8px;padding:14px 22px;border-bottom:1px solid var(--ink-150);font-size:13.5px}
.rank-row:last-child{border-bottom:none}
.rank-row.head{background:var(--ink-50);font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-500);padding:11px 22px}
.rank-badge{display:inline-block;font-weight:700;font-size:11px;padding:3px 8px;border-radius:3px;text-align:center;min-width:28px}
/* ── DAY ACTIVITY ── */
.day-row{display:grid;grid-template-columns:104px 1fr 40px;align-items:center;gap:16px;padding:13px 22px;border-bottom:1px solid var(--ink-150);font-size:13px}
.day-row:last-child{border-bottom:none}
.day-row.head{background:var(--ink-50);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);padding:9px 20px}
/* ── HIGHLIGHT CARDS ── */
.hl-card{background:var(--white);border:1px solid var(--ink-200);border-radius:6px;padding:16px 18px}
.hl-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-500);margin-bottom:10px;display:flex;align-items:center;gap:7px}
.hl-label i{width:13px;height:13px}
.hl-equipo{font-size:15px;font-weight:700;color:var(--ink-900);line-height:1.2;margin-bottom:4px}
.hl-sub{font-size:12px;color:var(--ink-500)}
.hl-num{font-size:32px;font-weight:700;letter-spacing:-.025em;line-height:1;font-variant-numeric:tabular-nums}
.hl-inc-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:8px}
.hl-inc-item:nth-child(2){border-left:1px solid var(--ink-150);padding-left:20px}
@media(max-width:600px){
  .hl-inc-grid{grid-template-columns:1fr;gap:0}
  .hl-inc-item:nth-child(2){border-left:none;padding-left:0;border-top:1px solid var(--ink-150);padding-top:14px;margin-top:14px}
}
.streak-row{display:flex;align-items:center;gap:13px;padding:13px 0;border-bottom:1px solid var(--ink-150)}
.streak-row:last-child{border-bottom:none}
.streak-medal{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:800;color:#fff;flex-shrink:0;text-shadow:0 1px 2px rgba(0,0,0,.4);box-shadow:0 2px 6px -1px rgba(0,0,0,.28),inset 0 1px 1px rgba(255,255,255,.45)}
.streak-bar{height:8px;background:var(--ink-100);border-radius:99px;overflow:hidden;flex:1}
.streak-fill{height:100%;border-radius:99px;transform-origin:left;transform:scaleX(0);transition:transform .8s cubic-bezier(0.16,1,0.3,1)}
/* Descripción explicativa bajo el título de una tarjeta */
.card-desc{font-size:13px;color:var(--ink-600);line-height:1.5}
.card:not(.tight) .card-desc{margin:-8px 0 18px}
.card.tight .card-desc{padding:0 22px 14px;margin-top:-2px;border-bottom:1px solid var(--ink-100)}
/* ── ACTIVIDAD POR OPERADOR ── */
.op-row{display:flex;align-items:center;gap:11px;padding:10px 20px;border-bottom:1px solid var(--ink-150)}
.op-row:last-child{border-bottom:none}
.op-row .op-dot{width:30px;height:30px;font-size:11px}
.op-meta{flex:1;min-width:0}
.op-name{font-size:13px;font-weight:600;color:var(--ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.op-sub{font-size:11px;color:var(--ink-500);margin-top:1px}
.op-bar{height:4px;background:var(--ink-100);border-radius:99px;overflow:hidden;margin-top:5px}
.op-fill{height:100%;border-radius:99px;transition:width .6s cubic-bezier(0.16,1,0.3,1)}
.op-count{text-align:right;flex-shrink:0}
.op-count b{font-size:16px;font-weight:700;color:var(--ink-900);font-variant-numeric:tabular-nums}
.op-count span{font-size:11px;color:var(--ink-500);display:block;margin-top:-2px}
/* ── EQUIPOS MÁS CONFIABLES ── */
.conf-row{display:flex;align-items:center;gap:14px;padding:14px 22px;border-bottom:1px solid var(--ink-150)}
.conf-row:last-child{border-bottom:none}
.conf-meta{flex:1;min-width:0}
.conf-name{font-size:14.5px;font-weight:600;color:var(--ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conf-sub{font-size:12px;color:var(--ink-500);margin-top:2px}
.conf-pct{font-size:19px;font-weight:700;font-variant-numeric:tabular-nums;flex-shrink:0;min-width:50px;text-align:right}
.conf-ring{width:38px;height:38px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:11px}
.conf-ring i,.conf-ring svg{width:18px;height:18px}
/* ── MTTR · lista de resoluciones ── */
.res-row{display:flex;align-items:center;gap:11px;padding:10px 20px;border-bottom:1px solid var(--ink-150)}
.res-row:last-child{border-bottom:none}
/* ── Tendencia bajo cada KPI de Reportes ── */
.rep-trend{font-size:11.5px;font-weight:700;margin-top:8px;display:flex;align-items:center;gap:4px;line-height:1.3;flex-wrap:wrap;min-width:0}
.rep-trend i{width:13px;height:13px;flex-shrink:0}
/* ── SIN REPORTE RECIENTE ── */
.no-report-card{background:#FCF286;border:none;border-radius:10px;padding:20px 22px}
.no-report-head{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8A6D00;margin-bottom:14px}
.no-report-head i{width:14px;height:14px}
.no-report-chips{display:flex;flex-wrap:wrap;gap:9px}
.no-report-chip{display:inline-flex;align-items:center;gap:7px;background:var(--white);border:1px solid #E6D52E;border-radius:99px;padding:7px 15px 7px 11px;font-size:13.5px;font-weight:600;color:var(--ink-900)}
.no-report-chip i{width:13px;height:13px;color:var(--warn)}
/* ── REPORTES RESPONSIVE ── */
.rank-lbl-short{display:none}
@media(max-width:760px){
  .rank-row{grid-template-columns:1fr 40px 40px 34px 46px;padding:9px 14px;gap:6px}
  .rank-lbl-full{display:none}
  .rank-lbl-short{display:inline;font-size:13px;letter-spacing:0}
  .rank-row.head{letter-spacing:.04em}
  .day-row{grid-template-columns:92px 1fr 34px;padding:10px 14px;font-size:12.5px}
}
@media(max-width:600px){
  #rep-highlights{grid-template-columns:1fr!important}
  .rank-row{grid-template-columns:1fr 34px 34px 30px 42px;padding:8px 12px;font-size:11px;gap:5px}
  .rank-row.head{font-size:9px;padding:7px 12px}
  .rank-lbl-short{font-size:12px}
  .day-row{grid-template-columns:86px 1fr 32px;padding:9px 12px}
  .day-row.head{font-size:9px;padding:7px 12px}
  [data-panel="reportes"] .two-col{grid-template-columns:1fr!important}
}
/* ── DELETE BTN ── */
.btn-delete{display:inline-flex;align-items:center;gap:3px;padding:3px 8px;border:1px solid var(--ink-200);border-radius:8px;background:var(--white);color:var(--ink-500);font-size:11px;font-weight:600;cursor:pointer;transition:all .12s;font-family:var(--font-sans);line-height:1}
.btn-delete:hover{border-color:var(--fail);color:var(--fail);background:var(--fail-soft)}
.edit-badge{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--warn-soft);color:var(--warn);border:1px solid #F2DCAE;border-radius:3px;padding:2px 6px;flex-shrink:0}
.edit-reg-btn{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border:1px solid var(--ink-200);border-radius:8px;background:var(--white);color:var(--ink-500);font-size:11px;font-weight:600;cursor:pointer;transition:all .12s;font-family:var(--font-sans);line-height:1}
.edit-reg-btn:hover{border-color:var(--navy);color:var(--navy)}
.edit-motivo-box{background:var(--warn-soft);border:1px solid #F2DCAE;border-radius:6px;padding:14px;margin-top:4px}
.edit-motivo-box label{color:var(--warn)!important}

/* ── PRINT / EXPORTAR PDF ── */
.print-header{display:none}
@media print{
  .topbar,.tabs,.actions,.filter-row,.search,.period-toggle,
  .modal-overlay,#toast,.eq-chev,.card-link,.edit-reg-btn,
  .btn-submit,.btn{display:none!important}
  body{background:white!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .page{padding:16px 20px!important;max-width:100%!important}
  .panel{display:none!important}
  .panel.active{display:block!important}
  .print-header{display:flex!important;align-items:center;justify-content:space-between;
    margin-bottom:24px;padding-bottom:14px;border-bottom:2px solid var(--navy)}
  .print-logo{height:26px}
  .print-title-txt{font-size:15px;font-weight:700;color:var(--navy)}
  .print-meta-txt{font-size:12px;color:var(--ink-500);margin-top:2px}
  .print-section-title{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
    color:var(--navy);margin:20px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--ink-200)}
  /* Tabla de equipos: mostrar todas las columnas */
  .equipos-table .row{grid-template-columns:28px 2.2fr 1.4fr 1fr 1.4fr 90px!important}
  .equipos-table .row>*:nth-child(3),
  .equipos-table .row>*:nth-child(4),
  .equipos-table .row>*:nth-child(5){display:block!important}
  .equipos-table .row:not(.head){cursor:default!important}
  /* KPIs y cards: no partir en saltos de página */
  .kpis{grid-template-columns:repeat(4,1fr)!important;break-inside:avoid}
  .two-col{grid-template-columns:1fr 1fr!important}
  .kpi,.card{break-inside:avoid}
  .chart-wrap{break-inside:avoid}
  .page-head{display:none!important}
  /* Colores en status badges */
  .status.ok{background:var(--ok-soft)!important;color:var(--ok)!important}
  .status.warn{background:var(--warn-soft)!important;color:var(--warn)!important}
  .status.fail{background:var(--fail-soft)!important;color:var(--fail)!important}
}

/* ── RESPONSIVE ── */
@media(max-width:1100px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.two-col{grid-template-columns:1fr}}

/* Tablet */
@media(max-width:760px){
  .page{padding:20px 16px 40px}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .equipos-table .row{grid-template-columns:28px 1fr 90px 36px}
  .equipos-table .row>*:nth-child(3),.equipos-table .row>*:nth-child(4),.equipos-table .row>*:nth-child(5){display:none}
  .mat-grid{grid-template-columns:1fr}
  .mat:nth-last-child(-n+2){border-bottom:1px solid var(--ink-150);padding-bottom:12px}
  .mat:last-child{border-bottom:none;padding-bottom:0}
  .chart-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .page-title{font-size:26px}
  .page-title .script{font-size:28px}
  .week-badge .range{display:none}
  .form-row-2{grid-template-columns:1fr}
  .search{margin-left:0;width:100%}
  .search input{width:100%}
  .filter-row{flex-wrap:wrap;gap:6px}
  .filter-row .period-toggle{margin-left:0 !important}
  .legend{flex-wrap:wrap;gap:8px}
}

/* Mobile */
@media(max-width:600px){
  /* Topbar: 2 filas — logo+acciones arriba, toggle+semana abajo */
  .topbar{
    height:auto;flex-wrap:wrap;padding:10px 14px 8px;gap:6px 8px;
    padding-top:max(10px,env(safe-area-inset-top,0px));
    align-items:center;
  }
  .brand{flex:1 1 auto}
  .brand .logo{height:70px}
  .brand .sep,.brand .label{display:none}
  /* Spacer ya no separa en mobile */
  .spacer{flex:1 1 0}
  /* user-chip y logout se quedan en la primera línea (orden natural) */
  .user-chip .who,.user-chip .role{display:none}
  .user-chip{padding:3px 8px 3px 3px}
  /* El switch de sucursal solo vive en el dashboard; en los módulos se oculta
     (la sucursal se elige en Inicio, y el módulo ya tiene su "← Inicio") */
  body:not(.en-inicio) .suc-toggle{display:none}
  /* Suc-toggle: fila propia, muy visible, activo = navy */
  .suc-toggle{
    order:10;flex:0 0 100%;
    background:#F7F7F7;border-radius:999px;padding:3px;gap:2px;
  }
  .suc-btn{
    flex:1;padding:10px 0;font-size:14px;font-weight:800;
    text-align:center;justify-content:center;border-radius:999px;
    letter-spacing:.01em;
  }
  .suc-btn.active{
    background:var(--navy)!important;color:var(--white)!important;
    box-shadow:0 2px 10px rgba(0,51,106,.22)!important;
  }
  .suc-btn:not(.active){color:var(--ink-500);background:transparent}
  /* Week badge: ocultar en mobile (info redundante con el toggle) */
  .week-badge{display:none}
  /* Tabs: ocultas en mobile — reemplazadas por bottom nav (ya en otro bloque) */
  /* Page header — título y botón más grandes */
  .page{padding:20px 16px 40px}
  .page-head{flex-direction:column;align-items:flex-start;gap:16px}
  .eyebrow{font-size:10px;margin-bottom:8px}
  .page-title{font-size:30px;letter-spacing:-.03em}
  .page-title .script{font-size:32px}
  .page-sub{font-size:13px;margin-top:6px}
  /* Botones de acción — stack vertical, primario prominente */
  .actions{width:100%;flex-direction:column-reverse;gap:8px}
  .actions .btn{width:100%;white-space:nowrap;justify-content:center}
  .actions .btn.primary{
    padding:15px 20px;font-size:15px;font-weight:800;
    border-radius:8px;
    box-shadow:0 4px 16px rgba(0,51,106,.28);
  }
  .actions .btn:not(.primary){
    padding:10px 16px;font-size:13px;font-weight:600;
  }
  /* KPIs 2 col */
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .kpi{padding:14px 14px 12px}
  .kpi-num{font-size:28px}
  /* Chevron compacto en mobile (no flota lejos del número) */
  .kpi-row .delta.flat{padding:2px 5px;background:transparent;border:0}
  .kpi-row .delta.flat i{width:14px;height:14px;color:var(--ink-500)}
  .kpi-chips{gap:4px;margin-top:10px}
  .kpi-chip,.kpi-chip-more{width:26px;height:26px}
  .kpi-chip i,.kpi-chip svg{width:12px;height:12px}
  .kpi-foot{font-size:11px;margin-top:8px}
  .kpi-progress{margin-top:10px;height:5px}
  /* Chart stats: 2 col */
  .chart-stats{grid-template-columns:1fr 1fr;gap:12px}
  /* Filter */
  .filter-row{gap:5px}
  .chip{font-size:11px;padding:6px 10px}
  /* Modal full width — bottom sheet que sube desde abajo */
  .modal{margin:0;border-radius:24px 24px 0 0;max-height:90vh;position:fixed;bottom:0;left:0;right:0;width:100%;max-width:100%;transform:translateY(100%) !important}
  .modal-overlay.open .modal{transform:translateY(0) !important}
  .modal-overlay{align-items:flex-end;padding:0}
  /* Modal tabs: scrollables para que no se corten */
  .modal-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap}
  .modal-tab{font-size:12px;padding:10px 14px 8px;white-space:nowrap;flex-shrink:0}
  /* Form dentro del modal: mantener 2 columnas para campos cortos (Semana/Año, Cantidad/Fecha) */
  .modal .form-row-2{grid-template-columns:1fr 1fr}
  /* …excepto Hora/Asignado de Agenda: en móvil quedaban encimados → apilar */
  #ag-hora-asignado{grid-template-columns:1fr}
  /* Historia equipo en mobile */
  .hist-row{grid-template-columns:72px 1fr auto;gap:8px}
  /* Consumo: el two-col del panel siempre apilado en mobile (override inline style) */
  .panel[data-panel="consumo"] .two-col{grid-template-columns:1fr!important}
  /* El card de Tinta semana actual: más compacto en mobile */
  .panel[data-panel="consumo"] .two-col > article:first-child .card-head{flex-direction:row;gap:8px}
  .ink-breakdown{gap:10px}

  /* ── FIX: Period toggles (SEM/MES) más grandes y táctiles en mobile ── */
  .period-toggle{padding:4px;gap:3px}
  .period-btn{padding:9px 18px;font-size:13px;font-weight:700;min-width:56px;border-radius:4px}

  /* ── FIX: Card "Consumo de materiales" — header en 2 filas ── */
  .panel[data-panel="consumo"] .two-col > article:last-child .card-head{
    flex-direction:column;align-items:flex-start;gap:10px
  }
  .panel[data-panel="consumo"] .two-col > article:last-child .card-head > div{
    width:100%;display:flex;justify-content:space-between;align-items:center
  }

  /* ── FIX: Inputs en iOS — font 16px evita el auto-zoom y normaliza alturas ── */
  .form-row select,.form-row input,.form-row textarea,.cs-trigger,.valla-search input{font-size:16px}
  .form-row input[type="date"]{min-height:46px;text-align:left;-webkit-appearance:none;appearance:none;padding:10px 12px}
  .form-row .cs-trigger{min-height:46px}
  /* ── FIX: botones del footer de los modales más grandes y táctiles ── */
  .modal-footer{gap:10px}
  .modal-footer .btn,.modal-footer .btn-submit{flex:1;min-height:50px;justify-content:center;font-size:15px;border-radius:8px}
  /* ── FIX: el dropdown custom no se sale de la pantalla ── */
  .cs-menu{max-width:calc(100vw - 24px)}
}

/* ── HISTORIAL DE MATERIALES (form + movimientos) ── */
.mat-hist{background:var(--ink-50);border:1px solid var(--ink-150);border-radius:8px;padding:10px 13px;animation:dupFadeIn .45s cubic-bezier(0.16,1,0.3,1)}
.mat-hist-title{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);margin-bottom:7px;display:flex;align-items:center;gap:5px}
.mat-hist-title i{width:11px;height:11px}
.mat-hist-row{display:flex;align-items:baseline;gap:8px;font-size:12px;color:var(--ink-700);padding:3px 0}
.mat-hist-row .d{font-weight:600;color:var(--ink-500);font-variant-numeric:tabular-nums;flex-shrink:0;min-width:64px}
.mat-hist-row .q{font-weight:700;color:var(--ink-900);flex-shrink:0}
.mat-hist-row .w{color:var(--ink-500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mat-hist-empty{font-size:12px;color:var(--ink-500)}
.mov-row{display:flex;align-items:center;gap:12px;padding:11px 2px;border-bottom:1px solid var(--ink-100)}
.mov-row:last-child{border-bottom:none}
.mov-date{font-size:11px;font-weight:600;color:var(--ink-500);min-width:58px;flex-shrink:0;font-variant-numeric:tabular-nums}
.mov-main{flex:1;min-width:0}
.mov-mat{font-size:13px;font-weight:600;color:var(--ink-900)}
.mov-sub{font-size:11px;color:var(--ink-500);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mov-qty{font-size:13px;font-weight:700;color:var(--ink-900);font-variant-numeric:tabular-nums;flex-shrink:0}
.mov-qty .u{font-size:11px;font-weight:600;color:var(--ink-500);margin-left:2px}

/* ── PRODUCCIÓN: cola de trabajos ── */
.prod-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.prod-head .btn{flex-shrink:0}
/* "Nuevo pedido" sube al top bar a la derecha (solo Producción + escritorio): header en una línea, sin botón flotando */
.prod-title{margin:6px 0 0;font-size:30px;font-weight:700;letter-spacing:-.025em;line-height:1.05;color:var(--ink-900)}
.prod-title .script{font-family:var(--font-script);font-style:italic;font-weight:400;color:var(--navy);font-size:32px;letter-spacing:0;margin:0 4px 0 5px;line-height:1;display:inline-block;vertical-align:middle}
.prod-desc{font-size:12.5px;color:var(--ink-500);margin-top:7px;max-width:540px;line-height:1.55}
/* Chips por equipo retirados: eran ruido visual (el tablero ya lo dice todo) */
.prod-chips{display:none}
/* Mini-avatar (foto o inicial) de quien preparó/imprimió, en la meta de la card */
.trab-card .card-ava{display:inline-block;width:15px;height:15px;border-radius:50%;background-size:cover;background-position:center;vertical-align:-3px;margin-right:4px;background-color:rgba(255,255,255,.28)}
.trab-card .card-ava.ini{font-size:8.5px;font-weight:800;line-height:15px;text-align:center;color:#fff}
/* Acciones del módulo de Equipos (registro + export), arriba de la lista */
.eq-actions{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.eq-actions .btn{padding:11px 18px;font-size:14px;font-weight:800;border-radius:10px}
@media(max-width:640px){.eq-actions{flex-direction:column}.eq-actions .btn{width:100%;justify-content:center}}
.prod-chip{display:inline-flex;align-items:center;gap:7px;background:var(--white);border:1px solid var(--ink-150);border-radius:999px;padding:6px 13px;font-size:12px;font-weight:600;color:var(--ink-700)}
.prod-chip b{font-weight:800;color:var(--navy)}
/* Tablero kanban: 5 columnas como el flujo de Odoo */
.prod-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;max-width:1400px}
/* Producción a lo ancho: quita el tope de 1280px de .page y el del tablero, solo en este módulo */
body.prod-wide .page{max-width:none}
body.prod-wide .prod-board{max-width:none}
/* Vista Planta alta: 6 columnas como su proyecto de Odoo (Pedidos nuevos ·
   DTF · UV DTF · Imprimiendo · Preparando · Terminados). Las columnas
   UV DTF y Preparando solo existen en esta vista. */
.prod-col.solo-alta{display:none}
.prod-board.alta .prod-col.solo-alta{display:block}
.prod-board.alta{grid-template-columns:repeat(3,minmax(0,1fr))}
.prod-col{background:var(--ink-50);border:none;border-radius:12px;padding:10px;min-height:340px}
.prod-col-empty{padding:10px 6px}
.prod-col-head{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-500);display:flex;align-items:center;gap:6px;margin-bottom:10px;padding:2px 4px}
.prod-col-head i{width:13px;height:13px;flex-shrink:0}
.prod-col-head .n{background:var(--white);border:none;border-radius:999px;padding:1px 8px;font-size:10.5px;color:var(--ink-600);margin-left:auto}
.prod-col-empty{font-size:11.5px;color:var(--ink-500);text-align:center}
/* ── Tarjeta del kanban (rediseño con arte): el contenedor es BLANCO; la
   CABECERA (.trab-head) lleva el color de la ETAPA (planta baja) o del TIPO
   (planta alta). Debajo va el ARTE del pedido y un PIE blanco con operador,
   material y la acción principal. ── */
.trab-card{background:var(--white);border:none;border-radius:16px;padding:0;margin-bottom:10px;box-shadow:0 2px 8px rgba(3,36,74,.18);transition:transform .18s,box-shadow .18s;overflow:hidden}
.trab-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px -10px rgba(3,36,74,.45)}
.trab-card:active{transform:translateY(-1px) scale(.995)}
/* Card destacada al llegar desde una notificación push: halo suave que se va solo */
.trab-card.destacada{box-shadow:0 0 0 5px rgba(3,36,74,.25),0 14px 30px -10px rgba(3,36,74,.5)}
/* Cabecera BLANCA y limpia: la etapa la comunica la pill de color, no el fondo */
.trab-head{padding:14px 16px 11px;background:var(--white);position:relative}
/* ── Planta Alta: el COLOR identifica el TIPO, no la etapa ──────────────────
   El color queda fijo por tipo en todo el tramo con archivo (carpeta →
   imprimiendo → preparando) y gana por especificidad (.prod-board.alta
   .trab-card.tc-X = 3 clases) sobre la regla de etapa (.trab-card.tc-imprimiendo
   = 2). La etapa la comunican la columna y la pill, no el color. */
.prod-board.alta .trab-card.tc-dtf  {--tc-ring:#A9CFFA}
.prod-board.alta .trab-card.tc-uvdtf{--tc-ring:#F6A8D6}
.prod-board.alta .trab-card.tc-sub  {--tc-ring:#7FDCE6}
/* "Imprimiendo ahora": contorno claro del propio color que PARPADEA suave (la
   máquina está activa en vivo). El ring va en un ::after cuya opacidad pulsa
   (GPU); el glow difuso se quitó porque se salía del cajón y chocaba con las
   vecinas. La sombra de elevación base la conserva .trab-card. */
.prod-board.alta .trab-card.tc-activa{position:relative}
.prod-board.alta .trab-card.tc-activa::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 3px var(--tc-ring);animation:ringPulse 2s ease-in-out infinite}
@keyframes ringPulse{0%,100%{opacity:1}50%{opacity:.4}}
@media (prefers-reduced-motion:reduce){.prod-board.alta .trab-card.tc-activa::after{animation:none}}
/* Urgente (AMBAS plantas): degradado rojo SUAVE (rojo intenso arriba → se
   desvanece gradualmente en ~media tarjeta) que cae sobre el color de la card
   —tipo en alta, etapa en baja— y se funde hacia abajo. Va en un ::before bajo el
   texto (los hijos van z-index:1), así el nombre se mantiene blanco y legible. */
.prod-board .trab-card.urg-fx .trab-head{position:relative}
.prod-board .trab-card.urg-fx .trab-head::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#BE1616 0%,#D41E1E 26%,rgba(212,30,30,.82) 48%,rgba(212,30,30,.42) 68%,rgba(212,30,30,0) 100%)}
.prod-board .trab-card.urg-fx .trab-head>*{position:relative;z-index:1}
/* Marcar (toque a la flama): el rojo se REVELA de arriba hacia abajo (clip), sin
   deformar el degradado — caída de fuego fluida. Solo en ese evento (urg-cae que
   pone urgRecienMarcado), no en cada refresco del tablero. */
.prod-board .trab-card.urg-cae .trab-head::before{animation:fuegoCae .6s cubic-bezier(.22,.61,.36,1) both}
@keyframes fuegoCae{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
/* Quitar urgente: el rojo se RETRAE hacia arriba antes de repintar (más rápido). */
.prod-board .trab-card.urg-sale .trab-head::before{animation:fuegoSale .42s cubic-bezier(.4,0,.7,.35) forwards}
@keyframes fuegoSale{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 100% 0)}}
.prod-board .trab-card.urg-fx .trab-star{opacity:1;color:#FFD43B;animation:flamePulse 1.1s ease-in-out infinite}
@keyframes flamePulse{0%,100%{opacity:1}50%{opacity:.32}}
@media (prefers-reduced-motion:reduce){.prod-board .trab-card.urg-cae .trab-head::before,.prod-board .trab-card.urg-sale .trab-head::before{animation:none}.prod-board .trab-card.urg-fx .trab-star{animation:none;opacity:1}}
/* Texto de la cabecera BLANCA: oscuro y limpio */
.trab-head .trab-desc{color:var(--ink-900)}
.trab-head .trab-meta-a{color:var(--ink-500)}
.trab-head .trab-meta-a .sep{color:var(--ink-300);margin:0 6px}
.trab-head .trab-star{color:#E8590C;opacity:.4}
.trab-head .trab-star:hover{opacity:1}
/* Badge de URGENTE: la cabecera CONSERVA el color de su etapa; el urgente es
   un badge rojo arriba a la derecha, con la hora límite ("Para: 2 PM"). */
.trab-urg-badge{display:inline-flex;flex-direction:column;align-items:flex-end;gap:1px;background:#FB2C36;color:#fff;border:none;border-radius:11px;padding:5px 10px;cursor:pointer;font-family:inherit;line-height:1.12;flex-shrink:0;box-shadow:0 2px 10px rgba(251,44,54,.4);transition:transform .12s,filter .15s;animation:urgGlow 1.3s ease-in-out infinite}
.trab-urg-badge .ub-top{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;letter-spacing:.03em;text-transform:uppercase}
.trab-urg-badge .ub-top i,.trab-urg-badge .ub-top svg{width:13px;height:13px;color:#FFD43B;animation:flamePulse 1.1s ease-in-out infinite}
.trab-urg-badge .ub-para{font-size:10px;font-weight:700;opacity:.95;white-space:nowrap}
.trab-urg-badge:hover{filter:brightness(1.06)}
.trab-urg-badge:active{transform:scale(.96)}
/* Parpadeo del badge urgente: glow que late + llama que pulsa */
@keyframes urgGlow{0%,100%{box-shadow:0 2px 10px rgba(251,44,54,.35)}50%{box-shadow:0 3px 16px rgba(251,44,54,.72)}}
@media(prefers-reduced-motion:reduce){.trab-urg-badge{animation:none}.trab-urg-badge .ub-top i,.trab-urg-badge .ub-top svg{animation:none}}
/* Controles del PIE blanco: botón principal (azul) y selector de equipo */
.trab-foot .trab-btn.primary{background:var(--white);border:1.5px solid var(--bright);color:var(--bright);border-radius:999px;padding:8px 18px;font-weight:800;box-shadow:none;transition:background .18s,color .15s,box-shadow .18s,transform .15s}
.trab-foot .trab-btn.primary:hover{background:var(--bright);border-color:var(--bright);color:#fff;box-shadow:0 4px 12px rgba(3,36,74,.22);transform:none}
.trab-foot .trab-btn.primary:active{transform:scale(.97)}
.trab-foot .trab-eq-select{background:var(--ink-100);border:none;color:var(--ink-800);border-radius:999px;padding:6px 12px;max-width:130px}
.trab-card .trab-foot .cs .cs-trigger{background:var(--ink-100);border:none;color:var(--ink-800)}
.trab-row1{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.trab-desc{font-size:14px;font-weight:800;letter-spacing:-.01em;line-height:1.3;flex:1;min-width:0;margin-top:8px}
.trab-meta-a{font-size:11.5px;font-weight:700;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trab-star{cursor:pointer;background:none;border:none;padding:1px;flex-shrink:0;line-height:1;transition:opacity .15s,transform .15s}
.trab-star:hover{transform:scale(1.2)}
.trab-star.on{animation:flamePulse 1.5s ease-in-out infinite}
.trab-star i{width:16px;height:16px;fill:currentColor}
.trab-star:not(.on) i{fill:none}
@keyframes flamePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.16)}}
/* Línea de identidad de la cabecera: quién preparó · pedido · total */
.trab-headline{display:flex;align-items:center;gap:8px;margin-top:10px}
.trab-headline .hl-quien{min-width:0;color:var(--ink-900);font-size:12.5px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trab-headline .hl-ref{font-family:var(--font-mono);font-size:11px;color:var(--ink-400);flex-shrink:0}
.trab-headline .trab-total{margin-left:auto;color:var(--navy);font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}
.trab-headline .trab-total .u{font-size:11px;font-weight:600;color:var(--ink-500);margin-left:2px}
/* Cuerpo blanco con el ARTE del pedido */
.trab-arte{background:var(--white);line-height:0;position:relative;margin:2px 14px 4px;border-radius:10px;overflow:hidden;border:1px solid var(--ink-200)}
.trab-arte img{display:block;width:100%;height:150px;object-fit:cover;background:var(--ink-50)}
.trab-arte.cargando{height:118px;background:linear-gradient(100deg,var(--ink-100) 30%,var(--ink-50) 50%,var(--ink-100) 70%);background-size:200% 100%;animation:arteShim 1.3s linear infinite}
.trab-arte.sin{height:0;margin:0;border:none}
@media (prefers-reduced-motion:reduce){.trab-arte.cargando{animation:none}}
/* Pie blanco: operador · material · acción principal */
.trab-foot{display:flex;align-items:center;gap:9px;padding:11px 14px;background:var(--white)}
.trab-foot .foot-l{display:flex;align-items:center;gap:0;min-width:0;flex:1}
.trab-foot-ava{width:28px;height:28px;border-radius:50%;background-size:cover;background-position:center;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;box-shadow:0 0 0 2px var(--white)}
/* Grupo de avatares (quien preparó + quien imprime): se solapan tipo pila */
.trab-ava-grp{display:inline-flex;flex-shrink:0;position:relative;z-index:2}
.trab-ava-grp .trab-foot-ava + .trab-foot-ava{margin-left:-9px}
/* Tag de material: color INTENSO por tipo (gradiente), ancho, texto corrido si es largo.
   Se mete bajo los avatares (margin-left negativo) y reserva su hueco (padding-left). */
.trab-mat-pill{display:inline-flex;align-items:center;color:#fff;border-radius:999px;padding:6px 14px 6px 46px;font-size:11px;font-weight:800;min-width:0;flex:1;overflow:hidden;margin-left:-14px}
.trab-mat-pill .mat-txt{min-width:0;flex:1;overflow:hidden;white-space:nowrap}
.trab-mat-pill .mq{display:inline-block;white-space:nowrap}
.trab-fin{font-size:11.5px;font-weight:700;color:var(--ink-500)}
.trab-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-shrink:0}
/* Acción principal: unidad inseparable al envolver */
.ta-group{display:inline-flex;align-items:center;gap:inherit}
/* ── Mazo de Terminados: los que llevan +5 min terminados se apilan en un
   mazo compacto (la columna ya no crece durante las 12 h); tocarlo lo abre
   para buscar uno en específico y la barra blanca lo vuelve a apilar.
   Con búsqueda o filtros activos no hay mazo: se muestran sueltas. ── */
.term-stack{position:relative;margin:16px 0 10px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.term-stack .ts-capa{position:absolute;height:18px;border-radius:12px 12px 0 0;background:var(--k-terminado)}
.term-stack .ts-capa.c1{top:-6px;left:8px;right:8px;opacity:.5}
.term-stack .ts-capa.c2{top:-11px;left:17px;right:17px;opacity:.26}
.term-stack .ts-front{position:relative;display:flex;align-items:center;gap:11px;background:var(--k-terminado);border-radius:12px;padding:12px 14px;box-shadow:0 2px 8px rgba(3,36,74,.18);transition:transform .18s,box-shadow .18s}
.term-stack:hover .ts-front{transform:translateY(-2px);box-shadow:0 10px 22px -8px rgba(16,94,52,.55)}
.term-stack:active .ts-front{transform:translateY(-1px) scale(.99)}
.term-stack .ts-n{background:rgba(255,255,255,.24);color:#fff;font-weight:800;font-size:13px;border-radius:999px;min-width:30px;height:30px;display:flex;align-items:center;justify-content:center;padding:0 8px;flex-shrink:0;font-variant-numeric:tabular-nums}
.term-stack .ts-txt{flex:1;min-width:0;color:#fff}
.term-stack .ts-txt b{display:block;font-size:12px;font-weight:800;letter-spacing:-.01em}
.term-stack .ts-txt span{display:block;font-size:10.5px;color:rgba(255,255,255,.9);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.term-stack .ts-front>i,.term-stack .ts-front>svg{width:15px;height:15px;color:rgba(255,255,255,.9);flex-shrink:0}
/* Barra para volver a apilar — sticky bajo el topbar: queda a mano aunque
   la lista abierta sea larga */
.term-stack-bar{position:sticky;top:80px;z-index:5;display:flex;align-items:center;justify-content:center;gap:7px;width:100%;border:none;background:var(--white);color:var(--ok);font-family:inherit;font-weight:800;font-size:11.5px;border-radius:999px;padding:9px 14px;margin-bottom:10px;cursor:pointer;box-shadow:0 2px 10px rgba(3,36,74,.16);transition:box-shadow .2s}
.term-stack-bar:hover{box-shadow:0 0 0 4px rgba(35,165,94,.18),0 2px 10px rgba(3,36,74,.16)}
.term-stack-bar i,.term-stack-bar svg{width:13px;height:13px}
@media(max-width:600px){.term-stack-bar{top:140px}}
/* El plegado/desplegado del mazo es un acordeón animado por JS (tsAcordeon:
   altura+padding de cada card en cascada); con reduced-motion no anima */
/* Tablero 2×2: cards anchas y alargadas (en móvil una columna) */
@media(max-width:640px){.prod-board{grid-template-columns:1fr}.prod-board.alta{grid-template-columns:1fr}}
/* Móvil: columnas con >5 pedidos se SEMI-APILAN tipo wallet (img del usuario).
   Cada card colapsa a su cabecera de color; tocas una y se despliega en
   acordeón. Sin scroll anidado (que se trababa): la página scrollea normal y
   la columna queda compacta. */
@media(max-width:640px){
  .apilada{display:flex;flex-direction:column}
  /* Apertura extendiendo / cierre recogiéndose, lento y suave (Emil) */
  .apilada .trab-card{margin:-10px 0 0;transition:margin .5s cubic-bezier(.23,1,.32,1),max-height .5s cubic-bezier(.23,1,.32,1),box-shadow .4s ease}
  .apilada .trab-card:first-child{margin-top:0}
  /* Colapsada: solo asoma la cabecera de color (pill + título + identidad) */
  .apilada .trab-card:not(.abierta){max-height:172px;overflow:hidden;cursor:pointer;box-shadow:0 -4px 12px rgba(3,36,74,.16)}
  .apilada .trab-card:not(.abierta) .trab-desc{white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .apilada .trab-card:not(.abierta) .trab-desc .mq{display:inline}
  /* El arte y el pie se ocultan al colapsar: solo queda la cabecera */
  .apilada .trab-card:not(.abierta) .trab-arte,
  .apilada .trab-card:not(.abierta) .trab-foot{display:none}
  /* Desplegada: card completa, con aire arriba y abajo para destacarla */
  .apilada .trab-card.abierta{max-height:640px;overflow:visible;margin:12px 0;box-shadow:0 12px 30px -10px rgba(3,36,74,.45)}
  .apilada .trab-card.abierta:first-child{margin-top:0}
}
/* Preparando: PILAS semi-abiertas de 5 (ambas plantas, todas las pantallas).
   Cada card colapsa a su cabecera y las del mismo grupo se solapan; tocar una
   la despliega. Mismo patrón del semi-apilado pero en grupos de 5. */
.pila-semi{display:flex;flex-direction:column;margin-bottom:16px}
.pila-semi .trab-card{margin:-10px 0 0;transition:margin .5s cubic-bezier(.23,1,.32,1),max-height .5s cubic-bezier(.23,1,.32,1),box-shadow .4s ease}
.pila-semi .trab-card:first-child{margin-top:0}
.pila-semi .trab-card:not(.abierta){max-height:172px;overflow:hidden;cursor:pointer;box-shadow:0 -4px 12px rgba(3,36,74,.16)}
.pila-semi .trab-card:not(.abierta) .trab-desc{white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pila-semi .trab-card:not(.abierta) .trab-desc .mq{display:inline}
.pila-semi .trab-card:not(.abierta) .trab-arte,
.pila-semi .trab-card:not(.abierta) .trab-foot{display:none}
.pila-semi .trab-card.abierta{max-height:640px;overflow:visible;margin:12px 0;box-shadow:0 12px 30px -10px rgba(3,36,74,.45)}
.pila-semi .trab-card.abierta:first-child{margin-top:0}
.trab-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ink-200);background:var(--white);border-radius:8px;padding:7px 12px;font-size:12px;font-weight:700;cursor:pointer;color:var(--ink-700);font-family:inherit;transition:border-color .15s,color .15s}
.trab-btn:hover{border-color:var(--navy);color:var(--navy)}
.trab-btn.primary{background:var(--bright);border-color:var(--bright);color:#fff;box-shadow:0 3px 8px rgba(3,36,74,.22);transition:background .18s,box-shadow .18s,transform .15s}
.trab-btn.primary:hover{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 6px 14px rgba(3,36,74,.35);transform:translateY(-1px)}
.trab-btn.primary:active{transform:translateY(0) scale(.97)}
.trab-btn i{width:13px;height:13px}
.trab-eq-select{font-size:12px;font-weight:600;padding:6px 8px;border:1px solid var(--ink-200);border-radius:7px;background:var(--ink-50);color:var(--ink-700);max-width:160px;font-family:inherit}
/* Botón hero del módulo: azul bright, hover solo eleva con glow */
/* Búsqueda compacta y flat junto al toggle Tablero|Estadísticas */
#prod-toggles{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#pf-zone{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
#prod-mode-row .search input{background:var(--ink-100);border:none;border-radius:999px;padding:10px 14px 10px 36px;font-size:12.5px;width:230px;transition:background .15s,box-shadow .15s}
#prod-mode-row .search input:focus{background:var(--white);border:none;box-shadow:0 0 0 3px rgba(79,163,240,.3)}
.pf-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border:none;border-radius:999px;background:var(--ink-100);color:var(--ink-600);cursor:pointer;transition:background .15s,color .15s}
.pf-btn:hover{background:var(--ink-150);color:var(--navy)}
.pf-btn.active{background:#DCE9F8;color:var(--navy)}
.pf-btn i{width:16px;height:16px}
#pf-dot{display:none;position:absolute;top:-2px;right:-2px;width:10px;height:10px;border-radius:50%;background:#E8590C;border:2px solid var(--white)}
/* Filtros inline: se despliegan a la izquierda del icono con animación */
.prod-filtros{display:none;gap:8px;align-items:center;flex-wrap:wrap}
.prod-filtros.open{display:flex;animation:pfSlide .45s cubic-bezier(.16,1,.3,1)}
@keyframes pfSlide{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
/* Los selects de filtro se convierten en dropdowns custom (.cs) — el
   estilo pill va en el trigger visible, no en el select oculto */
.prod-filtros .cs{min-width:150px;max-width:195px}
.prod-filtros .cs-trigger{border-radius:999px;padding:8px 13px;font-size:12px;font-weight:600;color:var(--ink-700)}
.prod-filtros .chip i{width:13px;height:13px}
.prod-filtros .chip#pf-urgente.active{background:#E8590C;border-color:#E8590C;color:#fff}
/* Estadísticas: tarjetas más redondeadas, con borde, sombra y aire entre secciones */
#prod-stats .two-col{gap:16px;margin-bottom:18px}
#prod-stats > .card{margin-bottom:18px}
#prod-stats .card{border-radius:18px;border:1px solid var(--ink-150);box-shadow:0 1px 2px rgba(16,16,16,.04),0 12px 28px -16px rgba(3,36,74,.18)}
#prod-stats .kpis{gap:16px;margin-bottom:18px}
#prod-stats .kpi{border-radius:18px;border:1px solid var(--ink-150)}
@media(max-width:1100px){#prod-stats .two-col{grid-template-columns:1fr}}
.total-preview{background:var(--ink-50);border:1px dashed var(--ink-200);border-radius:8px;padding:11px 14px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-500);display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.total-preview b{font-size:19px;color:var(--navy);font-variant-numeric:tabular-nums;letter-spacing:0;text-transform:none}
.odoo-row{display:flex;gap:8px;align-items:stretch}
.odoo-row input{flex:1}
.odoo-row .trab-btn{flex-shrink:0}
/* "Prepararlo yo" (card en Preparando): pill azul brillante, feedback al presionar */
.trab-btn.prep{background:#277AF4;border-color:#277AF4;color:#fff;border-radius:999px;padding:7px 14px;transition:transform .16s cubic-bezier(.23,1,.32,1),background .15s,border-color .15s}
.trab-btn.prep:hover{background:#3D8BFF;border-color:#3D8BFF;color:#fff}
.trab-btn.prep:active{transform:scale(.97)}
.trab-prep-tag{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:#277AF4;background:var(--ink-50);border:1px solid var(--ink-150);border-radius:999px;padding:6px 11px;white-space:nowrap;max-width:118px;overflow:hidden;font-family:inherit}
.trab-prep-tag svg{width:12px;height:12px;flex-shrink:0}
button.trab-prep-tag{cursor:pointer;transition:transform .16s cubic-bezier(.23,1,.32,1),border-color .15s}
button.trab-prep-tag:hover{border-color:#277AF4}
button.trab-prep-tag:active{transform:scale(.97)}
/* Nombre largo: marquesina lenta (texto duplicado, mismo keyframe de las alertas) */
.prep-mq{overflow:hidden;max-width:78px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.prep-mq>span{display:inline-block;white-space:nowrap;animation:alertaMq 10s linear infinite}
/* Confirmación del "Prepararlo yo": segundo toque confirma */
.trab-btn.prep.arm{background:#1D66D9;border-color:#1D66D9}
/* ── Kanban MÓVIL: chips pill de etapa, una columna a la vista ─────────────────
   El scroll siempre es corto (solo la etapa activa); cambiar de etapa desliza
   suave la columna entrante (dirección según el chip). Desktop no cambia. */
.kb-bar,.kb-toast{display:none}
@media(max-width:700px){
  body:has(.panel[data-panel="produccion"].active):has([data-prodview="tablero"].active) .kb-bar{
    display:block;position:sticky;top:0;z-index:40;
    background:var(--ink-50);padding:8px 0 9px;margin:0 0 2px}
  /* Segmented pill: pastilla azul que SE DESLIZA al chip activo (misma técnica
     del switch de Solicitudes del taller). Scrollea horizontal si no caben. */
  .kb-seg{position:relative;display:flex;background:var(--white);border-radius:999px;padding:4px;
    overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;box-shadow:0 1px 3px rgba(10,42,74,.09)}
  .kb-seg::-webkit-scrollbar{display:none}
  .kb-thumb{position:absolute;top:4px;bottom:4px;left:0;width:0;background:#277AF4;border-radius:999px;
    box-shadow:0 3px 9px -2px rgba(39,122,244,.5);
    transition:left .3s cubic-bezier(.23,1,.32,1),width .3s cubic-bezier(.23,1,.32,1)}
  .kb-chip{position:relative;z-index:1;border:none;font-family:inherit;font-size:13px;font-weight:700;
    padding:11px 15px;border-radius:999px;background:none;color:#1D66D9;cursor:pointer;
    white-space:nowrap;flex-shrink:0;transition:color .2s,transform .16s cubic-bezier(.23,1,.32,1)}
  .kb-chip:active{transform:scale(.95)}
  .kb-chip.on{color:#fff}
  .kb-chip .n{opacity:.72;font-weight:600;margin-left:1px}
  @media(prefers-reduced-motion:reduce){.kb-thumb{transition:none}}
  .prod-board[data-kb] .prod-col{display:none}
  .prod-board[data-kb="nuevo"] .prod-col[data-col="nuevo"],
  .prod-board[data-kb="cola"] .prod-col[data-col="cola"],
  .prod-board.alta[data-kb="uvdtf"] .prod-col[data-col="uvdtf"],
  .prod-board[data-kb="imprimiendo"] .prod-col[data-col="imprimiendo"],
  .prod-board[data-kb="prep"] .prod-col[data-col="prep"],
  .prod-board[data-kb="term"] .prod-col[data-col="term"]{display:block}
  .prod-col.kb-in-r{animation:kbInR .24s cubic-bezier(.23,1,.32,1)}
  .prod-col.kb-in-l{animation:kbInL .24s cubic-bezier(.23,1,.32,1)}
  .kb-toast.abierto{display:flex}
}
@keyframes kbInR{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
@keyframes kbInL{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
.kb-toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:210;
  width:max-content;max-width:calc(100vw - 28px);
  background:var(--ink-800);color:#fff;border-radius:999px;padding:8px 9px 8px 10px;
  align-items:center;gap:9px;font-size:13px;font-weight:600;
  box-shadow:0 10px 30px rgba(0,0,0,.28);opacity:0;will-change:transform;
  transform:var(--kb-from,translate(-50%,12px));
  transition:opacity .18s cubic-bezier(.23,1,.32,1),transform .46s cubic-bezier(.32,.72,0,1)}
.kb-toast.show{opacity:1;transform:translate(-50%,0)}
.kb-toast.out{opacity:0;transform:translate(-50%,80px);
  transition:opacity .24s cubic-bezier(.23,1,.32,1),transform .26s cubic-bezier(.23,1,.32,1)}
.kb-toast-ic{width:26px;height:26px;border-radius:50%;background:#277AF4;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.kb-toast-ic svg{width:15px;height:15px}
.kb-toast-tx b{font-weight:700;color:#8FC1FF}
.kb-toast button{border:none;font-family:inherit;background:#277AF4;color:#fff;font-size:12px;font-weight:700;
  border-radius:999px;padding:7px 15px;cursor:pointer;transition:transform .16s cubic-bezier(.23,1,.32,1)}
.kb-toast button:active{transform:scale(.95)}
.trab-card.kb-hl{box-shadow:0 0 0 2px #277AF4,0 0 0 7px rgba(39,122,244,.16);transition:box-shadow .5s}
@media(prefers-reduced-motion:reduce){
  .prod-col.kb-in-r,.prod-col.kb-in-l{animation:none}
  .kb-toast,.kb-toast.out{transition:opacity .15s;transform:translate(-50%,0)}
}
/* ── Rol consulta (Mercadeo): sin acciones de Producción, solo mirar ── */
body.rol-consulta [data-tocarpeta],body.rol-consulta [data-impreso],body.rol-consulta [data-terminar],
body.rol-consulta [data-imprimir],body.rol-consulta [data-preparar],body.rol-consulta [data-soltar],
body.rol-consulta [data-urgente],body.rol-consulta #prod-fab,
body.rol-consulta #trab-acc-editar,body.rol-consulta #trab-acc-eliminar{display:none!important}
/* Mercadeo solo ve el Ranking dentro de Producción: nunca el Tablero */
body.rol-consulta [data-prodview="tablero"]{display:none!important}
/* ── Dashboard de operación (Inicio · solo admins) ─────────────────── */
#hub-admin{display:flex;flex-direction:column;gap:14px;margin-bottom:22px}
.adm-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media(max-width:900px){.adm-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.adm-kpi{background:var(--white);border-radius:16px;padding:14px 16px;box-shadow:0 2px 8px rgba(3,36,74,.08)}
.adm-kpi .l{font-size:11.5px;font-weight:700;color:var(--ink-500)}
.adm-kpi .n{font-size:34px;font-weight:800;letter-spacing:-1.2px;line-height:1.1;margin:4px 0 6px;color:var(--ink-900);font-variant-numeric:tabular-nums}
.adm-kpi .n small{font-size:14px;font-weight:700;color:var(--ink-400);letter-spacing:0}
.adm-kpi.mal .n{color:var(--fail)}
.adm-chip{display:inline-block;font-size:10.5px;font-weight:700;border-radius:999px;padding:3px 9px;white-space:nowrap}
.adm-chip.ok{background:var(--ok-soft);color:var(--ok)}
.adm-chip.warn{background:var(--warn-soft);color:var(--warn)}
.adm-chip.mal{background:var(--fail-soft);color:var(--fail)}
.adm-chip.info{background:#E8F1FD;color:#1D66D9}
.adm-chip.mut{background:var(--ink-100);color:var(--ink-500)}
.adm-flujo{background:var(--white);border-radius:16px;padding:14px 18px;box-shadow:0 2px 8px rgba(3,36,74,.08)}
.adm-flujo .tit{font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;font-weight:800;color:var(--ink-400);margin-bottom:10px}
.adm-etapas{display:flex;flex-wrap:wrap;gap:6px 0}
.adm-etapa{flex:1;min-width:96px;padding:2px 14px;border-left:1px solid var(--ink-150)}
.adm-etapa:first-child{border-left:none;padding-left:2px}
.adm-etapa .el{font-size:11.5px;font-weight:700;color:var(--ink-500);display:flex;align-items:center;gap:6px}
.adm-etapa .el i{width:8px;height:8px;border-radius:3px;flex-shrink:0}
.adm-etapa .ec{font-size:22px;font-weight:800;color:var(--ink-900);font-variant-numeric:tabular-nums}
.adm-dist{display:flex;height:7px;border-radius:999px;overflow:hidden;background:var(--ink-100);margin-top:12px}
.adm-two{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:14px}
@media(max-width:900px){.adm-two{grid-template-columns:minmax(0,1fr)}}
.adm-panel{background:var(--white);border-radius:16px;padding:14px 18px;box-shadow:0 2px 8px rgba(3,36,74,.08)}
.adm-panel .ph{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px}
.adm-panel .ph .t{font-size:13.5px;font-weight:800;color:var(--ink-900);display:flex;align-items:center;gap:7px}
.adm-panel .ph .t svg{width:15px;height:15px}
.adm-panel .ph .r{font-size:16px;font-weight:800;color:var(--ink-900);font-variant-numeric:tabular-nums;white-space:nowrap}
.adm-panel .ph .r small{font-size:11px;color:var(--ink-400);font-weight:700}
.adm-vacio{font-size:12.5px;color:var(--ink-400);padding:10px 0}
.adm-chart-wrap{height:214px;position:relative}
.adm-chart-sep{height:1px;background:var(--ink-150);margin:26px 0 20px}
/* Admin en Inicio: el hub del operador (pendientes/racha/tarjetas) sobra — el nav
   de arriba ya navega y el tablero de operación cubre lo importante */
body.adm-hub #hub-colab{display:none}
body:not(.adm-hub) .hub-foot{display:none}
.hub-foot{text-align:center;margin:30px 0 6px;font-size:11px;letter-spacing:.06em;
  color:var(--ink-300);font-family:var(--font-mono)}
.hub-foot b{color:var(--ink-400);font-weight:700}
.adm-fx{border:1px solid var(--ink-150);border-radius:18px;padding:13px 14px;margin-top:10px;cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .12s}
.adm-fx:hover{border-color:var(--ink-300);box-shadow:0 6px 18px rgba(3,36,74,.09)}
.adm-fx:active{transform:scale(.995)}
.adm-fx.done{opacity:.78}
/* Rediseño 18 jul (mockup): píldora de fecha + título/cliente + chevron */
.fx-top{display:flex;align-items:flex-start;gap:10px}
.fx-pill{flex:0 0 auto;border-radius:999px;padding:4px 12px;font-size:10.5px;font-weight:800;white-space:nowrap}
.fx-pill.hoy{background:var(--navy);color:#fff}
.fx-pill.out{background:var(--white);color:var(--navy);border:1px solid #D8DEE8}
.fx-tt{flex:1;min-width:0}
.fx-tt b{display:block;font-size:12.5px;font-weight:800;color:var(--ink-900);line-height:1.35}
.fx-tt span{display:block;font-size:11px;color:var(--ink-400);margin-top:2px}
.adm-fx-go{margin-left:auto;color:var(--ink-300);width:16px;height:16px;flex-shrink:0;align-self:center}
/* Fila de datos: Asignado a · Horario · Vehículo */
.fx-datos{display:grid;grid-template-columns:1.45fr .95fr .95fr;gap:7px;border-top:1px solid var(--ink-100);margin-top:10px;padding-top:11px}
.fx-col{display:flex;align-items:center;gap:7px;min-width:0}
.fx-datos .adm-ava{width:30px;height:30px;font-size:11px;flex:0 0 auto;border:none;box-shadow:none}
.fx-cd{min-width:0}
.fx-cd .l{margin:0;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-300)}
.fx-cd .v{margin:0;font-size:11.5px;font-weight:700;color:var(--ink-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-col.alerta .fx-cd .v{color:#993C1D}
.fx-col.alerta .adm-ava{background:#FAECE7!important;color:#993C1D!important}
/* Pie según estado: fecha programada, vivo en proceso, o completada */
.fx-foot{margin-top:11px;border-radius:999px;padding:8px 12px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;font-weight:700;white-space:nowrap;overflow:hidden}
.fx-foot.fecha{background:var(--ink-100);color:var(--ink-600)}
.fx-foot.live{background:#E6F1FB;color:#185FA5}
.fx-foot.ok{background:var(--ok-soft);color:var(--ok)}
.fx-fic{width:13px;height:13px;flex-shrink:0}
.fx-dot{width:7px;height:7px;border-radius:50%;background:var(--tag-blue,#0B6FFF);flex-shrink:0;animation:fxPulse 1.6s ease-in-out infinite}
@keyframes fxPulse{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.fx-dot{animation:none}}
/* Lado del sitio/vehículo: tile cuadrado con icono (no avatar de persona) */
.adm-loc{width:40px;height:40px;border-radius:11px;background:var(--ink-100);color:var(--ink-600);display:flex;align-items:center;justify-content:center;border:2px solid var(--white);box-shadow:0 0 0 1px var(--ink-150)}
.adm-loc svg{width:18px;height:18px}
/* Instalación COMPLETADA: chip con gancho + check verde al centro, tarjeta atenuada */
.adm-chip-ic{width:12px;height:12px;vertical-align:-2px;margin-right:3px}
.adm-ava{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12.5px;border:2px solid var(--white);box-shadow:0 0 0 1px var(--ink-150);background-size:cover;background-position:center}
/* Recién terminados: feed compacto (avatar + trabajo + quién/hace + chip de origen) */
.adm-trow{display:flex;align-items:center;gap:11px;padding:9px 8px;margin:0 -8px;border-top:1px solid var(--ink-100);cursor:pointer;border-radius:9px;transition:background .14s}
.adm-trow:first-child{border-top:none}
.adm-trow:hover{background:var(--ink-100)}
.adm-trow:active{transform:scale(.995)}
.adm-trow:focus-visible{outline:2px solid var(--k-cola,#2F7FE0);outline-offset:-2px}
.adm-ava.sm{width:34px;height:34px;font-size:11px;flex-shrink:0}
.adm-trow-main{flex:1;min-width:0}
.adm-trow-main b{display:block;font-size:12.5px;font-weight:700;color:var(--ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adm-trow-main span{font-size:10.5px;color:var(--ink-400)}
.adm-trow .adm-chip{flex-shrink:0}
.adm-trow-go{width:16px;height:16px;color:var(--ink-300);flex-shrink:0}
/* Caja (Arqueos) en el dashboard admin: tarjetas del día + comparativa semanal */
.adm-aq-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:4px 0 14px}
@media(max-width:720px){.adm-aq-kpis{grid-template-columns:minmax(0,1fr)}}
.adm-aq-tile{background:var(--white);border:1px solid var(--ink-150);border-radius:12px;padding:12px 14px;cursor:pointer;
  display:flex;align-items:center;gap:12px;transition:background .15s,border-color .15s}
.adm-aq-tile .tx{flex:1;min-width:0}
.aqk-ico{width:46px;height:46px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:rgba(11,111,255,.09);color:var(--navy)}
.aqk-ico svg{width:20px;height:20px}
.adm-aq-tile:focus{outline:none}
.adm-aq-tile:focus-visible{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(9,66,168,.18)}
.adm-aq-tile:hover{background:var(--ink-50);border-color:var(--ink-200)}
.adm-aq-tile:focus-visible{outline:2px solid var(--k-cola);outline-offset:2px}
.adm-aq-tile .l{font-size:10.5px;font-weight:800;color:var(--ink-500);text-transform:uppercase;letter-spacing:.5px}
.adm-aq-tile .n{font-size:23px;font-weight:800;color:var(--navy);font-variant-numeric:tabular-nums;letter-spacing:-.5px;margin-top:3px;line-height:1.15}
.adm-aq-tile .n.mt{font-size:15px;letter-spacing:0;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-aq-tile .s{font-size:11px;font-weight:600;color:var(--ink-500);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adm-aq-chh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:0 0 6px}
.adm-aq-chh .t2{font-size:12px;font-weight:800;color:var(--ink-700)}
.adm-aq-chh .cmp{font-size:11.5px;font-weight:600;color:var(--ink-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adm-aq-chh .cmp b{color:var(--navy)}
/* "En vivo": punto SÓLIDO (no parpadea) con un anillo que se expande suave — lee
   como en vivo sin el flicker de opacidad que molestaba */
.adm-live{display:inline-flex;align-items:center;gap:6px}
.adm-live::before,.adm-live-dot{content:"";width:8px;height:8px;border-radius:50%;background:var(--ok);
  box-shadow:0 0 0 0 rgba(25,119,63,.4);animation:admPing 2.6s cubic-bezier(.4,0,.6,1) infinite}
@keyframes admPing{0%{box-shadow:0 0 0 0 rgba(25,119,63,.4)}70%{box-shadow:0 0 0 6px rgba(25,119,63,0)}100%{box-shadow:0 0 0 0 rgba(25,119,63,0)}}
@media(prefers-reduced-motion:reduce){.adm-live::before,.adm-live-dot{animation:none}}
/* Strip "En planta ahora": presencia real (fichaje Odoo) con avatares y punto verde */
.adm-online{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--white);
  border:1px solid var(--ink-150);border-radius:999px;padding:13px 22px;margin-bottom:14px}
.adm-online-h{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-500);display:flex;align-items:center;gap:9px}
.adm-online-h b{color:var(--ok);font-size:13px;font-weight:800;margin-left:1px}
.adm-online-avs{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.adm-online-av{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;background-size:cover;background-position:center;box-shadow:0 0 0 2px var(--white);position:relative;cursor:default;transition:transform .15s cubic-bezier(.23,1,.32,1)}
.adm-online-av:hover{transform:translateY(-3px);z-index:6}
.adm-online-av .od{position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 2px var(--white)}
/* Nombre al pasar el mouse (tooltip instantáneo) */
.adm-online-av::after{content:attr(data-name);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);
  background:var(--ink-900);color:#fff;font-size:11px;font-weight:600;padding:4px 9px;border-radius:7px;white-space:nowrap;
  opacity:0;pointer-events:none;transition:opacity .14s,transform .14s;box-shadow:0 6px 16px rgba(0,0,0,.2);z-index:7}
.adm-online-av:hover::after{opacity:1;transform:translateX(-50%) translateY(0)}
.adm-online-more{height:34px;padding:0 11px;border-radius:999px;background:var(--ink-100);color:var(--ink-600);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800}
/* Móvil: SIN contorno (la pill blanca envolvía 2 filas de avatares y se veía
   pesada) — queda plano: etiqueta arriba y UNA fila de avatares (tope 6 + "+N") */
@media(max-width:700px){
  .adm-online{background:transparent;border:none;border-radius:0;padding:4px 6px;
    flex-direction:column;align-items:flex-start;gap:10px}
  .adm-online-avs{justify-content:flex-start;flex-wrap:nowrap}
}
/* KPI de texto (día pico / material top): valor más chico que un número grande */
.adm-kpi.txt .n{font-size:23px;line-height:1.2;letter-spacing:-.3px;margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adm-kpi.txt .n small{font-size:13px}
/* ═══ Tema minimal del dashboard admin: fondo BLANCO, tarjetas gris suave, sin sombras (ref limpia) ═══ */
body.adm-hub.en-inicio{background:#fff}
body.adm-hub .adm-kpi,
body.adm-hub .adm-flujo,
body.adm-hub .adm-panel{background:#F7F7F7;box-shadow:none;border:none}
/* "En planta ahora" es el UNICO con capsula de contorno gris (ref del usuario).
   OJO: esta regla vive SEPARADA a proposito; no sumar selectores aqui. */
body.adm-hub .adm-online{background:#fff;box-shadow:none;border:1px solid var(--ink-150);border-radius:999px}
/* Móvil: la cápsula pierde el contorno TAMBIÉN en el tema del hub (esta regla
   debe vivir DESPUÉS de la de arriba: misma especificidad, gana la última) */
@media(max-width:700px){
  body.adm-hub .adm-online{background:transparent;border:none;border-radius:0;padding:6px 2px}
}
/* El Flujo de producción y "En planta ahora" quedan de fondo BLANCO, sin marco */
body.adm-hub .adm-flujo{background:#fff;border:none;box-shadow:none}
body.adm-hub .adm-flujo .tit{color:var(--ink-500)}
/* Sin la línea gris del topbar en el Inicio del admin (más limpio, sin contorno bajo el nav) */
body.adm-hub.en-inicio .topbar{border-bottom-color:transparent}
body.adm-hub .adm-chip.mut{background:#E4E6EA}
/* Cards de instalación: blancas dentro del panel gris (contraste limpio, sin sombra) */
body.adm-hub .adm-fx{background:#fff;border:1px solid transparent}
body.adm-hub .adm-fx:hover{border-color:transparent;box-shadow:0 6px 16px rgba(3,36,74,.07)}
/* "Recién terminados": plano sobre el blanco de la página, sin tile gris ni marco */
body.adm-hub .adm-term-panel,body.adm-hub #adm-aq{background:#fff;border:none;box-shadow:none}
body.adm-hub .adm-loc{background:#F7F7F7;box-shadow:none;border:1px solid #E4E6EA}
body.adm-hub .adm-online-av,body.adm-hub .adm-online-more{box-shadow:0 0 0 2px #F7F7F7}
/* Nav de módulos SIN borde ni sombra: relleno gris suave, más limpio y simple */
.icon-nav{background:#F7F7F7;border:none;box-shadow:none}
.icon-nav button:not(.on):hover{background:#E4E6EA;color:var(--navy)}
/* ── Móvil: que el dashboard admin no se rompa a 375px ── */
@media(max-width:560px){
  .adm-online{flex-direction:column;align-items:stretch;gap:9px;padding:11px 14px;border-radius:22px}
  .adm-online-avs{justify-content:flex-start}
  .adm-kpi .n{font-size:30px}
  .adm-kpi.txt .n{font-size:19px}
  .adm-ava,.adm-loc{width:34px;height:34px}
  .adm-loc svg{width:16px;height:16px}
  .adm-fx .tt b{font-size:12px;line-height:1.25}
  .adm-fx .side b{font-size:10.5px}
}
/* KPI clicable (Equipos con incidencia → tabla filtrada) */
.adm-kpi.clickable{cursor:pointer;transition:box-shadow .18s,transform .12s}
.adm-kpi.clickable:hover{box-shadow:0 8px 22px rgba(3,36,74,.13)}
.adm-kpi.clickable:active{transform:scale(.99)}
.adm-kpi .n small{font-size:15px;font-weight:700;color:var(--ink-400);letter-spacing:0}
/* Saludo del admin en DOS líneas: "Buenas tardes," ligera arriba, nombre grande navy abajo */
.hub-hola{display:block;line-height:1.04}
.hub-hola .hh-greet{display:block;font-weight:400;color:var(--ink-500);font-size:.58em;letter-spacing:0;margin-bottom:3px}
.hub-hola .hh-nm{display:block;font-weight:700;color:#1E1E1E;font-style:normal;font-family:var(--font-sans);letter-spacing:-.025em}
body.adm-hub .hub-saludo .prod-title{font-size:48px}
body.adm-hub .hub-head{margin-bottom:22px;align-items:flex-end}
body.adm-hub .hub-saludo .eyebrow,body.adm-hub .hub-frase{display:none}   /* admins: sin "3W · David" ni frase */
body.adm-hub .hub-fecha-box{font-size:21px;padding-bottom:3px;line-height:1.3}
body.adm-hub .hf-dia{color:#1E1E1E;font-weight:700}
body.adm-hub .hf-fecha{color:var(--ink-500);font-weight:700}
@media(max-width:700px){body.adm-hub .hub-saludo .prod-title{font-size:31px}}
.odoo-linea{display:block;width:100%;text-align:left;margin-top:5px;padding:7px 10px;border:1px solid var(--ink-200);border-radius:7px;background:var(--white);font-size:12px;color:var(--ink-700);cursor:pointer;font-family:inherit;transition:border-color .15s,background .15s}
.odoo-linea span{color:var(--ink-500);font-weight:700}
.odoo-linea:hover{border-color:var(--navy)}
.odoo-linea.sel{border-color:var(--navy);background:var(--ink-50);color:var(--ink-900);font-weight:600}
.form-check{display:flex;align-items:flex-start;gap:11px;font-size:13px;color:var(--ink-600);line-height:1.5;margin-bottom:13px;cursor:pointer}
.form-check input{width:19px;height:19px;accent-color:var(--navy);cursor:pointer;flex-shrink:0;margin-top:1px}
.form-check strong{color:var(--ink-900)}

/* ── INICIO: hub de zonas de trabajo (mini ERP) ── */
[data-panel="resumen"] > .kpis{display:none}
.hub-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:4px}
.hub-saludo{display:flex;align-items:center;gap:12px}
/* Avatar, fecha grande y chips: piezas SOLO de la cabecera móvil */
.hub-ava{position:relative;display:none;width:42px;height:42px;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-size:14px;align-items:center;justify-content:center;flex-shrink:0;background-size:cover;background-position:center;cursor:pointer;border:none;transition:transform .12s cubic-bezier(0.23,1,0.32,1)}
.hub-ava:active{transform:scale(.93)}
.hub-fecha-big{display:none}
.hub-chips{display:none}
.hub-chip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;border:none;border-radius:999px;padding:12px 15px;font-family:inherit;font-size:13px;font-weight:700;background:var(--white);color:var(--ink-800);box-shadow:0 1px 3px rgba(3,36,74,.1);cursor:pointer;transition:transform .12s cubic-bezier(.16,1,.3,1)}
.hub-chip i,.hub-chip svg{width:14px;height:14px;flex-shrink:0}
.hub-chip .ch{width:13px;height:13px;opacity:.5;margin-left:1px}
.hub-chip:active{transform:scale(.95)}
.hub-chip.urgente{background:var(--k-urgente);color:#fff}
.hub-chip .n{font-variant-numeric:tabular-nums}
.hub-frase{font-size:14px;color:var(--ink-600);margin-top:7px;font-weight:600}
.hub-fecha-box{text-align:right;font-size:12.5px;color:var(--ink-500);line-height:1.6;padding-bottom:4px}
/* Colaborador (v4.146): fecha más grande, día gris + fecha en negro de marca */
body:not(.adm-hub) .hub-fecha-box{font-size:20px;line-height:1.3;padding-bottom:3px}
body:not(.adm-hub) .hf-dia{color:var(--ink-500);font-weight:700}
body:not(.adm-hub) .hf-fecha{color:#1E1E1E;font-weight:700}
/* Pills de estado en las cards del kanban (estilo referencia) */
.trab-pill{display:inline-flex;align-items:center;gap:5px;font-size:9.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:3px 9px;line-height:1.3}
.trab-pill::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.pill-nuevo{background:#EEEDFE;color:#534AB7}
.pill-cola{background:#E6F1FB;color:#185FA5}
.pill-imprimiendo{background:var(--warn-soft);color:var(--warn)}
.pill-preparando{background:#FAECE7;color:#993C1D}
.pill-terminado{background:var(--ok-soft);color:var(--ok)}
.prod-col.dragover{outline:2px dashed var(--royal);outline-offset:-2px;background:#EFF5FC}
/* Compacto desktop (≥641): tipografía y controles chicos en todas las cards.
   Va al FINAL de las reglas trab-* a propósito: con la misma especificidad
   gana la última, así estas sí pisan a las base.
   (Los íconos Lucide se montan como <svg>, por eso se apunta a i Y svg.) */
@media(min-width:641px){
  .trab-card{margin-bottom:8px;border-radius:14px}
  .trab-head{padding:11px 13px}
  .trab-foot{padding:9px 12px;gap:8px}
  .trab-arte img{height:118px}
  .trab-arte.cargando{height:90px}
  /* Cada dato en UNA línea (el título corta con … y deja tooltip) */
  .trab-desc{font-size:12.5px;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .trab-meta-a{margin-top:4px;font-size:10.5px}
  .trab-headline{margin-top:7px}
  .trab-headline .hl-quien{font-size:11px}
  .trab-headline .trab-total{font-size:13px}
  .trab-card .trab-actions{gap:8px}
  .trab-foot .trab-btn.primary{padding:6px 13px;font-size:11.5px}
  .trab-card .trab-btn i,.trab-card .trab-btn svg{width:12px;height:12px}
  .trab-foot .trab-eq-select{padding:4px 10px;font-size:11px;max-width:130px}
  .trab-pill{font-size:9px;padding:2px 8px}
  .trab-star i,.trab-star svg{width:14px;height:14px}
  .trab-foot-ava{width:26px;height:26px;font-size:10.5px}
}
/* Desktop ancho (≥1024): las 4 columnas JUNTAS en una sola fila — el tablero
   completo se ve de un vistazo, sin segundo bloque abajo
   (entre 641 y 1023 queda el 2×2 con la misma card compacta) */
@media(min-width:1024px){
  .prod-board{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;max-width:1500px}
  /* Planta alta: las 6 columnas de su flujo en una sola fila */
  .prod-board.alta{grid-template-columns:repeat(6,minmax(0,1fr));max-width:1680px}
  /* Monitores muy anchos o zoom alejado: la columna tiene TOPE (la tarjeta
     mantiene su forma en vez de estirarse) y el tablero queda centrado */
  body.prod-wide .prod-board{max-width:none;grid-template-columns:repeat(5,minmax(0,400px));justify-content:center}
  body.prod-wide .prod-board.alta{grid-template-columns:repeat(6,minmax(0,380px))}
  .prod-col{padding:6px}
  .trab-card .trab-eq-select{max-width:110px}
  /* Con 6 columnas la card es más angosta: todo un punto más chico para
     que el contenido quepa sin amontonarse (solo en la vista alta) */
  .prod-board.alta .prod-col{padding:5px}
  .prod-board.alta .prod-col-head{font-size:9.5px;gap:5px}
  .prod-board.alta .trab-card{margin-bottom:8px;border-radius:13px}
  .prod-board.alta .trab-head{padding:10px 12px}
  .prod-board.alta .trab-foot{padding:8px 11px;flex-wrap:wrap;gap:7px}
  .prod-board.alta .trab-arte img{height:96px}
  .prod-board.alta .trab-arte.cargando{height:76px}
  .prod-board.alta .trab-desc{font-size:11.5px}
  .prod-board.alta .trab-meta-a{font-size:10px}
  .prod-board.alta .trab-headline .hl-quien{font-size:10.5px}
  .prod-board.alta .trab-headline .trab-total{font-size:12.5px}
  .prod-board.alta .trab-card .trab-btn.primary{padding:4px 9px;font-size:11px}
  .prod-board.alta .trab-card .trab-btn i,.prod-board.alta .trab-card .trab-btn svg{width:11px;height:11px}
  .prod-board.alta .trab-pill{font-size:8.5px;padding:2px 7px}
  .prod-board.alta .trab-star i,.prod-board.alta .trab-star svg{width:13px;height:13px}
  .prod-board.alta .trab-alerta-txt{max-width:96px}
  .prod-board.alta .trab-foot .cs .cs-trigger{max-width:100px;padding:4px 9px;font-size:10.5px}
  /* Card angosta (6 columnas): el material arriba y el botón estirado debajo */
  .prod-board.alta .trab-foot .trab-actions{width:100%;justify-content:flex-end}
  .prod-board.alta .ta-group{flex:1;justify-content:flex-end}
  .prod-board.alta .trab-foot .trab-btn.primary{flex:1;justify-content:center}
  /* El mazo de terminados también un punto más chico en las 6 columnas */
  .prod-board.alta .term-stack .ts-front{padding:10px 11px;gap:8px}
  .prod-board.alta .term-stack .ts-n{min-width:26px;height:26px;font-size:12px}
  .prod-board.alta .term-stack .ts-txt b{font-size:11px}
}
/* Tag de equipo en la card (vista alta, en cola): chip fijo, sin desplegable */
.trab-eq-tag{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.22);color:#fff;border-radius:999px;padding:4px 10px;font-size:10.5px;font-weight:700;min-width:0;max-width:62%}
.trab-eq-tag span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trab-eq-tag i,.trab-eq-tag svg{width:11px;height:11px;flex-shrink:0;opacity:.85}
/* Cliente destacado (vista alta): el taller se guía por el nombre, no por
   la descripción — línea propia, blanca y en negrita bajo el título */
.trab-card .trab-cliente{color:var(--navy);font-size:12.5px;font-weight:800;margin-top:3px;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Toggle de planta del tablero: a lo ancho en móvil */
@media(max-width:640px){
  #prod-planta-tog{width:100%;display:flex}
  #prod-planta-tog .period-btn{flex:1}
}
/* Toggle de planta del tablero: pulgar blanco que se desliza (como el del
   modal de pedidos); en "todas" (ninguna activa) el pulgar se desvanece */
#prod-planta-tog{position:relative}
#prod-planta-tog::before{content:'';position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 5.5px);background:var(--white);border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .25s;opacity:0}
#prod-planta-tog.pl-baja::before,#prod-planta-tog.pl-alta::before{opacity:1}
#prod-planta-tog.pl-alta::before{transform:translateX(calc(100% + 3px))}
#prod-planta-tog .period-btn{position:relative;z-index:1}
#prod-planta-tog .period-btn.active{background:transparent;box-shadow:none}
/* Cambio de planta: el tablero hace una transición suave (solo un respiro) */
@keyframes boardSwap{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}
.prod-board.swap{animation:boardSwap .35s ease}
@media (prefers-reduced-motion: reduce){.prod-board.swap{animation:none}}
/* Marquee de lectura: el texto que no cabe se desliza al posar el cursor
   sobre la card (listener en prod-board) y regresa al salir */
.mq{display:inline-block;vertical-align:top;will-change:transform}
.trab-meta .mq{display:contents}  /* móvil: los datos siguen envolviendo */
@media(min-width:641px){
  .trab-meta .mq{display:inline-flex;align-items:center;gap:3px 10px;white-space:nowrap}
  .trab-meta .mq>span{white-space:nowrap}
}
/* Mientras se lee: sin … ni desvanecido, el texto corre completo */
.trab-card.leyendo .trab-desc,.trab-card.leyendo .trab-meta-a,.trab-card.leyendo .trab-cliente{text-overflow:clip}
.trab-card.leyendo .trab-meta{-webkit-mask-image:none;mask-image:none}
/* Select "mover de equipo" de la card con el dropdown custom: pill blanca
   compacta; el nombre corta con … pero el menú lo muestra completo */
.trab-card .cs{min-width:0;flex-shrink:1}
.trab-card .cs .cs-trigger{background:rgba(255,255,255,.94);border:none;border-radius:999px;padding:5px 11px;font-size:11px;font-weight:600;color:var(--ink-800);gap:6px;width:auto;max-width:150px}
.trab-card .cs .cs-trigger span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trab-card .cs .cs-trigger i,.trab-card .cs .cs-trigger svg{width:12px;height:12px;flex-shrink:0}
.trab-card .cs.open .cs-trigger{box-shadow:0 0 0 3px rgba(255,255,255,.35)}
@media(min-width:1024px){
  .trab-card .cs .cs-trigger{max-width:118px}
}
/* Ancho fijo del rollo DTF: campo bloqueado, se nota que no se edita */
#t-ancho[readonly]{background:var(--ink-100);color:var(--ink-600);cursor:default}
/* Urgente: botón práctico (marca urgente) + carrusel de hora:min al lado */
.urg-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:8px 0 14px}
.urg-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1;background:var(--ink-100);border:1.5px solid transparent;color:var(--ink-700);border-radius:999px;padding:11px 20px;font-family:inherit;font-size:13px;font-weight:800;cursor:pointer;flex-shrink:0;transition:background .15s,color .15s,border-color .15s,box-shadow .15s}
.urg-toggle:active{transform:scale(.97)}
.urg-toggle i,.urg-toggle svg{width:15px;height:15px;display:block}
.urg-toggle.on{background:#FB2C36;border-color:#FB2C36;color:#fff;box-shadow:0 2px 10px rgba(251,44,54,.35)}
/* Hora límite: carrusel de HORA y MINUTOS (00|30); cada columna se desliza y se
   selecciona la del centro (banda roja). Rango 8 AM → 6 PM. */
.urg-wheel{position:relative;flex:1;min-width:0;display:flex;align-items:stretch;justify-content:center;gap:2px;height:108px;border:1.5px solid var(--ink-200);border-radius:14px;background:var(--white);overflow:hidden}
.uw-col{height:108px;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:36px 0;text-align:center;position:relative;z-index:1}
.uw-col::-webkit-scrollbar{display:none}
.uw-item{height:36px;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;color:var(--ink-400);white-space:nowrap;padding:0 14px;cursor:pointer;transition:color .15s,transform .15s}
.uw-item.sel{color:var(--ink-900);transform:scale(1.12)}
.uw-sep{display:flex;align-items:center;font-size:17px;font-weight:800;color:var(--ink-500);z-index:1}
.uw-band{position:absolute;left:6px;right:6px;top:50%;transform:translateY(-50%);height:36px;background:rgba(251,44,54,.09);border-radius:9px;pointer-events:none;z-index:0}
@media(prefers-reduced-motion:reduce){.uw-item{transition:none}}
/* Botón Listo (confirma la hora y minimiza el carrusel) */
.uw-listo{flex-shrink:0;width:46px;height:46px;border-radius:50%;border:none;background:#FB2C36;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px 10px rgba(251,44,54,.4);transition:filter .15s,transform .12s}
.uw-listo:hover{filter:brightness(1.06)}
.uw-listo:active{transform:scale(.92)}
.uw-listo i,.uw-listo svg{width:20px;height:20px}
/* Chip de hora confirmada (minimizado, toca para cambiar) */
.urg-chip-hora{display:inline-flex;align-items:center;gap:7px;background:#FB2C36;color:#fff;border:none;border-radius:999px;padding:12px 20px;font-family:inherit;font-size:14.5px;font-weight:800;cursor:pointer;box-shadow:0 2px 10px rgba(251,44,54,.32);transition:filter .15s,transform .12s}
.urg-chip-hora:hover{filter:brightness(1.05)}
.urg-chip-hora:active{transform:scale(.96)}
.urg-chip-hora i,.urg-chip-hora svg{width:16px;height:16px}
/* ── Modal de acciones del pedido (clic en la card) ── */
.acc-btn{display:flex;align-items:center;gap:12px;width:100%;border:1px solid var(--ink-150);background:var(--white);border-radius:12px;padding:13px 16px;font-size:13.5px;font-weight:700;color:var(--ink-800);cursor:pointer;font-family:inherit;text-align:left;transition:border-color .15s,background .15s;margin-bottom:9px}
.acc-btn:hover{border-color:var(--navy);background:var(--ink-50)}
.acc-btn i,.acc-btn svg{width:17px;height:17px;color:var(--royal);flex-shrink:0}
.acc-btn small{display:block;font-weight:500;font-size:11px;color:var(--ink-500);margin-top:1px}
/* Toggle de planta: el "pulgar" blanco se desliza de un lado al otro */
#t-planta{position:relative}
#t-planta::before{content:'';position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 5.5px);background:var(--white);border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:transform .3s cubic-bezier(.22,1,.36,1)}
#t-planta.alta::before{transform:translateX(calc(100% + 3px))}
#t-planta .period-btn{position:relative;z-index:1}
#t-planta .period-btn.active{background:transparent;box-shadow:none}
/* Puntos de alerta en las cards: parpadean cuando el pedido se atora */
@keyframes alertaBlink{0%,100%{opacity:1}50%{opacity:.22}}
.trab-pillwrap{display:inline-flex;align-items:center;gap:8px;min-width:0;flex:1}
.trab-r1l{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.trab-alerta{width:9px;height:9px;border-radius:50%;flex-shrink:0;animation:alertaBlink 1.5s ease-in-out infinite}
.trab-alerta.retraso{background:#E8950C;box-shadow:0 0 6px rgba(232,149,12,.5)}   /* +40 min imprimiéndose */
.trab-alerta.espera{background:#9AA3AE;animation-duration:2.4s}      /* +2 h en carpeta */
/* Letrero del punto: marquesina que corre sola (sin hover), en bucle */
.trab-alerta-txt{font-size:8.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;overflow:hidden;white-space:nowrap;flex:1;min-width:0;max-width:200px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.trab-alerta-txt>span{display:inline-block;animation:alertaMq 8s linear infinite}
.trab-alerta-txt.retraso{color:#CC7E08}
.trab-alerta-txt.espera{color:#6B7280}
@keyframes alertaMq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.trab-alerta-txt>span{animation:none}}
/* Filtro favorito del usuario: estrella dorada cuando está activo */
#pf-fav.on{background:#FFF4D6;color:#9A6A00}
#pf-fav.on i,#pf-fav.on svg{color:#F5A623;fill:#F5A623}
/* Ficha del pedido en el modal de acciones: tiles de datos + recorrido */
#trab-acc-info{margin:0 0 16px}
#trab-acc-info:empty{display:none}
.acc-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:10px}
.acc-tile{background:var(--ink-50);border-radius:11px;padding:11px 13px;min-width:0}
.acc-tile .l{display:block;font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-500);margin-bottom:4px}
.acc-tile .v{display:block;font-size:14px;font-weight:800;color:var(--ink-900);line-height:1.25;overflow-wrap:anywhere}
/* Recorrido del pedido: puntos con los colores de las columnas del kanban */
.acc-tl{background:var(--ink-50);border:none;border-radius:11px;padding:8px 13px;margin-bottom:12px}
.acc-tl-row{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:12.5px}
.acc-tl-row + .acc-tl-row{border-top:1px solid var(--ink-50)}
.acc-tl-row .dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.acc-tl-row .et{font-weight:700;color:var(--ink-800)}
.acc-tl-row .fx{color:var(--ink-500);margin-left:auto;font-variant-numeric:tabular-nums;white-space:nowrap}
.acc-notas{background:#FFF7E0;border-radius:11px;padding:11px 13px;font-size:12.5px;line-height:1.45;color:#6B5414;margin-bottom:10px}
.acc-notas b{display:block;font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#A8841F;margin-bottom:3px}
.acc-edit{font-size:11px;color:var(--ink-500);margin-bottom:10px;display:flex;align-items:center;gap:5px}
.acc-edit i,.acc-edit svg{width:11px;height:11px}
.acc-btn.peligro{border-color:#F3D2CE}
.acc-btn.peligro i,.acc-btn.peligro svg{color:var(--fail)}
.acc-btn.peligro:hover{border-color:var(--fail);background:#FEF5F4}
/* Confirmación estilizada (reemplaza el confirm() del navegador) */
.confirm-card{max-width:380px}
.confirm-ic{width:52px;height:52px;border-radius:50%;background:#FDEBEB;color:var(--fail);display:flex;align-items:center;justify-content:center;margin:4px auto 14px}
.confirm-ic i,.confirm-ic svg{width:24px;height:24px}
.confirm-tit{font-size:16px;font-weight:800;color:var(--ink-900);text-align:center;line-height:1.35}
.confirm-msg{font-size:12.5px;color:var(--ink-500);text-align:center;margin-top:8px;line-height:1.5}
.confirm-btns{display:flex;gap:10px;margin-top:20px}
.confirm-btns .btn,.confirm-btns .btn-danger,.confirm-btns .btn-navy{flex:1;justify-content:center}
.btn-danger{display:inline-flex;align-items:center;gap:7px;background:var(--fail);border:1px solid var(--fail);color:#fff;border-radius:10px;padding:11px 18px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;transition:opacity .15s}
/* Variante del confirm para acciones no destructivas (ej. guardar sin Odoo) */
.btn-navy{display:inline-flex;align-items:center;gap:7px;background:var(--navy);border:1px solid var(--navy);color:#fff;border-radius:10px;padding:11px 18px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;transition:opacity .15s}
.btn-navy:hover{opacity:.88}
.btn-danger:hover{opacity:.88}
/* ── RANKING del taller (visible a todos) ── */
#prod-ranking{max-width:1400px;margin-inline:auto}
.rk-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
@media(max-width:900px){.rk-grid{grid-template-columns:1fr}}
.rk-card{background:linear-gradient(165deg,var(--navy) 0%,#0A3D7A 55%,#1B5CA8 100%);border-radius:18px;padding:22px 20px 18px;color:#fff;position:relative;overflow:hidden}
/* Transición al cambiar entre Tablero / Ranking / Estadísticas */
@media (prefers-reduced-motion: no-preference){
  .vista-in{animation:vistaIn .55s cubic-bezier(.16,1,.3,1)}
  @keyframes vistaIn{from{opacity:0;transform:translateY(28px) scale(.98)}to{opacity:1;transform:none}}
}
.rk-tit{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.65);display:flex;align-items:center;gap:7px;margin-bottom:4px}
.rk-tit i,.rk-tit svg{width:14px;height:14px}
.rk-sub{font-size:11.5px;color:rgba(255,255,255,.45);margin-bottom:18px}
.rk-podio{display:flex;align-items:flex-end;justify-content:center;gap:14px}
.rk-p{display:flex;flex-direction:column;align-items:center;gap:7px;flex:1;max-width:150px;min-width:0}
.rk-ava{width:52px;height:52px;border-radius:50%;background:var(--bright);color:#03244a;font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center;background-size:cover;background-position:center;border:3px solid rgba(255,255,255,.35);position:relative}
.rk-p.oro .rk-ava{width:68px;height:68px;font-size:20px;border-color:#F7C948;box-shadow:0 0 0 4px rgba(247,201,72,.4),0 0 22px 6px rgba(247,201,72,.5),0 8px 22px rgba(0,0,0,.3)}
@media (prefers-reduced-motion: no-preference){
  .rk-p.oro .rk-ava{animation:oroGlow 2.2s ease-in-out infinite}
  @keyframes oroGlow{
    0%,100%{box-shadow:0 0 0 4px rgba(247,201,72,.4),0 0 18px 4px rgba(247,201,72,.45),0 8px 22px rgba(0,0,0,.3)}
    50%{box-shadow:0 0 0 5px #FFD43B,0 0 34px 12px rgba(247,201,72,.85),0 8px 22px rgba(0,0,0,.3)}
  }
}
.rk-med{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);font-size:17px;line-height:1;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}
.rk-p.oro .rk-med{font-size:21px}
.rk-nom{font-size:12px;font-weight:800;margin-top:6px;max-width:100%;display:flex;align-items:center;justify-content:center}
.rk-nom>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
/* Medalla "Top del mes" junto al nombre (campeón); flex:none para que nunca se corte */
.medalla-mes{height:17px;width:auto;flex:none;margin-left:4px;object-fit:contain;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}
.rk-p.oro .rk-nom{font-size:13.5px}
.rk-pts{font-size:10.5px;color:rgba(255,255,255,.6);font-weight:600;text-align:center;line-height:1.4}
.rk-pts b{font-size:15px;color:#fff;font-variant-numeric:tabular-nums}
.rk-big{display:flex;align-items:baseline;justify-content:center;gap:3px}
.rk-u{font-size:10px;font-weight:700;color:rgba(255,255,255,.5)}
.rk-meta{display:block;font-size:10px;color:rgba(255,255,255,.5);margin-top:2px}
.rk-p.oro .rk-pts b{font-size:19px;color:#F7C948}
.rk-base{width:100%;border-radius:8px 8px 0 0;margin-top:8px;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,.06))}
.rk-p.oro .rk-base{height:46px;background:linear-gradient(180deg,rgba(247,201,72,.55),rgba(247,201,72,.08))}
.rk-p.plata .rk-base{height:30px}
.rk-p.bronce .rk-base{height:20px}
/* ── Nube de estado (v4.222): frase tipo WhatsApp sobre el avatar del podio ── */
.rk-nube{position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);background:#fff;color:#03244a;font-size:11px;font-weight:600;line-height:1.15;padding:5px 11px;border-radius:999px;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,.25);z-index:4}
/* El elipsis recorta en el span interno, NO en la nube: si no, el overflow se
   traga la colita de abajo (:after), que sobresale del borde (bug v4.223) */
.rk-nube .t{display:block;max-width:140px;overflow:hidden;text-overflow:ellipsis}
/* Si hay nubes, el podio baja un pelín para que no pisen el subtítulo de la tarjeta */
.rk-podio:has(.rk-nube){padding-top:24px}
.rk-nube:after{content:'';position:absolute;left:50%;bottom:-3px;width:8px;height:8px;background:#fff;transform:translateX(-50%) rotate(45deg);border-radius:2px}
.rk-nube.ghost{background:rgba(255,255,255,.14);color:rgba(255,255,255,.85);border:1.5px dashed rgba(255,255,255,.55);box-shadow:none;font-weight:600}
.rk-nube.ghost:after{display:none}
.rk-nube.ghost:hover{background:rgba(255,255,255,.26);color:#fff}
.rk-nube[data-est-edit]{cursor:pointer}
.rk-nube-in{width:148px;border:none;outline:none;background:transparent;color:inherit;font:inherit;text-align:center;padding:0}
.rk-nube.ghost .rk-nube-in::placeholder{color:rgba(255,255,255,.55)}
@media (prefers-reduced-motion: no-preference){
  .rk-nube{animation:nubePop .5s cubic-bezier(.3,1.4,.5,1) both}
  @keyframes nubePop{from{opacity:0;transform:translateX(-50%) translateY(7px) scale(.82)}to{opacity:1;transform:translateX(-50%)}}
}
/* ── Onboarding de estados (v4.222): anuncio de una vez al entrar a Producción ── */
#oe-overlay{position:fixed;inset:0;background:rgba(8,20,40,.55);z-index:340;display:flex;align-items:center;justify-content:center;padding:20px;animation:oeFade .25s ease-out both}
#oe-overlay.out{opacity:0;transition:opacity .2s}
@keyframes oeFade{from{opacity:0}to{opacity:1}}
.oe-mod{background:var(--white);border-radius:18px;max-width:392px;width:100%;padding-bottom:22px;box-shadow:0 24px 60px rgba(0,0,0,.35);overflow:hidden;animation:oeIn .55s cubic-bezier(.16,1,.3,1) both;max-height:calc(100vh - 40px);overflow-y:auto}
@keyframes oeIn{from{opacity:0;transform:translateY(26px) scale(.96)}to{opacity:1;transform:none}}
.oe-hero{background:linear-gradient(165deg,var(--navy) 0%,#0A3D7A 55%,#1B5CA8 100%);padding:26px 20px 22px;display:flex;flex-direction:column;align-items:center;position:relative}
.oe-badge{position:absolute;top:12px;left:14px;background:#F9DA36;color:#4a3a02;font-size:10.5px;font-weight:800;letter-spacing:.08em;padding:3px 10px;border-radius:999px}
.oe-ava{width:74px;height:74px;border-radius:50%;background:var(--bright);color:#03244a;font-weight:800;font-size:21px;display:flex;align-items:center;justify-content:center;background-size:cover;background-position:center;border:3px solid #F7C948;margin-top:32px;position:relative}
.oe-nube{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);font-size:12px;font-weight:600;line-height:1.15;padding:6px 13px;border-radius:999px;white-space:nowrap}
.oe-nube:after{content:'';position:absolute;left:50%;bottom:-4px;width:9px;height:9px;transform:translateX(-50%) rotate(45deg);border-radius:2px;background:#fff}
.oe-n1{background:rgba(255,255,255,.15);color:rgba(255,255,255,.9);border:1.5px dashed rgba(255,255,255,.6)}
.oe-n1:after{display:none}
.oe-n2{background:#fff;color:#042C53;box-shadow:0 3px 10px rgba(0,0,0,.25),inset 0 0 0 1.5px #9cc3ff}
.oe-n3{background:#fff;color:#042C53;box-shadow:0 3px 10px rgba(0,0,0,.25)}
.oe-type{display:inline-block;overflow:hidden;white-space:nowrap;vertical-align:bottom;border-right:2px solid transparent}
.oe-n1,.oe-n2{display:none}
@media (prefers-reduced-motion: no-preference){
  .oe-n1,.oe-n2{display:inline-block}
  .oe-n1{animation:oeF1 10s infinite}
  .oe-n2{animation:oeF2 10s infinite}
  .oe-n3{opacity:0;animation:oeF3 10s infinite}
  .oe-type{animation:oeTyp 10s steps(21) infinite,oeCar .7s step-end infinite}
  @keyframes oeF1{0%,2%{opacity:0;transform:translateX(-50%) translateY(6px) scale(.85)}6%,24%{opacity:1;transform:translateX(-50%)}28%,100%{opacity:0;transform:translateX(-50%)}}
  @keyframes oeF2{0%,26%{opacity:0}30%,64%{opacity:1}68%,100%{opacity:0}}
  @keyframes oeTyp{0%,31%{width:0ch}60%,100%{width:21ch}}
  @keyframes oeCar{0%,49%{border-color:#0b5fd7}50%,100%{border-color:transparent}}
  @keyframes oeF3{0%,68%{opacity:0;transform:translateX(-50%) translateY(6px) scale(.85)}72%,94%{opacity:1;transform:translateX(-50%)}98%,100%{opacity:0;transform:translateX(-50%)}}
}
.oe-nom{color:#fff;font-weight:700;font-size:14px;margin-top:9px}
.oe-cap{color:rgba(255,255,255,.55);font-size:11px;margin-top:2px}
.oe-bod{padding:20px 22px 0}
.oe-tit{font-size:17.5px;font-weight:800;color:var(--ink-900);margin:0 0 6px;text-align:center}
.oe-sub{font-size:13px;color:var(--ink-500);line-height:1.55;text-align:center;margin:0 0 16px}
.oe-fila{display:flex;align-items:center;gap:11px;padding:9px 0;border-top:1px solid var(--ink-100);font-size:12.5px;color:var(--ink-700);line-height:1.4}
.oe-fic{width:30px;height:30px;border-radius:9px;background:#E6F1FB;color:var(--royal);display:flex;align-items:center;justify-content:center;flex:none}
.oe-fic svg,.oe-fic i{width:16px;height:16px}
.oe-cta{display:block;width:100%;margin-top:16px;background:var(--royal);color:#fff;border:none;border-radius:12px;padding:12px 0;font-size:14px;font-weight:700;cursor:pointer;text-align:center;transition:transform .12s,background .15s}
.oe-cta:hover{background:var(--bright)}
.oe-cta:active{transform:scale(.98)}
.rk-vacio{text-align:center;color:rgba(255,255,255,.45);font-size:12px;padding:26px 0}
.rk-prev-note{text-align:center;color:rgba(255,255,255,.8);font-size:11.5px;line-height:1.45;margin:2px 0 14px}
.rk-podio.rk-modo-prev{display:block}
.rk-prev-podio{display:flex;align-items:flex-end;justify-content:center;gap:14px;opacity:.82}
/* Personas del podio: clicables → mini-perfil con medallas y logros */
.rk-p[data-rkp]{cursor:pointer;transition:transform .15s}
.rk-p[data-rkp]:hover{transform:translateY(-3px)}
/* Card del perfil tipo TICKET coleccionable: borde perforado de estampita
   a los lados y tematizado según el puesto (oro / plata / bronce) */
.rkp-card{border-radius:22px;max-width:340px;
  -webkit-mask:radial-gradient(circle 7px at 0 50%,transparent 7px,#000 7.6px) 0 0/51% 26px repeat-y,
               radial-gradient(circle 7px at 100% 50%,transparent 7px,#000 7.6px) 100% 0/51% 26px repeat-y;
  mask:radial-gradient(circle 7px at 0 50%,transparent 7px,#000 7.6px) 0 0/51% 26px repeat-y,
       radial-gradient(circle 7px at 100% 50%,transparent 7px,#000 7.6px) 100% 0/51% 26px repeat-y}
.rkp-band{height:84px;background:linear-gradient(165deg,var(--navy) 0%,#0A3D7A 55%,#1B5CA8 100%);border-radius:22px 22px 0 0;position:relative}
.rkp-card.oro .rkp-band{background:linear-gradient(165deg,#FFE27A 0%,#F0A819 60%,#DD8A0C 100%)}
.rkp-card.plata .rkp-band{background:linear-gradient(165deg,#EDF1F7 0%,#ADB8C9 60%,#8E99AC 100%)}
.rkp-card.bronce .rkp-band{background:linear-gradient(165deg,#F0B47E 0%,#C77B33 60%,#9C5A1F 100%)}
.rkp-ava-wrap{display:flex;justify-content:center;margin-top:-46px;margin-bottom:10px}
.rkp-card .rk-ava{width:92px;height:92px;font-size:26px;color:#03244a;border:4px solid var(--white);box-shadow:0 0 0 4px #F7C948,0 12px 26px rgba(3,36,74,.3)}
.rkp-card.plata .rk-ava{box-shadow:0 0 0 4px #B9C2D0,0 12px 26px rgba(3,36,74,.3)}
.rkp-card.bronce .rk-ava{box-shadow:0 0 0 4px #CD7F32,0 12px 26px rgba(3,36,74,.3)}
.rkp-nom{font-size:20px;font-weight:800;color:var(--ink-900);text-align:center}
.rkp-sub{font-size:10.5px;color:var(--ink-500);font-family:var(--font-mono);text-align:center;margin:3px 22px 16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rkp-body{padding:0 26px 26px}
.rkp-body .mp-medallas{margin-bottom:16px}
.rkp-body .mp-medalla{padding:11px 6px;font-size:9.5px;border-radius:12px}
.rkp-body .mp-medalla .em{font-size:22px}
/* Mobile: el ticket se queda centrado (no bottom-sheet) */
@media(max-width:600px){
  .modal.rkp-card{position:relative;bottom:auto;left:auto;right:auto;width:100%;max-width:330px;margin:auto;border-radius:22px}
  #rk-perfil-overlay{align-items:center;padding:20px}
}
/* Mobile: nada del tablero puede salirse del ancho de pantalla */
@media(max-width:640px){
  .prod-board,.prod-col{min-width:0;max-width:100%}
  .trab-card{max-width:100%}
  .trab-row1,.trab-row2,.trab-card .trab-actions{flex-wrap:wrap}
  .trab-alerta-txt{max-width:130px}
  .trab-card .cs .cs-trigger{max-width:128px}
  /* Toggle Tablero|Ranking|Estadísticas: ancho completo sin desbordar */
  #prod-toggles{width:100%}
  #prod-toggles .period-toggle{width:100%;display:flex}
  #prod-toggles .period-btn{flex:1;min-width:0;padding:8px 4px!important;font-size:11px!important;letter-spacing:.01em;white-space:nowrap}
}
/* Totales del equipo en la semana — fondo claro con barras que destellan */
/* Tops por CANTIDAD (no por puntos): el podio premia puntos, estas listas el volumen de trabajos. Lado a lado en desktop. */
.rk-tops{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
@media(max-width:900px){.rk-tops{grid-template-columns:1fr}}
.rk-tops-card{background:var(--white);border-radius:18px;border:1px solid var(--ink-150);box-shadow:0 1px 2px rgba(16,16,16,.04),0 12px 28px -16px rgba(3,36,74,.18);padding:20px}
.rk-tops-list{display:flex;flex-direction:column}
.rk-tops-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--ink-100)}
.rk-tops-row:last-child{border-bottom:none}
.rk-tops-rank{width:16px;flex-shrink:0;font-size:13px;font-weight:800;color:var(--ink-300);font-variant-numeric:tabular-nums;text-align:center}
.rk-tops-av{position:relative;width:38px;height:38px;border-radius:50%;flex-shrink:0;background-size:cover;background-position:center;background-color:var(--royal);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff}
.rk-tops-nm{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--ink-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* (v4.222) Nombre + estado del día apilados en las listas semanales */
.rk-tops-nmwrap{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.rk-tops-nmwrap .rk-tops-nm{flex:none}
.rk-tops-nm .medalla-mes{vertical-align:-3px}
.rk-tops-est{font-size:11px;font-style:italic;color:var(--ink-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* (v4.225) El estado propio se edita también desde los tops semanales */
.rk-tops-est[data-est-edit]{cursor:pointer}
.rk-tops-est.mia:hover{color:var(--ink-700)}
.rk-tops-est.ghost{font-style:normal;font-weight:700;color:var(--bright)}
.rk-tops-est.ghost:hover{text-decoration:underline}
.rk-tops-est .rk-nube-in{width:160px;text-align:left;font-style:normal;color:var(--ink-700)}
.rk-tops-n{font-size:20px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--navy);flex-shrink:0;line-height:1}
.rk-tops-n .u{font-size:11px;font-weight:600;color:var(--ink-500);margin-left:3px}
.rk-tops-empty{padding:14px 2px;font-size:13px;color:var(--ink-400)}
.rk-tops-row:first-child .rk-tops-rank,.rk-tops-row:first-child .rk-tops-n{color:var(--bright)}
.rk-week{background:var(--white);border-radius:18px;border:1px solid var(--ink-150);box-shadow:0 1px 2px rgba(16,16,16,.04),0 12px 28px -16px rgba(3,36,74,.18);padding:20px}
.rk-week-tit{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-500);display:flex;align-items:center;gap:7px;margin-bottom:14px}
.rk-week-tit i,.rk-week-tit svg{width:14px;height:14px}
.rk-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media(max-width:760px){.rk-tiles{grid-template-columns:repeat(2,1fr)}}
/* Tiles del equipo: fondo claro por métrica + barra de progreso que destella */
.rk-tile{display:block;border-radius:14px;padding:13px 15px;animation:tileIn .5s cubic-bezier(.16,1,.3,1) both}
.rk-tile:nth-child(2){animation-delay:.08s}
.rk-tile:nth-child(3){animation-delay:.16s}
.rk-tile:nth-child(4){animation-delay:.24s}
@keyframes tileIn{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.rk-tile{animation:none}}
.rkt-top{display:flex;align-items:center;gap:11px}
.rkt-ic{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rkt-ic i,.rkt-ic svg{width:18px;height:18px}
/* Tiles blancos — el color vive en el icono, el número y la barra brillante */
.rk-tile{background:var(--white);border:1px solid var(--ink-100)}
.rk-tile.rkt-a .rkt-ic{background:var(--k-nuevo);color:#fff}.rk-tile.rkt-a .v{color:#4D36B8}
.rk-tile.rkt-a .rk-bar i{background:linear-gradient(90deg,#8B66FF,#5B33F0);box-shadow:0 0 10px rgba(108,79,224,.65)}
.rk-tile.rkt-b .rkt-ic{background:var(--k-cola);color:#fff}.rk-tile.rkt-b .v{color:#185FA5}
.rk-tile.rkt-b .rk-bar i{background:linear-gradient(90deg,#4D9BFF,#1E6FE8);box-shadow:0 0 10px rgba(47,127,224,.65)}
.rk-tile.rkt-c .rkt-ic{background:var(--k-imprimiendo);color:#fff}.rk-tile.rkt-c .v{color:#9A6A00}
.rk-tile.rkt-c .rk-bar i{background:linear-gradient(90deg,#FFB52E,#F08C00);box-shadow:0 0 10px rgba(232,149,12,.65)}
.rk-tile.rkt-d .rkt-ic{background:var(--k-terminado);color:#fff}.rk-tile.rkt-d .v{color:#187A45}
.rk-tile.rkt-d .rk-bar i{background:linear-gradient(90deg,#2ECC71,#17A055);box-shadow:0 0 10px rgba(35,165,94,.65)}
.rk-tile .l{font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-500)}
.rk-tile .v{font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:2px}
.rk-tile .v .u{font-size:11px;font-weight:600;color:var(--ink-500);margin-left:2px}
/* La barra crece hasta su valor y un destello intenso la recorre */
.rk-bar{height:7px;border-radius:999px;background:var(--ink-100);margin-top:10px;overflow:hidden}
.rk-bar i{display:block;height:100%;border-radius:999px;width:0;position:relative;overflow:hidden;transition:width .9s cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion: no-preference){
  .rk-bar i::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 22%,rgba(255,255,255,.95) 50%,transparent 78%);transform:translateX(-100%);animation:barShine 1.9s ease-in-out infinite}
  @keyframes barShine{55%,100%{transform:translateX(100%)}}
}
/* ── Mobile: controles del módulo alineados y de un mismo alto ── */
@media(max-width:640px){
  #prod-mode-row{gap:8px}
  /* Los dos toggles (vista + Sem/Mes/Año) se APILAN en su propia fila: en
     Estadísticas ya no se montan uno encima del otro */
  #prod-toggles{width:100%;flex-direction:column;align-items:stretch;gap:8px}
  #prod-toggles .period-toggle{width:100%;display:flex}
  #prod-toggles .period-btn{flex:1}
  #pf-zone{margin-left:0;width:100%;flex-wrap:wrap}
  #pf-search{flex:1;margin-left:0;min-width:0}
  #prod-mode-row .search input{width:100%;height:40px;box-sizing:border-box}
  .pf-btn{width:40px;height:40px}
  .prod-filtros{width:100%}
}
@keyframes panelBack{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:translateX(0)}}
/* ── MI PERFIL ── */
.mp-hero{background:linear-gradient(160deg,var(--navy) 0%,#0A3D7A 100%);border-radius:16px 16px 50% 50% / 16px 16px 46px 46px;padding:24px 22px 40px;text-align:center;color:#fff;margin-bottom:0}
.mp-avatar{position:relative;width:72px;height:72px;border-radius:50%;background:var(--bright);color:#03244a;font-size:24px;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 10px;background-size:cover;background-position:center;border:3px solid rgba(255,255,255,.25)}
.mp-nombre{font-size:19px;font-weight:800}
.mp-idline{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;margin-top:5px}
.mp-idline #mp-hero-puesto{font-size:12px;color:rgba(255,255,255,.72)}
.mp-idline .mp-email{font-size:10.5px;color:rgba(255,255,255,.5);font-family:var(--font-mono);letter-spacing:.02em}
.mp-sep{color:rgba(255,255,255,.3)}
/* Mi perfil: el navy llega ARRIBA y a los LADOS (el header — Mi perfil, Salir, X — queda DENTRO del navy, con colores claros/dorados) */
#miperfil-overlay .modal-header{background:var(--navy);border-bottom:none;margin-bottom:0;padding:20px 24px 12px}
#miperfil-overlay .modal-title{color:#fff}
#miperfil-overlay .mp-salir{color:#FFD24A}
#miperfil-overlay .mp-salir:hover{background:transparent}
#miperfil-overlay .modal-close{color:#fff}
#miperfil-overlay .modal-close:hover{background:transparent;color:#fff}
#miperfil-overlay .mp-head-actions .modal-close::before{background:rgba(255,255,255,.28)}
/* El hero rompe el padding del body para tocar los bordes; sin curva arriba (la pone el header), curva abajo */
#miperfil-overlay .mp-hero{margin:0 -28px;border-radius:0 0 50% 50% / 0 0 46px 46px;padding:8px 22px 40px}
/* Mi perfil: ocultar la barra de scroll (se veía fea); el modal sigue scrolleando */
#miperfil-overlay .modal{scrollbar-width:none;-ms-overflow-style:none}
#miperfil-overlay .modal::-webkit-scrollbar{display:none}
.mp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.mp-stat .v{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}
.mp-stat .l{font-size:9px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:2px}
.mp-stat-hero .v{font-size:27px;color:#FCD34D;line-height:1}
.mp-stat-hero .l{color:rgba(252,211,77,.9)}
.mp-medallas{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}
.mp-medalla{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border-radius:14px;padding:14px 8px;font-size:10.5px;font-weight:800;color:#fff;text-align:center;line-height:1.25;text-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 5px 14px rgba(3,36,74,.14)}
.mp-medalla .em{font-size:27px;line-height:1;text-shadow:none}
.md-1{background:linear-gradient(145deg,#8B82E8,#534AB7)}
.md-2{background:linear-gradient(145deg,#3F93E8,#185FA5)}
.md-3{background:linear-gradient(145deg,#F7A92D,#DE7B0F)}
.md-4{background:linear-gradient(145deg,#F0717B,#D8344A)}
.md-5{background:linear-gradient(145deg,#F7C948,#DB9A10)}
.md-6{background:linear-gradient(145deg,#43C17A,#1D9E58)}
/* Logro bloqueado → placeholder gris difuso (sin pista de cuál es, se revela al desbloquear) */
.mp-medalla.off{background:var(--ink-100)!important;color:transparent;box-shadow:none;filter:none;text-shadow:none}
.mp-medalla.off .em{visibility:hidden}
.file-row{display:flex;align-items:center;gap:10px}
.file-btn{display:inline-flex;align-items:center;gap:8px;background:var(--ink-50);border:1px solid var(--ink-200);border-radius:8px;padding:11px 18px;font-size:13px;font-weight:700;color:var(--navy);cursor:pointer;font-family:inherit;transition:border-color .15s}
.file-btn:hover{border-color:var(--navy)}
.file-name{font-size:12px;color:var(--ink-500);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px}
.odoo-linea.done{opacity:.45;text-decoration:line-through}
.md-esp{background:linear-gradient(135deg,#FFE27A,#F0A819 55%,#DD8A0C);box-shadow:0 0 0 2px #F7CE58,0 6px 18px rgba(240,168,25,.45)}
/* Celebración de hitos (ocultos hasta lograrlos) */
.logro-overlay{position:fixed;inset:0;background:rgba(3,18,38,.74);display:none;align-items:center;justify-content:center;z-index:300;padding:20px}
.logro-overlay.open{display:flex}
.logro-card{background:#fff;border-radius:24px;padding:34px 34px 22px;text-align:center;max-width:340px;width:100%;animation:logroPop .5s cubic-bezier(0.16,1,0.3,1)}
.logro-card.especial{box-shadow:0 0 0 3px #F0C040,0 18px 55px rgba(240,168,25,.5)}
/* Medalla pentagonal dorada (estilo estampita coleccionable) */
.logro-badge{width:96px;height:92px;margin:0 auto 16px;background:linear-gradient(165deg,#FFE27A 0%,#F0A819 62%,#DD8A0C 100%);clip-path:polygon(50% 0%,100% 38%,81% 100%,19% 100%,0% 38%);display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 10px 16px rgba(240,168,25,.45));animation:logroEm .9s ease infinite alternate}
.logro-badge span{font-size:38px;line-height:1}
.logro-sub{font-size:11.5px;color:var(--ink-500);margin-top:10px;line-height:1.5}
.logro-claim{display:block;width:100%;margin-top:18px;background:var(--ink-900);color:#fff;border:none;border-radius:999px;padding:14px;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;transition:opacity .15s,transform .12s}
.logro-claim:hover{opacity:.88}
.logro-claim:active{transform:scale(.98)}
.logro-skip{display:block;width:100%;margin-top:6px;background:none;border:none;color:var(--ink-500);font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit;padding:9px}
.logro-skip:hover{color:var(--ink-700)}
/* Estampitas en Mi perfil (máx. 3, el usuario las elige) */
.mp-sec-tit{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);margin:2px 0 9px}
.mp-sec-tit small{font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-500)}
/* Estampitas (medallas que luce): repisa uniforme y alineada, con aire respecto al título.
   Mismo tamaño para las tres (sin "centro protagonista", que desbalanceaba con badges repetidos);
   entrada escalonada sutil al abrir el perfil. */
.mp-estampitas{display:flex;justify-content:center;align-items:flex-start;gap:18px;margin:16px 0 30px;position:relative;z-index:2}
.mp-estampitas:empty{display:none}
/* En Mi perfil se montan sobre la curva del hero navy → margen negativo solo ahí */
#miperfil-overlay .mp-estampitas{margin:-6px 0 30px}
.mp-est{display:flex;flex-direction:column;align-items:center;gap:11px;background:none;border:none;padding:0;font-family:inherit}
.mp-est:not(.placeholder){opacity:0;animation:estIn .44s cubic-bezier(0.16,1,0.3,1) forwards}
.mp-est:nth-child(1){animation-delay:.04s}
.mp-est:nth-child(2){animation-delay:.10s}
.mp-est:nth-child(3){animation-delay:.16s}
@keyframes estIn{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.mp-est-badge{width:76px;height:73px;background:linear-gradient(165deg,#FFE27A,#F0A819 62%,#DD8A0C);clip-path:polygon(50% 0%,100% 38%,81% 100%,19% 100%,0% 38%);display:flex;align-items:center;justify-content:center;font-size:33px;filter:drop-shadow(0 7px 13px rgba(3,36,74,.32))}
.mp-est-badge.svg{background:none;clip-path:none}
.mp-est-badge.svg img{width:76px;height:76px;display:block;filter:drop-shadow(0 8px 15px rgba(3,36,74,.32))}
.mp-est-lbl{font-size:10px;font-weight:800;color:var(--navy);text-align:center;line-height:1.25;max-width:96px;min-height:2.5em;display:flex;align-items:center;justify-content:center}
/* Slot vacío: medalla placeholder gris difusa (se llena al desbloquear) */
.mp-est.placeholder .mp-est-badge{background:var(--ink-150);filter:none;box-shadow:inset 0 2px 7px rgba(3,36,74,.07)}
.mp-est.placeholder .mp-est-badge img,.mp-est.placeholder .mp-est-lbl{visibility:hidden}
.mp-est.placeholder{opacity:.85}
.mp-est{cursor:pointer}
.mp-est.placeholder{cursor:default}
.mp-est.off{opacity:.5;filter:grayscale(.4);transition:opacity .15s,filter .15s}
.mp-est.off:hover{opacity:.9;filter:grayscale(0)}
.mp-est-disp{margin:-14px 0 26px}
.mp-est-disp:empty{display:none}
.mp-est-disp-tit{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-500);text-align:center;margin-bottom:12px}
.mp-est-disp-row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.mp-est-disp-row .mp-est-badge{width:52px;height:50px;font-size:23px}
.mp-est-disp-row .mp-est-badge.svg img{width:52px;height:52px}
.mp-est-disp-row .mp-est-lbl{font-size:9px;min-height:auto;max-width:72px}
.mp-est-empty{font-size:12px;color:var(--ink-400);text-align:center;padding:4px 0}
@media(prefers-reduced-motion:reduce){.mp-est:not(.placeholder){animation:none;opacity:1}}
/* Pantallas muy angostas (iPhone SE/mini): encoge el trío para que no se recorte */
@media(max-width:360px){
  .mp-estampitas{gap:14px}
  .mp-est-badge{width:64px;height:61px;font-size:28px}
  .mp-est-badge.svg img{width:64px;height:64px}
}
/* Badges con SVG propio (ej. Velocista) en vez de la medalla pentagonal */
.logro-badge.svg{background:none;clip-path:none;filter:drop-shadow(0 10px 18px rgba(47,127,224,.4))}
.logro-badge.svg img{width:104px;height:104px}
/* (estampita .svg: estilos y tamaño 76px definidos arriba; sin duplicar para no pisar el tamaño) */
.logro-tit{font-size:18px;font-weight:800;margin-top:14px;color:var(--ink-900)}
.logro-lbl{font-size:13.5px;color:var(--ink-600);margin-top:6px;font-weight:600;line-height:1.45}
@keyframes logroPop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes logroEm{from{transform:scale(1) rotate(-3deg)}to{transform:scale(1.18) rotate(3deg)}}
@media(prefers-reduced-motion:reduce){.logro-card{animation:none}.logro-badge{animation:none}}
@media(max-width:600px){
  .hub-fecha-box{text-align:left;padding-bottom:0}
}
.trab-card[draggable="true"]{cursor:grab}
.trab-card.dragging{opacity:.45}

/* ── ESTADÍSTICAS: highlights e indicadores (estilo Excel) ── */
.rpd-high{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.rpd-high-chip{display:inline-flex;align-items:center;gap:9px;background:var(--white);border:1px solid var(--ink-150);border-radius:10px;padding:10px 15px}
.rpd-high-chip .em{font-size:17px;line-height:1}
.rpd-high-chip .tx{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-500)}
.rpd-high-chip .vl{font-size:13.5px;font-weight:800;color:var(--ink-900)}
.rpd-high-chip .vl span{font-weight:600;color:var(--ink-500);font-size:11.5px}
.rpd-campeones{margin:0 0 18px}
.rpd-camp-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:760px){.rpd-camp-grid{grid-template-columns:1fr}}
.rpd-camp{position:relative;border-radius:16px;padding:15px 18px;background:linear-gradient(180deg,#ffc845 0%,#f0a819 52%,#dd940a 100%);box-shadow:0 1px 2px rgba(120,80,10,.16),0 12px 26px -16px rgba(176,120,12,.5)}
.rpd-camp-rol{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#5e3c00;margin-bottom:11px}
.rpd-camp-win{display:flex;align-items:center;gap:12px}
.rpd-camp-ava .rp-ava{width:50px;height:50px;font-size:18px;border:2px solid #fff;box-shadow:0 0 0 3px rgba(74,45,0,.18)}
.rpd-camp-info{flex:1;min-width:0}
.rpd-camp-nom{font-size:19px;font-weight:800;color:#4a2d00;line-height:1.12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rpd-camp-pts{font-size:14px;font-weight:800;color:#5e3c00}
.rpd-camp-pts .rp-dec{font-size:.7em;opacity:.75}
.rpd-camp-tr{flex:none;width:38px;height:38px;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(120,80,10,.35))}
.rpd-camp-next{display:flex;gap:8px 16px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px solid rgba(94,60,0,.26);font-size:12px;color:#5e3c00;font-weight:700}
.rpd-camp-next .rp-dec{font-size:.75em}
.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:16px 0 28px}
/* Iconos de módulo SÓLIDOS: el color intenso guía el ojo sobre el fondo claro
   (los pastel no resaltaban — pedido del dueño, 12 jun) */
.hub-card[data-hub="produccion"] .hub-ic{background:var(--k-cola);border:none;color:#fff}
.hub-card[data-hub="bitacoras"] .hub-ic{background:var(--k-nuevo);border:none;color:#fff}
.hub-card[data-hub="consumo"] .hub-ic{background:var(--k-sub);border:none;color:#fff}
.hub-card[data-hub="reportes"] .hub-ic{background:var(--k-imprimiendo);border:none;color:#fff}
.hub-card[data-hub="reg-equipo"] .hub-ic{background:var(--navy);border:none;color:#fff}
.hub-card[data-hub="planificador"] .hub-ic{background:var(--plan);border:none;color:#fff}
.hub-card[data-hub="arqueos"] .hub-ic{background:#0B7A5C;border:none;color:#fff}   /* esmeralda propio del módulo Caja (no es color de estado del kanban) */
.hub-card[data-hub="config"] .hub-ic{background:#3D4451;border:none;color:#fff}    /* gris pizarra propio de Configuración */
/* Detalleros de taller (body.solo-taller): ven el Planificador y, además, los
   módulos que Configuración les haya concedido en panel_permisos. Esos navs se
   marcan con .perm-ok desde aplicarPermisosBD y quedan exentos del ocultamiento;
   el resto de tarjetas/nav/tabs se ocultan (el Inicio se personaliza aparte). */
body.solo-taller .hub-card:not([data-hub="planificador"]):not(.perm-ok){display:none!important}
body.solo-taller .bnav-btn:not([data-bnav="planificador"]):not(.perm-ok){display:none!important}
body.solo-taller .tab:not([data-tab="planificador"]):not(.perm-ok){display:none!important}
/* Icon-nav del topbar (escritorio): también solo Planificador + lo concedido. Sin
   esto, el detallero seguía viendo el icono de Inicio aunque switchTab lo rebotara. */
body.solo-taller .icon-nav button[data-nav]:not([data-nav="planificador"]):not(.perm-ok){display:none!important}
body.solo-taller .suc-toggle:not(.perm-ok){display:none!important}   /* .perm-ok: se revela si Config le concede Producción (necesita la sucursal) */
.hub-card{display:flex;flex-direction:column;align-items:flex-start;gap:11px;background:var(--white);border:none;box-shadow:0 1px 3px rgba(3,36,74,.06);border-radius:14px;padding:20px;cursor:pointer;font-family:inherit;text-align:left;position:relative;outline:none;transition:transform .16s cubic-bezier(0.16,1,0.3,1),box-shadow .16s}
.hub-card:hover,.hub-card:focus-visible{transform:translateY(-2px);box-shadow:0 12px 28px rgba(3,36,74,.10)}
.hub-ic{width:42px;height:42px;border-radius:10px;background:var(--ink-50);border:1px solid var(--ink-150);display:flex;align-items:center;justify-content:center;color:var(--navy);flex-shrink:0}
.hub-ic i{width:20px;height:20px}
.hub-tit{font-size:15px;font-weight:800;letter-spacing:-.01em;color:var(--ink-900);line-height:1.25}
.hub-sub{font-size:12px;color:var(--ink-500);line-height:1.45}
.hub-badge{position:absolute;top:14px;right:14px;font-size:11px;font-weight:800;background:var(--navy);color:#fff;border-radius:999px;padding:3px 10px;font-variant-numeric:tabular-nums}
.hub-card.primary{background:var(--navy);border-color:var(--navy)}
.hub-card.primary .hub-ic{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);color:#fff}
.hub-card.primary .hub-tit{color:#fff}
.hub-card.primary .hub-sub{color:rgba(255,255,255,.82)}
.hub-card.primary:hover{box-shadow:0 14px 32px rgba(3,36,74,.30)}
@media(max-width:900px){.hub-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.hub-grid{gap:10px}.hub-card{padding:15px;border-radius:12px}.hub-tit{font-size:13.5px}.hub-ic{width:36px;height:36px}}

/* ── REPORTES · DASHBOARD DE PRODUCCIÓN ── */
.rp-grid{display:grid;column-gap:10px;row-gap:0}
.rp-row{grid-template-columns:subgrid;grid-column:1/-1;display:grid;align-items:center;padding:8px 0;border-bottom:1px solid var(--ink-100)}
.rp-row:last-child{border-bottom:none}
.rp-head{padding:0 0 8px;margin-bottom:2px;border-bottom:1px solid var(--ink-150)}
.rp-row .nm{font-size:12.5px;font-weight:600;color:var(--ink-800);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-row .tr{height:8px;border-radius:999px;background:var(--ink-100);overflow:hidden}
.rp-row .tr i{display:block;height:100%;background:var(--royal);border-radius:999px}
.rp-h{font-size:10px;font-weight:700;letter-spacing:.02em;color:var(--ink-400);text-align:right;padding-left:10px;white-space:nowrap}
.rp-c{font-size:11.5px;font-weight:600;color:var(--ink-500);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;border-left:1px solid var(--ink-100);padding-left:10px}
.rp-c1{font-size:13px;font-weight:800;color:var(--ink-900)}
.rp-ava{display:none}
.nm-mob{display:none}
@media(max-width:700px){
  .rp-ppl .nm{display:flex;align-items:center;gap:7px;min-width:0}
  .rp-ppl .nm .nm-txt{display:none}
  .rp-ppl .nm .nm-mob{display:inline-block;font-weight:600;color:var(--ink-800);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  .rp-ppl .nm .rp-ava{display:inline-flex;flex-shrink:0;width:26px;height:26px;border-radius:50%;background-size:cover;background-position:center;background-color:var(--ink-200);color:var(--ink-700);font-size:10.5px;font-weight:800;align-items:center;justify-content:center;overflow:hidden}
}
.rp-dec{display:inline-block;min-width:14px;text-align:left;font-size:.6em;font-weight:700;vertical-align:.42em;letter-spacing:-.01em}
.card.tight .card-desc{border-bottom:none}
.rp-hours{height:130px;display:flex;align-items:flex-end;gap:4px;margin-top:14px}
.rp-hour{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;min-width:0}
.rp-hour .b{width:68%;max-height:calc(100% - 18px);background:var(--royal);border-radius:4px 4px 0 0;min-height:2px}
.rp-hour .h{font-size:9px;color:var(--ink-500);font-weight:600;font-variant-numeric:tabular-nums}
@media(max-width:700px){.rp-grid{column-gap:6px}.rp-c,.rp-h{padding-left:7px;font-size:11px}.rp-c1{font-size:12px}}

/* ── FASE 2: tarjeta de preparación (form) + panel de incidencia (modal card) ── */
/* Tarjeta-toggle "lleva preparación": ícono + texto + punto que se llena al activar */
.prep-duo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:430px){.prep-duo{grid-template-columns:1fr}}
.prep-card{display:flex;flex-direction:column;gap:5px;width:100%;text-align:left;border:1.5px solid var(--ink-150);background:var(--white);border-radius:22px;padding:11px 15px;cursor:pointer;font-family:inherit;position:relative;overflow:hidden;transition:border-color .3s ease,transform .12s cubic-bezier(.23,1,.32,1)}
.prep-card:active{transform:scale(.99)}
/* Relleno azul que CRECE desde el check (esquina) al seleccionar y se VACÍA al quitar */
.prep-card::before{content:'';position:absolute;inset:0;background:#1b74f8;clip-path:circle(0% at calc(100% - 22px) 22px);transition:clip-path .45s cubic-bezier(.23,1,.32,1);z-index:0}
.prep-card.on{border-color:#1b74f8}
.prep-card.on::before{clip-path:circle(165% at calc(100% - 22px) 22px)}
.prep-card>*{position:relative;z-index:1}
.prep-ic{flex-shrink:0;width:30px;height:30px;border-radius:9px;background:var(--ink-100);color:var(--ink-400);display:flex;align-items:center;justify-content:center;transition:background .3s ease .1s,color .3s ease .1s}
.prep-ic i,.prep-ic svg{width:16px;height:16px}
.prep-head{display:flex;align-items:center;gap:9px;min-width:0;padding-right:28px}
.prep-head b{font-size:13px;font-weight:800;color:var(--ink-900);line-height:1.15;transition:color .3s ease .1s}
.prep-card>small{display:block;font-size:10.5px;color:var(--ink-500);line-height:1.25;transition:color .3s ease .1s}
.prep-dot{position:absolute;top:11px;right:11px;width:20px;height:20px;border-radius:50%;border:2px solid var(--ink-200);display:flex;align-items:center;justify-content:center;transition:background .3s ease .1s,border-color .3s ease .1s}
.prep-dot i,.prep-dot svg{width:13px;height:13px;color:#fff;opacity:0;transform:scale(.5);transition:opacity .2s ease .15s,transform .25s cubic-bezier(.23,1,.32,1) .15s}
.prep-card.on .prep-head b{color:#fff}
.prep-card.on>small{color:rgba(255,255,255,.92)}
.prep-card.on .prep-ic{background:rgba(255,255,255,.22);color:#fff}
.prep-card.on .prep-dot{background:#fff;border-color:#fff}
.prep-card.on .prep-dot i,.prep-card.on .prep-dot svg{color:#1b74f8;opacity:1;transform:scale(1)}
/* Panel de incidencia: se despliega con grid-rows + opacidad (ease-out fuerte) */
#trab-acc-incid{display:grid;grid-template-rows:0fr;opacity:0;margin:0;transition:grid-template-rows .22s cubic-bezier(.23,1,.32,1),opacity .18s ease,margin .2s ease}
#trab-acc-incid.open{grid-template-rows:1fr;opacity:1;margin:8px 0 16px}
#trab-acc-incid .incid-inner{overflow:hidden;min-height:0;background:var(--ink-50);border:none;border-radius:14px;padding:14px}
.incid-field{margin-bottom:12px}
.incid-field:last-of-type{margin-bottom:0}
.incid-lbl{display:block;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-500);margin-bottom:7px}
/* Segmento con PULGAR DESLIZANTE (2 opciones iguales): el thumb viaja con transform */
.incid-seg{position:relative;display:flex;width:100%;background:var(--ink-100);border-radius:10px;padding:3px}
.incid-seg .seg-thumb{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:8px;background:#fff;box-shadow:0 1px 3px rgba(16,16,16,.14);z-index:0;transition:transform .26s cubic-bezier(.22,1,.36,1),opacity .15s ease}
.incid-seg.pos1 .seg-thumb{transform:translateX(100%)}
.incid-seg.none .seg-thumb{opacity:0}
.incid-seg button{position:relative;z-index:1;flex:1;font:inherit;font-size:12.5px;font-weight:700;color:var(--ink-500);background:none;border:none;border-radius:8px;padding:9px 8px;cursor:pointer;transition:transform .12s cubic-bezier(.23,1,.32,1),color .15s ease}
.incid-seg button.sel{color:var(--ink-900)}
.incid-seg button:active{transform:scale(.96)}
.incid-nota{width:100%;min-height:52px;margin-top:12px;font:inherit;font-size:13px;padding:9px 11px;border:1.5px solid var(--ink-150);border-radius:10px;resize:vertical;box-sizing:border-box;background:#fff}
.incid-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
/* Botones de acción del pedido: colores notorios por intención (Emil: el color comunica) */
.acc-btn.act-edit{border-color:transparent;background:#EAF1FB}
.acc-btn.act-edit:hover{background:#DCE8FC}
.acc-btn.act-incid{background:#C9740F;border-color:#C9740F;color:#fff}
.acc-btn.act-incid small{color:rgba(255,255,255,.85)}
.acc-btn.act-incid i,.acc-btn.act-incid svg{color:#fff}
.acc-btn.act-incid:hover{background:#E68A1E;border-color:#E68A1E}
#trab-acc-incid-btn.expanded{background:#C9740F;border-color:#C9740F}
.acc-btn.warn{background:#C9740F;border-color:#C9740F;color:#fff}
.acc-btn.warn small{color:rgba(255,255,255,.85)}
.acc-btn.warn i,.acc-btn.warn svg{color:#fff}
.acc-btn.peligro{background:var(--fail);border-color:var(--fail);color:#fff}
.acc-btn.peligro i,.acc-btn.peligro svg{color:#fff}
.acc-btn.peligro small{color:rgba(255,255,255,.82)}
.acc-btn.peligro:hover{background:#D6361F;border-color:#D6361F}
/* Botón "Volver a imprimir etiqueta": contorno azul; en hover se rellena de azul con texto blanco */
#trab-acc-reimprimir{border-color:#277AF4}
#trab-acc-reimprimir i,#trab-acc-reimprimir svg{color:#277AF4}
#trab-acc-reimprimir:hover{background:#277AF4;border-color:#277AF4;color:#fff}
#trab-acc-reimprimir:hover small{color:rgba(255,255,255,.9)}
#trab-acc-reimprimir:hover i,#trab-acc-reimprimir:hover svg{color:#fff}
/* Pedido interno: pill "Interna" en las cards + campo de foto en el modal */
.trab-pill.pill-interna{background:#1a1a1a;color:#fff;text-transform:uppercase;letter-spacing:.03em}
.int-switch{display:inline-flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;font-family:inherit;padding:4px 2px}
.int-sw-lbl{font-size:13px;font-weight:700;color:#3a4a63}
.int-track{position:relative;width:42px;height:24px;background:#cbd3de;border-radius:999px;transition:background .18s;flex-shrink:0;display:inline-block}
.int-knob{position:absolute;top:3px;left:3px;width:18px;height:18px;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .18s}
.int-switch.on .int-track{background:#277AF4}
.int-switch.on .int-knob{left:21px}
.int-foto{margin:2px 0}
.int-foto-lbl{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#1B5FB0;background:#EAF1FB;border:1.5px solid #CBE0F7;border-radius:999px;padding:11px 18px;cursor:pointer;transition:background .15s}
.int-foto-lbl:hover{background:#DCE8FC}
.int-foto-lbl i,.int-foto-lbl svg{width:16px;height:16px}
@media (prefers-reduced-motion: reduce){#trab-acc-incid{transition-duration:0ms}.incid-seg .seg-thumb{transition:opacity .12s}}
/* Tag "actualizado" en el título cuando Odoo cambió el nombre del pedido */
.acc-upd-tag{display:inline-block;vertical-align:middle;margin-left:7px;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ok);background:var(--ok-soft);padding:3px 8px;border-radius:999px}
/* Banner de preview de actualización de Odoo (con confirmación, NUNCA escribe solo) */
#trab-acc-odooupd{display:grid;grid-template-rows:0fr;opacity:0;margin:0;transition:grid-template-rows .22s cubic-bezier(.23,1,.32,1),opacity .18s ease,margin .2s ease}
#trab-acc-odooupd.show{grid-template-rows:1fr;opacity:1;margin:0 0 14px}
#trab-acc-odooupd .odooupd-inner{overflow:hidden;min-height:0;background:#EAF1FB;border-radius:14px;padding:14px}
.odooupd-head{font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--royal);display:flex;align-items:center;gap:6px;margin-bottom:8px}
.odooupd-head i,.odooupd-head svg{width:14px;height:14px}
.odooupd-txt{font-size:13.5px;font-weight:700;color:var(--ink-900);line-height:1.35}
.odooupd-sub{font-size:11.5px;color:var(--ink-500);margin:-2px 0 10px}
.odooupd-col{border-radius:10px;padding:9px 11px}
.odooupd-old{background:var(--white);border:1px solid var(--ink-150)}
.odooupd-new{background:var(--white);border:1.5px solid var(--royal)}
.odooupd-lbl{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;margin-bottom:3px}
.odooupd-old .odooupd-lbl{color:var(--ink-400)}
.odooupd-new .odooupd-lbl{color:var(--royal)}
.odooupd-val{font-size:13.5px;font-weight:700;color:var(--ink-900);line-height:1.35}
.odooupd-old .odooupd-val{color:var(--ink-500);font-weight:600}
.odooupd-arrow{text-align:center;font-size:15px;color:var(--ink-400);line-height:1;margin:5px 0}
.odooupd-prod{font-size:11.5px;color:var(--ink-500);margin-top:8px}
.odooupd-acts{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.odoo-pills{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:-2px 0 14px}
.odoo-pills:empty{display:none}
.odoosync{display:none}
.odoosync.show{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:6px 10px;border-radius:999px;margin:0}
.odoosync i,.odoosync svg{width:14px;height:14px}
.odoosync.ok{background:var(--ok);color:#fff}
.odoosync.warn{background:var(--warn);color:#fff}
.odoosync.check,.odoosync.neutral{background:var(--ink-100);color:var(--ink-500)}
.acc-prev{font-size:11.5px;color:var(--ink-400);margin:-8px 0 12px;line-height:1.45;overflow-wrap:anywhere}
.acc-prev-lbl{font-weight:700;color:var(--ink-500)}
.odooetapa{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:6px 10px;border-radius:999px;margin:0;background:#EAF1FB;color:var(--royal)}
.odooetapa .oe-lbl{font-size:9.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;opacity:.7}
@media(max-width:560px){
  .o-hide-sm{display:none}
  .odoosync.show,.odooetapa{font-size:11px;padding:5px 9px;gap:5px}
  .odoosync i,.odoosync svg{width:13px;height:13px}
  .odooetapa .oe-lbl{font-size:9px}
}
/* Preview del arte del pedido en la ficha (imagen en vivo desde Odoo) */
.acc-arte{margin:0 0 14px;border-radius:12px;overflow:hidden;background:var(--ink-50);border:1px solid var(--ink-150);position:relative}
.acc-arte img{display:block;width:100%;max-height:260px;object-fit:contain;background:var(--ink-50);cursor:zoom-in;animation:arteIn .42s cubic-bezier(.23,1,.32,1) both}
.acc-arte.cargando{aspect-ratio:16/9;background:linear-gradient(100deg,var(--ink-100) 30%,var(--ink-50) 50%,var(--ink-100) 70%);background-size:200% 100%;animation:arteShim 1.3s linear infinite}
@keyframes arteIn{from{opacity:0;filter:blur(10px)}to{opacity:1;filter:blur(0)}}
@keyframes arteShim{to{background-position:-200% 0}}
.arte-zoom-ov{position:fixed;inset:0;z-index:200;background:rgba(8,12,20,.86);display:none;align-items:center;justify-content:center;padding:22px;cursor:zoom-out}
.arte-zoom-ov.open{display:flex}
.arte-zoom-ov img{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 24px 70px rgba(0,0,0,.55)}
@media(prefers-reduced-motion:reduce){.acc-arte img{animation:none}.acc-arte.cargando{animation:none}}
/* Selector manual de imagen del pedido (Odoo con varias portadas) — motion tipo Emil */
.acc-arte img{transition:opacity .18s cubic-bezier(.23,1,.32,1),filter .18s cubic-bezier(.23,1,.32,1)}
.acc-arte.swapping img{opacity:.35;filter:blur(2px)}
.arte-cambiar-row{margin:-6px 0 14px;display:flex;justify-content:flex-end}
.arte-cambiar{display:inline-flex;align-items:center;gap:6px;background:var(--white);border:1px solid var(--ink-150);color:var(--navy);border-radius:999px;padding:7px 13px;font-size:12.5px;font-weight:700;cursor:pointer;transition:transform .16s cubic-bezier(.23,1,.32,1),border-color .16s ease}
.arte-cambiar i{width:15px;height:15px}
.arte-cambiar:hover{border-color:var(--navy)}
.arte-cambiar:active{transform:scale(.97)}
.arte-count{background:var(--navy);color:#fff;border-radius:999px;font-size:10.5px;font-weight:700;min-width:17px;height:17px;display:inline-grid;place-items:center;padding:0 4px}
.arte-picker{margin:0 0 14px;border:1px solid var(--ink-150);border-radius:14px;padding:13px;transform-origin:top center;opacity:0;transform:translateY(-6px);transition:opacity .2s cubic-bezier(.23,1,.32,1),transform .2s cubic-bezier(.23,1,.32,1)}
.arte-picker.open{opacity:1;transform:translateY(0)}
.arte-picker-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}
.arte-picker-t{font-size:12px;font-weight:700;color:var(--ink-600)}
.arte-refresh{display:inline-flex;align-items:center;gap:6px;background:var(--ink-50);border:1px solid var(--ink-150);color:var(--navy);border-radius:999px;padding:6px 11px;font-size:12px;font-weight:700;cursor:pointer;transition:transform .16s cubic-bezier(.23,1,.32,1)}
.arte-refresh i{width:14px;height:14px}
.arte-refresh:active{transform:scale(.97)}
.arte-refresh.cargando{pointer-events:none;opacity:.7}
.arte-refresh.cargando i{animation:arteSpin .8s linear infinite}
@keyframes arteSpin{to{transform:rotate(360deg)}}
.arte-thumbs{display:flex;gap:10px;flex-wrap:wrap;min-height:66px}
.arte-thumb{position:relative;width:92px;height:66px;border-radius:11px;overflow:hidden;border:2px solid transparent;background:var(--ink-100);cursor:pointer;padding:0;opacity:0;transform:translateY(8px);animation:arteThumbIn .26s cubic-bezier(.23,1,.32,1) forwards;transition:transform .16s cubic-bezier(.23,1,.32,1),border-color .16s ease,box-shadow .16s ease}
@keyframes arteThumbIn{to{opacity:1;transform:translateY(0)}}
.arte-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.arte-thumb:hover{transform:translateY(-2px)}
.arte-thumb:active{transform:scale(.97)}
.arte-thumb.sel{border-color:var(--navy);box-shadow:0 0 0 3px rgba(0,51,106,.14)}
.arte-thumb .sel-tag{position:absolute;left:0;right:0;bottom:0;background:rgba(0,51,106,.86);color:#fff;font-size:8.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px;text-align:center}
.arte-thumbs-load,.arte-thumbs-empty{font-size:12px;color:var(--ink-500);display:flex;align-items:center;gap:7px;padding:6px 0}
.arte-thumbs-load i{width:15px;height:15px;animation:arteSpin .8s linear infinite}
.arte-picker-hint{margin-top:11px;font-size:11.5px;color:var(--ink-500);line-height:1.45}
@media(prefers-reduced-motion:reduce){.arte-picker{transition:opacity .2s ease;transform:none}.arte-picker.open{transform:none}.arte-thumb{animation:none;opacity:1;transform:none}.arte-thumb:hover,.arte-thumb:active{transform:none}.acc-arte img{transition:opacity .2s ease}.acc-arte.swapping img{filter:none}.arte-cambiar:active,.arte-refresh:active{transform:none}.arte-refresh.cargando i,.arte-thumbs-load i{animation:none}}
@media (prefers-reduced-motion: reduce){#trab-acc-odooupd{transition-duration:0ms}}

/* ── DETALLE DE EQUIPO: stats + tira 30 días ── */
.eqd-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.eqd-stat{background:var(--ink-50);border:1px solid var(--ink-150);border-radius:8px;padding:10px 12px}
.eqd-stat .lbl{font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-500)}
.eqd-stat .val{font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--ink-900);font-variant-numeric:tabular-nums;margin-top:3px}
.eqd-stat .val .u{font-size:11px;font-weight:600;color:var(--ink-500);margin-left:1px}
.eqd-strip{display:flex;gap:3px;margin-bottom:6px}
.eqd-cell{flex:1;height:26px;border-radius:4px;background:var(--ink-150)}
.eqd-cell.ok{background:var(--ok)}
.eqd-cell.warn{background:var(--warn)}
.eqd-cell.fail{background:var(--fail)}
.eqd-strip-lbl{display:flex;justify-content:space-between;font-size:10px;color:var(--ink-500);font-weight:600;margin-bottom:18px}
/* ── Endurecimiento de accesibilidad (12 jun 2026) ── */
.trab-card:focus-visible,.term-stack:focus-visible{outline:2px solid var(--white);outline-offset:2px;box-shadow:0 0 0 5px rgba(3,36,74,.45)}
.modal:focus{outline:none}
/* Red de seguridad: animaciones/transiciones sin guard propio se apagan con reduced motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media(max-width:640px){
  /* 16px evita el auto-zoom de iOS al enfocar (el viewport ya permite pinch-zoom) */
  input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important}
  .icon-btn{width:40px;height:40px}
}
/* ── Producción en móvil: la primera card visible SIN scroll (12 jun).
   El operador entra 30-50 veces al día; el chrome se compacta a lo mínimo:
   título en una línea + botón pill, sin eyebrow ni copy de onboarding ── */
@media(max-width:640px){
  .panel[data-panel="produccion"] .prod-head{margin-bottom:8px;gap:10px;flex-wrap:nowrap;align-items:center}
  .panel[data-panel="produccion"] .prod-head .eyebrow{display:none}
  .panel[data-panel="produccion"] .prod-title{font-size:19px;margin:0;white-space:nowrap}
  .panel[data-panel="produccion"] .prod-title .script{font-size:21px}
  .panel[data-panel="produccion"] .prod-desc{display:none}
  #prod-mode-row{margin-bottom:10px!important}
}
/* ── Hub en móvil: cabecera editorial — avatar + fecha gigante + chips
   con el pulso del día (la lista detallada se resume en los chips) ── */
@media(max-width:640px){
  .hub-head .eyebrow{display:none}
  /* El saludo es el protagonista: avatar grande (única foto en pantalla,
     el chip del topbar se oculta) y abre Mi perfil con un tap.
     La zona de bienvenida ocupa más pantalla, como la referencia. */
  .hub-head{margin:12px 0 2px}
  .hub-saludo{gap:16px}
  .hub-saludo .prod-title{font-size:23px;margin:0}
  .hub-saludo .prod-title .script{font-size:26px}
  .hub-frase{font-size:13px;margin-top:5px}
  .hub-ava{display:flex;width:64px;height:64px;font-size:19px}
  /* SOLO en el dashboard: el topbar se despeja (la foto vive en el saludo,
     salir vive dentro de Mi perfil, la sucursal sube compacta junto al logo).
     En cualquier otro módulo el topbar vuelve a la normalidad. */
  body.en-inicio .user-chip{display:none}
  body.en-inicio #btn-logout{display:none}
  body.en-inicio .week-badge{display:none}
  body.en-inicio .spacer{flex:1 1 0}
  body.en-inicio .suc-toggle{order:0;flex:0 1 auto;margin-left:auto;background:#F7F7F7;border-radius:999px;padding:4px;gap:3px}
  body.en-inicio .suc-btn{flex:0 0 auto;padding:12px 22px;font-size:15px;font-weight:800;border-radius:999px}
  .hub-fecha-box{display:none}
  .hub-fecha-big{display:block;margin:20px 0 22px}
  .hub-fecha-big .num{font-size:40px;font-weight:800;letter-spacing:-.03em;line-height:.95;color:var(--ink-900);font-variant-numeric:tabular-nums}
  .hub-fecha-big .dia{font-size:16px;font-weight:700;color:var(--ink-700);margin-top:3px}
  .hub-fecha-big .dia small{font-weight:600;color:var(--ink-500);font-size:12.5px}
  .hub-chips{display:flex;gap:7px;overflow-x:auto;margin:0 0 22px;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .hub-chips::-webkit-scrollbar{display:none}
}
/* Feedback táctil consistente: hundirse sutil al tocar (sin PowerPoint) */
.hub-card:active{transform:scale(.98)}
.chip:active,.period-btn:active,.suc-btn:active{transform:scale(.95)}
.bnav-btn:active{transform:scale(.9)}
.btn:active{transform:scale(.98)}
.icon-btn:active{transform:scale(.94)}
/* En táctil el hover pegajoso del lift se apaga (el :active es el feedback) */
@media(hover:none){
  .hub-card:hover,.kpi.kpi-clickable:hover,.trab-card:hover,.valla-card:hover,
  .perfil-card:hover,.focus-equipo:hover{transform:none}
}
/* Scroll programático suave (scrollIntoView de cards destacadas, etc.) */
html{scroll-behavior:smooth}
/* El icono del nav activo salta un pelín: el cambio de sección se SIENTE */
.bnav-btn i,.bnav-btn svg{transition:transform .22s cubic-bezier(0.23,1,0.32,1)}
.bnav-btn.active i,.bnav-btn.active svg{transform:translateY(-2px) scale(1.15)}
/* ── Consistencia Emil en TODO lo presionable del sitio: misma transición
   (transform + superficie) y press proporcional al tamaño del control ── */
.btn-login,.btn-submit,.file-btn,.bita-sub,.estado-btn,.acc-btn,
.modal-close,.pf-btn,.btn-delete,.edit-reg-btn,.cs-trigger,.term-stack-bar{
  transition:transform .12s cubic-bezier(0.23,1,0.32,1),background-color .15s,
    border-color .15s,color .15s,box-shadow .15s,opacity .15s
}
.btn-login:active,.btn-submit:active,.file-btn:active,.bita-sub:active,
.estado-btn:active,.acc-btn:active,.term-stack-bar:active{transform:scale(.97)}
.modal-close:active,.pf-btn:active,.btn-delete:active,.edit-reg-btn:active,.cs-trigger:active{transform:scale(.94)}

/* ── Modal "Solicitar material" (Etapa 2 fusión Consumo→Almacén, v4.106):
   producción pide, el bodeguero recibe push y atiende desde Almacén ── */
/* z-index 200 = igual que el modal del panel, para que el dropdown bonito
   (.cs-menu, z-index 300) abra POR ENCIMA y se puedan elegir materiales.
   Con 1200 el menú quedaba detrás y no se podía seleccionar nada. */
.sm-ov{position:fixed;inset:0;background:rgba(20,22,28,.44);z-index:200;display:flex;align-items:center;justify-content:center;padding:18px;animation:smFade .2s ease}
.sm-modal{background:#fff;border-radius:18px;max-width:420px;width:100%;padding:22px;max-height:88vh;overflow:auto;animation:smPop .34s cubic-bezier(.16,1,.3,1)}
@keyframes smFade{from{opacity:0}to{opacity:1}}
@keyframes smPop{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.sm-ov,.sm-modal{animation:none}}
.sm-modal h3{margin:0 0 14px;font-size:19px;font-weight:800;color:var(--ink-900);display:flex;align-items:center;gap:9px}
.sm-modal h3 svg{width:19px;height:19px;color:var(--navy)}
.sm-seg{display:inline-flex;background:#F0F0F0;border-radius:999px;padding:3px;margin-bottom:14px}
.sm-seg button{border:none;background:transparent;color:var(--ink-500);font:inherit;font-size:13px;font-weight:700;padding:7px 18px;border-radius:999px;cursor:pointer;transition:background-color .18s cubic-bezier(.16,1,.3,1),color .18s,transform .13s cubic-bezier(.16,1,.3,1)}
.sm-seg button.on{background:var(--navy);color:#fff}
.sm-seg button:active{transform:scale(.94)}
.sm-in{transition:box-shadow .15s ease,background-color .15s ease}
.sm-lbl{display:block;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-500);margin:12px 2px 6px}
/* Consumo de planta: pista de stock + selector de planta */
.sm-hint{margin:7px 2px 0;font-size:11.5px;font-weight:600;color:var(--ink-500)}
.sm-hint b{color:var(--ink-900)}
.sm-hint .low{color:var(--fail);font-weight:700}
.sm-plsel{display:flex;gap:7px}
.sm-plsel button{flex:1;border:1.5px solid var(--ink-200);background:#fff;color:var(--ink-500);font:inherit;font-size:12.5px;font-weight:700;padding:9px 0;border-radius:999px;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s,transform .12s}
.sm-plsel button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.sm-plsel button:active{transform:scale(.96)}
.sm-in{width:100%;box-sizing:border-box;border:none;background:#F7F7F7;border-radius:10px;padding:12px 13px;font:inherit;font-size:14px;color:var(--ink-900);outline:none}
.sm-in:focus{box-shadow:0 0 0 2px rgba(9,66,168,.25)}
/* Check "Urgente": caja custom que se llena de rojo con un check que rebota, y
   la fila entera se tiñe (clase .on por JS). Nada de checkbox nativo pelón. */
.sm-urg{display:flex;align-items:center;gap:12px;margin:14px 0 2px;cursor:pointer;padding:11px 13px;border-radius:14px;border:1.5px solid var(--ink-150);background:#fff;transition:background-color .2s ease,border-color .2s ease}
.sm-urg.on{background:#FCEBEB;border-color:#F0997B}
.sm-urg-input{position:absolute;opacity:0;width:0;height:0}
.sm-urg-box{flex:0 0 24px;width:24px;height:24px;border-radius:8px;border:2px solid var(--ink-200);background:#fff;display:flex;align-items:center;justify-content:center;color:#fff;transition:background-color .18s ease,border-color .18s ease,transform .22s cubic-bezier(.34,1.55,.64,1)}
.sm-urg-box svg{width:15px;height:15px;transform:scale(0);transition:transform .24s cubic-bezier(.34,1.7,.64,1)}
.sm-urg-input:checked + .sm-urg-box{background:#E24B4A;border-color:#E24B4A;transform:scale(1.12)}
.sm-urg-input:checked + .sm-urg-box svg{transform:scale(1)}
.sm-urg-input:focus-visible + .sm-urg-box{box-shadow:0 0 0 3px rgba(226,75,74,.28)}
.sm-urg-txt{display:flex;flex-direction:column;line-height:1.25}
.sm-urg-txt b{font-size:13.5px;font-weight:700;color:var(--ink-900)}
.sm-urg-txt span{font-size:11.5px;color:var(--ink-500)}
.sm-urg.on .sm-urg-txt span{color:#A32D2D}
@media(prefers-reduced-motion:reduce){.sm-urg-box,.sm-urg-box svg{transition:none}}
.sm-acts{display:grid;gap:8px;margin-top:16px}
.sm-send{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;background:var(--navy);color:#fff;font:inherit;font-size:14px;font-weight:700;padding:13px;border-radius:999px;cursor:pointer;transition:filter .15s ease,transform .13s cubic-bezier(.16,1,.3,1)}
.sm-send:hover{filter:brightness(1.08)}
.sm-send:active{transform:scale(.97)}
.sm-send:disabled{opacity:.55;cursor:default}
.sm-send svg{width:15px;height:15px}
.sm-cancel{border:none;background:transparent;color:var(--ink-500);font:inherit;font-size:13px;font-weight:700;padding:9px;cursor:pointer;border-radius:999px;transition:color .15s ease,transform .13s cubic-bezier(.16,1,.3,1)}
.sm-cancel:active{transform:scale(.96)}
/* Pedir VARIOS materiales: stepper −/+ de cantidad + Agregar (pill), y lista */
.sm-qtyrow{display:flex;gap:8px;align-items:stretch}
.sm-stepper{flex:1;min-width:0;display:flex;align-items:center;background:#F7F7F7;border-radius:999px;padding:4px}
.sm-stepper input{flex:1;min-width:0;width:100%;border:none;background:transparent;text-align:center;font:inherit;font-size:16px;font-weight:800;color:var(--ink-900);outline:none;-moz-appearance:textfield}
.sm-stepper input::-webkit-outer-spin-button,.sm-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.sm-stepper input::placeholder{font-weight:400;color:var(--ink-500)}
.sm-step{flex:0 0 auto;width:38px;height:38px;border:none;border-radius:999px;background:#fff;color:var(--navy);font-size:21px;font-weight:800;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 2px rgba(3,36,74,.08);transition:background-color .15s ease,transform .12s cubic-bezier(.23,1,.32,1)}
.sm-step:hover{background:#EEF1F6}
.sm-step:active{transform:scale(.88)}
.sm-add{flex:0 0 auto;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;border:none;background:var(--navy);color:#fff;font:inherit;font-size:13px;font-weight:700;padding:0 15px;border-radius:999px;cursor:pointer;transition:filter .15s ease,transform .13s cubic-bezier(.23,1,.32,1)}
.sm-add:hover{filter:brightness(1.1)}
.sm-add:active{transform:scale(.96)}
.sm-add svg{width:15px;height:15px}
.sm-items{display:flex;flex-direction:column;gap:6px;margin:10px 0 2px}
.sm-item{display:flex;align-items:center;gap:9px;background:#F7F7F7;border-radius:10px;padding:8px 10px 8px 8px;animation:smItemIn .5s cubic-bezier(.16,1,.3,1)}
@keyframes smItemIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
.sm-item.out{animation:smItemOut .2s cubic-bezier(.4,0,.7,0) forwards;pointer-events:none}
@keyframes smItemOut{to{opacity:0;transform:translateX(16px) scale(.94)}}
.sm-item-q{background:var(--navy);color:#fff;font-size:12px;font-weight:800;border-radius:8px;padding:3px 8px;min-width:26px;text-align:center}
.sm-item-n{flex:1;font-size:13px;color:var(--ink-900);line-height:1.3}
.sm-item-x{border:none;background:transparent;color:var(--ink-400);cursor:pointer;width:26px;height:26px;border-radius:999px;display:flex;align-items:center;justify-content:center;flex:0 0 26px;transition:background-color .15s,transform .12s ease}
.sm-item-x:hover{background:var(--ink-150);color:var(--ink-700)}
.sm-item-x:active{transform:scale(.88)}
.sm-item-x svg{width:14px;height:14px}
@media(prefers-reduced-motion:reduce){.sm-item{animation:none}}

/* ── Notificación interna de bodega (realtime): pila flotante, estilo Emil ── */
.alm-notifs{position:fixed;right:16px;bottom:calc(96px + env(safe-area-inset-bottom,0px));z-index:210;display:flex;flex-direction:column;gap:10px;width:320px;max-width:calc(100vw - 32px);pointer-events:none}
/* Notificación de bodega v4.213 (mockup del dueño): PILL BLANCA con el botón
   Ver como cápsula sólida ocupando el extremo derecho (azul tag; rojo tag si
   es urgente, con su mini pill URGENTE adentro). Sin icono: el texto manda.
   Jerarquía: hora chiquita gris → "Nombre solicitó:" → material en negrita. */
.alm-notif{pointer-events:auto;position:relative;background:#fff;border-radius:999px;box-shadow:0 10px 30px -8px rgba(10,30,60,.28),0 2px 8px rgba(10,30,60,.08);border:none;padding:0;display:flex;align-items:stretch;animation:anIn .32s cubic-bezier(.16,1,.3,1)}
@keyframes anIn{from{opacity:0;transform:translateX(26px) scale(.96)}to{opacity:1;transform:none}}
.alm-notif.out{animation:anOut .18s cubic-bezier(.32,0,.67,0) forwards}
@keyframes anOut{to{opacity:0;transform:translateX(26px) scale(.96)}}
/* Texto: aire generoso desde la curva izquierda; TODO a una línea con "…"
   (si no cabe, se corta y se entiende que hay más). La tarjeta nunca engorda. */
.an-b{flex:1;min-width:0;padding:10px 10px 10px 22px;display:flex;flex-direction:column;justify-content:center}
.an-when{font-size:10px;font-weight:600;color:#B5B5B5;margin-bottom:1px}
.an-t{margin:0;font-size:12.5px;font-weight:500;color:var(--ink-900,#0E0E0E);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.an-t b{font-weight:800}
.an-m{margin:0;font-size:13.5px;font-weight:800;color:var(--ink-900,#0E0E0E);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.an-s{margin:2px 0 0;font-size:10.5px;color:var(--ink-400,#8A8A8A);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Botón Ver: cápsula sólida PEGADA al extremo derecho, de borde a borde (el
   alto completo de la tarjeta; sus curvas coinciden con las de la pill) */
.an-go{flex:0 0 auto;align-self:stretch;min-width:88px;border:none;border-radius:999px;background:var(--tag-blue,#0B6FFF);color:#fff;font-family:inherit;font-size:13.5px;font-weight:800;letter-spacing:-.01em;padding:0 18px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:filter .15s ease,transform .14s cubic-bezier(.16,1,.3,1)}
.alm-notif.urg .an-go{background:var(--tag-red,#F4313F)}
@media(hover:hover){.an-go:hover{filter:brightness(1.07)}}
.an-go:active{transform:scale(.97)}
.an-urg{background:#fff;color:var(--tag-red,#F4313F);font-size:9px;font-weight:800;padding:2px 10px;border-radius:999px;white-space:nowrap;letter-spacing:.05em;line-height:1.4}
/* Cerrar: mini círculo flotante en la esquina (estilo iOS), fuera del texto */
.an-x{position:absolute;top:-6px;left:-6px;z-index:1;border:none;background:#fff;color:#8A8A8A;cursor:pointer;width:21px;height:21px;border-radius:50%;display:inline-grid;place-items:center;padding:0;box-shadow:0 2px 10px rgba(10,30,60,.28);transition:background-color .15s ease,color .15s ease,transform .12s ease}
@media(hover:hover){.an-x:hover{color:var(--ink-900,#0E0E0E);transform:scale(1.08)}}
.an-x:active{transform:scale(.9)}
.an-x svg{width:11px;height:11px}
@media(max-width:640px){.alm-notifs{left:12px;right:12px;width:auto;bottom:calc(78px + env(safe-area-inset-bottom,0px))}}
@media(prefers-reduced-motion:reduce){.alm-notif{animation:anFade .2s ease}.alm-notif.out{animation:anFade .18s ease reverse forwards}}
@keyframes anFade{from{opacity:0}to{opacity:1}}

/* ════════════════════════════════════════════════════════════
   HUB DE COLABORADORES (v4.142) — widgets por permiso.
   Saludo grande estilo admin + Próximas tareas (timeline) +
   Podio de hoy (coral) + Tu progreso + Cola + Equipos + Material.
   ════════════════════════════════════════════════════════════ */
/* Saludo de colaborador: mismo tamaño de dos líneas que el admin */
body:not(.adm-hub) .hub-saludo .prod-title{font-size:44px}
body:not(.adm-hub) .hub-frase{font-size:14px;font-weight:600;margin-top:8px}
@media(max-width:700px){ body:not(.adm-hub) .hub-saludo .prod-title{font-size:30px} }

#hub-colab{margin:20px 0 6px}
.hc-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.hc-card{position:relative;display:flex;flex-direction:column;background:var(--white);border-radius:16px;padding:20px 22px;box-shadow:0 1px 2px rgba(10,30,60,.05),0 8px 22px -12px rgba(10,30,60,.12)}
.hc-span7{grid-column:span 7}
.hc-span4{grid-column:span 4}
.hc-colR{grid-column:span 5;display:flex;flex-direction:column;gap:16px}
.hc-lbl{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-500);margin-bottom:15px}
.hc-lbl svg{width:15px;height:15px;color:var(--navy)}
.hc-empty{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--ink-500);padding:10px 2px}
.hc-empty svg{width:18px;height:18px;color:var(--ink-400);flex-shrink:0}
.hc-empty.mini{font-size:12px;padding:6px 0}
.hc-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:auto;padding-top:18px}
.hc-go{display:inline-flex;align-items:center;gap:8px;border:none;background:var(--navy);border-radius:999px;padding:12px 22px;font-family:inherit;font-size:13.5px;font-weight:700;color:#fff;cursor:pointer;white-space:nowrap;box-shadow:0 8px 18px -8px rgba(9,66,168,.55);transition:background .15s,transform .12s cubic-bezier(0.23,1,0.32,1)}
.hc-go svg{width:14px;height:14px}
.hc-go:hover{background:#07317E}
.hc-go:active{transform:scale(.96)}
.hc-bar{height:7px;border-radius:999px;background:var(--ink-100);overflow:hidden}
.hc-bar i{display:block;height:100%;border-radius:999px}
.hc-bar.oro i{background:linear-gradient(90deg,#FFE27A,#DD8A0C)}
.hc-bar.azul i{background:var(--k-cola)}
.hc-chip{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:4px 11px;border-radius:999px;white-space:nowrap}
.hc-chip.fail{background:var(--fail-soft);color:var(--fail)}
.hc-chip.fail::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--fail);flex-shrink:0}
.hc-chip.ok{background:var(--ok-soft);color:var(--ok)}

/* ── Próximas tareas: timeline con la que sigue destacada ── */
.hc-tl{position:relative;padding-left:24px}
.hc-tl::before{content:'';position:absolute;left:6px;top:10px;bottom:14px;width:2px;background:var(--ink-150);border-radius:2px}
.hc-tli{position:relative;padding:9px 0 9px 12px}
.hc-tli::before{content:'';position:absolute;left:-24px;top:50%;transform:translate(1.5px,-50%);width:11px;height:11px;border-radius:50%;background:var(--white);border:2.5px solid var(--ink-300)}
.hc-tli.feat::before{border-color:#FB2C36;background:#FB2C36}
.hc-feat{background:#1E1E1E;border-radius:14px;padding:16px 18px;color:#fff;display:flex;gap:16px;align-items:center}
.hc-feat .fb{flex:1;min-width:0}
.hc-feat .fchips{display:flex;gap:6px;margin-bottom:9px;flex-wrap:wrap}
.hc-kchip{font-size:9.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:4px 10px;border-radius:999px;white-space:nowrap}
.hc-kchip.urg{background:#FB2C36;color:#fff}
.hc-kchip.azul{background:var(--k-cola);color:#fff}
.hc-kchip.mut{background:rgba(255,255,255,.14);color:rgba(255,255,255,.85)}
.hc-feat .ftit{font-size:15.5px;font-weight:800;letter-spacing:-.01em;line-height:1.25}
.hc-feat .fsub{font-size:12px;color:rgba(255,255,255,.62);margin-top:4px;font-weight:600}
.hc-feat .ffoot{display:flex;align-items:center;gap:10px;margin-top:13px;flex-wrap:wrap}
.hc-feat .fbtn{display:inline-flex;align-items:center;gap:7px;background:#fff;color:#1E1E1E;border:none;border-radius:999px;padding:8px 16px;font-family:inherit;font-size:12px;font-weight:800;cursor:pointer;transition:transform .12s}
.hc-feat .fbtn:active{transform:scale(.97)}
.hc-feat .fbtn svg{width:13px;height:13px}
.hc-feat .fmeta{font-size:11px;color:rgba(255,255,255,.5);font-weight:600}
.hc-feat .fprev{width:76px;height:76px;border-radius:12px;flex-shrink:0;background:linear-gradient(145deg,#2E2E2E,#191919);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.4)}
.hc-feat .fprev svg{width:24px;height:24px}
.hc-tli-row{display:flex;align-items:center;gap:12px}
.hc-tli-row .tx{flex:1;min-width:0}
.hc-tli-row .tx b{display:block;font-size:13.5px;font-weight:700;color:var(--ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hc-tli-row .tx span{display:block;font-size:11.5px;color:var(--ink-500);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hc-tli-row .meta{font-size:11px;color:var(--ink-400);font-weight:700;white-space:nowrap}
.hc-schip{font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:999px;white-space:nowrap}
.hc-schip.carp{background:var(--k-cola);color:#fff}
.hc-schip.urg{background:#FB2C36;color:#fff}
.hc-tl-foot{margin-top:10px;padding-top:13px;border-top:1px solid #EFF1F5}
.hc-tl-foot button{border:none;background:none;font-family:inherit;font-size:12.5px;font-weight:700;color:var(--navy);cursor:pointer;padding:0}

/* ── Podio de hoy: bloque coral con columnas + resultados ── */
.hc-pcard{padding-bottom:16px}
.hc-podio{position:relative;border-radius:14px;background:#0B6FFF;padding:26px 20px 0;display:flex;justify-content:center;align-items:flex-end;gap:14px;overflow:hidden}
.hc-podio .sp{position:absolute;color:rgba(255,255,255,.85)}
.hc-podio .sp svg{width:14px;height:14px}
.hc-podio .sp.s1{top:16px;left:18px}
.hc-podio .sp.s2{top:30px;right:24px}
.hc-podio .pc{position:relative;width:72px;border-radius:999px 999px 0 0;background:rgba(255,255,255,.30);display:flex;flex-direction:column;align-items:center;padding-top:10px}
.hc-podio .pc.p1{height:126px;background:rgba(255,255,255,.44)}
.hc-podio .pc.p2{height:102px}
.hc-podio .pc.p3{height:86px}
.hc-podio .pa{width:50px;height:50px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:var(--navy);box-shadow:0 3px 10px rgba(0,0,0,.18)}
.hc-podio .pc.p1 .pa{width:56px;height:56px;color:#0B6FFF}
.hc-podio .pc.p3 .pa{width:44px;height:44px;color:var(--k-terminado)}
.hc-podio .crown{position:absolute;top:-13px;left:50%;transform:translateX(-50%);width:26px;height:26px;border-radius:50%;background:var(--oro,#F0A819);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.22)}
.hc-podio .crown svg{width:13px;height:13px}
.hc-podio .pn{position:absolute;bottom:8px;font-size:15px;font-weight:800;color:rgba(255,255,255,.95);text-shadow:0 1px 3px rgba(0,0,0,.2)}
.hc-pres{padding-top:12px}
.hc-prow{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:11px;row-gap:8px;padding:9px 11px;border-radius:11px}
.hc-prow.me{background:var(--ink-50)}
.hc-prow .pos{width:22px;height:22px;border-radius:50%;background:var(--ink-100);color:var(--ink-600);font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hc-prow.me .pos{background:var(--navy);color:#fff}
.hc-prow .pn2{min-width:0;font-size:13px;font-weight:700;color:var(--ink-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hc-prow .pts{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;justify-self:end}
.hc-prow .pts small{font-size:10px;font-weight:700;color:var(--ink-400)}
.hc-prow .pb{grid-column:1 / -1;height:8px;border-radius:999px;background:var(--ink-100);overflow:hidden}
.hc-prow .pb i{display:block;height:100%;border-radius:999px}
.hc-psub{font-size:12px;font-weight:600;color:var(--ink-500);margin-top:8px;padding:0 2px}
.hc-psub b{color:var(--navy)}
/* Spotlight del líder: cabecera con su avatar + tira de 3 métricas de la semana */
.hc-pstat-hd{display:flex;align-items:center;gap:9px;margin:15px 2px 10px}
.hc-pstat-hd .ava{width:30px;height:30px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;flex:0 0 30px;background-size:cover;background-position:center;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--ink-150)}
.hc-pstat-hd .who{min-width:0}
.hc-pstat-hd .who b{display:block;font-size:12.5px;font-weight:800;color:var(--ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hc-pstat-hd .who span{font-size:10.5px;font-weight:600;color:var(--ink-500)}
.hc-pstats{display:grid;grid-template-columns:1fr 1fr 1fr;background:var(--ink-50);border-radius:12px;padding:12px 4px;margin:0 0 4px}
.hc-pstat{position:relative;text-align:center;padding:0 6px}
.hc-pstat+.hc-pstat::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:64%;background:var(--ink-200)}
.hc-pstat .v{font-size:19px;font-weight:800;color:var(--navy);font-variant-numeric:tabular-nums;line-height:1}
.hc-pstat.gold .v{color:#C9820A}
.hc-pstat .k{display:flex;align-items:center;justify-content:center;gap:4px;font-size:9px;font-weight:800;color:var(--ink-500);text-transform:uppercase;letter-spacing:.4px;margin-top:6px}
.hc-pstat .k svg{width:11px;height:11px;flex-shrink:0}

/* ── Tu progreso ── */
.hc-dia{display:flex;flex-direction:column;gap:14px}
.hc-dia .dr{display:flex;align-items:center;gap:13px}
.hc-dia .di{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hc-dia .di svg{width:18px;height:18px}
.hc-dia .di.racha{background:var(--warn-soft);color:#E8590C}
.hc-dia .di.logro{background:#FDF3DC;color:#DD8A0C}
.hc-dia .di.ft{background:#E8F0FC;color:var(--k-cola)}
.hc-dia .dt{flex:1;min-width:0}
.hc-dia .dt b{display:block;font-size:13.5px;font-weight:700;color:var(--ink-900)}
.hc-dia .dt b small{font-size:11px;font-weight:700;color:var(--ink-400);margin-left:4px}
.hc-dia .dt > span{display:block;font-size:11.5px;color:var(--ink-500);margin-top:1px}
.hc-dia .dt .hc-bar{margin-top:7px}
.hc-dia .flames{display:flex;gap:5px;margin-top:7px}
.hc-dia .flames i{width:20px;height:7px;border-radius:999px;background:var(--ink-100)}
.hc-dia .flames i.on{background:#E8590C}

/* ── Cola de tu planta ── */
.hc-cola{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hc-cola .ct{background:var(--ink-50);border-radius:12px;padding:13px 14px}
.hc-cola .ct b{display:block;font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1}
.hc-cola .ct span{display:block;font-size:11px;font-weight:700;color:var(--ink-500);margin-top:5px;white-space:nowrap}
.hc-cola .ct.urg b{color:var(--k-urgente)}
.hc-cola .ct.carp b{color:var(--k-cola)}
.hc-cola .ct.imp b{color:var(--k-imprimiendo)}
.hc-cola .ct.nue b{color:var(--k-nuevo)}

/* ── Registro de equipos / Material ── */
.hc-eqbig{display:flex;align-items:baseline;gap:8px}
.hc-eqbig b{font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1;color:var(--ink-900)}
.hc-eqbig span{font-size:12.5px;font-weight:600;color:var(--ink-500)}
.hc-mrow{display:flex;align-items:center;gap:11px;padding:9px 0;border-top:1px solid #EFF1F5}
.hc-mrow:first-child{border-top:none;padding-top:0}
.hc-mrow .mtx{flex:1;min-width:0}
.hc-mrow .mtx b{display:block;font-size:13px;font-weight:700;color:var(--ink-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hc-mrow .mtx span{display:block;font-size:11.5px;color:var(--ink-500);margin-top:1px}
.hc-mchip{font-size:10.5px;font-weight:800;padding:4px 10px;border-radius:999px;white-space:nowrap}
.hc-mchip.lista{background:var(--k-terminado);color:#fff}
.hc-mchip.pend{background:var(--ink-100);color:var(--ink-500)}

/* ── Responsive ── */
@media(max-width:1100px){
  .hc-span7,.hc-colR{grid-column:span 12}
  .hc-span4{grid-column:span 6}
}
@media(max-width:700px){
  .hc-grid{gap:12px}
  .hc-card{padding:16px;border-radius:14px}
  .hc-span4{grid-column:span 12}
  .hc-tli-row{flex-wrap:wrap;gap:6px 10px}
  .hc-tli-row .tx{flex:1 1 100%}
  .hc-tli-row .meta{margin-left:auto}
  .hc-feat{padding:14px 15px;gap:12px}
  .hc-feat .fprev{width:60px;height:60px;border-radius:10px}
}
@media(prefers-reduced-motion:reduce){
  .hc-go,.hc-feat .fbtn{transition:none}
  .hc-feat .fbtn:active{transform:none}
}

/* v4.143: arte real en la tarea destacada + fotos en el podio del hub */
.hc-feat .fprev.img{background-size:cover;background-position:center}
.hc-podio .pa.foto{background-size:cover;background-position:center}

/* v4.145 · FAB: el + gira suave al pasar el mouse (al clic el modal lo tapa,
   así que el giro vive en el hover; el press conserva su scale) */
.prod-fab svg,.prod-fab i{transition:transform .3s cubic-bezier(0.23,1,0.32,1)}
@media(hover:hover) and (pointer:fine){ .prod-fab:hover svg,.prod-fab:hover i{transform:rotate(90deg)} }
@media(prefers-reduced-motion:reduce){ .prod-fab svg,.prod-fab i{transition:none} }

/* ════════════════════════════════════════════════════════════
   WIDGETS DE TALLER en el hub (v4.147) — acento verde del módulo.
   Reusan .hc-* de producción; solo se agregan variantes propias.
   ════════════════════════════════════════════════════════════ */
.hc-lbl.tal svg{color:var(--plan)}
.hc-bar.green i{background:var(--plan)}
/* Chips de prioridad dentro de la tarjeta destacada oscura */
.hc-kchip.alta{background:#FB2C36;color:#fff}
.hc-kchip.media{background:#F0A819;color:#3D2A00}
.hc-kchip.norm{background:rgba(255,255,255,.14);color:rgba(255,255,255,.85)}
.hc-feat .fherr{margin-top:11px;background:rgba(255,255,255,.08);border-radius:10px;padding:9px 12px;font-size:11.5px;color:rgba(255,255,255,.82);display:flex;align-items:center;gap:8px;font-weight:600;line-height:1.35}
.hc-feat .fherr svg{width:14px;height:14px;flex-shrink:0;color:var(--oro,#F0A819)}
/* Chips de estado en las filas del día del taller */
.hc-schip.libre{background:var(--plan-soft);color:var(--plan-deep)}
.hc-schip.proc{background:#E8F0FC;color:var(--navy)}
.hc-schip.alta{background:#FB2C36;color:#fff}
.hc-schip.media{background:var(--warn-soft);color:var(--warn)}
.hc-schip.norm{background:var(--ink-100);color:var(--ink-500)}
/* Íconos de "Tu semana" del taller */
.hc-dia .di.tar{background:var(--plan-soft);color:var(--plan)}
.hc-dia .di.hrs{background:#E8F0FC;color:var(--navy)}
/* Tiles de "Tu día en números" (reusa .hc-cola) */
.hc-cola .ct.proc b{color:var(--navy)}
.hc-cola .ct.libre b{color:var(--plan)}
.hc-cola .ct.hecho b{color:var(--k-terminado)}
.hc-cola .ct.enproc b{color:var(--k-imprimiendo)}
/* Qué llevar hoy (checklist de solo lectura) */
.hc-herr{display:flex;flex-direction:column;gap:9px}
.hc-herr .hrow{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:600;color:var(--ink-700)}
.hc-herr .hrow.on{color:var(--ink-400);text-decoration:line-through}
.hc-herr .hbox{width:18px;height:18px;border-radius:6px;border:2px solid var(--ink-200);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.hc-herr .hbox.on{background:var(--plan);border-color:var(--plan)}
.hc-herr .hbox.on svg{width:11px;height:11px;color:#fff}

/* ══════════════════════════════════════════════════════════════════
   LISTA DE IMPRESIÓN (planta alta) — pre-lista del día (v4.179)
   Diseño del dueño (14 jul): fondo blanco, pills grandes, etapas con
   colores PROPIOS (no kanban): Recibido #F9DA36 · Aprobado #47BCFC ·
   Pasado #27C466. El tag del pedido es información aparte.
   ══════════════════════════════════════════════════════════════════ */
:root{--li-recibido:#F9DA36;--li-aprobado:#47BCFC;--li-pasado:#27C466;--li-textil:#8B5CF6}
#prod-lista{background:var(--white);border:1px solid var(--ink-150);border-radius:16px;overflow:hidden}
.li-bar{display:flex;align-items:center;gap:14px;padding:16px 20px 4px;flex-wrap:wrap}
.li-day{display:flex;align-items:center;gap:6px;background:var(--ink-100);border-radius:999px;padding:8px 18px 8px 10px}
.li-day button{border:none;background:none;width:28px;height:28px;border-radius:999px;display:grid;place-items:center;color:var(--ink-700);cursor:pointer}
.li-day button:hover{background:var(--ink-150)}
.li-day button svg{width:16px;height:16px}
#li-day-lbl{font-size:17px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
#li-day-lbl small{font-size:12px;font-weight:600;color:var(--ink-500);margin-left:4px}
/* Planificando MAÑANA: la píldora del día se tinta de azul para dejar claro
   que no es el día de hoy sino la lista del día siguiente (v4.223) */
.li-day.manana{background:#E6F1FB}
.li-day.manana #li-day-lbl{color:var(--navy)}
.li-day.manana #li-day-lbl small{color:var(--royal)}
.li-tots{display:flex;align-items:baseline;gap:22px;margin-left:auto;flex-wrap:wrap}
.li-tots .tot{font-size:11px;font-weight:800;letter-spacing:.04em;color:var(--ink-700);display:inline-flex;align-items:baseline;gap:6px}
.li-tots .tot b{font-family:var(--font-sans);font-weight:800;font-size:21px;letter-spacing:-.02em;display:inline-block}
.li-pop{animation:liPop .22s cubic-bezier(.23,1,.32,1)}
@keyframes liPop{from{transform:scale(1.22)}to{transform:scale(1)}}
.li-tots .tot small{font-size:9.5px;font-weight:700;color:var(--ink-500)}
.li-tots .tot.t-dtf b{color:var(--li-textil)}
.li-tots .tot.t-uv b{color:var(--k-uvdtf)}

/* Anotación rápida: pills grandes sobre blanco */
.li-qadd{display:flex;align-items:center;gap:10px;padding:14px 20px 24px;flex-wrap:wrap}
.li-qadd input{border:1.5px solid var(--ink-200);border-radius:999px;padding:11px 18px;font-family:var(--font-sans);font-size:14px;color:var(--ink-900);background:var(--white);outline:none}
.li-qadd input:focus{border-color:var(--tag-blue)}
.li-qadd input.field-error{border-color:var(--fail)!important;background:#FEF5F4!important}
.li-qadd input::placeholder{color:var(--ink-400)}
#li-cliente{flex:0 1 500px;min-width:170px}
#li-plg{width:150px;text-align:center;font-weight:700;appearance:textfield;-moz-appearance:textfield}
#li-plg::-webkit-outer-spin-button,#li-plg::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.li-step{display:flex;align-items:center;background:var(--ink-100);border-radius:999px;padding:3px;gap:1px}
.li-step input{width:40px;border:none;background:transparent;text-align:center;font-family:var(--font-sans);font-size:14px;font-weight:800;color:var(--ink-900);outline:none;appearance:textfield;-moz-appearance:textfield;padding:0}
.li-step input::-webkit-outer-spin-button,.li-step input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.li-step button{flex:none;width:32px;height:32px;border:none;border-radius:999px;background:var(--white);color:var(--navy);font-size:18px;font-weight:800;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:0 1px 2px rgba(3,36,74,.08);transition:background-color .15s ease,transform .12s cubic-bezier(.23,1,.32,1)}
.li-step button:hover{background:#EEF1F6}
.li-step button:active{transform:scale(.88)}
.li-tipo-seg{display:flex;flex:none;background:var(--ink-100);border-radius:999px;padding:3px;position:relative}
.li-tipo-seg::before{content:'';position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);background:var(--li-textil);border-radius:999px;box-shadow:0 1px 3px rgba(0,0,0,.12);transition:transform .25s cubic-bezier(.22,1,.36,1),background-color .25s ease}
.li-tipo-seg.sel-uv::before{transform:translateX(100%);background:var(--k-uvdtf)}
.li-tipo-seg button{position:relative;z-index:1;flex:none;width:98px;border:none;background:none;border-radius:999px;padding:9px 0;font-family:var(--font-sans);font-size:12.5px;font-weight:800;letter-spacing:.02em;color:var(--ink-500);cursor:pointer;white-space:nowrap;text-align:center;transition:color .2s ease,transform .16s cubic-bezier(.23,1,.32,1)}
.li-tipo-seg button:active{transform:scale(.95)}
.li-tipo-seg button.on{color:#fff}
.li-plg-wrap{position:relative;display:inline-flex}
#li-precio-prev{position:absolute;top:calc(100% + 2px);right:4px;font-family:var(--font-sans);font-size:12px;font-weight:800;color:var(--navy);white-space:nowrap;pointer-events:none}
#li-anotar{border:none;background:var(--tag-blue);color:#fff;border-radius:999px;padding:12px 24px;font-family:var(--font-sans);font-size:14px;font-weight:800;cursor:pointer;transition:background .15s,transform .12s cubic-bezier(.23,1,.32,1)}
#li-anotar:hover{background:#0757CC}
#li-anotar:active{transform:scale(.96)}
#li-anotar:disabled{opacity:.6;cursor:default}

.li-wrap{overflow-x:auto}
.li-tabla{border-collapse:collapse;width:100%;min-width:860px}
.li-tabla thead th{font-size:13.5px;font-weight:800;color:var(--ink-900);text-align:left;padding:10px 12px;border-bottom:1.5px solid var(--ink-150);white-space:nowrap}
.li-tabla th.num,.li-tabla td.num{text-align:right}
.li-tabla tbody td{padding:13px 12px;border-bottom:1px solid var(--ink-100);font-size:14px;vertical-align:middle;white-space:nowrap;background:var(--white)}
.li-tabla tbody tr:hover td{background:var(--ink-50)}
.li-tabla td.st{width:22px;padding-right:0}
.li-dot{width:10px;height:10px;border-radius:999px;display:inline-block}
.li-tabla td.hora{font-weight:500;color:var(--ink-400);width:58px;font-family:var(--font-sans)}
.li-tabla td.cli{font-weight:600}
.li-tabla td.num{font-family:var(--font-sans);font-weight:600;font-variant-numeric:tabular-nums}
.li-money{font-weight:800;font-family:var(--font-sans)}
.li-money sup{font-size:.62em;font-weight:800}
.li-tag{display:inline-flex;align-items:center;border-radius:999px;padding:4px 12px;font-size:10px;font-weight:800;letter-spacing:.05em;color:#fff}
.li-tag.tp-dtf{background:var(--li-textil)}
.li-tag.tp-uv{background:var(--k-uvdtf)}
.li-ref{font-family:var(--font-sans);font-weight:700;font-size:12px;color:var(--ink-600);margin-right:6px}
.li-btn-add{border:none;background:var(--ink-100);color:var(--ink-700);border-radius:999px;padding:7px 18px;font-family:var(--font-sans);font-size:12.5px;font-weight:700;cursor:pointer;transition:background .15s,color .15s}
.li-btn-add:hover{background:var(--ink-150);color:var(--ink-900)}
.li-etapa{border:none;border-radius:999px;padding:7px 15px;font-family:var(--font-sans);font-size:12px;font-weight:800;letter-spacing:.02em;cursor:pointer;white-space:nowrap;transition:filter .13s;color:#fff}
.li-etapa:hover{filter:brightness(.94)}
.li-etapa[data-e="recibido"]{background:var(--li-recibido);color:var(--tag-yellow-ink,#3D3400)}
.li-etapa[data-e="aprobado"]{background:var(--li-aprobado)}
.li-etapa[data-e="pasado"]{background:var(--li-pasado);cursor:default}
.li-etapa[data-e="pasado"]:hover{filter:none}
.li-dots{border:none;background:none;width:30px;height:30px;border-radius:999px;display:inline-grid;place-items:center;color:var(--ink-400);cursor:pointer;font-size:16px;font-weight:800;line-height:1;letter-spacing:.08em}
.li-dots:hover{background:var(--ink-100);color:var(--ink-900)}
.li-tabla tfoot td{padding:14px 12px;font-size:13.5px;font-weight:800;color:var(--ink-900);border-top:1.5px solid var(--ink-150);background:var(--white)}
.li-tabla tfoot td.num{font-family:var(--font-sans)}
.li-vacio{text-align:center;color:var(--ink-500);padding:30px 12px !important;font-size:13.5px}
.li-row-in{animation:liRowIn .28s cubic-bezier(.23,1,.32,1)}
@keyframes liRowIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.li-leyenda{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:12px 20px;background:var(--ink-50);border-top:1px solid var(--ink-100);font-size:13px;font-weight:700;color:var(--ink-900)}
.li-leyenda b{font-weight:800}
.li-leyenda span{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--ink-700)}

/* Menú ⋯ de fila (fixed: escapa del overflow de la tabla) */
.li-menu{position:fixed;z-index:230;background:var(--white);border:1px solid var(--ink-150);border-radius:12px;box-shadow:0 8px 30px -10px rgba(14,20,35,.35);min-width:205px;overflow:hidden}
.li-menu button{display:flex;align-items:center;gap:9px;width:100%;border:none;background:none;padding:11px 15px;text-align:left;font-family:var(--font-sans);font-size:12.5px;font-weight:600;color:var(--ink-700);cursor:pointer}
.li-menu button:hover{background:var(--ink-50)}
.li-menu button + button{border-top:1px solid var(--ink-100)}
.li-menu button.rojo{color:var(--fail)}
.li-menu button svg{width:14px;height:14px}

/* Menú del FAB (planta alta): dos caminos */
.fab-menu{position:fixed;right:24px;bottom:96px;z-index:230;background:var(--white);border:1px solid var(--ink-150);border-radius:14px;box-shadow:0 10px 34px -10px rgba(14,20,35,.4);min-width:258px;overflow:hidden;animation:fabIn .18s cubic-bezier(.23,1,.32,1)}
.fab-menu button{display:flex;align-items:center;gap:12px;width:100%;border:none;background:none;padding:13px 15px;text-align:left;cursor:pointer;font-family:var(--font-sans)}
.fab-menu button:hover{background:var(--ink-50)}
.fab-menu button + button{border-top:1px solid var(--ink-100)}
.fab-menu .ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none;color:#fff}
.fab-menu .ic.pedido{background:var(--tag-blue)}
.fab-menu .ic.lista{background:var(--li-aprobado)}
.fab-menu .ic svg{width:17px;height:17px}
.fab-menu .tx b{display:block;font-size:13.5px;font-weight:700;color:var(--ink-900);line-height:1.25}
.fab-menu .tx small{font-size:11px;color:var(--ink-500);line-height:1.3}

@media (max-width:640px){
  .li-bar{padding:12px 14px 4px}
  .li-tots{margin-left:0;gap:16px}
  .li-qadd{padding:12px 14px 14px}
  #li-cliente{min-width:130px}
  #li-plg{width:120px}
  /* En móvil el FAB sube por el bottom-nav (bottom:108px): el menú va ARRIBA
     del botón, no encima (tapaba el FAB y parecía que 'no salía nada') */
  .fab-menu{right:16px;bottom:calc(174px + env(safe-area-inset-bottom,0px))}
}
@media (prefers-reduced-motion:reduce){
  .fab-menu{animation:none}
  .li-pop,.li-row-in{animation:none}
  .li-tipo-seg button,.li-step button{transition:background-color .15s ease,color .15s ease}
}

/* Toggle Tablero|Lista: pulgar blanco deslizante (igual al de plantas) */
#prod-lista-tog{position:relative}
#prod-lista-tog .period-btn{position:relative;z-index:1;flex:1;min-width:76px}
#prod-lista-tog::before{content:'';position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 5.5px);background:var(--white);border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:transform .3s cubic-bezier(.22,1,.36,1)}
#prod-lista-tog.lm-lista::before{transform:translateX(calc(100% + 3px))}
#prod-lista-tog .period-btn.active{background:transparent;box-shadow:none}
/* Secciones DTF TEXTIL / DTF UV dentro de la tabla (30+ pedidos: escaneo rápido) */
.li-sec td{background:var(--ink-50)!important;padding:8px 12px;font-size:11px;font-weight:800;letter-spacing:.07em;color:var(--ink-600);border-bottom:1px solid var(--ink-150)}
.li-sec .li-dot{margin-right:7px;vertical-align:-1px}
.li-sec small{font-weight:700;color:var(--ink-500);letter-spacing:.02em;margin-left:8px;text-transform:none}
@media (prefers-reduced-motion:reduce){
  #prod-lista-tog::before,.li-tipo-seg::before{transition:background-color .2s ease}
}

/* ── SUGERENCIAS DEL ASISTENTE IA (Fase 2, v4.205) — pills blancas entre el
   saludo y "En planta ahora" del tablero admin. Las pinta cargarSugerenciasIA
   (ops.js) desde ia_sugerencias; colores de urgencia = paleta oficial de tags. */
.adm-iasg{margin:2px 0 14px}
.adm-iasg-h{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:800;
  letter-spacing:.09em;text-transform:uppercase;color:var(--ink-400);margin:0 2px 8px}
.adm-iasg-h svg{width:12px;height:12px;color:var(--navy)}
.adm-iasg-h .f{font-weight:600;color:var(--ink-300);letter-spacing:.02em;text-transform:none}
.adm-iasg-pills{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
@media (min-width:1500px){.adm-iasg-pills{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:700px){.adm-iasg-pills{grid-template-columns:minmax(0,1fr)}}
.adm-iasg-pill{position:relative;display:flex;align-items:center;gap:10px;width:100%;
  background:var(--white);border:1px solid var(--ink-150);border-radius:999px;
  padding:9px 13px 9px 9px;cursor:pointer;font-family:var(--font-sans);text-align:left;
  opacity:0;transform:translateY(6px);
  transition:opacity .2s cubic-bezier(.23,1,.32,1),transform .2s cubic-bezier(.23,1,.32,1),
    border-color .14s ease,box-shadow .14s ease}
.adm-iasg-pill.in{opacity:1;transform:translateY(0)}
.adm-iasg-pill .b{width:32px;height:32px;border-radius:50%;flex:none;
  display:grid;place-items:center}
.adm-iasg-pill .b svg{width:16px;height:16px}
/* Texto recortado a 2 lineas; el completo vive en el tooltip de abajo */
.adm-iasg-pill .t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.adm-iasg-pill::after{content:attr(data-full);position:absolute;left:6px;right:6px;bottom:calc(100% + 7px);
  background:var(--ink-900);color:#fff;font-size:11.5px;font-weight:500;line-height:1.5;
  padding:10px 13px;border-radius:11px;opacity:0;transform:translateY(4px);pointer-events:none;
  transition:opacity .16s ease,transform .16s cubic-bezier(.23,1,.32,1);
  box-shadow:0 10px 28px rgba(14,14,14,.22);z-index:60}
@media (hover:hover) and (pointer:fine){
  /* La pill con transform crea su propio stacking context: sin este z-index el
     tooltip quedaba DEBAJO de los avatares de "En planta ahora" */
  .adm-iasg-pill:hover{z-index:70}
  .adm-iasg-pill:hover::after{opacity:1;transform:translateY(0);transition-delay:.3s}
}
.adm-iasg-pill.u-alta .b{background:var(--tag-red);color:#fff}
.adm-iasg-pill.u-media .b{background:var(--tag-yellow);color:var(--tag-yellow-ink)}
.adm-iasg-pill.u-info .b{background:var(--tag-blue);color:#fff}
.adm-iasg-pill .t{font-size:12px;font-weight:600;color:var(--ink-800);line-height:1.35;flex:1}
.adm-iasg-pill .ch{width:14px;height:14px;color:var(--tag-blue);flex:none;margin-left:auto}
@media (hover:hover) and (pointer:fine){
  .adm-iasg-pill:hover{border-color:var(--navy);box-shadow:0 2px 10px rgba(9,66,168,.10)}
  .adm-iasg-pill:hover .ch{color:var(--navy)}
}
.adm-iasg-pill:active{transform:scale(.97)}
.adm-iasg-pill:focus{outline:none}
.adm-iasg-pill:focus-visible{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(9,66,168,.18)}
@media (prefers-reduced-motion:reduce){
  .adm-iasg-pill{transform:none;transition:opacity .16s ease}
  .adm-iasg-pill.in{transform:none}
  .adm-iasg-pill::after{transform:none;transition:opacity .16s ease}
}

/* ── Íconos de la flota 3W (assets/iconos) · v4.233 ─────────────────────── */
img.veh-ic{display:inline-block;object-fit:contain;vertical-align:-3px}