/* ==========================================================================
   Norte . estilos de Entreno (v2)
   El calendario es un instrumento, no una parrilla: fondo neutro, número grande
   en Inter Tight, barra de estado en el canto izquierdo, escala de diez pasos
   para la valoración y aguja de fatiga en el canto derecho. Hoy lleva anillo
   naranja. El descanso lleva textura de puntos. Solo tokens de norte.css.
   ========================================================================== */

.entreno{display:flex;flex-direction:column;gap:14px}

/* ---------- cabecera: mes en grande y racha ---------- */
.ehead{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.etitle{display:flex;align-items:baseline;gap:9px;min-width:0}
.etitle-m{font-family:var(--fd);font-weight:800;font-size:clamp(26px,5vw,34px);letter-spacing:-.045em;line-height:1;text-transform:capitalize}
.etitle-y{font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--tx3)}
.estreak{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--tx3);margin:0;min-width:0}
.estreak svg{width:16px;height:16px;flex:none;color:var(--tx4)}
.estreak.on svg{color:var(--or)}
.estreak b{color:var(--tx);font-weight:600}
.estreak span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}

/* ---------- filtros: una sola línea de desplegables ---------- */
.efilters{display:flex;align-items:center;gap:7px;flex-wrap:wrap;min-width:0}
.efilters .nsel{min-width:0;flex:0 1 auto}
.efilters .nsel-btn{max-width:100%}
.efilters .nsel.is-empty{opacity:.5;pointer-events:none}
.eclear{min-height:34px}
.eclear svg{width:13px;height:13px}
.ecount{font-size:12.5px;color:var(--tx2);white-space:nowrap;font-variant-numeric:tabular-nums;margin-left:auto}
.ecount:empty{display:none}
.eflabel{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);white-space:nowrap}
@media (max-width:420px){
  .efilters{gap:6px}
  .efilters .nsel-btn{padding:4px 7px 4px 9px;font-size:12px;gap:5px}
  .efilters .nsel-val{max-width:22vw}
  .efilters .erating .nsel-val{max-width:16vw}
}

/* vista calendario o lista, en la cabecera de la aplicación */
.eview{padding:3px}
.seg .eview-btn{display:inline-flex;align-items:center;gap:7px;padding:0 12px;min-height:34px;min-width:40px;border-radius:100px;font-size:12.5px;font-weight:600;color:var(--tx3);transition:background .18s,color .18s}
.eview-btn svg{width:16px;height:16px}
.eview-btn.on{background:var(--card3);color:var(--tx)}
.eview-btn:hover:not(.on){color:var(--tx2)}
@media (max-width:899px){.eview-btn span{display:none}.seg .eview-btn{padding:0 12px}}

/* ---------- calendario ---------- */
.ecal-wrap{display:flex;flex-direction:column;gap:12px}
.ecal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.ecal-wd{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tx3);text-align:center;padding:2px 0 6px}
.ecal-wd.rest{color:var(--tx4)}
.ecal-wd .wd-3{display:none}

.ecell{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  aspect-ratio:1;min-height:46px;padding:6px 7px 6px 11px;border-radius:11px;
  border:1px solid transparent;background:rgba(255,255,255,.028);
  color:var(--tx);text-align:left;font-family:var(--f);overflow:hidden;
  transition:transform .2s var(--ease),background .2s,opacity .22s,border-color .2s;
}
.ecell.blank{visibility:hidden;pointer-events:none}
/* la barra del canto izquierdo es el estado */
.ecell-bar{position:absolute;left:4px;top:7px;bottom:7px;width:3px;border-radius:3px;background:transparent}
.ecell.st-trained .ecell-bar{background:var(--good)}
.ecell.st-bonus .ecell-bar{background:var(--or)}
.ecell.st-missed .ecell-bar{background:var(--bad)}
.ecell.st-rest .ecell-bar{background:var(--line2)}
.ecell.st-none .ecell-bar{background:repeating-linear-gradient(to bottom,var(--line2) 0 3px,transparent 3px 6px)}
.ecell.st-trained{background:rgba(79,183,122,.07)}
.ecell.st-bonus{background:var(--or-soft)}
.ecell.st-missed{background:rgba(224,90,90,.045)}
/* el descanso lleva textura de puntos, no color */
.ecell.st-rest{background-color:transparent;background-image:radial-gradient(rgba(255,255,255,.13) 1px,transparent 1px);background-size:7px 7px;background-position:2px 2px;color:var(--tx3)}
.ecell.st-none{background:transparent;border:1px dashed var(--line);color:var(--tx3)}
.ecell.st-future{background:transparent;color:var(--tx4);cursor:default;opacity:.45}
.ecell.st-future .ecell-bar{background:transparent}
/* hoy: anillo naranja */
.ecell.today{box-shadow:0 0 0 1.5px var(--or),0 0 0 5px var(--or-soft)}
.ecell.today .ecell-n{color:var(--or)}
.ecell.dim{opacity:.2}

.ecell-top{display:flex;align-items:baseline;justify-content:space-between;gap:4px;width:100%;min-width:0}
.ecell-n{font-size:16px;font-weight:800;line-height:1;letter-spacing:-.04em}
.ecal:not(.mini) .ecell-n{font-size:17px}
.ecell-tag{display:none;font-size:8px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--or);white-space:nowrap;line-height:1}
.ecell-glyph{font-size:15px;line-height:1;letter-spacing:-2px;margin-top:auto;font-family:var(--f)}
.ecell-glyph.dot{width:6px;height:6px;border-radius:100px;margin-top:auto;margin-bottom:2px}
.ecell-glyph.dot.bad{background:var(--bad)}
.ecell-glyph.dot.none{background:var(--tx4)}
.ecell-detail,.ecell-fat{display:none}
.ebare{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.elink{font-weight:700;text-decoration:underline;text-underline-offset:2px;cursor:pointer;color:var(--or);border-radius:4px}
.ecell:active:not([disabled]){transform:scale(.95);transition-duration:.08s}
@media (hover:hover){
  .ecell:not([disabled]):not(.blank):hover{background:rgba(255,255,255,.08);border-color:var(--line2)}
  .ecell.dim:hover{opacity:.55}
}

/* escala de diez pasos: la valoración como instrumento */
.escale{display:inline-flex;align-items:flex-end;gap:2px;height:11px}
.escale i{width:2px;height:5px;border-radius:2px;background:var(--line2);transition:height .2s var(--ease),background .2s}
.escale i.on{height:11px;background:currentColor}
.escale i:nth-child(5n).on{height:11px}

/* celda mediana: escala y duración dentro */
@media (min-width:560px){
  .ecal:not(.mini) .ecell{padding:8px 9px 8px 13px;border-radius:var(--r)}
  .ecal:not(.mini) .ecell-glyph{font-size:16px}
  .ecal:not(.mini) .ecell-tag{display:inline}
  .ecal:not(.mini) .ecell-detail{display:flex;flex-direction:column;gap:5px;width:100%;margin-top:auto;min-width:0}
  .ecal:not(.mini) .ecell-types{display:none}
  .ecal:not(.mini) .ecell-read{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
  .ecal:not(.mini) .ecell-min{font-size:10.5px;font-weight:600;color:var(--tx3)}
  .ecal:not(.mini) .ecell-bare{font-size:10.5px}
  .ecal:not(.mini) .ecell-note{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
  .ecal:not(.mini) .ecell-note.missed{color:var(--bad);opacity:.75}
  .ecal:not(.mini) .ecell-note.rest{color:var(--tx4)}
  .ecal:not(.mini) .ecell-bare .elink{display:none}
}

/* celda grande de escritorio: tipos, escala, duración y aguja de fatiga */
@media (min-width:900px){
  .ecal:not(.mini){gap:7px}
  .ecal:not(.mini) .ecell{aspect-ratio:auto;min-height:112px;padding:10px 14px 10px 15px;border-radius:var(--r)}
  .ecal:not(.mini) .ecell-n{font-size:22px}
  .ecal:not(.mini) .ecell-tag{font-size:8.5px}
  .ecal:not(.mini) .ecell-glyph{display:none}
  .ecal:not(.mini) .ecell-types{display:flex;flex-wrap:wrap;gap:4px}
  .ecal:not(.mini) .ecell-types .chip{padding:2px 8px;min-height:21px;font-size:11px;font-weight:600;background:rgba(255,255,255,.04);border-color:var(--line);color:var(--tx2);line-height:1.2;white-space:normal}
  .ecal:not(.mini) .ecell-bare{display:flex;flex-direction:column;align-items:flex-start;gap:2px;font-size:11.5px}
  .ecal:not(.mini) .ecell-bare .elink{display:inline}
  .ecal:not(.mini) .ecell-min{font-size:11.5px}
  .ecal:not(.mini) .ecell-note{font-size:10.5px}
  .ecal:not(.mini) .ecell-fat{display:block;position:absolute;right:7px;top:12px;bottom:12px;width:2px;border-radius:2px;background:rgba(255,255,255,.05);overflow:hidden}
  .ecal:not(.mini) .ecell-fat i{position:absolute;left:0;right:0;bottom:0;border-radius:2px;opacity:.55;transition:height .4s var(--ease)}
  .ecal:not(.mini) .ecell{padding-right:16px}
  .ecal-wd .wd-1{display:none}
  .ecal-wd .wd-3{display:inline}
}

/* leyenda del mes */
.elegend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:11.5px;color:var(--tx3)}
.eleg-item{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.eleg-item b{font-weight:700;color:var(--tx2);font-variant-numeric:tabular-nums}
.eleg-item.zero{opacity:.45}
.elegend .sw{width:3px;height:13px;border-radius:3px;display:inline-block;flex:none}
.elegend .sw.trained{background:var(--good)}
.elegend .sw.bonus{background:var(--or)}
.elegend .sw.missed{background:var(--bad)}
.elegend .sw.rest{background:var(--line2)}
.elegend .sw.none{background:repeating-linear-gradient(to bottom,var(--line2) 0 3px,transparent 3px 6px)}

/* todos los meses: rejilla de calendarios compactos */
.ecal-all{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
@media (max-width:420px){.ecal-all{grid-template-columns:1fr}}
.ecal-month{display:flex;flex-direction:column;gap:10px;padding:14px}
.ecal-month h3{margin:0;text-transform:capitalize}
.ecal.mini{gap:4px}
.ecal.mini .ecell{min-height:34px;padding:4px 4px 4px 9px;border-radius:9px}
.ecal.mini .ecell-bar{left:3px;top:5px;bottom:5px;width:2.5px}
.ecal.mini .ecell-n{font-size:12px}
.ecal.mini .ecell-tag{display:none}
.ecal.mini .ecell-glyph{font-size:11px}

/* ---------- resumen en el ticker ---------- */
.esum-sec{margin-top:24px}
.esum-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.esum-head .kick{text-transform:uppercase}
.esum-n{font-size:12.5px;color:var(--tx3);font-variant-numeric:tabular-nums}
.esum .tick{gap:3px}
.esum .tick .num{font-size:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.esum .tick .num.small{font-size:14px;color:var(--tx3);font-family:var(--f);font-weight:600;letter-spacing:0}
.esum .tick .num.etop-num{font-size:16px;letter-spacing:-.03em}
.esum .tick-d{display:flex;align-items:baseline;gap:6px;min-height:16px;flex-wrap:wrap}
.esum .tick-d em{font-style:normal;font-size:11px;color:var(--tx4)}
.esum .tick-sub{font-style:normal;font-size:11.5px;color:var(--tx3);line-height:1.3}
.esum .delta .arw{font-size:9px;line-height:1}
.esum .delta:empty{display:none}
.etop{display:inline-flex;align-items:center;gap:7px;min-width:0}
.etop .emo{font-size:19px;line-height:1;font-family:var(--f)}
.esum .spark{width:100%;height:22px;margin-top:5px;overflow:visible}
@media (min-width:1100px){.esum .tick .num{font-size:22px}}

/* ---------- lista ---------- */
.elist{display:flex;flex-direction:column;gap:12px}
.esort{display:flex;align-items:center;gap:9px}
.etable{min-width:660px}
.etable .ta-r{text-align:right}
.etable td{white-space:nowrap}
.edate{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px;border-radius:var(--r-sm);transition:background .18s}
.edate b{font-weight:600}
.edate:hover{background:rgba(255,255,255,.05)}
.etypes{display:inline-flex;gap:4px;flex-wrap:wrap}
.chip .emo{font-size:14px;line-height:1;font-family:var(--f)}
.erate{display:inline-flex;align-items:center;gap:10px}
.erate .num{font-size:21px}
.efbar{display:inline-flex;align-items:center;gap:8px;min-width:150px}
.efbar .track{flex:1;height:5px;border-radius:100px;background:rgba(255,255,255,.08);overflow:hidden;min-width:80px}
.efbar .track i{display:block;height:100%;border-radius:100px;transition:width .4s var(--ease)}
.efbar b{font-weight:600;font-size:12.5px;min-width:34px;text-align:right}
.etable .btn-sm{min-height:44px}
@media (min-width:900px){.etable .btn-sm{min-height:34px}}

/* lista en móvil: tarjetas sin borde, con el canto de estado */
.ecards{display:flex;flex-direction:column;gap:8px}
.ecard{position:relative;display:flex;flex-direction:column;gap:9px;width:100%;text-align:left;color:var(--tx);font-family:var(--f);padding:12px 14px 12px 17px;transition:background .2s,transform .15s var(--ease)}
.ecard:active{transform:scale(.99)}
.ecard-bar{position:absolute;left:6px;top:12px;bottom:12px;width:3px;border-radius:3px;background:var(--good)}
.ecard-bar.st-bonus{background:var(--or)}
.ecard-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ecard-date{font-weight:600;font-size:14px}
.ecard-min{display:inline-flex;align-items:center;gap:5px;margin-left:auto;font-size:12.5px;color:var(--tx2);font-weight:500}
.ecard-min svg{width:13px;height:13px;color:var(--tx3)}
.ecard-rate .erate .num{font-size:19px}
.ecard .ebare{font-size:13px}

/* ---------- hoja de detalle de un día ---------- */
.eday{display:flex;flex-direction:column;gap:16px}
.eday p{font-size:14px}
.eday .state.bonus{background:var(--or-soft);color:var(--or)}
.eday-stats{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}
.eday-stats.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.eday-stat{display:flex;flex-direction:column;gap:8px;min-width:0;padding:13px 14px}
.eday-stat .kick{font-size:9.5px;letter-spacing:.12em}
.eday-stat .num{font-size:22px;line-height:1}
.eday-stat .num small{font-size:11px;font-weight:600;color:var(--tx3);letter-spacing:0;font-family:var(--f)}
.eday-stat .escale{margin-top:auto}
.eday-rbar{margin-top:auto;padding-top:6px}
.eday-people{display:flex;flex-direction:column;gap:8px}
.eday-actions{padding-top:4px}
.eday-actions .btn{flex:1}
@media (max-width:420px){
  .eday-stats{grid-template-columns:1fr 1fr}
  .eday-stats:not(.two) .eday-stat:last-child{grid-column:1 / -1}
}

@media (prefers-reduced-motion:reduce){
  .ecell,.ecell:hover,.ecell:active,.ecard:active{transform:none!important;transition:none!important}
}