/* Clases (clases.js): agenda de la semana y reservas. Solo tokens de css/base.css.
   Los números usan .pg-stats y los títulos .pg-h2 (progreso.css). */
.cl-area{max-width:880px}
.cl-section{margin-top:6px}
.cl-list{display:grid;gap:10px}

.cl-week{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.cl-week b{font:800 20px/1.1 var(--heading);text-transform:uppercase;text-align:center}
.cl-nav{min-width:44px;padding:8px 14px;font-size:18px;line-height:1}

.cl-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.cl-filter{flex:1 1 180px;margin:0}

.cl-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:14px}
.cl-day{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 2px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--text)}
.cl-day small{color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.cl-day b{font:800 22px/1 var(--heading)}
.cl-day:hover{border-color:var(--line-strong)}
.cl-day.is-empty b{color:var(--muted);font-weight:600}
.cl-day.is-on{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.cl-day.is-on small,.cl-day.is-on.is-empty b{color:var(--brand-ink)}
.cl-day.has-res::after{content:"";position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--brand)}
.cl-day.is-on.has-res::after{background:var(--brand-ink)}

.cl-class{display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--line);border-left:3px solid var(--cl-color,var(--line-strong));border-radius:var(--radius);background:var(--surface)}
.cl-class.is-dim{opacity:.62}
.cl-time b{display:block;font:800 22px/1 var(--heading)}
.cl-time span{display:block;margin-top:3px;color:var(--muted);font-size:11px}
.cl-name{margin:0;font:800 20px/1.1 var(--heading);text-transform:uppercase;overflow-wrap:anywhere}
.cl-meta,.cl-spots{margin:3px 0 0;color:var(--muted);font-size:12px}
.cl-action{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}
.cl-btn{min-height:38px;padding:8px 14px}
.cl-tag{display:inline-block;padding:4px 9px;border:1px solid var(--line);border-radius:999px;color:var(--text-soft);font-size:11px;font-weight:700;white-space:nowrap}
.cl-tag.is-ok{border-color:var(--brand-line);background:var(--brand-soft);color:var(--brand)}
.cl-tag.is-off{color:var(--danger-text)}
.cl-repeat{display:inline-flex;align-items:center;gap:6px;color:var(--text-soft);font-size:11px;cursor:pointer}
.cl-repeat input{accent-color:var(--brand)}

@media(max-width:650px){
  .cl-class{grid-template-columns:52px minmax(0,1fr);padding:12px 14px;gap:10px 12px}
  .cl-action{grid-column:1 / -1;justify-content:flex-start}
  .cl-btn{flex:1}
  .cl-week b{font-size:18px}
  .cl-day{padding:8px 0}
  .cl-day b{font-size:19px}
}