
/* ══════════════════════════════════════════════════════════════════════
   ENCIMERA SUR · SISTEMA DE GESTIÓN INTEGRAL
   Sistema de diseño v7
   ──────────────────────────────────────────────────────────────────────
   COLOR   Negro #111111 y crema #EFEEE8 (manual corporativo) + naranja #F59139.
           El naranja no decora: marca el hito y la acción siguiente.
           Los 7 chips de estado están separados perceptualmente (ΔE2000 ≥ 10 en
           relleno y ≥ 15 en texto): ningún par se confunde de un vistazo.
           El HITO es un chip NEGRO SÓLIDO: no se parece a nada más.
   TIPO    DM Sans (la misma tipografía que encimerasur.es), con cifras tabulares,
           porque las fuentes de marca no llevan cifras tabulares.
   TAMAÑO  Escala un paso por encima de la anterior: base 15 px, tablas 13,5 px,
           chips 11,5 px. Nada por debajo de 10,5 px.
   FORMA   Radios cortos. Chips rectangulares: cantos rectos, como una encimera.
   ══════════════════════════════════════════════════════════════════════ */

/* ───────── Tipografías autoalojadas (sin CDN) ───────── */
@font-face{font-family:'DM Sans';src:url('fonts/dmsans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('fonts/dmsans-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('fonts/dmsans-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('fonts/dmsans-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

:root{
  /* ── MARCA ─────────────────────────────────────────── */
  --negro:#111111;            /* RAL 9005 · Pantone Black 6 C */
  --crema:#EFEEE8;            /* RAL 9018 · Pantone 7527 C */
  --naranja:#F59139;
  --naranja-700:#D97721;
  --naranja-900:#723605;      /* naranja como TEXTO (legible sobre claro) */
  --naranja-soft:rgba(245,145,57,.14);
  --naranja-line:rgba(245,145,57,.45);

  /* ── NEUTROS · eje negro↔crema, cálidos ────────────── */
  --ink-900:#111111; --ink-800:#22211E; --ink-700:#3A3833; --ink-600:#4E4C45;
  --ink-500:#63605A; --ink-400:#6F6C64;   /* texto atenuado: legible (>=4.5:1) */
  --ink-300:#A5A299; --ink-200:#D3D0C5;   /* SOLO decorativo: bordes, iconos, deshabilitado */
  --line:#DCDAD0; --line-2:#C6C3B7;
  --bg:#EFEEE8; --bg-2:#E5E3DA; --panel:#F7F6F1; --white:#FFFFFF;

  /* ── ESTADOS · texto (tinta) + relleno (chip) ────────
     Separación verificada: relleno ΔE2000 ≥ 10,8 · texto ΔE2000 ≥ 15,3 */
  --ok:#1F6B3A;      --ok-soft:rgba(46,140,80,.22);
  --info:#1B5A80;    --info-soft:rgba(32,120,165,.22);
  --warn:#6F5605;    --warn-soft:rgba(214,172,20,.32);
  --danger:#A82217;  --danger-soft:rgba(196,45,30,.18);
  --terra-ink:#723605; --terra-soft:rgba(245,145,57,.32);
  --gris:#5A5548;    --gris-soft:rgba(140,130,105,.34);
  /* Rellenos sólidos vivos: barras, puntos, botones macizos. NO se usan como texto. */
  --fill-ok:#3E7A52; --fill-info:#35617D; --fill-warn:#B0761C; --fill-danger:#B0392A;

  /* ── FORMA · radios cortos, nada de cápsulas ───────── */
  --r-xs:3px; --r-sm:5px; --r:8px; --r-lg:12px; --r-chip:4px;

  /* ── ESPACIADO ─────────────────────────────────────── */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px;

  /* ── ELEVACIÓN ─────────────────────────────────────── */
  --shadow-xs:0 1px 2px rgba(17,17,17,.05);
  --shadow-sm:0 2px 8px rgba(17,17,17,.07);
  --shadow-md:0 8px 26px rgba(17,17,17,.10);
  --shadow-lg:0 20px 56px rgba(17,17,17,.20);

  /* ── ESTRUCTURA ────────────────────────────────────── */
  --sidebar-w:268px; --topbar-h:66px;

  /* ── TIPOGRAFÍA ────────────────────────────────────── */
  --f-display:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --f-body:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --f-mono:'DM Sans','Helvetica Neue',Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:var(--f-body); background:var(--bg); color:var(--ink-700);
  font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased;
  display:flex; overflow:hidden;
}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:var(--r-xs);border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--ink-300)}

/* Cifras y referencias SIEMPRE en mono: así las columnas de euros cuadran */
.tnum,.mono,.cod{font-family:var(--f-mono);font-variant-numeric:tabular-nums;letter-spacing:0}
.cod{font-weight:500;color:var(--ink-900)}

:focus-visible{outline:2px solid var(--naranja);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ════════════════════════ SIDEBAR ════════════════════════ */
#sidebar{
  width:var(--sidebar-w); flex-shrink:0; height:100vh; background:var(--negro);
  color:var(--ink-300); display:flex; flex-direction:column; position:relative; z-index:40;
}
.sb-brand{display:flex;align-items:center;padding:24px 20px 8px}
.sb-brand-logo{width:162px;max-width:80%;height:auto;display:block}
.sb-brand-ver{font-family:var(--f-mono);font-size:10px;color:rgba(239,238,232,.42);padding:2px 21px 0;letter-spacing:.04em}
.sb-brand-sub{
  font-size:9.5px; font-weight:700; letter-spacing:.26em; text-transform:uppercase;
  color:var(--naranja); padding:0 21px 17px; border-bottom:1px solid rgba(239,238,232,.09);
}
.sb-cta{margin:15px 14px 6px}
.sb-cta button{
  width:100%; border:none; cursor:pointer; font-family:var(--f-body);
  background:var(--naranja); color:var(--negro);
  padding:12px 15px; border-radius:var(--r-sm); font-weight:700; font-size:13.5px;
  display:flex; align-items:center; gap:9px; justify-content:center; transition:background .14s;
}
.sb-cta button:hover{background:#FFA24E}
.sb-cta button svg{width:17px;height:17px}
#sidebar-nav{flex:1;overflow-y:auto;padding:8px 12px 16px}
#sidebar-nav::-webkit-scrollbar{width:5px}
#sidebar-nav::-webkit-scrollbar-thumb{background:rgba(239,238,232,.14)}
.sb-group-label{
  font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(239,238,232,.55); padding:17px 12px 6px;
}
.sb-item{
  display:flex; align-items:center; gap:12px; padding:10px 13px; border-radius:var(--r-sm);
  cursor:pointer; color:rgba(239,238,232,.74); font-size:14px; font-weight:500;
  transition:.13s; position:relative; margin-bottom:1px; text-decoration:none;
}
.sb-item:hover{background:rgba(239,238,232,.07);color:var(--crema)}
.sb-item.active{background:rgba(239,238,232,.10);color:var(--crema);font-weight:600}
.sb-item.active::before{
  content:''; position:absolute; left:-12px; top:6px; bottom:6px; width:3px;
  border-radius:0 var(--r-xs) var(--r-xs) 0; background:var(--naranja);
}
.sb-item .ic{width:18px;height:18px;flex-shrink:0;opacity:.8}
.sb-item.active .ic{opacity:1}
.sb-item .badge{
  margin-left:auto; background:var(--naranja); color:var(--negro); font-family:var(--f-mono);
  font-size:11px; font-weight:700; min-width:21px; height:20px; padding:0 6px;
  border-radius:var(--r-chip); display:grid; place-items:center; line-height:1;
}
.sb-item .badge.danger{background:var(--fill-danger);color:var(--crema)}
.sb-foot{padding:14px 17px;border-top:1px solid rgba(239,238,232,.09);display:flex;align-items:center;gap:11px}
.sb-avatar{
  width:34px; height:34px; border-radius:var(--r-sm); background:rgba(239,238,232,.10);
  display:grid; place-items:center; color:var(--crema); font-weight:700; font-size:13px; flex-shrink:0;
}
.sb-foot .u-name{font-size:13px;font-weight:600;color:var(--crema);line-height:1.3}
.sb-foot .u-role{font-size:11.5px;color:rgba(239,238,232,.62)}

/* ════════════════════════ MAIN ════════════════════════ */
#main{flex:1;display:flex;flex-direction:column;height:100vh;min-width:0;background:var(--bg)}
#topbar{
  height:var(--topbar-h); flex-shrink:0; background:var(--bg); border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:16px; padding:0 28px; position:relative; z-index:30;
}
.tb-title{font-family:var(--f-display);font-weight:600;font-size:19px;color:var(--ink-900);letter-spacing:-.01em}
.tb-sub{font-size:12.5px;color:var(--ink-400);margin-top:2px}
.tb-search{margin-left:auto;position:relative;width:340px;max-width:34vw}
.tb-search input{
  width:100%; border:1px solid var(--line-2); background:var(--white); border-radius:var(--r-sm);
  padding:9px 14px 9px 36px; font-family:var(--f-body); font-size:13.5px; color:var(--ink-700);
  outline:none; transition:.15s;
}
.tb-search input:focus{border-color:var(--naranja);box-shadow:0 0 0 3px var(--naranja-soft)}
.tb-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--ink-300)}
.tb-icon-btn{
  width:40px; height:40px; border-radius:var(--r-sm); border:1px solid var(--line-2);
  background:var(--white); display:grid; place-items:center; cursor:pointer;
  color:var(--ink-500); position:relative; transition:.13s; text-decoration:none;
}
.tb-icon-btn:hover{border-color:var(--ink-300);color:var(--ink-900)}
.tb-icon-btn svg{width:18px;height:18px}
.tb-icon-btn .dot{position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--naranja);border:1.5px solid var(--white)}
#content{flex:1;overflow-y:auto;padding:26px 28px 44px}

/* ════════════════════════ COMPONENTES ════════════════════════ */
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-xs)}
.card-pad{padding:22px 24px}
.card-h{display:flex;align-items:flex-start;gap:12px;margin-bottom:var(--s4)}
.card-h h3{font-family:var(--f-display);font-size:16px;font-weight:600;color:var(--ink-900);letter-spacing:-.005em}
.card-h .right{margin-left:auto;display:flex;gap:var(--s2);align-items:center}
.sub{font-size:12.5px;color:var(--ink-400);margin-top:3px}
.eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-500)}
.section-gap{margin-bottom:var(--s4)}
.muted{color:var(--ink-500)}
.field-err{color:var(--danger);font-size:11.5px;margin-top:4px;font-weight:600}
hr.sep{border:none;border-top:1px solid var(--line);margin:var(--s4) 0}

/* ── CHIPS DE ESTADO · rectangulares, separados perceptualmente ── */
.pill{
  display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:700;
  padding:4px 9px; border-radius:var(--r-chip); line-height:1.5; white-space:nowrap; letter-spacing:.01em;
}
.pill .dt{width:6px;height:6px;border-radius:1px;flex-shrink:0;background:currentColor}
.p-ok{background:var(--ok-soft);color:var(--ok)}
.p-info{background:var(--info-soft);color:var(--info)}
.p-warn{background:var(--warn-soft);color:var(--warn)}
.p-danger{background:var(--danger-soft);color:var(--danger)}
.p-terra{background:var(--terra-soft);color:var(--terra-ink)}      /* naranja de marca */
.p-gray{background:var(--gris-soft);color:var(--gris)}
.p-violet{background:var(--negro);color:var(--crema)}              /* HITO · negro sólido */

.origin-pill{display:inline-flex;align-items:center;font-size:11px;font-weight:700;padding:3px 8px;border-radius:var(--r-chip);letter-spacing:.02em}
.origin-cliente{background:var(--info-soft);color:var(--info)}
.origin-interno{background:var(--gris-soft);color:var(--gris)}

/* ── Botones ── */
.btn{
  display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line-2);
  background:var(--white); color:var(--ink-700); font-family:var(--f-body); font-weight:600;
  font-size:13.5px; padding:9px 15px; border-radius:var(--r-sm); cursor:pointer;
  transition:.13s; white-space:nowrap;
}
.btn:hover{border-color:var(--ink-400);background:var(--panel)}
.btn svg{width:15px;height:15px;flex-shrink:0}
.btn-dark{background:var(--negro);border-color:var(--negro);color:var(--crema)}
.btn-dark:hover{background:#000;border-color:#000;color:var(--crema)}
.btn-terra{background:var(--naranja);border-color:var(--naranja);color:var(--negro)}
.btn-terra:hover{background:#FFA24E;border-color:#FFA24E}
.btn-ok{background:var(--fill-ok);border-color:var(--fill-ok);color:#fff}
.btn-ok:hover{filter:brightness(.94)}
.btn-ghost{background:transparent;border-color:transparent;color:var(--ink-500)}
.btn-ghost:hover{background:var(--bg-2);color:var(--ink-900)}
.btn-sm{padding:7px 12px;font-size:12.5px}
.btn-sm svg{width:14px;height:14px}
.btn-xs{padding:5px 10px;font-size:12px;border-radius:var(--r-xs)}
.btn-lg{padding:13px 22px;font-size:15px;font-weight:600;gap:8px}
.btn-xs svg{width:13px;height:13px}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn:disabled:hover{border-color:var(--line-2);background:var(--white)}

/* ── Tablas ── */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--white)}
table.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
table.tbl thead th{
  text-align:left; font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-400); padding:11px 15px; border-bottom:1px solid var(--line);
  background:var(--panel); white-space:nowrap; position:sticky; top:0; z-index:1;
}
table.tbl tbody td{padding:12px 15px;border-bottom:1px solid var(--line);color:var(--ink-700);vertical-align:middle}
table.tbl tbody tr:last-child td{border-bottom:none}
table.tbl tbody tr{transition:background .12s}
table.tbl tbody tr:hover{background:var(--panel)}

/* ── Filtros ── */
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.f-inp{
  border:1px solid var(--line-2); background:var(--white); border-radius:var(--r-sm);
  padding:8px 13px; font-family:var(--f-body); font-size:13.5px; color:var(--ink-700); outline:none;
}
.f-inp:focus{border-color:var(--naranja);box-shadow:0 0 0 3px var(--naranja-soft)}

/* ── Segmentado ── */
.seg{display:inline-flex;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:3px;gap:2px}
.seg button{
  border:none; background:transparent; font-family:var(--f-body); font-size:12.5px; font-weight:600;
  color:var(--ink-500); padding:6px 15px; border-radius:var(--r-xs); cursor:pointer; transition:.13s;
}
.seg button:hover{color:var(--ink-900)}
.seg button.on{background:var(--white);color:var(--ink-900);box-shadow:var(--shadow-xs)}

/* ── Pestañas ── */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:20px;overflow-x:auto}
.tab{
  padding:10px 16px; font-size:13.5px; font-weight:600; color:var(--ink-400); cursor:pointer;
  border-bottom:2px solid transparent; white-space:nowrap; transition:.13s; margin-bottom:-1px;
}
.tab:hover{color:var(--ink-700)}
.tab.active{color:var(--ink-900);border-bottom-color:var(--naranja)}

/* ── Bandejas · Oficina Core ── */
.bandejas{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:1340px){.bandejas{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.bandejas{grid-template-columns:1fr}}
.bandeja{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden; box-shadow:var(--shadow-xs); display:flex; flex-direction:column;
}
.bandeja .bnd-h{display:flex;align-items:center;gap:11px;padding:14px 16px;border-bottom:1px solid var(--line)}
.bandeja .bnd-bar{width:4px;align-self:stretch;border-radius:1px}
.bandeja .bnd-t{
  font-family:var(--f-display); font-weight:600; font-size:13.5px; color:var(--ink-800);
  flex:1; display:flex; align-items:center; gap:7px;
}
.bandeja .bnd-t svg{width:13px;height:13px;color:var(--naranja-900);flex-shrink:0}
.bandeja .bnd-n{font-family:var(--f-mono);font-weight:700;font-size:19px;color:var(--ink-900)}
.bandeja .bnd-body{padding:8px 10px;flex:1;max-height:250px;overflow-y:auto}
.bnd-row{
  display:flex; align-items:center; gap:9px; padding:8px 9px; border-radius:var(--r-xs);
  cursor:pointer; font-size:13px; transition:background .12s;
}
.bnd-row:hover{background:var(--panel)}
.bnd-row .bnd-code{font-family:var(--f-mono);font-size:11.5px;color:var(--ink-400);margin-left:auto;flex-shrink:0}
/* HITO · el naranja de marca señala el punto de avance clave */
.bandeja.hito{border-color:var(--naranja-line);box-shadow:0 0 0 1px var(--naranja-soft),var(--shadow-xs)}

/* ── Kanban ── */
.kanban{display:flex;gap:14px;overflow-x:auto;padding:2px 2px 14px;align-items:flex-start}
.kcol{flex:0 0 272px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:12px;min-height:130px}
.kcol.drop-hint{border-color:var(--naranja);background:var(--naranja-soft)}
.kcol-h{
  display:flex; align-items:center; justify-content:space-between; font-family:var(--f-display);
  font-weight:600; font-size:13px; color:var(--ink-700); margin-bottom:10px; padding:0 2px;
}
.kcol-h .cnt{
  font-family:var(--f-mono); background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-chip); font-size:11.5px; padding:2px 7px; color:var(--ink-500);
}
.kcard{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-sm);
  padding:11px 13px; margin-bottom:9px; cursor:grab; box-shadow:var(--shadow-xs); transition:.13s;
}
.kcard:hover{box-shadow:var(--shadow-sm);border-color:var(--line-2)}
.kcard.dragging{opacity:.45}
.kcard .kc-t{font-weight:600;font-size:13.5px;color:var(--ink-800);margin-bottom:3px}
.kcard .kc-code{font-family:var(--f-mono);font-size:11.5px;color:var(--ink-400);margin-bottom:8px}
.kcard .kc-foot{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}

/* ── Flujo Global ── */
.flujo-global{display:flex;gap:9px;flex-wrap:wrap;align-items:stretch}
.fg-chip{
  flex:1; min-width:108px; border-radius:var(--r-sm); padding:13px 9px; text-align:center;
  cursor:pointer; text-decoration:none; border:1px solid transparent; transition:.13s;
  color:var(--crema);   /* el JS lo cambia a negro si el fondo es claro */
}
.fg-chip:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.fg-chip .fg-n{font-family:var(--f-mono);font-weight:700;font-size:23px;display:block;line-height:1.2}
.fg-chip .fg-l{font-size:11.5px;font-weight:600;opacity:.92}

/* ── Versiones ── */
.ver-tl{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.ver-node{font-family:var(--f-mono);border:1px solid var(--line);border-radius:var(--r-chip);padding:4px 10px;font-size:11.5px;font-weight:500}
.ver-node.old{background:var(--bg-2);color:var(--ink-500);border-style:dashed}
.ver-node.cur{background:var(--terra-soft);color:var(--terra-ink);border-color:var(--naranja-line)}

/* ── Campos ── */
.info-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:16px 24px}
.fld label{display:block;font-size:11px;font-weight:700;color:var(--ink-500);margin-bottom:6px;text-transform:uppercase;letter-spacing:.09em}
.fld input,.fld select,.fld textarea{
  width:100%; border:1px solid var(--line-2); border-radius:var(--r-sm); padding:9px 12px;
  font-family:var(--f-body); font-size:13.5px; color:var(--ink-900); background:var(--white);
  outline:none; transition:.13s;
}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--naranja);box-shadow:0 0 0 3px var(--naranja-soft)}
.fld input:disabled{background:var(--bg-2);color:var(--ink-500)}

/* Inputs/textarea sueltos (fuera de .fld): mismo aspecto que dentro de .fld */
.paso-body textarea, .test-noconf textarea, textarea.form-txt, .modal textarea:not(.fld textarea){
  width:100%; box-sizing:border-box; border:1px solid var(--line-2); border-radius:var(--r-sm);
  padding:10px 12px; font-family:var(--f-body); font-size:13.5px; color:var(--ink-900);
  background:var(--white); outline:none; transition:.13s; resize:vertical;
}
.paso-body textarea:focus, .test-noconf textarea:focus{border-color:var(--naranja);box-shadow:0 0 0 3px var(--naranja-soft)}
/* Asegurar box-sizing en TODOS los campos para que el padding no desborde */
.fld input,.fld select,.fld textarea{box-sizing:border-box}


/* ── Estado vacío ── */
.empty-state{text-align:center;padding:44px 20px;color:var(--ink-400);display:flex;flex-direction:column;align-items:center;gap:9px;font-size:13px}
.empty-state svg{width:24px;height:24px;opacity:.55}

/* ════════════════════════ MODALES ════════════════════════ */
.modal-bg{
  position:fixed; inset:0; background:rgba(17,17,17,.44); backdrop-filter:blur(2px); z-index:200;
  display:none; align-items:flex-start; justify-content:center; padding:28px; overflow-y:auto;
  opacity:0; transition:opacity .12s ease;
}
.modal-bg.open{display:flex; opacity:1}
.modal-bg.closing{opacity:0}
.modal{
  background:var(--bg); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); width:100%;
  max-width:940px; margin:auto; animation:pop .16s cubic-bezier(.2,.9,.3,1); overflow:hidden;
}
.modal.wide{max-width:1220px}
.modal-bg.closing .modal{animation:popOut .12s cubic-bezier(.4,0,1,1) forwards}
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.99)}to{opacity:1;transform:none}}
@keyframes popOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(4px) scale(.995)}}
.modal-head{padding:17px 24px;background:var(--white);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:13px}
.modal-head h2{font-family:var(--f-display);font-size:17.5px;font-weight:600;color:var(--ink-900);letter-spacing:-.01em}
.modal-head .mh-sub{font-size:12.5px;color:var(--ink-400);margin-top:3px}
.modal-x{
  margin-left:auto; width:36px; height:36px; border-radius:var(--r-sm); border:1px solid var(--line);
  background:var(--white); display:grid; place-items:center; cursor:pointer; color:var(--ink-500); flex-shrink:0;
}
.modal-x:hover{background:var(--bg-2);color:var(--ink-900)}
.modal-x svg{width:15px;height:15px}
.modal-foot{padding:16px 24px;background:var(--white);border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;flex-wrap:wrap}


/* ════════════════════ TRANSICIONES GLOBALES ════════════════════ */
/* Fade-in del contenido al cargar cada página */
@keyframes fadeInUp{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
#content{animation:fadeInUp .2s ease}
body.page-leaving #content{opacity:0;transition:opacity .1s ease}

/* Micro-interacciones: botones, filas, tarjetas */
.btn{transition:background .14s ease, border-color .14s ease, color .14s ease, transform .08s ease, box-shadow .14s ease}
.btn:active{transform:translateY(1px)}
.tbl tbody tr{transition:background .12s ease}
.card{transition:box-shadow .16s ease, border-color .16s ease, transform .16s ease}
.bnd-row{transition:background .12s ease, border-color .12s ease, transform .1s ease}

.kcard{transition:box-shadow .14s ease, transform .12s ease, border-color .14s ease}

.sb-item{transition:background .13s ease, color .13s ease}
.pill{transition:background .12s ease}
.seg button{transition:background .13s ease, color .13s ease}
.tab{transition:color .14s ease, border-color .14s ease}
.calx-cell{transition:background .12s ease}
.ccal-c{transition:background .1s ease, border-color .1s ease, transform .08s ease}
.ccal-c:active{transform:scale(.94)}

/* El toast entra y sale con curva suave (ya existe .show, reforzamos la transición) */
#toast{transition:transform .32s cubic-bezier(.2,.9,.3,1), opacity .32s ease}

/* Respeta a quien prefiere menos movimiento */
@media (prefers-reduced-motion: reduce){
  #content, .modal, .pop-card{animation:none!important}
  .modal-bg, .btn, .card, .bnd-row, .kcard, .ccal-c{transition:none!important}
}

/* ════════════════════ POPOVER LIGERO ════════════════════ */
#popover-host{position:fixed;inset:0;z-index:320;display:none}
#popover-host.open{display:block}
.pop-backdrop{position:absolute;inset:0;background:rgba(17,17,17,.28);opacity:0;transition:opacity .12s ease}
#popover-host.open .pop-backdrop{opacity:1}
.pop-card{position:absolute;top:50%;left:50%;transform:translate(-50%,-48%) scale(.98);opacity:0;
  background:var(--white);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--shadow-lg);
  width:min(340px,90vw);max-height:70vh;overflow:hidden;transition:opacity .13s ease, transform .13s cubic-bezier(.2,.9,.3,1)}
#popover-host.open .pop-card{opacity:1;transform:translate(-50%,-50%) scale(1)}
.pop-head{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--line)}
.pop-head strong{font-family:var(--f-display);font-size:14px;font-weight:600;color:var(--ink-900);text-transform:capitalize}
.pop-x{width:28px;height:28px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--white);
  display:grid;place-items:center;cursor:pointer;color:var(--ink-500)}
.pop-x:hover{background:var(--bg-2);color:var(--ink-900)}
.pop-x svg{width:13px;height:13px}
.pop-body{padding:14px 16px;overflow-y:auto;max-height:calc(70vh - 52px)}

/* ════════════════════ MINI-CALENDARIO DE CITA · barra de navegación ════════════════════ */
.ccal-topbar{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.ccal-topbar .ccal-head{margin:0;flex:1;text-align:center}
.ccal-nav{width:26px;height:26px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:var(--white);
  cursor:pointer;font-size:16px;line-height:1;color:var(--ink-600);display:grid;place-items:center;transition:.12s}
.ccal-nav:hover{background:var(--panel);border-color:var(--ink-400);color:var(--ink-900)}
.ccal-hoy{padding:0 10px;height:26px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:var(--white);
  cursor:pointer;font-size:11.5px;font-weight:600;color:var(--ink-600);transition:.12s}
.ccal-hoy:hover{background:var(--panel);border-color:var(--ink-400)}
.ccal-c.hoy{border-color:var(--naranja);box-shadow:inset 0 0 0 1px var(--naranja)}

/* ── Toast ── */
#toast{
  position:fixed; bottom:28px; left:50%; transform:translateX(-50%) translateY(150px); z-index:400;
  background:var(--negro); color:var(--crema); padding:14px 22px; border-radius:var(--r-sm);
  font-size:13.5px; font-weight:600; box-shadow:var(--shadow-lg); border-left:3px solid var(--naranja);
  transition:transform .3s cubic-bezier(.2,.9,.3,1); max-width:min(680px,90vw); text-align:center;
}
#toast.show{transform:translateX(-50%) translateY(0)}

/* ── Pantalla del cliente ── */
.conf-scr{max-width:500px;margin:0 auto;background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-md)}
.conf-scr .cs-head{background:var(--negro);color:var(--crema);padding:20px}
.conf-scr .cs-body{padding:22px}
.cs-line{display:flex;align-items:center;gap:10px;padding:4px 0;font-size:14px;color:var(--ink-700)}
.cs-line svg{width:16px;height:16px;color:var(--ink-400);flex-shrink:0}
.cs-ico{width:50px;height:50px;border-radius:var(--r);display:grid;place-items:center;margin:0 auto 13px}
.cs-ico svg{width:24px;height:24px}
.wa-btn{
  display:inline-flex; align-items:center; gap:8px; background:var(--fill-ok); color:#fff; border:none;
  border-radius:var(--r-sm); padding:9px 15px; font-family:var(--f-body); font-weight:600;
  font-size:13.5px; cursor:pointer;
}
.wa-btn:hover{filter:brightness(.94)}
.wa-btn svg{width:16px;height:16px}
.chat-ic{width:17px;height:17px;flex:0 0 17px}

/* ── Notas ── */
.nota{border-radius:var(--r-sm);padding:12px 15px;font-size:13.5px;color:var(--ink-700);border:1px solid var(--line);background:var(--panel)}
.nota-info{border-color:rgba(32,120,165,.35);background:var(--info-soft)}
.nota-warn{border-color:rgba(214,172,20,.45);background:var(--warn-soft)}
.nota-naranja{border-color:var(--naranja-line);background:var(--naranja-soft)}
.nom-tbl code{font-family:var(--f-mono);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r-xs);padding:2px 7px;font-size:12.5px;color:var(--naranja-900)}

/* ════════════════════════ CALENDARIO MENSUAL ════════════════════════ */
.calx-head{display:flex;align-items:center;gap:13px;margin-bottom:16px}
.calx-title{font-family:var(--f-display);font-weight:600;font-size:18px;color:var(--ink-900);text-transform:capitalize;min-width:190px}
.calx-nav{display:flex;gap:6px}
.calx-nav button{
  border:1px solid var(--line-2); background:var(--white); border-radius:var(--r-xs);
  width:36px; height:36px; cursor:pointer; font-size:16px; color:var(--ink-500);
  display:grid; place-items:center; font-family:var(--f-body);
}
.calx-nav button:hover{background:var(--panel);color:var(--ink-900)}
.calx-nav .today-btn{width:auto;padding:0 14px;font-weight:600;font-size:13px}
.calx-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.calx-dow{background:var(--bg-2);padding:10px 6px;text-align:center;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500)}
.calx-cell{background:var(--white);min-height:130px;padding:8px 7px 5px;display:flex;flex-direction:column}
.calx-cell.other{background:var(--panel)}
.calx-cell.today{background:var(--naranja-soft);box-shadow:inset 0 0 0 1px var(--naranja-line)}
.calx-daynum{font-family:var(--f-mono);font-size:12px;font-weight:500;color:var(--ink-500);margin-bottom:5px}
.calx-cell.today .calx-daynum{color:var(--naranja-900);font-weight:700}
.calx-cell.other .calx-daynum{color:var(--ink-400)}
.calx-ev{
  font-size:11.5px; font-weight:600; padding:3px 7px; border-radius:var(--r-xs); margin-bottom:3px;
  cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-left:3px solid currentColor;
}
.calx-ev:hover{filter:brightness(.96)}
.calx-more{font-size:11px;font-weight:600;color:var(--ink-500);cursor:pointer;padding:2px 7px;margin-top:auto}
.calx-more:hover{color:var(--naranja-900)}

/* ════════════════════════════════════════════════════════════
   PARTE DE MEDICIÓN · documento intacto (7 secciones · Tailwind · A4)
   NO se escala: es un A4. Si se agranda, deja de caber en la página.
   Solo cambia la tipografía a la de marca.
   ════════════════════════════════════════════════════════════ */
.pm-vincula{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin-bottom:18px}
#documento-impreso{font-family:var(--f-body);font-size:13.5px}
#documento-impreso h1{font-family:var(--f-display);letter-spacing:-.03em}
#documento-impreso svg:not([width]){width:18px;height:18px}
#documento-impreso input,#documento-impreso select,#documento-impreso textarea{font-family:var(--f-body)}
#documento-impreso input[type=number],#documento-impreso input[type=date]{font-family:var(--f-mono)}
.pm-foto{
  aspect-ratio:1; background:var(--bg-2); border:1px dashed var(--line-2); border-radius:var(--r-xs);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  font-size:9px; color:var(--ink-500); padding:4px; text-align:center; line-height:1.25;
}
.pm-foto svg{width:15px;height:15px;opacity:.6}




/* ════════════════════ RESPONSABLES (Configuración) ════════════════════ */
.rol-chip{display:inline-flex;align-items:center;gap:6px;border-radius:var(--r-chip);padding:3px 10px;
  font-family:var(--f-body);font-size:12px;font-weight:600}
.rol-dot{width:8px;height:8px;border-radius:2px;flex-shrink:0}
.resp-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px}
@media(max-width:820px){.resp-grid{grid-template-columns:1fr}}
.resp-grupo{border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;background:var(--white)}
.resp-grupo-h{display:flex;align-items:center;gap:9px;padding:11px 14px;border-bottom:1px solid var(--line)}
.resp-grupo-t{font-family:var(--f-display);font-weight:600;font-size:14px}
.resp-grupo-n{font-family:var(--f-mono);font-size:11px;color:var(--ink-600)}
.resp-grupo-body{padding:8px 14px 12px}
.resp-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.resp-row:last-child{border-bottom:none}
.resp-row.baja{opacity:.55}
.resp-nom{font-weight:600;font-size:13.5px;color:var(--ink-800);flex:1}
.resp-acc{display:inline-flex;gap:6px;flex-shrink:0}

/* ════════════════════ FILTROS CONFIGURABLES ════════════════════ */
.filtros-wrap{position:relative}
.fbadge{background:var(--naranja);color:var(--negro);font-family:var(--f-mono);font-size:10px;font-weight:700;
  padding:1px 6px;border-radius:var(--r-chip);margin-left:4px}
.fpanel{position:absolute;top:calc(100% + 6px);right:0;z-index:20;background:var(--white);border:1px solid var(--line-2);
  border-radius:var(--r);box-shadow:var(--shadow-md);padding:14px;width:min(380px,90vw)}
.fpanel-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.fchips{display:flex;flex-wrap:wrap;gap:7px}
.fchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);background:var(--white);
  border-radius:var(--r-sm);padding:6px 10px;font-family:var(--f-body);font-size:12px;font-weight:600;
  color:var(--ink-400);cursor:pointer;transition:.12s}
.fchip:hover{border-color:var(--ink-400)}
.fchip.on{color:var(--ink-800);border-color:var(--line-2);background:var(--panel)}
.fchip .fdot{width:8px;height:8px;border-radius:2px;opacity:.35}
.fchip.on .fdot{opacity:1}
.fchip .fdot.p-ok{background:var(--fill-ok)}.fchip .fdot.p-info{background:var(--fill-info)}
.fchip .fdot.p-warn{background:var(--fill-warn)}.fchip .fdot.p-danger{background:var(--fill-danger)}
.fchip .fdot.p-terra{background:var(--naranja)}.fchip .fdot.p-violet{background:var(--negro)}
.fchip .fdot.p-gray{background:var(--ink-400)}
.foff{font-family:var(--f-mono);font-size:9px;color:var(--ink-300);text-transform:uppercase;letter-spacing:.05em}

/* ════════════════════ ADJUNTOS ════════════════════ */
.adj-zona{border:1.5px dashed var(--line-2);border-radius:var(--r);padding:16px;text-align:center;background:var(--panel);transition:.13s}
.adj-zona:hover{border-color:var(--naranja-line);background:var(--naranja-soft)}
.adj-btns{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-bottom:6px}
.adj-list{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}
.adj-item{display:flex;align-items:center;gap:8px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:8px 11px;font-size:12.5px;max-width:100%}
.adj-item .adj-ic{color:var(--naranja-900);flex-shrink:0}
.adj-item .adj-nom{color:var(--ink-700);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}
.adj-item .adj-peso{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-400);flex-shrink:0}
.adj-item .adj-del{cursor:pointer;color:var(--ink-300);flex-shrink:0;line-height:1;display:grid;place-items:center}
.adj-item .adj-del:hover{color:var(--danger)}
.adj-thumb{width:52px;height:52px;border-radius:var(--r-sm);object-fit:cover;border:1px solid var(--line);flex-shrink:0}
.adj-recibidos{background:var(--info-soft);border:1px solid rgba(32,120,165,.3);border-radius:var(--r-sm);padding:11px 13px;margin-bottom:14px}
.adj-recibidos .muted{color:var(--ink-700)}

/* ════════════════════ FIRMA ════════════════════ */
.firma-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.firma-grid{grid-template-columns:1fr}}
.firma-box{border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;background:var(--white)}
.firma-lienzo{width:100%;height:130px;display:block;background:repeating-linear-gradient(var(--panel),var(--panel) 25px,var(--bg-2) 26px);cursor:crosshair;touch-action:none}
.firma-foot{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-top:1px solid var(--line);background:var(--panel)}
.firma-lbl{font-size:11px;font-weight:700;color:var(--ink-500);text-transform:uppercase;letter-spacing:.06em}
.firma-clear{font-size:11.5px;color:var(--ink-400);cursor:pointer;font-weight:600}
.firma-clear:hover{color:var(--danger)}
.firma-ok{color:var(--ok);font-size:11px;font-weight:700}

/* ════════════════════ PASOS DE CONFORMIDAD ════════════════════ */
.pasos{display:flex;flex-direction:column;gap:14px}
.paso{border:1px solid var(--line);border-radius:var(--r);background:var(--white);overflow:hidden}
.paso.done{border-color:var(--naranja-line)}
.paso-h{display:flex;align-items:center;gap:11px;padding:13px 16px;background:var(--panel);border-bottom:1px solid var(--line)}
.paso-n{width:26px;height:26px;border-radius:50%;background:var(--negro);color:var(--crema);display:grid;place-items:center;
  font-family:var(--f-mono);font-weight:700;font-size:13px;flex-shrink:0}
.paso.done .paso-n{background:var(--ok)}
.paso-t{font-family:var(--f-display);font-weight:600;font-size:14px;color:var(--ink-900)}
.paso-body{padding:16px}

/* Test de no conformidad */
.test-noconf{background:var(--danger-soft);border:1px solid rgba(196,45,30,.3);border-radius:var(--r);padding:16px;margin-bottom:14px}
.test-op{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:var(--white);cursor:pointer;margin-bottom:7px;font-size:13.5px;transition:.12s}
.test-op:hover{border-color:var(--ink-400)}
.test-op.on{border-color:var(--danger);background:var(--white);box-shadow:0 0 0 1px var(--danger)}
.test-radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--line-2);flex-shrink:0;display:grid;place-items:center}
.test-op.on .test-radio{border-color:var(--danger)}
.test-op.on .test-radio::after{content:'';width:9px;height:9px;border-radius:50%;background:var(--danger)}



/* Paginador */
.paginador{display:flex;align-items:center;justify-content:center;gap:14px;padding:14px 0 4px;margin-top:8px;border-top:1px solid var(--line)}

/* Mini-calendario en el modal de cita */
.ccal-head{font-family:var(--f-display);font-weight:600;font-size:14px;color:var(--ink-900);text-align:center;margin-bottom:8px;text-transform:capitalize}
.ccal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:2px}
.ccal-dow span{text-align:center;font-size:9.5px;font-weight:700;color:var(--ink-400);text-transform:uppercase}
.ccal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.ccal-c{aspect-ratio:1;border:1px solid var(--line);border-radius:var(--r-xs);display:flex;flex-direction:column;
  align-items:center;justify-content:center;font-family:var(--f-mono);font-size:12px;color:var(--ink-700);cursor:pointer;position:relative;transition:.1s}
.ccal-c:hover{border-color:var(--naranja);background:var(--naranja-soft)}
.ccal-c.out{border:none;cursor:default;background:transparent}
.ccal-c.sel{background:var(--negro);color:var(--crema);border-color:var(--negro)}
.ccal-c.busy .ccal-dot{position:absolute;bottom:3px;font-size:8px;background:var(--naranja);color:var(--negro);
  border-radius:6px;min-width:12px;height:12px;display:grid;place-items:center;font-weight:700;font-style:normal;padding:0 2px}
.ccal-c.sel.busy .ccal-dot{background:var(--crema);color:var(--negro)}
@media(max-width:820px){.cita-cols{grid-template-columns:1fr!important}}






/* ════════════════════ ÁREA DE CLIENTE ════════════════════ */
.ac-shell{max-width:540px;margin:0 auto;background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-md);box-sizing:border-box}
.ac-shell *{box-sizing:border-box}
.ac-head{background:var(--negro);color:var(--crema);padding:20px;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.ac-head-sub{font-size:11.5px;opacity:.8;letter-spacing:.18em;text-transform:uppercase}
.ac-body{padding:22px}
.ac-hello{font-family:var(--f-display);font-size:20px;font-weight:600;color:var(--ink-900)}
.ac-sub{font-size:13.5px;color:var(--ink-600);margin:3px 0 18px}
/* Timeline de hitos */
.ac-timeline{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px}
.ac-hito{display:flex;flex-direction:column;align-items:center;gap:6px;flex:0 0 auto;width:56px;text-align:center}
.ac-hito-dot{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;font-family:var(--f-mono);background:var(--panel);border:2px solid var(--line-2);color:var(--ink-700)}
.ac-hito.done .ac-hito-dot{background:var(--ok);border-color:var(--ok);color:#fff}
.ac-hito.now .ac-hito-dot{background:var(--naranja);border-color:var(--naranja);color:var(--negro);box-shadow:0 0 0 4px var(--naranja-soft)}
.ac-hito-lbl{font-size:10.5px;color:var(--ink-600);line-height:1.2}
.ac-hito.done .ac-hito-lbl,.ac-hito.now .ac-hito-lbl{color:var(--ink-900);font-weight:600}
.ac-hito-line{flex:1;height:2px;background:var(--line-2);margin-top:15px;min-width:8px}
/* Tarjetas de sección */
.ac-card{border:1px solid var(--line-2);border-radius:var(--r-sm);margin-bottom:13px;overflow:hidden}
.ac-card-h{display:flex;align-items:center;gap:8px;padding:11px 14px;background:var(--panel);border-bottom:1px solid var(--line);font-weight:600;font-size:13.5px;color:var(--ink-900)}
.ac-card-h svg{width:16px;height:16px;color:var(--ink-500)}
.ac-card-h .pill{margin-left:auto}
.ac-card-b{padding:14px}
.ac-line{display:flex;align-items:center;gap:9px;padding:3px 0;font-size:13.5px;color:var(--ink-700)}
.ac-line svg{width:15px;height:15px;color:var(--ink-400);flex-shrink:0}
.ac-total{font-family:var(--f-mono);font-size:26px;font-weight:700;color:var(--ink-900);letter-spacing:-.02em}
.ac-ok{display:flex;align-items:center;gap:7px;color:var(--ok);font-size:13.5px;font-weight:500;margin-top:8px}
.ac-ok svg{width:16px;height:16px}
.ac-doc{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.ac-doc:last-of-type{border-bottom:none}
.ac-doc svg{width:15px;height:15px;color:var(--ink-400);vertical-align:middle}
.ac-contacto{margin-top:16px;padding:12px 14px;background:var(--panel);border-radius:var(--r-sm);font-size:12.5px;color:var(--ink-600);text-align:center}
@media(max-width:560px){
  .ac-timeline{gap:0}
  .ac-hito{width:auto;flex:1 1 0;min-width:0}
  .ac-hito-dot{width:26px;height:26px;font-size:11px}
  .ac-hito-lbl{font-size:9px}
  .ac-hito-line{min-width:4px}
  .ac-shell{max-width:100%}
  .ac-head,.ac-body{padding-left:16px;padding-right:16px}
}




.cita-sug{margin-top:6px;font-size:12px;color:var(--ink-600);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cita-sug strong{color:var(--ink-900);font-family:var(--f-mono)}




/* ── Desplegable del buscador global ── */
.gs-results{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:0 12px 32px rgba(0,0,0,.14);max-height:min(70vh,440px);overflow-y:auto;z-index:1100;display:none}
.gs-results.on{display:block}
.gs-group-h{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-500);padding:9px 14px 4px}
.gs-item{display:flex;align-items:center;gap:10px;padding:8px 14px;cursor:pointer;border:none;background:none;width:100%;text-align:left}
.gs-item:hover,.gs-item.sel{background:var(--bg-2)}
.gs-item .gs-ic{width:26px;height:26px;flex-shrink:0;border-radius:6px;display:flex;align-items:center;justify-content:center;background:var(--terra-soft);color:var(--naranja-900)}
.gs-item .gs-ic svg{width:14px;height:14px}
.gs-item .gs-main{min-width:0;flex:1}
.gs-item .gs-t{font-size:13px;font-weight:600;color:var(--ink-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-item .gs-s{font-size:11.5px;color:var(--ink-500)}
.gs-item .gs-tag{font-size:10px;font-weight:700;color:var(--ink-500);flex-shrink:0}
.gs-empty{padding:16px 14px;font-size:12.5px;color:var(--ink-500)}

/* ── Lienzo de dibujo grande (croquis del problema) ── */
.draw-box{border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;background:var(--white);position:relative}
.draw-lienzo{width:100%;aspect-ratio:16/10;display:block;background:#fff;cursor:crosshair;touch-action:none}
.draw-foot{display:flex;align-items:center;gap:10px;padding:9px 12px;border-top:1px solid var(--line);background:var(--panel);flex-wrap:wrap}
.draw-lbl{font-size:11px;font-weight:700;color:var(--ink-500);text-transform:uppercase;letter-spacing:.06em;margin-right:auto}
.draw-btn{font-size:12px;font-weight:600;color:var(--ink-700);cursor:pointer;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:4px 10px;background:var(--white)}
.draw-btn:hover{border-color:var(--negro)}
.draw-btn.danger{color:var(--danger)}
.draw-btn.danger:hover{border-color:var(--danger)}
/* Overlay de pantalla completa REAL (todo el viewport) */
.draw-fs{position:fixed;inset:0;z-index:2000;background:#fff;display:flex;flex-direction:column}
.draw-fs-head{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid var(--line);background:var(--panel);flex-shrink:0}
.draw-fs-head h3{font-size:15px;font-weight:700;margin:0;margin-right:auto}
.draw-fs-body{flex:1;position:relative;overflow:hidden;background:#eceae3;display:flex;align-items:center;justify-content:center;padding:10px}
.draw-fs-canvas{background:#fff;cursor:crosshair;touch-action:none;display:block;box-shadow:0 4px 20px rgba(0,0,0,.12);border-radius:6px}





/* ── Tickets · conversación estilo mensajería ── */
.tck-chat{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);
  padding:16px 14px;display:flex;flex-direction:column;gap:10px;max-height:420px;overflow-y:auto}
.tck-dia{align-self:center;background:var(--panel);border:1px solid var(--line-2);border-radius:20px;
  padding:3px 12px;font-size:11px;font-weight:600;color:var(--ink-500);margin:2px 0}
.tck-b{max-width:78%;border-radius:14px;padding:9px 13px 7px;position:relative;box-shadow:0 1px 2px rgba(0,0,0,.07)}
.tck-b .a{display:block;font-size:11.5px;font-weight:700;margin-bottom:3px}
.tck-b .t{font-size:13.5px;line-height:1.5;color:var(--ink-800);white-space:pre-wrap}
.tck-b .h{display:block;text-align:right;font-size:10.5px;color:var(--ink-500);margin-top:3px;font-variant-numeric:tabular-nums}
/* del cliente / partner · a la izquierda, en blanco */
.tck-b.ellos{align-self:flex-start;background:var(--white);border:1px solid var(--line-2);border-bottom-left-radius:4px}
.tck-b.ellos .a{color:var(--info)}
/* nuestros · a la derecha, en verde suave */
.tck-b.yo{align-self:flex-end;background:#E7F3E7;border:1px solid #BEDDBE;border-bottom-right-radius:4px}
.tck-b.yo .a{color:var(--ok)}
/* nota interna · centrada y distinta de forma inequívoca */
.tck-b.interna{align-self:center;max-width:88%;background:#FFF8E8;border:1px dashed var(--warn)}
.tck-b.interna .a{color:#7A5300}
.tck-int-badge{display:inline-block;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  color:#7A5300;background:#FFE9B8;border-radius:20px;padding:2px 8px;margin-left:6px}
.tck-adj{display:inline-flex;align-items:center;gap:5px;margin-top:5px;font-size:11.5px;color:var(--ink-700);
  background:rgba(0,0,0,.04);border-radius:8px;padding:3px 8px}
.tck-adj svg{width:12px;height:12px}
/* barra de escritura */
.tck-escribir{display:flex;gap:8px;align-items:flex-end;margin-top:12px}
.tck-escribir textarea{flex:1;resize:none;border-radius:20px;padding:10px 15px;min-height:42px;max-height:120px;font-size:13.5px}
.tck-send{width:42px;height:42px;flex-shrink:0;border-radius:50%;border:none;background:var(--naranja);
  color:#111;display:flex;align-items:center;justify-content:center;cursor:pointer}
.tck-send:hover{background:var(--naranja-700,#E07F28)}
.tck-send svg{width:18px;height:18px}
.tck-modo{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:12px;color:var(--ink-500);cursor:pointer}
.tck-modo input{width:auto;margin:0}
.tck-modo.on{color:#7A5300;font-weight:600}

/* ── Barra táctil del taller · Fabricación (E1 · E2) ── */
.taller-bar{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}
.taller-btn{display:flex;align-items:center;gap:14px;padding:18px 20px;border-radius:var(--r);cursor:pointer;
  border:2px solid var(--line-2);background:var(--panel);text-align:left;width:100%;transition:transform .08s}
.taller-btn:hover{transform:translateY(-1px)}
.taller-btn:active{transform:translateY(1px)}
.taller-btn b{display:block;font-size:19px;font-weight:700;color:var(--ink-900);line-height:1.15}
.taller-btn small{display:block;font-size:13px;color:var(--ink-500);margin-top:2px}
.taller-ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.taller-ic svg{width:24px;height:24px}
.taller-plano{border-color:var(--negro)}
.taller-plano .taller-ic{background:var(--negro);color:#fff}
.taller-inc{border-color:var(--danger)}
.taller-inc .taller-ic{background:var(--danger);color:#fff}
.taller-inc b{color:var(--danger)}
@media(max-width:900px){ .taller-bar{grid-template-columns:1fr} }

/* Buscar plano · rejilla de tarjetas grandes */
.plano-q{width:100%;font-size:17px;padding:14px 16px;margin-bottom:16px}
.plano-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.plano-card{text-align:left;border:2px solid var(--line-2);border-radius:var(--r);padding:16px;background:var(--white);cursor:pointer;transition:transform .08s}
.plano-card:hover{border-color:var(--negro);transform:translateY(-1px)}
.plano-card:active{transform:translateY(1px)}
.plano-cod{font-size:18px;font-weight:700;color:var(--ink-900);font-variant-numeric:tabular-nums}
.plano-cli{font-size:14px;color:var(--ink-700);margin-top:3px}
.plano-tit{font-size:12.5px;color:var(--ink-500);margin-top:2px}
.plano-mat{font-size:12px;color:var(--ink-700);margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
.plano-ref{font-size:11.5px;color:var(--ink-500);margin-top:6px}

/* ── Autocompletado de cliente en el parte (C3) ── */
.pm-sug{position:absolute;top:100%;left:0;right:0;background:var(--white);border:1px solid var(--line-2);
  border-radius:var(--r-sm);box-shadow:0 10px 28px rgba(0,0,0,.13);z-index:60;display:none;max-height:230px;overflow-y:auto;margin-top:2px}
.pm-sug.on{display:block}
.pm-sug-it{display:block;width:100%;text-align:left;border:none;background:none;padding:7px 11px;cursor:pointer}
.pm-sug-it:hover{background:var(--bg-2)}
.pm-sug-n{display:block;font-size:13px;font-weight:600;color:var(--ink-800)}
.pm-sug-d{display:block;font-size:11px;color:var(--ink-500)}
.pm-sug-none{padding:8px 11px;font-size:12px;color:var(--ink-500)}
.pm-sug-x{border:none;background:none;color:var(--danger);font-size:11px;font-weight:600;cursor:pointer;padding:0 0 0 4px;text-decoration:underline}

/* ── Validación guiada del parte (A4) ── */
.pm-falta{outline:2px solid var(--danger)!important;outline-offset:1px;background:#FDF3F1!important;border-radius:4px}
.pm-aviso-val{background:#FDF3F1;border:1px solid var(--danger);color:var(--danger);font-size:12.5px;font-weight:600;
  padding:8px 12px;border-radius:var(--r-sm);margin-bottom:10px;width:100%}
.btn-off{opacity:.45;cursor:not-allowed}
.btn-off:hover{border-color:var(--line-2)}
.pm-render-item{background:#F3F1EA}

/* ── Elementos del parte ── */
.elem-list{display:flex;flex-direction:column;gap:8px}
.elem-row{display:flex;align-items:center;gap:11px;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel)}
.elem-badge{width:24px;height:24px;border-radius:6px;background:var(--negro);color:var(--crema);font-family:var(--f-mono);font-weight:700;font-size:12px;display:grid;place-items:center;flex-shrink:0}
.elem-tipo{font-size:13.5px;font-weight:600;color:var(--ink-900)}
.elem-desc{font-size:12.5px;color:var(--ink-700);margin:1px 0 2px}
.elem-meta{font-size:12px;color:var(--ink-600);margin-top:1px}

/* ── Área de Cliente (app) · elementos propios ── */
.ac-kpis{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.ac-kpi{flex:1;min-width:150px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow-xs)}
.ac-kpi-v{font-family:var(--f-mono);font-weight:700;font-size:30px;color:var(--ink-900);letter-spacing:-.02em;line-height:1}
.ac-kpi-l{font-size:12px;color:var(--ink-500);margin-top:4px}
.ac-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer;transition:.1s}
.ac-row:last-child{border-bottom:none}
.ac-row:hover{padding-left:4px}
.ac-back{background:none;border:none;color:var(--ink-600);font-size:13px;font-weight:600;cursor:pointer;padding:0;margin-bottom:14px;font-family:var(--f-body)}
.ac-back:hover{color:var(--naranja-900)}
.ac-det-head{margin-bottom:16px}
.ac-det-head .eyebrow{margin-bottom:3px}
.ac-det-head h2{font-family:var(--f-display);font-size:20px;font-weight:600;color:var(--ink-900);line-height:1.2}
.ac-card{max-width:none;margin:0 auto 14px;background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:none}
.ac-card-h{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--panel);border-bottom:1px solid var(--line);font-weight:600;font-size:13.5px;color:var(--ink-900)}
.ac-card-h svg{width:16px;height:16px;color:var(--ink-500)}
.ac-card-h .pill{margin-left:auto}
.ac-card-b{padding:16px}

/* ── Área de Cliente · pestañas y contenido ── */
.ac-tabs{display:flex;gap:2px;border-bottom:2px solid var(--line);margin-bottom:16px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.ac-tab{flex:0 0 auto;background:none;border:none;padding:9px 13px;font-size:13px;font-weight:600;color:var(--ink-500);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;white-space:nowrap;display:flex;align-items:center;gap:6px;font-family:var(--f-body)}
.ac-tab:hover{color:var(--ink-800)}
.ac-tab.on{color:var(--negro);border-bottom-color:var(--naranja)}
.ac-tab-n{background:var(--naranja);color:var(--negro);font-size:10px;font-weight:700;border-radius:9px;padding:1px 6px;min-width:16px;text-align:center}
.ac-pane{min-height:80px}
.ac-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}
.ac-info-item .ac-il{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-500);margin-bottom:2px}
.ac-info-item .ac-iv{font-size:13.5px;color:var(--ink-900);font-weight:500}
.ac-total-row{display:flex;justify-content:space-between;align-items:baseline;font-weight:700;font-size:15px;color:var(--ink-900);margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
.ac-total-row .ac-total{font-size:22px}
.ac-empty{text-align:center;padding:28px 16px;color:var(--ink-500);font-size:13.5px}
.ac-inc{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:10px 12px;margin-bottom:8px}
.ac-inc:last-child{margin-bottom:0}
.ac-timeline-v{display:flex;flex-direction:column;gap:0}
.ac-tl-item{display:flex;gap:12px;padding:0 0 14px;position:relative}
.ac-tl-item:not(:last-child)::before{content:'';position:absolute;left:5px;top:12px;bottom:0;width:2px;background:var(--line-2)}
.ac-tl-dot{width:12px;height:12px;border-radius:50%;background:var(--naranja);flex-shrink:0;margin-top:2px;position:relative;z-index:1}
.ac-tl-txt{font-size:13px;color:var(--ink-800);line-height:1.4}
.ac-tl-meta{font-size:11px;color:var(--ink-500);margin-top:1px}
@media(max-width:560px){.ac-info-grid{grid-template-columns:1fr}}

/* ════════════════════ FILTRO DE FECHAS ════════════════════ */
.fecha-filtro{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.fecha-filtro-lbl{font-size:12px;font-weight:600;color:var(--ink-600);text-transform:uppercase;letter-spacing:.04em}
.fecha-filtro input[type=date]{max-width:150px}

/* ════════════════════ CABECERAS ORDENABLES ════════════════════ */
.tbl th.th-sort{user-select:none;position:relative;transition:color .12s}
.tbl th.th-sort:hover{color:var(--naranja-900)}
.tbl th .sort-ind{font-size:9px;color:var(--naranja);margin-left:2px;letter-spacing:-1px}

/* ════════════════════ INCIDENCIAS MINI (dentro de ficha de fase) ════════════════════ */
.inc-mini-list{display:flex;flex-direction:column;gap:7px;margin-top:8px}
.inc-mini{border:1px solid var(--line-2);border-radius:var(--r-sm);padding:9px 12px;cursor:pointer;transition:.12s;background:var(--white)}
.inc-mini:hover{border-color:var(--danger);background:var(--danger-soft)}
.inc-mini.cerrada{opacity:.6}
.inc-mini-top{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.inc-mini-t{font-size:13px;color:var(--ink-800);font-weight:500}

/* ════════════════════ VERSIONES DE CONFORMIDAD ════════════════════ */
.conf-ver{border:1px solid var(--line-2);border-radius:var(--r);padding:13px 15px;margin-bottom:11px;background:var(--white)}
.conf-ver.anulada{opacity:.62;background:var(--panel)}
.conf-ver-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.conf-ver-tag{font-family:var(--f-mono);font-weight:700;font-size:12px;color:var(--ink-900);
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-chip);padding:2px 8px}
.conf-ver-motivo{font-size:13px;color:var(--ink-700);margin-bottom:6px}
.conf-ver-texto{font-size:12.5px;color:var(--ink-600);line-height:1.55;margin-bottom:10px;
  padding:8px 11px;background:var(--panel);border-radius:var(--r-sm)}
.conf-firmas{display:grid;grid-template-columns:1fr 1fr;gap:11px}
@media(max-width:560px){.conf-firmas{grid-template-columns:1fr}}
.conf-firma{border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;background:var(--panel)}
.conf-firma-lbl{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-500);margin-bottom:5px}
.conf-firma-img{max-height:60px;max-width:100%;background:var(--white);border-radius:var(--r-xs)}

/* ════════════════════ NOTIFICACIONES ════════════════════ */
.notif-panel{position:absolute;top:calc(100% + 8px);right:0;z-index:60;background:var(--white);border:1px solid var(--line-2);
  border-radius:var(--r);box-shadow:var(--shadow-lg);width:min(380px,92vw);overflow:hidden}
.notif-h{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--line)}
.notif-h h3{font-family:var(--f-display);font-size:14px;font-weight:600;color:var(--ink-900)}
.notif-list{max-height:400px;overflow-y:auto}
.notif-item{display:flex;gap:11px;padding:12px 16px;border-bottom:1px solid var(--line);cursor:pointer;transition:.12s}
.notif-item:hover{background:var(--panel)}
.notif-item.no-leida{background:var(--naranja-soft)}
.notif-item .n-dot{width:8px;height:8px;border-radius:50%;background:var(--naranja);flex-shrink:0;margin-top:5px}
.notif-item.leida .n-dot{background:var(--line-2)}
.notif-item .n-txt{font-size:13px;color:var(--ink-700);line-height:1.4}
.notif-item .n-time{font-size:11px;color:var(--ink-400);margin-top:3px;font-family:var(--f-mono)}
.notif-vacio{padding:34px 20px;text-align:center;color:var(--ink-400);font-size:13px}


/* Badges de trabajo nuevo / de hoy */
.badge-nuevo{display:inline-block;background:var(--naranja);color:var(--negro);font-family:var(--f-mono);
  font-size:9px;font-weight:700;padding:1px 6px;border-radius:var(--r-chip);letter-spacing:.05em;vertical-align:middle}
.badge-hoy{display:inline-block;background:var(--negro);color:var(--crema);font-family:var(--f-mono);
  font-size:9px;font-weight:700;padding:1px 6px;border-radius:var(--r-chip);letter-spacing:.05em;vertical-align:middle}
.aviso-nuevo{display:flex;align-items:center;gap:10px;background:var(--naranja-soft);border:1px solid var(--naranja-line);
  border-radius:var(--r-sm);padding:11px 14px;font-size:13px;color:var(--naranja-900);font-weight:600}
.aviso-nuevo svg{flex-shrink:0}

/* Aviso de retraso */
.aviso-retraso{display:flex;align-items:center;gap:10px;background:var(--danger-soft);border:1px solid rgba(196,45,30,.35);
  border-radius:var(--r-sm);padding:11px 14px;margin-bottom:14px;font-size:13px;color:var(--danger);font-weight:600}
.aviso-retraso svg{flex-shrink:0}

/* ════════════════════════════════════════════════════════════════════
   RESPONSIVE · tablet primero (el operario mide en obra con tablet)
   ────────────────────────────────────────────────────────────────────
   TODO va en `@media screen`: si no, al imprimir el Parte (viewport A4 ≈
   794 px) se dispararían las reglas de tablet y rompería la hoja.
   ════════════════════════════════════════════════════════════════════ */

/* Botón hamburguesa · solo aparece cuando el sidebar se pliega */
.tb-burger{
  display:none; width:42px; height:42px; border-radius:var(--r-sm);
  border:1px solid var(--line-2); background:var(--white); place-items:center;
  cursor:pointer; color:var(--ink-700); flex-shrink:0;
}
.tb-burger svg{width:20px;height:20px}
#sb-backdrop{
  display:none; position:fixed; inset:0; background:rgba(17,17,17,.45);
  z-index:45; backdrop-filter:blur(1px);
}
#sb-backdrop.open{display:block}

/* ── Portátil / tablet apaisada: sidebar más estrecho ── */
@media screen and (max-width:1279px){
  :root{--sidebar-w:236px}
  #content{padding:22px 20px 40px}
  .card-pad{padding:18px 18px}
  .kcol{flex:0 0 250px}
}

/* ── Tablet vertical y por debajo: sidebar fuera de pantalla ── */
@media screen and (max-width:1023px){
  #sidebar{
    position:fixed; top:0; bottom:0; left:0; width:290px; z-index:50;
    transform:translateX(-100%); transition:transform .24s cubic-bezier(.2,.9,.3,1);
    box-shadow:var(--shadow-lg);
  }
  #sidebar.open{transform:translateX(0)}
  .tb-burger{display:grid}
  #topbar{padding:0 16px;gap:12px}
  .tb-title{font-size:17px}
  .tb-sub{display:none}
  .tb-search{width:auto;flex:1;max-width:none;min-width:0}
  #content{padding:18px 16px 40px}
  .bandejas{grid-template-columns:repeat(2,1fr)}
  .info-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
  .modal{max-width:100%!important}
  .modal-bg{padding:14px}
}

/* ── Móvil ── */
@media screen and (max-width:767px){
  .tb-search{display:none}                /* la búsqueda vive en el sidebar */
  .tb-title{font-size:16px}
  #content{padding:14px 12px 40px}
  .bandejas{grid-template-columns:1fr}
  .card-pad{padding:16px 14px}
  .info-grid{grid-template-columns:1fr}
  .flujo-global .fg-chip{min-width:calc(50% - 5px)}
  .kcol{flex:0 0 232px}
  /* Modales a pantalla completa: en un móvil, una tarjeta flotante no sirve */
  .modal-bg{padding:0;align-items:stretch}
  .modal{border-radius:0;min-height:100vh;max-width:100%!important}
  .modal-head{position:sticky;top:0;z-index:5}
  .modal-foot{position:sticky;bottom:0;z-index:5}
  /* El calendario a mes completo no cabe: se compacta y se toca el día */
  .calx-cell{min-height:76px;padding:5px 4px 3px}
  .calx-ev{font-size:0;padding:0;height:5px;border-radius:2px;border-left:none;margin-bottom:3px}
  .calx-more{font-size:10px}
  .calx-title{font-size:16px;min-width:0}
  .calx-head{flex-wrap:wrap;gap:8px}
  table.tbl{font-size:12.5px}
  table.tbl thead th,table.tbl tbody td{padding:10px 11px}
}

/* ── Pantalla táctil: áreas de toque de verdad (44 px) ── */
@media screen and (pointer:coarse){
  .btn{min-height:44px;padding:10px 16px}
  .btn-sm{min-height:40px}
  .btn-xs{min-height:36px;padding:7px 12px;font-size:12.5px}
  .sb-item{padding:13px 13px}
  .seg button{min-height:40px;padding:8px 16px}
  .tab{padding:13px 16px}
  .bnd-row{padding:12px 9px}
  .modal-x{width:44px;height:44px}
  .calx-nav button{width:44px;height:44px}
  .kcard{cursor:default}
  .fld input,.fld select,.fld textarea{min-height:44px;font-size:16px}  /* 16px evita el zoom automático de iOS */
  .f-inp,.tb-search input{min-height:44px;font-size:16px}
}

/* ════════════════════════════════════════════════════════════════════
   PARTE DE MEDICIÓN EN TABLET · es el documento que se rellena en obra
   Tailwind ya apila con `md:`. Aquí solo se arreglan las rejillas fijas
   y, sobre todo, el tamaño de los campos para el dedo.
   ════════════════════════════════════════════════════════════════════ */
@media screen and (pointer:coarse){
  #documento-impreso input:not([type=radio]),
  #documento-impreso select,
  #documento-impreso textarea{
    min-height:44px!important; font-size:16px!important; padding:8px 10px!important;
  }
  #documento-impreso textarea{min-height:88px!important}
  #documento-impreso input[type=radio]{width:22px;height:22px}
  #documento-impreso label{font-size:13px!important;margin-bottom:5px!important}
  .print-container{padding:16px!important}
  #pm-fotos{gap:10px!important}
}
@media screen and (max-width:767px){
  #documento-impreso .grid-cols-3{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #documento-impreso .col-span-3{grid-column:span 2/span 2!important}
  .print-container{padding:14px!important;border:none!important;box-shadow:none!important}
}


/* ── Documento A4 genérico (presupuesto, conformidad, albarán) ── */
.doc-a4{background:#fff;color:#111;width:100%;max-width:210mm;margin:0 auto;padding:14mm 13mm;box-sizing:border-box;
  font-size:12.5px;line-height:1.45}
.doc-a4 .d-head{display:flex;align-items:flex-start;justify-content:space-between;border-bottom:2px solid #111;padding-bottom:10px;margin-bottom:16px}
.doc-a4 .d-logo{font-family:var(--f-display);font-weight:700;font-size:19px;letter-spacing:-.01em}
.doc-a4 .d-logo span{color:var(--naranja-900)}
.doc-a4 .d-emp{font-size:10.5px;color:#555;margin-top:2px;line-height:1.35}
.doc-a4 .d-tit{text-align:right}
.doc-a4 .d-tit h2{font-size:17px;font-weight:700;margin:0;text-transform:uppercase;letter-spacing:.04em}
.doc-a4 .d-tit .d-ref{font-size:12.5px;color:#444;margin-top:3px;font-variant-numeric:tabular-nums}
.doc-a4 .d-sec{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#555;
  border-bottom:1px solid #ddd;padding-bottom:3px;margin:16px 0 8px}
.doc-a4 .d-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 20px}
.doc-a4 .d-f{font-size:12px}
.doc-a4 .d-f b{display:block;font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:#666;font-weight:700}
.doc-a4 table{width:100%;border-collapse:collapse;margin-top:6px;font-size:12px}
.doc-a4 th{text-align:left;font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:#555;
  border-bottom:1.5px solid #111;padding:5px 4px}
.doc-a4 td{padding:6px 4px;border-bottom:1px solid #e7e5df;vertical-align:top}
.doc-a4 .d-num{text-align:right;font-variant-numeric:tabular-nums}
.doc-a4 .d-tot td{border-bottom:none;border-top:2px solid #111;font-weight:700;font-size:13.5px;padding-top:8px}
.doc-a4 .d-firmas{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:26px}
.doc-a4 .d-firma{border:1px solid #ccc;border-radius:4px;padding:8px;min-height:92px;display:flex;flex-direction:column}
.doc-a4 .d-firma b{font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:#666}
.doc-a4 .d-firma img{max-height:64px;max-width:100%;object-fit:contain;margin-top:auto}
.doc-a4 .d-nota{background:#F7F6F2;border-left:3px solid #111;padding:8px 10px;font-size:11px;margin-top:14px}
.doc-a4 .d-foot{margin-top:20px;padding-top:8px;border-top:1px solid #ddd;font-size:9.5px;color:#666;text-align:center}

@media print{
  body.printing-doc #sidebar,body.printing-doc #topbar,body.printing-doc .no-print,
  body.printing-doc .modal-head,body.printing-doc .modal-foot,body.printing-doc #toast{display:none!important}
  body.printing-doc .doc-a4{max-width:none!important;padding:0!important;font-size:11.5px!important}
  body.printing-doc .doc-a4 .d-firma{min-height:80px!important}
}

/* ── Impresión: el parte y los documentos A4 ── */
@page{size:A4;margin:8mm}
@media print{
  body{overflow:visible!important;display:block!important;background:#fff!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;line-height:1.1!important}
  #sidebar,#topbar,.no-print,.modal-head,.modal-foot,#toast{display:none!important}
  #main,#content{overflow:visible!important;height:auto!important;padding:0!important;background:#fff!important}
  .modal-bg{position:static!important;display:block!important;padding:0!important;background:#fff!important;backdrop-filter:none!important}
  .modal{max-width:100%!important;width:100%!important;box-shadow:none!important;border-radius:0!important;background:#fff!important;margin:0!important;animation:none!important}
  .print-container{box-shadow:none!important;margin:0!important;padding:0!important;width:100%!important;max-width:100%!important;border:none!important;height:278mm!important;display:flex!important;flex-direction:column!important}
  #formulario-medicion{display:flex!important;flex-direction:column!important;flex-grow:1!important;justify-content:space-between!important}
  .mb-5{margin-bottom:0!important}.gap-3{gap:.3rem!important}.gap-2{gap:.2rem!important}.pb-4{padding-bottom:.2rem!important;margin-bottom:0!important}
  h1.text-3xl{font-size:1.4rem!important;margin:0!important;line-height:1!important}
  p.text-\[10px\]{font-size:.55rem!important;margin-top:1px!important}
  h3.section-title{font-size:.75rem!important;padding:3px 6px!important;margin-bottom:3px!important;border-left-width:3px!important}
  label.block{font-size:.65rem!important;margin-bottom:1px!important;font-weight:700!important;color:#1f2937!important}
  input,select,textarea{border:1px solid #6b7280!important;background:#fff!important;font-size:.75rem!important;padding:1px 4px!important;height:22px!important;min-height:22px!important}
  textarea{height:auto!important;min-height:30px!important}
  .text-xs,.text-\[11px\]{font-size:.65rem!important}.text-sm{font-size:.75rem!important}
  .bg-red-50{padding:4px 8px!important;margin-top:2px!important;border-width:1px!important;border-color:#ef4444!important;background:#fef2f2!important}
  .bg-red-50 p{font-size:.7rem!important;margin-bottom:1px!important;color:#b91c1c!important}
  .bg-red-50 ul li{font-size:.65rem!important;line-height:1.2!important;margin-top:1px!important;margin-bottom:0!important;color:#1f2937!important}
  .pm-foto{border:1px solid #9ca3af!important;color:#374151!important}
}
