/* ============================================================================
   Operador (PRD Zook Operador): "Para tu revisión", "Lo que hizo tu equipo hoy"
   y "Qué puede hacer tu equipo". Sólo tokens del panel de cuenta.html
   (--surface, --line, --text, --muted, --violet…), que el tema claro redefine
   en html[data-theme="light"]. Área táctil ≥ 44 px; el color nunca comunica
   solo (siempre hay texto al lado).
   ========================================================================== */
.zo-block{margin:0 0 22px;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--text);font-family:var(--sans);max-width:100%;overflow-wrap:anywhere;}
.zo-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.zo-h{font-family:var(--sans);font-size:1.05rem;font-weight:700;letter-spacing:0;line-height:1.3;display:flex;align-items:center;gap:8px;}
.zo-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 7px;border-radius:999px;background:var(--violet);color:var(--on-violet);font-size:.78rem;font-weight:700;font-variant-numeric:tabular-nums;}
.zo-list{display:flex;flex-direction:column;gap:12px;}
.zo-card{border:1px solid var(--line);border-radius:13px;background:var(--surface-2);padding:14px;outline:none;transition:box-shadow .3s;}
.zo-card:focus-visible{outline:2px solid var(--violet);outline-offset:2px;}
.zo-card.zo-flash{box-shadow:0 0 0 3px var(--violet);}
.zo-card-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px;}
.zo-area{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:999px;border:1px solid var(--line-2);font-size:.78rem;font-weight:700;color:var(--text);}
.zo-for{font-size:.85rem;color:var(--muted);}
.zo-sum{font-size:.9rem;color:var(--text);margin:4px 0 8px;}
.zo-preview-l{font-size:.78rem;color:var(--muted);font-weight:600;margin-bottom:4px;}
.zo-preview{margin:0 0 12px;padding:12px 14px;border-left:3px solid var(--violet);border-radius:8px;background:var(--surface);color:var(--text);font-size:.92rem;line-height:1.5;white-space:pre-wrap;}
.zo-actions{display:flex;gap:10px;flex-wrap:wrap;}
.zo-links{display:flex;gap:6px 14px;flex-wrap:wrap;margin-top:4px;}
.zo-btn{flex:1 1 140px;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:11px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font-family:inherit;font-size:.95rem;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s,transform .1s;}
.zo-btn:hover:not(:disabled){border-color:var(--violet);}
.zo-btn:active:not(:disabled){transform:scale(.98);}
.zo-btn:disabled{opacity:.55;cursor:not-allowed;}
.zo-primary{background:var(--violet);border-color:var(--violet);color:var(--on-violet);}
.zo-primary:hover:not(:disabled){background:var(--violet-press);}
.zo-danger{border-color:var(--red);color:var(--red);}
.zo-link{min-height:44px;padding:0 4px;border:0;background:none;color:var(--violet-text);font-family:inherit;font-size:.86rem;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer;}
.zo-link:disabled{opacity:.55;cursor:not-allowed;}
.zo-edit{display:flex;flex-direction:column;gap:8px;}
.zo-lbl{font-size:.85rem;font-weight:600;color:var(--text);}
.zo-ta{width:100%;max-width:100%;min-height:88px;padding:10px 12px;border-radius:10px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font-family:inherit;font-size:.95rem;line-height:1.5;resize:vertical;}
.zo-status{font-size:.88rem;font-weight:600;margin:0 0 10px;padding:8px 12px;border-radius:9px;border:1px solid var(--line);}
.zo-status.ok{color:var(--emerald);}
.zo-status.err{color:var(--red);}
.zo-empty{padding:6px 2px;}
.zo-empty-t{font-weight:700;font-size:.98rem;margin-bottom:4px;}
.zo-empty-d{font-size:.88rem;color:var(--muted);line-height:1.5;}
@media(max-width:520px){
  .zo-block{padding:14px;border-radius:14px;}
  .zo-btn{flex-basis:100%;}
}
/* ── Lo que hizo tu equipo (US-006B) ── */
.zo-days{display:inline-flex;gap:6px;}
.zo-day{min-height:44px;min-width:64px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font-family:inherit;font-size:.88rem;font-weight:600;cursor:pointer;}
.zo-day.on{background:var(--violet);border-color:var(--violet);color:var(--on-violet);}
.zo-group{margin-top:14px;}
.zo-group:first-of-type{margin-top:4px;}
.zo-gh{font-family:var(--sans);font-size:.92rem;font-weight:700;letter-spacing:0;margin-bottom:6px;}
.zo-gn{font-weight:500;color:var(--muted);font-size:.84rem;}
.zo-rows{list-style:none;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.zo-row{padding:10px 12px;background:var(--surface-2);}
.zo-row+.zo-row{border-top:1px solid var(--line);}
.zo-row-main{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.zo-time{font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums;min-width:40px;}
.zo-row-t{flex:1 1 200px;font-size:.92rem;line-height:1.45;min-width:0;}
.zo-amt{font-variant-numeric:tabular-nums;}
.zo-st{font-size:.78rem;font-weight:600;color:var(--muted);border:1px solid var(--line-2);border-radius:999px;padding:1px 8px;}
.zo-st-blocked{color:var(--amber);}
.zo-st-rejected,.zo-st-undone{color:var(--muted);}
.zo-row-undo{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px;}
.zo-undo{flex:0 0 auto;}
.zo-undo-l{font-size:.82rem;color:var(--muted);}
.zo-row .zo-status{margin:8px 0 0;}
@media(max-width:520px){
  .zo-head{align-items:flex-start;}
  .zo-undo{flex:1 1 100%;}
}
/* ── Qué puede hacer tu equipo (US-008) ── */
.zo-areas{display:flex;flex-direction:column;gap:12px;}
.zo-area-row{border:1px solid var(--line);border-radius:13px;background:var(--surface-2);padding:14px;}
.zo-area-h{display:flex;align-items:baseline;gap:4px 10px;flex-wrap:wrap;margin-bottom:10px;}
.zo-area-h .zo-gh{margin:0;}
.zo-area-d{font-size:.84rem;color:var(--muted);}
.zo-segs{display:flex;gap:6px;flex-wrap:wrap;}
.zo-seg{flex:1 1 150px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 12px;border-radius:11px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font-family:inherit;font-size:.9rem;font-weight:600;cursor:pointer;}
.zo-seg:hover:not(:disabled){border-color:var(--violet);}
.zo-seg.on{border-color:var(--violet);box-shadow:0 0 0 1px var(--violet) inset;}
.zo-seg:disabled{cursor:not-allowed;opacity:.7;}
.zo-seg:disabled:not(.on){opacity:.45;}
/* El modo elegido no se comunica sólo con color: lleva un radio dibujado. */
.zo-seg-dot{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--line-2);background:var(--surface);flex:0 0 auto;}
.zo-seg.on .zo-seg-dot{border-color:var(--violet);background:radial-gradient(circle,var(--violet) 42%,transparent 48%);}
.zo-mode-d{font-size:.86rem;color:var(--text);margin:10px 0 0;line-height:1.45;}
.zo-forced{color:var(--amber);font-weight:600;}
.zo-stat{font-size:.82rem;color:var(--muted);margin:8px 0 0;line-height:1.45;}
.zo-stat strong{color:var(--text);font-variant-numeric:tabular-nums;}
.zo-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
@media(max-width:520px){ .zo-seg{flex-basis:100%;justify-content:flex-start;} }
/* ── Avisos por WhatsApp (US-009A) ── */
.zo-wa-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.zo-wa-top>div{flex:1 1 240px;min-width:0;}
.zo-switch-l{display:inline-flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;}
.zo-switch-t{font-size:.86rem;font-weight:600;}
.zo-wa-form{display:flex;flex-direction:column;gap:8px;margin-top:12px;}
.zo-in{width:100%;max-width:320px;min-height:44px;padding:0 12px;border-radius:10px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font-family:inherit;font-size:.95rem;}
.zo-wa-form .zo-btn{flex:0 0 auto;align-self:flex-start;}
@media(max-width:520px){ .zo-in{max-width:100%;} .zo-wa-form .zo-btn{align-self:stretch;} }
