/* ==========================================================================
   OJO: desde septiembre 2026 ESTE archivo es el que vale, no fuente/.
   Se editó a mano durante semanas (vista del socio, generador automático,
   sustitutos) y fuente/ quedó atrás. Correr fuente/generar.py lo borraría:
   el script ahora se niega a hacerlo. Ver planificadores/LEEME.md.
   Colores y letras de la tienda (DESIGN.md) desde octubre 2026.
   ========================================================================== */


:root{
  /* Un solo rojo: el Rojo DZ. Antes había tres (#b8903f, #D41425, #E0152B)
     de la plantilla original; los tres apuntan ahora al mismo. */
  --red:#d9ae62;        /* primario: la acción principal */
  --red-soft:#b8903f;   /* Rojo DZ Hondo: hover y fin de degradado */
  --cta:#d9ae62;
  --num:#111111;        /* los números van en Tinta, no en rojo */
  --ink:#111111;        /* Tinta */
  --body:#5c5c5c;       /* Gris Texto */
  --grey-num:#5c5c5c;
  --mint:#f5f5f5;       /* Piso Suave (antes un verde menta) */
  --line:#ececec;       /* Línea */
  --black:#0a0a0a;      /* Negro Ring: lo activo, lo elegido */
  --ok:#15803d;
  --aviso:#b45309;
  --radius:999px;
  --font-head:"Anton","Impact","Arial Narrow",sans-serif;
  --font-body:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --container:1255px;
}


/* Variables de la cabecera, tomadas de rutinas/css/base.css */
:root{
  --azul:#d9ae62;
  --azul-suave:rgba(217,174,98,.13);
  --borde:#2a2a2a;
  --borde2:#3a3a3a;
  --carbon:#0d0d0d;
  --sobre-acento:#0d0d0d;
  --sombra-alta:0 18px 50px rgba(0,0,0,.68);
  --superficie:#212121;
  --superficie3:#2e2e2e;
  --texto:#f0f0f0;
  --texto2:#b0b0b0;
  --texto3:#808080;
}

body{background:var(--mint);margin:0}   /* antes #0B0E14: una franja azul noche bajo la barra */


/* Todo cuelga de .dz-plan para no pisar los estilos de la tienda
   ni que la tienda pise los nuestros. */
.dz-plan,.dz-plan *,.dz-plan *::before,.dz-plan *::after{box-sizing:border-box}
.dz-plan{
  font-family:var(--font-body);font-size:17px;line-height:1.8;color:var(--body);
  -webkit-font-smoothing:antialiased;
}
.dz-plan img{max-width:100%;height:auto;display:block}
.dz-plan a{text-decoration:none;color:inherit}
.dz-plan ul{margin:0;padding:0;list-style:none}
.dz-plan h1,.dz-plan h2,.dz-plan h3,.dz-plan h4,.dz-plan h5,.dz-plan h6{
  font-family:var(--font-head);color:var(--ink);margin:0;font-weight:400;
  text-transform:uppercase;letter-spacing:.4px;
}
/* Anton tiene un solo grosor: sin esto los font-weight:700 de la plantilla
   pintan una negrita falsa */
.dz-plan{font-synthesis-weight:none}
.dz-plan p{margin:0 0 18px}
.dz-plan .container{width:100%;max-width:var(--container);margin:0 auto;padding:0 20px}

/* Aviso de donde se esta guardando */
.dz-plan-estado{
  display:flex;align-items:center;gap:8px;font-size:13px;
  padding:10px 14px;border-radius:10px;margin-bottom:18px;
}
.dz-plan-estado--local{background:rgba(180,83,9,.07);border:1px solid rgba(180,83,9,.35);color:#b45309}
.dz-plan-estado--nube{background:rgba(21,128,61,.08);border:1px solid rgba(21,128,61,.35);color:#15803d}

.dz-plan .btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-body);font-size:16px;font-weight:500;line-height:1.2;
  border-radius:var(--radius);padding:14px 28px;
  transition:.25s ease;cursor:pointer;border:1px solid transparent;
}
.dz-plan .btn-dark{background:var(--black);color:#fff}
.dz-plan .btn-dark:hover{background:var(--red)}
.dz-plan .btn-primary{background:var(--red);color:#fff;padding:12px 24px}
.dz-plan .btn-primary:hover{background:var(--ink)}
.dz-plan .btn-cta{
  border-color:var(--cta);color:var(--cta);
  font-size:18px;padding:5px 12px 5px 20px;border-radius:46px;background:transparent;
}
.dz-plan .btn-cta:hover{background:var(--cta);color:#fff}
.dz-plan .btn-cta .arrow{
  display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;
  background:var(--cta);color:#fff;font-size:18px;line-height:1;transition:.25s;
}
.dz-plan .btn-cta:hover .arrow{background:var(--nf-card,#fff);color:var(--cta)}

.dz-plan .chev{
  width:8px;height:8px;display:inline-block;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);margin-bottom:3px;transition:transform .25s;
}
.dz-plan .mod-list{margin:0 0 30px;padding-left:20px;list-style:disc}
.dz-plan .mod-list li{font-size:17px;line-height:1.8;color:var(--body);margin-bottom:6px}/* ============================================================
   Planificadores (rutina y nutrición)
   Reutiliza los tokens de style.css
   ============================================================ *//* El atributo hidden lo pisa cualquier display declarado en el CSS
   -.split es grid, .notice es flex-, asi que hay que reforzarlo. */



.dz-plan [hidden]{display:none!important}

.dz-plan .tool{padding:34px 0 80px;background:var(--mint);min-height:calc(100vh - 56px)}
.dz-plan .tool-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:22px}
.dz-plan .tool-head h1{font-size:32px;line-height:1.15;color:var(--ink);margin:0 0 6px}
.dz-plan .tool-head p{font-size:15px;color:var(--body);margin:0;max-width:620px}
.dz-plan .tool-actions{display:flex;gap:10px;flex-wrap:wrap}

.dz-plan .btn-ghost{
  background:var(--nf-card,#fff);color:var(--ink);border:1px solid var(--line);
  font-size:14px;padding:10px 18px;border-radius:var(--radius);
}
.dz-plan .btn-ghost:hover{border-color:var(--red);color:var(--red)}
.dz-plan .btn-xs{font-size:13px;padding:9px 16px;min-height:40px}/* ---------- Tarjetas ---------- */


.dz-plan .card{
  background:var(--nf-card,#fff);border:1px solid var(--line);border-radius:16px;
  padding:22px;margin-bottom:18px;
}
.dz-plan .card > h2{font-size:18px;color:var(--ink);margin:0 0 4px}
.dz-plan .card > .card-hint{font-size:13px;color:var(--body);margin:0 0 18px}/* ---------- Formularios ---------- */


.dz-plan .fields{display:grid;gap:14px}
.dz-plan .fields--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.dz-plan .fields--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.dz-plan .field{display:flex;flex-direction:column;gap:6px;min-width:0}
.dz-plan .field > label{font-size:12px;font-weight:600;color:var(--ink);letter-spacing:.02em}
.dz-plan .field input,
.dz-plan .field select{
  font-family:var(--font-body);font-size:14px;color:var(--ink);
  border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--nf-card,#fff);
  width:100%;min-width:0;
}
.dz-plan .field input:focus,
.dz-plan .field select:focus{outline:2px solid rgba(217,174,98,.35);border-color:var(--red)}/* ---------- Layout de dos columnas ---------- */


.dz-plan .split{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:18px;align-items:start}/* ---------- Catálogo ---------- */


.dz-plan .catalog-filters{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.dz-plan .catalog-filters input{grid-column:1 / -1}
.dz-plan .catalog-count{font-size:12px;color:var(--body);margin:0 0 10px}
.dz-plan .catalog-list{max-height:560px;overflow-y:auto;margin:0 -6px;padding:0 6px}
.dz-plan .cat-item{
  display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;
  background:none;border:0;border-bottom:1px solid var(--line);
  padding:12px 4px;cursor:pointer;font-family:var(--font-body);
}
.dz-plan .cat-item:hover{background:rgba(10,10,10,.04)}
.dz-plan .cat-item .plus{
  flex:none;width:24px;height:24px;border-radius:50%;background:var(--red);color:#fff;
  display:grid;place-items:center;font-size:16px;line-height:1;margin-top:2px;
}
.dz-plan .cat-item-body{min-width:0}
.dz-plan .cat-item-name{display:block;font-size:14px;font-weight:500;color:var(--ink);margin-bottom:2px}
.dz-plan .cat-item-meta{display:block;font-size:12px;color:var(--body)}
.dz-plan .cat-more{width:100%;margin-top:12px}/* Etiqueta de dato poco fiable */


.dz-plan .warn{
  display:inline-block;font-size:12px;font-weight:600;color:#b45309;
  background:rgba(180,83,9,.10);border-radius:20px;padding:1px 8px;margin-left:6px;vertical-align:1px;
}/* ---------- Días de la rutina ---------- */


.dz-plan .days{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.dz-plan .day-tab{
  font-family:var(--font-body);font-size:14px;padding:9px 16px;border-radius:var(--radius);
  border:1px solid var(--line);background:var(--nf-card,#fff);color:var(--ink);cursor:pointer;
}
.dz-plan .day-tab.active{background:var(--black);border-color:var(--black);color:#fff}
.dz-plan .day-tab .n{opacity:.6;margin-left:6px;font-size:12px}
.dz-plan .day-tab.active .n{opacity:.85}/* ---------- Tabla de ejercicios / alimentos ---------- */


.dz-plan .plan-table{width:100%;border-collapse:collapse}
.dz-plan .plan-table th{
  text-align:left;font-family:var(--font-body);font-size:12px;font-weight:600;
  color:var(--body);padding:0 8px 10px;border-bottom:1px solid var(--line);white-space:nowrap;
}
.dz-plan .plan-table td{padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
.dz-plan .plan-table tbody tr:last-child td{border-bottom:0}
.dz-plan .plan-table .name{font-size:14px;color:var(--ink)}
.dz-plan .plan-table .sub{display:block;font-size:12px;color:var(--body)}
.dz-plan .plan-table input{
  width:70px;font-family:var(--font-body);font-size:14px;color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:7px 8px;background:var(--nf-card,#fff);
}
.dz-plan .plan-table input.wide{width:92px}
.dz-plan .num{text-align:right;font-variant-numeric:tabular-nums}
.dz-plan .icon-btn{
  background:none;border:0;cursor:pointer;color:var(--body);font-size:16px;
  padding:4px 6px;border-radius:6px;line-height:1;
}
.dz-plan .icon-btn:hover{color:var(--cta);background:rgba(217,174,98,.08)}

.dz-plan .empty{padding:40px 10px;text-align:center;color:var(--body);font-size:14px}/* ---------- Totales y objetivos ---------- */


.dz-plan .totals{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:4px}
.dz-plan .total{background:var(--mint);border-radius:12px;padding:14px 16px}
.dz-plan .total-label{font-size:12px;color:var(--body);margin-bottom:4px}
.dz-plan .total-value{font-family:var(--font-head);font-size:24px;font-weight:700;color:var(--ink)}
.dz-plan .total-value small{font-size:13px;font-weight:500;color:var(--body);margin-left:2px}

.dz-plan .meter{margin-top:8px;height:6px;border-radius:4px;background:rgba(10,14,21,.1);overflow:hidden}
.dz-plan .meter span{display:block;height:100%;border-radius:4px;background:var(--red);transition:width .3s}
.dz-plan .meter.over span{background:var(--aviso)}/* ---------- Avisos ---------- */


.dz-plan .notice{
  display:flex;gap:12px;background:rgba(180,83,9,.07);border:1px solid rgba(180,83,9,.35);
  border-radius:12px;padding:14px 16px;margin-bottom:18px;
}
.dz-plan .notice p{margin:0;font-size:13px;line-height:1.6;color:#7c2d12}
.dz-plan .notice strong{color:#b45309}

@media (max-width:1080px){
  .dz-plan .split{grid-template-columns:1fr}
  .dz-plan .catalog-list{max-height:380px}
  .dz-plan .fields--4,
  .dz-plan .fields--5{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .dz-plan .tool{padding:24px 0 60px}
  .dz-plan .tool-head h1{font-size:25px}
  .dz-plan .fields--4,
  .dz-plan .fields--5{grid-template-columns:1fr}
  .dz-plan .totals{grid-template-columns:repeat(2,1fr)}
  /* Se ocultan las columnas de macros, NO la última: ahí están Quitar y
     Cambiar, que en el celular habían desaparecido */
  .dz-plan .plan-table th:nth-child(n+4):not(:last-child),
  .dz-plan .plan-table td:nth-child(n+4):not(:last-child){display:none}
}/* ============================================================
   Impresión / exportar a PDF
   El bloque .print-doc lo rellena el JS con el plan completo:
   en pantalla no existe, al imprimir es lo único que se ve.
   ============================================================ */


.dz-plan .print-doc{display:none}

@media print{
  @page{margin:16mm 14mm}/* Fuera todo lo que es interfaz: solo se imprime .print-doc */

  
  .dz-plan .site-header,
  
  .dz-plan .site-footer,
  
  .dz-plan .tool-head,
  
  .dz-plan .tool-actions,
  
  .dz-plan .tool .card,
  
  .dz-plan .split,
  
  .dz-plan .notice,
  
  .dz-plan .days{display:none!important}

  .dz-plan,
  .dz-plan{background:var(--nf-card,#fff)!important}
  .dz-plan .tool{padding:0;background:var(--nf-card,#fff);min-height:0}
  .dz-plan .container{max-width:none;padding:0}

  .dz-plan .print-doc{display:block;color:#000;font-size:11pt;line-height:1.45}

  .dz-plan .print-cab{border-bottom:2px solid #000;padding-bottom:10px;margin-bottom:18px}
  .dz-plan .print-cab h1{font-size:19pt;margin:0 0 4px;color:#000}
  .dz-plan .print-cab .meta{font-size:10pt;color:#333}
  .dz-plan .print-cab .meta span + span::before{content:' · '}

  .dz-plan .print-dia{margin-bottom:20px;break-inside:avoid}
  .dz-plan .print-dia > h2{
    font-size:13pt;margin:0 0 8px;color:#000;
    border-bottom:1px solid #999;padding-bottom:4px;
  }
  .dz-plan .print-toma{margin:0 0 12px;break-inside:avoid}
  .dz-plan .print-toma > h3{font-size:11pt;margin:0 0 4px;color:#000}

  .dz-plan .print-doc table{width:100%;border-collapse:collapse;margin-bottom:6px}/* Anchos fijos: si no, un nombre de plato largo aplasta las columnas numéricas */
  
  .dz-plan .print-doc table.t-menu,
  
  .dz-plan .print-doc table.t-rutina{table-layout:fixed}
  .dz-plan .t-menu th:nth-child(1),
  .dz-plan .t-menu td:nth-child(1){width:44%}
  .dz-plan .t-menu th:nth-child(2),
  .dz-plan .t-menu td:nth-child(2){width:16%}
  .dz-plan .t-menu th:nth-child(n+3),
  .dz-plan .t-menu td:nth-child(n+3){width:10%}
  .dz-plan .t-rutina th:nth-child(1),
  .dz-plan .t-rutina td:nth-child(1){width:5%}
  .dz-plan .t-rutina th:nth-child(2),
  .dz-plan .t-rutina td:nth-child(2){width:37%}
  .dz-plan .t-rutina th:nth-child(3),
  .dz-plan .t-rutina td:nth-child(3){width:20%}
  .dz-plan .t-rutina th:nth-child(n+4),
  .dz-plan .t-rutina td:nth-child(n+4){width:9.5%}
  .dz-plan .print-doc td{word-wrap:break-word;overflow-wrap:anywhere}
  .dz-plan .print-doc th{
    text-align:left;font-size:9pt;font-weight:600;color:#000;
    border-bottom:1px solid #000;padding:3px 6px 3px 0;
  }
  .dz-plan .print-doc td{
    font-size:10pt;padding:3px 6px 3px 0;
    border-bottom:1px solid #DDD;vertical-align:top;
  }
  .dz-plan .print-doc .num{text-align:right;white-space:nowrap}
  .dz-plan .print-doc tfoot td{font-weight:700;border-top:1px solid #000;border-bottom:0}

  .dz-plan .print-vacio{font-size:10pt;color:#666;font-style:italic;margin:0 0 10px}

  .dz-plan .print-resumen{
    border:1px solid #000;padding:10px 12px;margin-top:14px;break-inside:avoid;
  }
  .dz-plan .print-resumen h2{font-size:12pt;margin:0 0 8px;color:#000}
  .dz-plan .print-resumen table td{border-bottom:1px solid #DDD}

  .dz-plan .print-nota{margin-top:16px;font-size:8.5pt;color:#555;border-top:1px solid #CCC;padding-top:8px}/* Salto de página antes de la lista de la compra */

  
  .dz-plan .print-salto{break-before:page}
}/* ---------- Fila de días (encima de las tomas) ---------- */


.dz-plan .days--dias{margin-bottom:10px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.dz-plan .days--dias .day-tab{font-size:13px;padding:7px 13px}
.dz-plan .day-tab .kcal{opacity:.6;margin-left:6px;font-size:12px}
.dz-plan .day-tab.active .kcal{opacity:.85}/* ---------- Resumen semanal ---------- */


.dz-plan .semana-resumen{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.dz-plan .semana-resumen h3{font-size:14px;color:var(--ink);margin:0 0 12px}
.dz-plan .semana-fila{
  display:grid;grid-template-columns:90px 1fr 84px;align-items:center;
  gap:12px;padding:5px 0;font-size:13px;
}
.dz-plan .semana-fila .dia{color:var(--ink)}
.dz-plan .semana-fila .valor{text-align:right;color:var(--body);font-variant-numeric:tabular-nums}
.dz-plan .semana-fila .meter{margin:0;height:5px}
.dz-plan .semana-media{
  display:flex;justify-content:space-between;gap:12px;margin-top:12px;padding-top:12px;
  border-top:1px solid var(--line);font-size:13px;color:var(--ink);font-weight:600;
}
@media (max-width:640px){
  .dz-plan .semana-fila{grid-template-columns:72px 1fr 74px;gap:8px;font-size:12px}
}/* ---------- Miniaturas de ejercicios y platos ---------- */


.dz-plan .celda-media{display:flex;align-items:flex-start;gap:10px}
.dz-plan .celda-media > div{min-width:0}
.dz-plan .dz-media{
  position:relative;flex:none;width:48px;height:48px;border-radius:8px;
  overflow:hidden;background:var(--mint);border:1px solid var(--line);
  display:grid;place-items:center;
}
.dz-plan .dz-media img{width:100%;height:100%;object-fit:cover}
/* El plato compuesto: las fotos de sus ingredientes en rejilla. Con dos van
   en columnas; con tres o cuatro, en cuadrante. Un hilo claro entre trozos
   para que se lea como varios alimentos y no como una foto mal recortada. */
.dz-plan .dz-media--compuesta{display:grid;gap:1px;background:var(--line);place-items:stretch}
.dz-plan .dz-media--compuesta[data-trozos="2"]{grid-template-columns:1fr 1fr}
.dz-plan .dz-media--compuesta[data-trozos="3"],
.dz-plan .dz-media--compuesta[data-trozos="4"]{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
.dz-plan .dz-media--compuesta[data-trozos="3"] img:first-child{grid-row:span 2}
.dz-plan .dz-media--compuesta img{width:100%;height:100%;object-fit:cover}
/* El plato de la toma: la foto grande de lo que se va a comer, encima de la
   tabla de gramos. Es lo primero que mira quien abre el plan. */
.dz-plan .plato-toma{
  display:flex;gap:14px;align-items:center;margin:0 0 16px;
  padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--mint);
}
.dz-plan .plato-toma-txt{min-width:0;display:flex;flex-direction:column;gap:3px}
.dz-plan .plato-toma-txt strong{font-size:15px}
.dz-plan .plato-toma .pista{font-size:12px;line-height:1.45}
.dz-plan .dz-media--plato{width:104px;height:104px;border-radius:12px}
@media(max-width:560px){
  .dz-plan .plato-toma{flex-direction:column;align-items:flex-start}
  .dz-plan .dz-media--plato{width:100%;height:170px}
}
/* Rehacer una foto que ya existe: los botones se asoman al pasar por encima.
   Ocultos del todo taparían la foto; siempre visibles, la ensucian. */
.dz-plan .dz-media-rehacer{
  position:absolute;inset:auto 0 0 0;display:flex;
  opacity:0;transition:opacity .15s;background:rgba(255,255,255,.92);
}
.dz-plan .dz-media:hover .dz-media-rehacer,
.dz-plan .dz-media:focus-within .dz-media-rehacer{opacity:1}
/* En el teléfono no hay "pasar el ratón por encima": si dependieran de eso,
   estos botones no existirían para quien arma el plan desde el móvil, que es
   la mitad de las veces. Ahí se quedan siempre a la vista. */
@media (hover:none){
  .dz-plan .dz-media-rehacer{opacity:1;background:rgba(255,255,255,.82)}
}
.dz-plan .dz-media-rehacer > *{
  flex:1;border:0;background:none;cursor:pointer;color:var(--red);
  font-size:13px;line-height:1;padding:3px 0;display:grid;place-items:center;
}
.dz-plan .dz-media-rehacer > * + *{border-left:1px solid var(--line)}
.dz-plan .dz-media-rehacer > *:hover{background:rgba(217,174,98,.10)}
/* El botón de generar la foto real va encima, en una esquina, sin tapar. */
.dz-plan .dz-media-generar--sobre{
  position:absolute;right:0;bottom:0;width:18px;height:18px;line-height:1;
  border-radius:6px 0 0 0;background:rgba(255,255,255,.88);font-size:13px;
}
.dz-plan .dz-media--vacia::after{
  content:'';width:16px;height:16px;border-radius:4px;
  background:repeating-linear-gradient(45deg,var(--line) 0 3px,transparent 3px 6px);
}
.dz-plan .dz-media-generar{
  width:100%;height:100%;border:0;background:none;cursor:pointer;
  font-family:var(--font-body);font-size:17px;line-height:1;color:var(--red);
}
.dz-plan .dz-media-generar:hover:not(:disabled){background:rgba(217,174,98,.08)}
.dz-plan .dz-media-generar:disabled{cursor:default;color:var(--body)}
.dz-plan .dz-media-ia{
  position:absolute;right:2px;bottom:2px;font-size:12px;font-weight:700;
  letter-spacing:.04em;color:#fff;background:rgba(10,14,21,.7);
  border-radius:3px;padding:0 3px;
}
@media print{.dz-plan .dz-media{display:none}}/* Acciones del hueco vacío: subir foto propia o generar con IA */


.dz-plan .dz-media-acciones{display:flex;width:100%;height:100%}
.dz-plan .dz-media-acciones > *{
  flex:1;display:grid;place-items:center;cursor:pointer;
  font-family:var(--font-body);font-size:15px;line-height:1;
  border:0;background:none;color:var(--red);
}
.dz-plan .dz-media-acciones > * + *{border-left:1px solid var(--line)}
.dz-plan .dz-media-acciones > *:hover{background:rgba(217,174,98,.08)}
.dz-plan .dz-media-subir{position:relative;overflow:hidden}
.dz-plan .dz-media-subir input{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}/* ============================================================
   VISTA CLIENTE — el resumen que ve quien sigue el plan
   Tarjetas de macros, total destacado y tomas como banda con foto.
   ============================================================ */


.dz-plan .vista-cliente{max-width:430px;margin:0 auto}/* Entreno / Descanso */


.dz-plan .tipo-dia{
  display:inline-flex;border:1px solid var(--line);border-radius:10px;
  overflow:hidden;margin:0 auto 18px;background:var(--nf-card,#fff);
}
.dz-plan .tipo-dia button{
  font-family:var(--font-body);font-size:14px;font-weight:600;
  padding:10px 26px;border:0;background:var(--nf-card,#fff);color:var(--body);cursor:pointer;
}
.dz-plan .tipo-dia button.on{background:var(--black);color:#fff}
.dz-plan .centrado{text-align:center}

.dz-plan .vc-titulo{
  font-family:var(--font-head);font-size:15px;font-weight:700;letter-spacing:.14em;
  color:var(--red);text-align:center;margin:0 0 14px;
}/* Total del día */


.dz-plan .vc-total{
  background:var(--red);color:#fff;border-radius:12px;
  padding:22px 20px;text-align:center;margin-bottom:14px;
}
.dz-plan .vc-total strong{
  font-family:var(--font-head);font-size:30px;font-weight:700;letter-spacing:.01em;
}
.dz-plan .vc-total span{font-size:15px;font-weight:600;margin-left:6px;opacity:.9}
.dz-plan .vc-total small{display:block;font-size:12px;opacity:.8;margin-top:4px}/* Macros en rejilla de dos */


.dz-plan .vc-macros{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
.dz-plan .vc-macro{background:var(--nf-card,#fff);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.dz-plan .vc-macro h4{
  font-family:var(--font-head);font-size:13px;font-weight:700;letter-spacing:.06em;
  color:var(--ink);margin:0 0 8px;
}
.dz-plan .vc-macro .g{font-family:var(--font-head);font-size:22px;font-weight:700;color:var(--ink)}
.dz-plan .vc-macro .g small{font-size:13px;font-weight:500;color:var(--body);margin-left:3px}
.dz-plan .vc-macro .kg{display:block;font-size:12px;color:var(--body);margin-top:2px}/* Tomas como banda con foto */


.dz-plan .vc-toma{
  position:relative;border-radius:14px;overflow:hidden;margin-bottom:12px;
  min-height:96px;display:flex;align-items:flex-end;cursor:pointer;
  background:linear-gradient(135deg,#3a3a42,#1b1b20);
  transition:transform .25s ease, box-shadow .25s ease;
}
.dz-plan .vc-toma.con-foto{min-height:130px}
.dz-plan .vc-toma:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(10,14,21,.22)}

.dz-plan .vc-toma img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .5s ease;
}
.dz-plan .vc-toma:hover img{transform:scale(1.04)}/* Degradado de abajo arriba: el texto se apoya en la zona oscura y la
   comida se ve entera arriba, que es lo que tiene que lucir. */


.dz-plan .vc-toma::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(to top,
    rgba(10,14,21,.88) 0%, rgba(10,14,21,.55) 38%, rgba(10,14,21,.1) 75%);
}/* Botón de foto, discreto hasta que se pasa por encima */


.dz-plan .vc-foto{
  position:absolute;top:10px;right:10px;z-index:2;
  width:30px;height:30px;border-radius:50%;cursor:pointer;
  display:grid;place-items:center;color:#fff;
  background:rgba(10,14,21,.45);backdrop-filter:blur(6px);
  opacity:0;transition:opacity .2s, background .2s;
}
.dz-plan .vc-toma:hover .vc-foto,
.dz-plan .vc-foto:focus-within{opacity:1}
.dz-plan .vc-foto:hover{background:var(--red)}
.dz-plan .vc-foto input{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}
.dz-plan .vc-foto.cargando{opacity:1;background:var(--red)}
.dz-plan .vc-foto.cargando svg{animation:vc-late 1s ease-in-out infinite}
.dz-plan .vc-foto.fallo{opacity:1;background:#b91c1c}
@keyframes vc-late{50%{opacity:.35}}
.dz-plan .vc-toma-txt{position:relative;z-index:1;padding:16px 18px;width:100%}
.dz-plan .vc-toma h3{
  font-family:var(--font-head);font-size:20px;font-weight:700;letter-spacing:.06em;
  color:#fff;margin:0;text-transform:uppercase;
  text-shadow:0 1px 12px rgba(0,0,0,.5);
}
.dz-plan .vc-toma .kcal{
  display:block;font-family:var(--font-body);font-size:12.5px;
  color:rgba(255,255,255,.9);margin-top:3px;font-weight:500;
  text-shadow:0 1px 8px rgba(0,0,0,.5);
}
.dz-plan .vc-toma--vacia{background:var(--mint);border:1px dashed var(--line);min-height:70px}
.dz-plan .vc-toma--vacia::after{display:none}
.dz-plan .vc-toma--vacia h3{color:rgba(10,14,21,.35)}
.dz-plan .vc-toma--vacia .kcal{color:rgba(10,14,21,.35)}/* Detalle de la toma, al desplegar */


.dz-plan .vc-detalle{display:none;padding:2px 4px 16px}
.dz-plan .vc-detalle.abierta{display:block}
.dz-plan .vc-linea{
  display:flex;justify-content:space-between;gap:14px;
  font-size:14px;padding:7px 0;border-bottom:1px solid var(--line);
}
.dz-plan .vc-linea:last-child{border-bottom:0}
.dz-plan .vc-linea .cant{color:var(--body);white-space:nowrap}/* Selector de día */


.dz-plan .vc-dias{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-bottom:16px}
.dz-plan .vc-dias button{
  font-family:var(--font-body);font-size:13px;font-weight:600;
  width:38px;height:38px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line);background:var(--nf-card,#fff);color:var(--ink);
}
.dz-plan .vc-dias button.on{background:var(--black);border-color:var(--black);color:#fff}
.dz-plan .vc-dias button.con-plan:not(.on){border-color:var(--ink);color:var(--ink);border-width:1.5px}/* Cambio entre editar y vista cliente */


.dz-plan .modo-vista{display:flex;gap:8px;margin-bottom:18px}
.dz-plan .modo-vista button{
  font-family:var(--font-body);font-size:14px;font-weight:600;padding:9px 18px;
  border-radius:var(--radius);border:1px solid var(--line);background:var(--nf-card,#fff);
  color:var(--ink);cursor:pointer;
}
.dz-plan .modo-vista button.on{background:var(--black);border-color:var(--black);color:#fff}

@media print{.dz-plan .modo-vista,
.dz-plan .tipo-dia,
.dz-plan .vc-dias{display:none}}

/* ==========================================================================
   EL PILOTO AUTOMÁTICO
   --------------------------------------------------------------------------
   Va dentro de la tarjeta del menú y no en una aparte a propósito: es la
   alternativa a montar el menú a mano, así que tiene que verse justo encima
   de lo que sustituye. Con un fondo tenue basta para que se lea como oferta
   y no como una advertencia.
   ========================================================================== */
.dz-plan .auto-plan{
  display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;
  padding:14px 16px;margin-bottom:14px;border-radius:14px;
  background:var(--mint);border:1px solid var(--line);
}
.dz-plan .auto-plan-txt{display:flex;flex-direction:column;gap:2px;min-width:200px;flex:1}
.dz-plan .auto-plan-txt strong{font-size:15px}
.dz-plan .auto-plan-txt span{font-size:12.5px;color:var(--grey-num);line-height:1.45}
.dz-plan .auto-plan-ctrl{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.dz-plan .auto-plan-ctrl label{display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:var(--grey-num)}
.dz-plan .auto-plan-ctrl select{padding:7px 9px;border:1px solid var(--line);border-radius:9px;background:var(--nf-card,#fff);font:inherit;font-size:13px}
.dz-plan .auto-plan-check{flex-direction:row!important;align-items:center;gap:6px;padding-bottom:9px;cursor:pointer}
.dz-plan .auto-plan-check input{width:auto}
.dz-plan .auto-aviso{
  margin:0 0 14px;padding:10px 13px;border-radius:11px;font-size:12.5px;line-height:1.5;
  background:rgba(217,174,98,.07);border:1px solid rgba(217,174,98,.18);
}
@media(max-width:560px){
  .dz-plan .auto-plan-ctrl{width:100%}
  .dz-plan .auto-plan-ctrl button{flex:1}
}

/* El selector de entreno/descanso dentro del editor. El de la vista del
   cliente va centrado bajo el título; este va pegado a las pestañas de los
   días, que es lo que modifica. */
.dz-plan .tipo-dia--editor{margin:0 0 14px}
/* Un día de descanso se reconoce de un vistazo en la tira de días, sin tener
   que abrirlos uno por uno. */
.dz-plan .day-tab--descanso{border-style:dashed}
.dz-plan .day-tab--descanso .kcal{opacity:.75}

/* ==========================================================================
   SUSTITUIR UN ALIMENTO
   --------------------------------------------------------------------------
   Se abre debajo de la fila, dentro de la misma tabla, en vez de en un
   diálogo: así se sigue viendo qué se está cambiando y por cuánto, que es
   justo lo que hay que comparar.
   ========================================================================== */
.dz-plan .fila-sustitutos > td{background:var(--mint);padding:12px 14px}
.dz-plan .sust-titulo{font-size:12.5px;color:var(--grey-num);margin:0 0 10px;line-height:1.5}
.dz-plan .sust-lista{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.dz-plan .sust-opcion{
  display:flex;flex-direction:column;gap:2px;text-align:left;cursor:pointer;
  padding:9px 11px;border:1px solid var(--line);border-radius:11px;background:var(--nf-card,#fff);font:inherit;
}
.dz-plan .sust-opcion:hover{border-color:var(--red);background:rgba(217,174,98,.04)}
.dz-plan .sust-nombre{font-size:13px;font-weight:600;line-height:1.3}
.dz-plan .sust-cant{font-size:14px;font-weight:700;color:var(--red)}
.dz-plan .sust-dif{font-size:12px;color:var(--grey-num)}

/* ==========================================================================
   LA VISTA DE QUIEN COME
   --------------------------------------------------------------------------
   Rehecha con forma de app de comidas. El orden de lectura es el que importa:
   primero cuánto llevas del día, después qué te toca comer. Todo lo que no
   ayuda a decidir qué meterse en la boca —los gramos por kilo de peso, la
   fibra— se queda en el editor.
   ========================================================================== */
.dz-plan .vc-cab{display:flex;justify-content:center;margin-bottom:16px}

/* Navegación por días: flechas a los lados, día en el centro. */
.dz-plan .vc-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:10px}
.dz-plan .vc-flecha{
  width:34px;height:34px;border-radius:50%;border:1px solid var(--line);
  background:var(--nf-card,#fff);color:var(--body);font-size:20px;line-height:1;cursor:pointer;
}
.dz-plan .vc-flecha:hover{border-color:var(--red);color:var(--red)}
.dz-plan .vc-hoy{font-family:var(--font-head);font-size:16px;font-weight:700;min-width:180px;text-align:center}

/* El resumen: anillo a la izquierda, cifras a la derecha. */
.dz-plan .vc-resumen{
  display:flex;align-items:center;gap:16px;padding:16px;margin-bottom:12px;
  border:1px solid var(--line);border-radius:18px;background:var(--nf-card,#fff);
}
.dz-plan .vc-anillo{width:74px;height:74px;flex:none;transform:rotate(-90deg)}
.dz-plan .vc-anillo circle{fill:none;stroke-width:7}
.dz-plan .vc-anillo-fondo{stroke:var(--line)}
.dz-plan .vc-anillo-valor{stroke:var(--red);stroke-linecap:round;transition:stroke-dashoffset .5s ease}
.dz-plan .vc-resumen-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.dz-plan .vc-resumen-txt strong{font-family:var(--font-head);font-size:24px;font-weight:700;line-height:1.1}
.dz-plan .vc-macros-linea{font-size:12.5px;color:var(--grey-num);line-height:1.5}
.dz-plan .vc-macros-linea b{color:var(--body);font-weight:600}
.dz-plan .vc-objetivo{font-size:12.5px;color:var(--grey-num)}

.dz-plan .vc-barra{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin-bottom:6px}
.dz-plan .vc-barra span{display:block;height:100%;background:var(--red);border-radius:99px;transition:width .5s ease}
.dz-plan .vc-cuenta{font-size:12px;color:var(--grey-num);text-align:center;margin:0 0 20px}

/* Cada comida: su nombre, sus calorías y debajo lo que lleva. */
.dz-plan .comida{margin-bottom:22px}
.dz-plan .comida-cab{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding-bottom:8px;margin-bottom:10px;border-bottom:1px solid var(--line);
}
.dz-plan .comida-cab h3{font-family:var(--font-head);font-size:17px;font-weight:700;margin:0}
.dz-plan .comida-kcal{font-size:12.5px;color:var(--grey-num);white-space:nowrap}

.dz-plan .alimento{display:flex;align-items:center;gap:12px;padding:7px 0}
.dz-plan .alimento-foto{
  width:56px;height:56px;flex:none;border-radius:12px;overflow:hidden;
  background:var(--mint);display:grid;place-items:center;
}
.dz-plan .alimento-foto img{width:100%;height:100%;object-fit:cover}
/* Mientras no hay foto, el emoji del alimento sobre su color: se reconoce
   igual de rápido y no deja un hueco gris esperando. */
.dz-plan .alimento-emoji{font-size:26px;line-height:1}
.dz-plan .alimento-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.dz-plan .alimento-nom{font-size:14.5px;font-weight:600;line-height:1.3}
.dz-plan .alimento-sub{font-size:12.5px;color:var(--grey-num)}

@media(max-width:480px){
  .dz-plan .vc-resumen{gap:12px;padding:13px}
  .dz-plan .vc-resumen-txt strong{font-size:21px}
  .dz-plan .vc-hoy{min-width:120px;font-size:15px}
}
@media print{
  .dz-plan .vc-flecha,.dz-plan .vc-dias{display:none}
}

/* El generador de fotos en lote, junto al de planes. Mismo sitio porque son
   las dos cosas que se lanzan una vez y luego se dejan trabajar. */
.dz-plan .fotos-lote{
  display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;
  padding:12px 16px;margin-bottom:14px;border:1px dashed var(--line);border-radius:14px;
}
.dz-plan .fotos-lote-txt{display:flex;flex-direction:column;gap:2px;min-width:200px;flex:1}
.dz-plan .fotos-lote-txt strong{font-size:14px}
.dz-plan .fotos-lote-txt span{font-size:12.5px;color:var(--grey-num)}

/* La foto a pantalla completa. Fondo oscuro y la imagen entera —`contain` y no
   `cover`— porque aquí se viene justo a ver el plato completo, y recortarlo
   sería repetir el problema que trae a la gente hasta aquí. */
.dz-visor{
  position:fixed;inset:0;z-index:150;display:none;
  background:rgba(8,10,14,.93);
  align-items:center;justify-content:center;flex-direction:column;gap:14px;
  padding:24px;cursor:zoom-out;
}
.dz-visor.abierto{display:flex}
.dz-visor img{max-width:min(900px,92vw);max-height:80vh;object-fit:contain;border-radius:14px}
.dz-visor-pie{color:#fff;font-size:14px;text-align:center;max-width:90vw}

/* El plato completo en la vista del cliente: ancho, encima de sus alimentos.
   Se queda vacío hasta que la foto llega, y si no hay ninguna desaparece —un
   recuadro gris permanente ensucia más que ayuda. */
.dz-plan .comida-foto{margin:0 0 14px;border-radius:14px;overflow:hidden}
.dz-plan .comida-foto.con-foto img{
  width:100%;max-height:230px;object-fit:cover;display:block;cursor:zoom-in;
}
.dz-plan .comida-foto.mosaico{display:grid;gap:2px;background:var(--line);max-height:190px}
.dz-plan .comida-foto.mosaico[data-trozos="2"]{grid-template-columns:1fr 1fr}
.dz-plan .comida-foto.mosaico[data-trozos="3"],
.dz-plan .comida-foto.mosaico[data-trozos="4"]{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
.dz-plan .comida-foto.mosaico img{width:100%;height:95px;object-fit:cover;display:block}

/* De quién es el plan. Va arriba del todo y con fondo propio porque cambia el
   significado de TODO lo que hay debajo: no es un filtro más, es saber a quién
   le estás armando la dieta. Confundirse aquí es guardarle a Ana la dieta de
   Luis. */
.dz-plan .socio-barra{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  padding:11px 16px;margin-bottom:16px;border-radius:12px;
  background:var(--mint);border:1px solid var(--line);font-size:13.5px;
}
.dz-plan .socio-barra label{color:var(--grey-num)}
.dz-plan .socio-barra select{
  padding:7px 10px;border:1px solid var(--line);border-radius:9px;
  background:var(--nf-card,#fff);font:inherit;font-size:13.5px;max-width:280px;
}
/* Cuando se está mirando el plan de otro, la barra se tiñe: es un aviso
   permanente de que lo que se escriba no va a tu propia ficha. */
.dz-plan .socio-barra.ajeno{background:rgba(217,174,98,.06);border-color:rgba(217,174,98,.25)}
.dz-plan .socio-aviso{color:var(--red);font-weight:600}

/* ==========================================================================
   AÑADIR UN ALIMENTO
   --------------------------------------------------------------------------
   Va plegado: la mayor parte del tiempo se busca en el catálogo, no se crean
   alimentos. Ocupar sitio permanentemente por algo que se usa de vez en cuando
   empuja hacia abajo lo que sí se usa siempre.
   ========================================================================== */
.dz-plan .nuevo-ali{margin-bottom:12px}
.dz-plan .nuevo-ali-form{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px;
  padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--mint);
}
.dz-plan .na-ancho{grid-column:1 / -1}
.dz-plan .na-campo{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--grey-num);min-width:0}
.dz-plan .na-campo input,.dz-plan .na-campo select{
  padding:8px 10px;border:1px solid var(--line);border-radius:9px;
  background:var(--nf-card,#fff);font:inherit;font-size:13.5px;color:var(--ink);width:100%;
}
.dz-plan fieldset.na-campo{border:1px solid var(--line);border-radius:10px;padding:8px 11px;background:var(--nf-card,#fff)}
.dz-plan fieldset.na-campo legend{font-size:12.5px;color:var(--grey-num);padding:0 4px}
.dz-plan .na-radio{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink);cursor:pointer;padding:2px 0}
.dz-plan .na-radio input{width:auto}
/* El formulario vive en la columna del catálogo, que es estrecha: tres
   casillas en fila dejaban los rótulos partidos en dos líneas. El peso, que es
   el dato que de verdad hay que pensar, se lleva la fila entera. */
.dz-plan .na-unidad{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dz-plan .na-unidad > :first-child{grid-column:1 / -1}
.dz-plan .na-aviso{
  grid-column:1 / -1;margin:0;padding:9px 12px;border-radius:10px;font-size:12.5px;line-height:1.5;
  background:rgba(217,131,36,.10);border:1px solid rgba(217,131,36,.30);color:#8a5410;
}
.dz-plan .na-botones{grid-column:1 / -1;display:flex;gap:8px}
@media(max-width:560px){
  .dz-plan .nuevo-ali-form{grid-template-columns:1fr}
  .dz-plan .na-unidad{grid-template-columns:1fr}
}
.dz-plan .na-fila{display:flex;gap:7px;align-items:stretch}
.dz-plan .na-fila input{flex:1 1 auto;min-width:0}
.dz-plan .na-fila .btn{flex:0 0 auto;white-space:nowrap}

/* ── Polish DZ (octubre 2026) ── */
.dz-plan button:focus-visible,
.dz-plan a:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.dz-plan .vc-flecha,
.dz-plan .vc-dias button{min-width:40px;min-height:40px}
/* Los números se leen en columna: cifras del mismo ancho */
.dz-plan .total-value,
.dz-plan .vc-resumen-txt strong,
.dz-plan .vc-macro .g{font-variant-numeric:tabular-nums}
/* Las calorías del día en Tinta y en Anton: antes iban grises como el resto */
.dz-plan .vc-resumen-txt strong{color:var(--ink);font-weight:400;letter-spacing:.3px}

/* ── Harden (octubre 2026): controles del editor dentro del sistema ── */
/* El buscador del catálogo salía con el estilo del navegador (21 px, sin bordes redondos) */
.dz-plan .catalog-filters input[type=search],
.dz-plan .catalog-filters input[type=text],
.dz-plan #dzn-buscar{
  width:100%;min-height:44px;padding:10px 18px;border-radius:999px;
  border:1.5px solid #e2e2e2;background:var(--nf-card,#fff);color:var(--ink);
  font:500 16px var(--font-body);
}
.dz-plan .catalog-filters input:focus{outline:none;border-color:var(--ink)}
/* Casillas en Negro Ring, no en el azul del sistema operativo */
.dz-plan input[type=checkbox]{accent-color:var(--black);width:20px;height:20px}
/* Pestañas de día, modo y selects: mínimo 40 px para el dedo */
.dz-plan .day-tab,
.dz-plan .modo-vista button,
.dz-plan select{min-height:40px}
/* Entreno / Descanso como píldoras, igual que todo lo demás */
.dz-plan .tipo-dia,
.dz-plan .tipo-dia button{border-radius:999px}
/* Botones de cada alimento: 40 px y visibles */
.dz-plan .icon-btn{min-width:40px;min-height:40px}
/* El aviso de error no va en el rojo de la marca */
.dz-plan .socio-aviso{color:#e11d48}

/* ── Editor en el celular (octubre 2026) ── */
@media (max-width:620px){
  /* Las columnas de la cuadrícula ya no se estiran según su contenido:
     antes la página quedaba 10 px más ancha que la pantalla */
  .dz-plan .split,
  .dz-plan .fields--4,
  .dz-plan .fields--5{grid-template-columns:minmax(0,1fr)}
  /* Entreno / Descanso se reparten el ancho en vez de empujarlo */
  .dz-plan .tipo-dia{display:flex;width:100%}
  .dz-plan .tipo-dia button{flex:1 1 0;padding:10px 12px}
  /* 16 px en los campos: con menos, el iPhone hace zoom al tocarlos */
  .dz-plan input,
  .dz-plan select,
  .dz-plan textarea{font-size:16px}
  .dz-plan .plan-table input{min-height:40px}
  /* Los botones de foto (subir / rehacer) dejan de ser de 23 px */
  .dz-plan .celda-media .dz-media{width:64px;height:64px}
  .dz-plan .dz-media-rehacer > *{padding:8px 0;font-size:14px}
}
@media (max-width:620px){
  .dz-plan .plan-table th,
  .dz-plan .plan-table td{padding-left:4px;padding-right:4px}
  .dz-plan .plan-table{width:100%}
}
/* La regla de 16 px de arriba perdía contra selectores más específicos
   (.dz-plan .field input, etc.): solo el buscador quedaba en 16 px */
@media (max-width:620px){
  .dz-plan input:not([type=checkbox]):not([type=radio]):not([type=file]),
  .dz-plan select,
  .dz-plan textarea{font-size:16px !important}
}
/* Campos y botones de ícono heredan la letra de la página (salían en Arial) */
.dz-plan input,.dz-plan select,.dz-plan button,.dz-plan .icon-btn{font-family:var(--font-body)}

/* ── Editor en el celular: el menú primero (octubre 2026) ──
   El trabajo de todos los días es el menú; los datos del cliente se ponen
   una vez y el catálogo se consulta. Antes el menú quedaba ~3.000 px abajo. */
@media (max-width:1080px){
  .dz-plan .tool > .container{display:flex;flex-direction:column}
  .dz-plan .tool > .container > .card:not(#dzn-tarjetaCompra){order:3}   /* Datos del cliente, al final */
  .dz-plan #dzn-tarjetaCompra{order:4}
  .dz-plan .split{display:flex;flex-direction:column}
  .dz-plan .split > .card:last-child{order:-1}                          /* Menú antes que catálogo */
}
@media (max-width:620px){
  /* Días, comidas y acciones en una sola fila que se desliza con el dedo,
     como los chips de categorías de la tienda (antes, 3 renglones cada uno) */
  .dz-plan .days,
  .dz-plan .tool-actions{
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
    margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;
  }
  .dz-plan .days::-webkit-scrollbar,
  .dz-plan .tool-actions::-webkit-scrollbar{display:none}
  .dz-plan .days > *,
  .dz-plan .tool-actions > *{flex:0 0 auto}
}
/* "Vaciar" borra el plan: va al final de la fila y en el color de error,
   no igual que "Lista de la compra" */
.dz-plan #dzn-vaciar{order:9;color:#e11d48;border-color:rgba(225,29,72,.35)}
.dz-plan .tool-actions{display:flex}
/* Con flex en columna, los hijos se estiraban al ancho de las filas que no
   se parten (días, acciones): se les prohíbe pasar del ancho de la pantalla */
@media (max-width:1080px){
  .dz-plan .tool > .container > *,
  .dz-plan .split > *,
  .dz-plan .card{min-width:0;max-width:100%}
}

/* ============================================================
   PULIDO FINAL (octubre 2026)
   ============================================================ */
/* Nombres de comida y de alimento en tinta; el día en Anton, como los títulos */
.dz-plan .alimento-nom{color:var(--ink)}
.dz-plan .vc-hoy{color:var(--ink);font-weight:400;font-synthesis-weight:none;text-transform:uppercase;letter-spacing:.04em;font-size:20px}
.dz-plan .comida-cab h3,.dz-plan .vc-resumen-txt strong,.dz-plan .total-value,.dz-plan .vc-macro .g{font-weight:400;font-synthesis-weight:none}
.dz-plan .comida-cab h3{text-transform:uppercase;letter-spacing:.03em}
.dz-plan .vc-flecha:hover{border-color:var(--ink);color:var(--ink)}
/* Los días sin comidas se ven apagados; los que tienen, con borde tinta */
.dz-plan .vc-dias button:not(.con-plan):not(.on){color:#6b6b6b}
/* Aviso del plan automático: neutro, no rojo (no es un error) */
.dz-plan .auto-aviso{background:var(--mint);border:1px solid var(--line);color:var(--ink)}
/* Entreno / descanso cuando solo se puede leer */
.dz-plan .tipo-dia.solo-lectura button:disabled{cursor:default;opacity:1}
.dz-plan .tipo-dia.solo-lectura button:disabled:not(.on){display:none}
/* Tabla del editor: más apretada, y la unidad al lado de la cantidad */
.dz-plan .plan-table td{line-height:1.3}
.dz-plan .plan-table .sub-unidad{display:inline;margin-left:6px;font-size:12.5px;color:var(--grey-num)}
.dz-plan .btn-ghost:hover{border-color:var(--ink);color:var(--ink)}

/* ============================================================
   CRÍTICA 4 OCT (noche)
   ============================================================ */
/* Botones con etiqueta de la casa: Instrument Sans 800 en mayúsculas */
.dz-plan .btn{font-weight:800;text-transform:uppercase;letter-spacing:.03em}
.dz-plan .btn-xs{font-size:12.5px}
.dz-plan .btn-primary:hover{background:var(--red-soft)}
/* Anton siempre en mayúsculas; las unidades pequeñas en letra de texto */
.dz-plan .vc-resumen-txt strong{text-transform:uppercase;letter-spacing:.02em}
.dz-plan .total-value small{font-family:var(--font-body);font-weight:600;text-transform:none}
/* El progreso no es la marca: barras y anillo en Negro Ring; pasarse, ámbar */
.dz-plan .meter{background:var(--line)}
.dz-plan .meter span{background:var(--black)}
.dz-plan .vc-anillo-valor{stroke:var(--black)}
/* "+" del catálogo: contorno en tinta, rojo solo al pasar o tocar */
.dz-plan .cat-item .plus{background:var(--nf-card,#fff);color:var(--ink);border:1.5px solid var(--ink)}
.dz-plan .cat-item:hover .plus,.dz-plan .cat-item:active .plus{background:var(--red);border-color:var(--red);color:#fff}
.dz-plan .sust-cant{color:var(--ink)}
.dz-plan .sust-opcion:hover{border-color:var(--ink);background:rgba(10,10,10,.03)}
/* Botones de foto en tinta y a tamaño de dedo */
.dz-plan .dz-media-rehacer > *,.dz-plan .dz-media-generar,.dz-plan .dz-media-acciones > *{color:var(--ink)}
.dz-plan .dz-media-rehacer > *{min-height:32px;font-size:15px}
.dz-plan .dz-media-rehacer > *:hover,.dz-plan .dz-media-generar:hover:not(:disabled),
.dz-plan .dz-media-acciones > *:hover{background:rgba(10,10,10,.06)}
.dz-plan .dz-media-generar--sobre{width:30px;height:30px;font-size:15px}
.dz-plan .dz-media-generar.dz-media-armado{background:var(--red);color:#fff;font-size:12px;font-weight:800}
.dz-plan .dz-media-subir{max-width:100%}
/* Avisos en los colores de estado del sistema */
.dz-plan .notice p{color:var(--ink)}
.dz-plan .na-aviso{background:rgba(180,83,9,.07);border-color:rgba(180,83,9,.35);color:var(--ink)}
/* El aviso de guardado, alineado con el contenido y no a sangre */
#dz-plan-estado.dz-plan-estado{max-width:calc(var(--container) - 40px);width:calc(100% - 32px);margin:0 auto 14px;box-sizing:border-box;flex-wrap:wrap}
#dz-plan-estado:empty{display:none}
/* Confirmación al añadir un alimento, abajo y cerca del pulgar */
.dz-plan .aviso-flotante{
  position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));z-index:120;
  transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:.2s ease;
  background:var(--black);color:#fff;border-radius:999px;padding:12px 20px;
  font-family:var(--font-body);font-size:14px;font-weight:700;line-height:1.3;
  max-width:calc(100% - 32px);box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.dz-plan .aviso-flotante.ver{opacity:1;transform:translate(-50%,0)}
.dz-plan .aviso-flotante i{color:#4ade80;margin-right:4px}
/* La fila de acciones del celular avisa que sigue a la derecha */
@media (max-width:620px){
  .dz-plan .tool-actions{-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent);padding-right:24px}
  .dz-plan .plan-table .name{overflow-wrap:anywhere}
  .dz-plan .plan-table th:first-child,.dz-plan .plan-table td:first-child{padding-left:0}
  .dz-plan .plan-table th:last-child,.dz-plan .plan-table td:last-child{padding-right:0}
}
@media (prefers-reduced-motion:reduce){.dz-plan *{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Re-crítica 4 oct */
.dz-plan .vc-foto.fallo{background:#e11d48}
.dz-plan .aviso-flotante i{color:#fff}
.dz-plan .modo-vista button{text-transform:uppercase;font-weight:800;letter-spacing:.03em;font-size:13px}
/* Entreno/descanso de solo lectura: una etiqueta, no un botón */
.dz-plan .tipo-dia.solo-lectura{width:auto;background:none;border:0;padding:0;justify-content:center}
.dz-plan .tipo-dia.solo-lectura button:disabled.on{
  width:auto;flex:none;background:var(--mint);color:var(--ink);border:0;border-radius:999px;
  padding:6px 14px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;min-height:0;
}
.dz-plan .dz-media-subir input{width:100%;height:100%}

/* ============================================================
   VENTANAS, DESHACER Y CATÁLOGO EN PANEL (4 oct, noche)
   ============================================================ */
.dz-plan .btn-peligro{background:#e11d48;color:#fff}
.dz-plan .btn-peligro:hover{background:#be123c}
.dz-plan .btn-dark:hover{background:#000}
/* Confirmar en el estilo de la casa */
.dz-plan .dlg-capa{
  position:fixed;inset:0;z-index:140;background:rgba(10,10,10,.55);
  display:grid;place-items:center;padding:16px;animation:dlg-entra .15s ease;
}
.dz-plan .dlg-caja{
  background:var(--nf-card,#fff);border-radius:20px;padding:22px 22px 18px;max-width:420px;width:100%;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
}
.dz-plan .dlg-titulo{font-family:var(--font-head);font-weight:400;text-transform:uppercase;font-size:22px;margin:0 0 10px;color:var(--ink)}
.dz-plan .dlg-texto{font-size:15px;line-height:1.5;color:var(--ink);margin:0 0 10px;white-space:pre-line}
.dz-plan .dlg-pie{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;flex-wrap:wrap}
.dz-plan .dlg-pie .btn{min-height:44px}
@keyframes dlg-entra{from{opacity:0}to{opacity:1}}
/* Deshacer dentro del aviso de abajo */
.dz-plan .aviso-flotante.con-accion{pointer-events:auto;display:flex;align-items:center;gap:10px;padding:8px 8px 8px 18px}
.dz-plan .aviso-deshacer{
  background:var(--nf-card,#fff);color:var(--ink);border:0;border-radius:999px;padding:9px 14px;min-height:40px;
  font-family:var(--font-body);font-weight:800;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;
}
/* Día sin comidas en la vista del socio */
.dz-plan .vc-vacio{text-align:center;padding:28px 18px;border:1px dashed var(--line);border-radius:18px;background:var(--nf-card,#fff)}
.dz-plan .vc-vacio > i{font-size:30px;color:#9a9a9a;margin-bottom:10px;display:block}
.dz-plan .vc-vacio p{font-size:15px;line-height:1.5;color:var(--body);margin:0 0 16px}
.dz-plan .vc-vacio strong{color:var(--ink)}
.dz-plan .vc-wa{
  display:inline-flex;align-items:center;gap:8px;background:#25d366;color:#0a0a0a;text-decoration:none;
  border-radius:999px;padding:12px 20px;min-height:48px;font-weight:800;font-size:13.5px;text-transform:uppercase;letter-spacing:.03em;
}
.dz-plan .vc-wa i{font-size:18px}
/* El catálogo: en escritorio, una tarjeta normal; sin cabecera de panel */
.dz-plan .hoja-cab,.dz-plan .abrir-hoja,.dz-plan .hoja-fondo{display:none}
@media (max-width:1080px){
  .dz-plan .abrir-hoja{display:inline-flex;width:100%;justify-content:center;margin:12px 0 4px;min-height:48px}
  .dz-plan .card-catalogo{
    position:fixed;left:0;right:0;bottom:0;z-index:130;margin:0;
    max-height:86dvh;overflow-y:auto;overscroll-behavior:contain;
    border-radius:22px 22px 0 0;padding-top:0;
    transform:translateY(105%);transition:transform .25s ease;visibility:hidden;
    box-shadow:0 -18px 50px rgba(0,0,0,.25);
    padding-bottom:calc(20px + env(safe-area-inset-bottom));
  }
  .dz-plan .card-catalogo.abierta{transform:none;visibility:visible}
  .dz-plan .hoja-cab{
    display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:2;
    background:var(--nf-card,#fff);padding:14px 0 10px;margin-bottom:6px;border-bottom:1px solid var(--line);
  }
  .dz-plan .hoja-cab::before{content:'';position:absolute;left:50%;top:6px;width:40px;height:4px;border-radius:4px;background:#d4d4d4;transform:translateX(-50%)}
  .dz-plan .hoja-destino{flex:1;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink)}
  .dz-plan .hoja-cerrar{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--nf-card,#fff);color:var(--ink);font-size:18px;cursor:pointer}
  .dz-plan .hoja-fondo{display:block;position:fixed;inset:0;z-index:125;background:rgba(10,10,10,.45);opacity:0;pointer-events:none;transition:opacity .2s}
  .dz-plan .hoja-fondo.ver{opacity:1;pointer-events:auto}
  html.hoja-abierta,html.hoja-abierta body{overflow:hidden}
  /* La confirmación de "añadido" va por encima del panel */
  .dz-plan .aviso-flotante{z-index:135}
}

/* ============================================================
   SUSTITUTOS DEL SOCIO (6 oct)
   ============================================================ */
.dz-plan .alimento-txt{flex:1;min-width:0}
.dz-plan .alimento-cambiar{
  margin-left:auto;flex:none;display:inline-flex;flex-direction:column;align-items:center;gap:3px;
  min-width:56px;min-height:48px;padding:6px 8px;border:1px solid var(--line);border-radius:14px;
  background:var(--nf-card,#fff);color:var(--ink);cursor:pointer;font-family:var(--font-body);
  font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;
}
.dz-plan .alimento-cambiar i{font-size:14px}
.dz-plan .alimento-cambiar[aria-expanded="true"]{background:var(--black);border-color:var(--black);color:#fff}
.dz-plan .alimento-cambio{display:block;font-size:12px;font-weight:700;color:#b45309;margin-top:2px}
.dz-plan .vc-sust{
  margin:2px 0 10px 68px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--mint);
  display:flex;flex-direction:column;gap:8px;
}
.dz-plan .vc-sust-titulo{margin:0;font-size:13px;font-weight:700;color:var(--ink)}
.dz-plan .vc-sust-op,.dz-plan .vc-sust-volver{
  display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  min-height:48px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--nf-card,#fff);
  font-family:var(--font-body);font-size:14px;color:var(--ink);cursor:pointer;text-align:left;
}
.dz-plan .vc-sust-op:hover{border-color:var(--ink)}
.dz-plan .vc-sust-nom{font-weight:700}
.dz-plan .vc-sust-cant{color:var(--body);font-size:13px;white-space:nowrap}
.dz-plan .vc-sust-volver{justify-content:flex-start;font-weight:800;font-size:12.5px;text-transform:uppercase;letter-spacing:.03em;border-color:var(--black)}
.dz-plan .cambio-socio{
  display:inline-block;margin-left:6px;font-size:12px;font-weight:700;color:#b45309;
  background:rgba(180,83,9,.10);border-radius:20px;padding:1px 8px;
}
@media (max-width:520px){.dz-plan .vc-sust{margin-left:0}}

/* ============================================================
   SUPLEMENTACIÓN (8 oct)
   ============================================================ */
.dz-plan .supl-fila{
  position:relative;display:grid;grid-template-columns:2fr 1.2fr 1.4fr 1.4fr;gap:10px;
  padding:14px 48px 14px 14px;margin-bottom:10px;border:1px solid var(--line);border-radius:14px;background:var(--mint);
}
.dz-plan .supl-campo{display:flex;flex-direction:column;gap:4px;min-width:0}
.dz-plan .supl-campo span{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--body)}
.dz-plan .supl-campo input,.dz-plan .supl-campo select{
  width:100%;min-height:42px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--nf-card,#fff);
  font-family:var(--font-body);font-size:14px;color:var(--ink);box-sizing:border-box;
}
.dz-plan .supl-ancho:last-of-type{grid-column:1 / -1}
.dz-plan .supl-quitar{position:absolute;top:10px;right:8px;width:36px;height:36px}
.dz-plan #dzn-suplAgregar{margin-top:4px;min-height:44px}
@media (max-width:760px){
  .dz-plan .supl-fila{grid-template-columns:1fr 1fr;padding-right:14px;padding-top:48px}
  .dz-plan .supl-campo.supl-ancho{grid-column:1 / -1}
  .dz-plan .supl-campo input,.dz-plan .supl-campo select{font-size:16px}
}
/* En la vista del socio */
.dz-plan .vc-supl{margin:6px 0 22px;padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--nf-card,#fff)}
.dz-plan .vc-supl-fila{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}
.dz-plan .vc-supl-fila:last-of-type{border-bottom:0}
.dz-plan .vc-supl-ico{flex:none;width:44px;height:44px;border-radius:12px;background:var(--black);color:#fff;display:grid;place-items:center;font-size:18px}
.dz-plan .vc-supl-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.dz-plan .vc-supl-txt strong{font-size:15px;color:var(--ink)}
.dz-plan .vc-supl-dosis{font-size:14px;font-weight:700;color:var(--ink)}
.dz-plan .vc-supl-frec{font-size:13px;color:var(--body)}
.dz-plan .vc-supl-pedir{margin-top:12px;width:100%;justify-content:center;box-sizing:border-box}