/* Bloque A · Inicio/Hoy — mapa de estado.
   Reescrito 2026-08-22: el CSS anterior era del tema OSCURO (fondos
   rgba(15,23,42,.76) y color:#fff) y el panel ya usa el tema claro de
   El Origami, así que los nombres de producto salían en blanco sobre blanco.
   Ahora todo el bloque cuelga de los tokens del tema claro. */

.bloque-a-overview-active .content > :not(.mobile-topbar):not(.top-identity):not(.bloque-a-today){display:none!important}

.bloque-a-today{
  --bl-surface:#ffffff;
  --bl-border:#eadfd4;
  --bl-ink:#172033;
  --bl-ink-2:#374151;
  --bl-muted:#6b7280;
  --bl-brand:#F5771E;
  --bl-shadow:0 4px 14px rgba(75,45,20,.035);

  --violet:#7c3aed; --violet-soft:#f3e8ff;
  --orange:#f97316; --orange-soft:#fff2e6;
  --cyan:#06b6d4;   --cyan-soft:#e6fbfe;
  --green:#059669;  --green-soft:#e9faf3;
  --red:#dc2626;    --red-soft:#fdeaea;
  --slate:#64748b;  --slate-soft:#f1f2f5;

  display:grid;gap:15px;padding:clamp(14px,1.6vw,22px);
  color:var(--bl-ink);align-content:start;
}

/* Cada elemento con dato lleva su color de familia vía data-tone. */
.bloque-a-today [data-tone="violet"]{--c:var(--violet);--s:var(--violet-soft)}
.bloque-a-today [data-tone="orange"]{--c:var(--orange);--s:var(--orange-soft)}
.bloque-a-today [data-tone="cyan"]  {--c:var(--cyan);  --s:var(--cyan-soft)}
.bloque-a-today [data-tone="green"] {--c:var(--green); --s:var(--green-soft)}
.bloque-a-today [data-tone="red"]   {--c:var(--red);   --s:var(--red-soft)}
.bloque-a-today [data-tone="slate"] {--c:var(--slate); --s:var(--slate-soft)}

/* ---------------- HERO ---------------- */
.bl-hero{
  background:linear-gradient(118deg,#fff 0%,#fffaf6 46%,#fdf0e2 100%);
  border:1px solid var(--bl-border);border-radius:20px;padding:19px 22px;
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:center;
  box-shadow:0 10px 30px rgba(75,45,20,.05);
}
.bl-eyebrow{margin:0 0 7px;font-size:9.5px;letter-spacing:.19em;font-weight:800;color:var(--bl-brand)}
.bl-hero h1{margin:0;font-size:clamp(20px,2.2vw,27px);line-height:1.12;font-weight:800;letter-spacing:-.015em;color:var(--bl-ink)}
.bl-hero h1 b{color:var(--violet);font-weight:800}
.bl-lema{margin:11px 0 0;display:flex;align-items:center;gap:11px}
.bl-lema-bar{width:3.5px;height:26px;flex:none;border-radius:2px;background:linear-gradient(180deg,var(--bl-brand),var(--violet))}
.bl-lema i{font-style:italic;font-size:clamp(14px,1.3vw,16.5px);font-weight:600;color:#8a4b12}
.bl-hero-side{display:grid;gap:7px;justify-items:end;text-align:right;min-width:172px}
.bl-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5.5px 11px;font-size:11px;font-weight:800}
.bl-pill.ok{background:var(--green-soft);color:#065f46;border:1px solid #b6ead4}
.bl-pill.ok .bl-led{background:var(--green)}
.bl-pill.warn{background:#fff4e5;color:#9a3412;border:1px solid #f8d5ac}
.bl-pill.warn .bl-led{background:var(--orange)}
.bl-led{width:6px;height:6px;border-radius:50%}
.bl-hero-side small{font-size:10.5px;color:var(--bl-muted);line-height:1.45}
.bl-hero-side small b{color:var(--bl-ink-2)}

/* ---------------- KPIs ---------------- */
.bl-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.bl-kpi{
  appearance:none;font:inherit;text-align:left;cursor:pointer;
  background:var(--bl-surface);border:1px solid var(--bl-border);border-radius:15px;
  padding:13px 14px;position:relative;overflow:hidden;box-shadow:var(--bl-shadow);
  display:grid;gap:0;transition:transform .16s ease-out,box-shadow .16s ease-out,border-color .16s ease-out;
}
.bl-kpi::before{content:"";position:absolute;inset:0 auto 0 0;width:3.5px;background:var(--c)}
.bl-kpi:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(75,45,20,.09);border-color:var(--c)}
.bl-kpi:focus-visible{outline:2px solid var(--c);outline-offset:2px}
.bl-kpi-lab{font-size:9.5px;letter-spacing:.13em;font-weight:800;text-transform:uppercase;color:var(--bl-muted)}
.bl-kpi-val{font-size:clamp(19px,2vw,25px);font-weight:800;letter-spacing:-.02em;margin:6px 0 3px;color:var(--bl-ink)}
.bl-kpi-val.sm{font-size:clamp(14px,1.3vw,17px);line-height:1.25}
.bl-kpi-sub{font-size:11px;color:var(--bl-muted);font-weight:500}
.bl-kpi-sub b{color:var(--c);font-weight:800}

/* ---------------- Cabeceras de sección ---------------- */
.bl-sec{display:flex;align-items:center;gap:9px;margin:4px 0 -3px}
.bl-sec h2{margin:0;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--bl-ink-2)}
.bl-sec-line{flex:1;height:1px;background:var(--bl-border)}
.bl-sec-hint{font-size:10.5px;color:var(--bl-muted);font-weight:500}

/* ---------------- Mapa ---------------- */
.bl-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.bl-tile{
  appearance:none;font:inherit;text-align:left;cursor:pointer;
  background:var(--bl-surface);border:1px solid var(--bl-border);border-radius:15px;
  padding:13px 14px;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:11px;align-items:center;
  box-shadow:var(--bl-shadow);transition:transform .16s ease-out,box-shadow .16s ease-out,border-color .16s ease-out;
}
/* El icono lleva el color de la FAMILIA; el número y la etiqueta llevan el del
   ESTADO, para que el ojo vaya primero a lo que está atascado. */
.bl-tile-badge{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--s)}
.bl-tile-badge svg{width:17px;height:17px;stroke:var(--c)}
.bl-tile[data-state="ok"]   {--bl-estado:var(--green)}
.bl-tile[data-state="warn"] {--bl-estado:#b45309}
.bl-tile[data-state="bad"]  {--bl-estado:var(--red)}
.bl-tile[data-state="none"] {--bl-estado:var(--slate)}
.bl-tile:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(75,45,20,.09);border-color:var(--c)}
.bl-tile:focus-visible{outline:2px solid var(--c);outline-offset:2px}
.bl-tile-txt{display:grid;gap:3px;min-width:0}
.bl-tile-nm{font-size:12.5px;font-weight:800;color:var(--bl-ink);line-height:1.2}
.bl-tile-mt{font-size:11px;color:var(--bl-muted);font-weight:500;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bl-tile-right{display:grid;justify-items:end;gap:4px}
.bl-tile-big{font-size:19px;font-weight:800;color:var(--bl-estado,var(--c));letter-spacing:-.02em;line-height:1}
.bl-st{font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:2.5px 7px;border-radius:999px;white-space:nowrap}
.bl-st.ok{background:var(--green-soft);color:#065f46}
.bl-st.warn{background:#fff4e5;color:#9a3412}
.bl-st.bad{background:var(--red-soft);color:#991b1b}
.bl-st.none{background:var(--slate-soft);color:#64748b}

/* ---------------- Fichas apagadas ---------------- */
.bl-chips{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.bl-chip{
  appearance:none;font:inherit;cursor:pointer;
  background:var(--bl-surface);border:1px solid var(--bl-border);border-radius:12px;
  padding:10px 11px;display:grid;justify-items:center;gap:3px;
  box-shadow:0 3px 10px rgba(75,45,20,.03);transition:transform .16s ease-out,box-shadow .16s ease-out,border-color .16s ease-out;
}
.bl-chip:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(75,45,20,.08);border-color:var(--c)}
.bl-chip:focus-visible{outline:2px solid var(--c);outline-offset:2px}
.bl-chip-dot{width:7px;height:7px;border-radius:50%;background:var(--c);margin-bottom:3px}
.bl-chip-nm{font-size:11px;font-weight:800;color:var(--bl-ink);line-height:1.2;text-align:center}
.bl-chip-sub{font-size:9.5px;color:var(--bl-muted);font-weight:500}

/* ---------------- Paneles ---------------- */
.bl-split{display:grid;grid-template-columns:1.32fr 1fr;gap:11px;align-items:start}
.bl-panel{background:var(--bl-surface);border:1px solid var(--bl-border);border-radius:16px;padding:15px 16px;box-shadow:var(--bl-shadow)}
.bl-panel h3{margin:0 0 11px;font-size:13px;font-weight:800;display:flex;align-items:center;gap:8px;color:var(--bl-ink)}
.bl-sq{width:5px;height:14px;border-radius:3px;background:var(--c)}
.bl-panel-n{margin-left:auto;font-size:10.5px;color:var(--bl-muted);font-weight:600}

.bl-row{
  appearance:none;font:inherit;text-align:left;cursor:pointer;width:100%;
  display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:10px;align-items:center;
  padding:8px 9px;border-radius:10px;border:1px solid transparent;background:transparent;
  transition:background .16s ease-out,border-color .16s ease-out;
}
.bl-row + .bl-row{margin-top:2px}
.bl-row:nth-of-type(even){background:#fdfaf6;border-color:#f4ece3}
.bl-row:hover{background:var(--s);border-color:var(--c)}
.bl-row:focus-visible{outline:2px solid var(--c);outline-offset:2px}
.bl-rk{font-size:10.5px;font-weight:800;color:var(--bl-muted);text-align:center}
.bl-rtxt{display:grid;gap:2px;min-width:0}
.bl-rn{font-size:12px;font-weight:700;color:var(--bl-ink);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bl-rq{font-size:10.5px;color:var(--bl-muted);font-weight:500}
.bl-bar{display:block;height:4px;border-radius:3px;background:#f0e7dd;margin-top:3px;overflow:hidden}
.bl-bar i{display:block;height:100%;border-radius:3px;background:var(--c)}
.bl-rv{font-size:13px;font-weight:800;color:var(--bl-ink);white-space:nowrap}

.bl-who{
  appearance:none;font:inherit;text-align:left;cursor:pointer;width:100%;
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:center;
  padding:8px 6px;background:transparent;border:1px solid transparent;border-radius:10px;
  transition:background .16s ease-out,border-color .16s ease-out;
}
.bl-who + .bl-who{border-top:1px solid #f4ece3;border-radius:0}
.bl-who:hover{background:var(--s);border-color:var(--c);border-radius:10px}
.bl-who:focus-visible{outline:2px solid var(--c);outline-offset:2px}
.bl-wtxt{display:grid;gap:2px;min-width:0}
.bl-wn{font-size:12px;font-weight:700;color:var(--bl-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bl-wd{font-size:10.5px;color:var(--bl-muted);font-weight:500}
.bl-wv{font-size:13px;font-weight:800;color:var(--bl-ink);white-space:nowrap}
.bl-who.top .bl-wv{color:var(--c)}

.bl-note{margin:8px 0 0;font-size:11.5px;color:var(--bl-muted)}
.bl-foot{margin:2px 0 0;font-size:10.5px;color:var(--bl-muted);text-align:center}

/* ---------------- Responsive ---------------- */
@media(max-width:1180px){
  .bl-map{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bl-chips{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:980px){
  .bl-hero{grid-template-columns:1fr}
  .bl-hero-side{justify-items:start;text-align:left;min-width:0}
  .bl-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bl-split{grid-template-columns:1fr}
}
@media(max-width:560px){
  .bloque-a-today{padding:12px;gap:12px}
  .bl-hero{padding:16px}
  .bl-kpis,.bl-map{grid-template-columns:1fr}
  .bl-chips{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bl-lema i{font-size:14px}
}