/* ═══════════════════════════════════════════════════════
   tst-calendar.css — v7.0
   Alineado al TST Design System v5.0
   ═══════════════════════════════════════════════════════ */

.tst-cal {
  /* Tokens del Design System */
  --navy:       #1E3A5F;
  --brand:      #305180;
  --accent:     #305180;
  --lime:       #E1FA59;
  --lime-dark:  #B8CC30;
  --gold:       #F5B021;
  --live-red:   #E63946;
  --win-green:  #2A9D8F;
  --border:     #E4E3DC;
  --white:      #FFFFFF;
  --off-white:  #F7F6F2;
  --bg:         #F7F6F2;
  --paper:      #EFEFEA;
  --text:       #1A1A1A;
  --muted:      #5C5C5C;
  --dim:        #A8A8A8;
  --rad:        8px;
  --rad-lg:     12px;
  --sh:         0 1px 3px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.04);
  --sh-hov:     0 4px 16px rgba(0,0,0,.10), 0 2px 6px rgba(0,0,0,.05);
  --font:       "DM Sans", "Helvetica Neue", Arial, sans-serif;
  --font-mono:  "DM Mono", "Courier New", monospace;
  --ease:       cubic-bezier(.4, 0, .2, 1);

  font-family: var(--font);
  color: var(--text);
  max-width: 100%;
  -webkit-font-smoothing: antialiased;
}

/* ══ CABECERA ══ */
.tst-cal-head { margin-bottom: 24px; }
.tst-cal-circ {
  font-size: .68rem; font-weight: 800; letter-spacing: .14em;
  text-transform: uppercase; color: var(--dim); margin: 0 0 3px;
}
.tst-cal-title {
  font-size: clamp(1.7rem, 4vw, 2.5rem); font-weight: 900;
  letter-spacing: -.025em; color: var(--navy); margin: 0 0 4px; line-height: 1.05;
}
.tst-cal-sub { font-size: .84rem; color: var(--muted); margin: 0; }

/* ══ BARRA DE FILTROS ══ */
.tst-bar {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 24px; flex-wrap: wrap;
}

/* ══ DROPDOWN ══ */
.tst-dd { position: relative; }
.tst-dd-btn {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: 7px; padding: 9px 14px;
  font-family: var(--font); font-size: .83rem; font-weight: 600; color: var(--text);
  cursor: pointer; white-space: nowrap;
  box-shadow: var(--sh); transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
  line-height: 1; -webkit-tap-highlight-color: transparent;
}
.tst-dd-btn:hover { border-color: #b0b8c8; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
/* Filtro activo usa el azul marino del Design System */
.tst-dd-btn.is-on { background: var(--navy); border-color: var(--navy); color: #fff; }

.tst-dd-arr { transition: transform .2s var(--ease); flex-shrink: 0; }
.tst-dd-btn[aria-expanded="true"] .tst-dd-arr { transform: rotate(180deg); }

.tst-dd-panel {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 300;
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--rad-lg); box-shadow: var(--sh-hov);
  min-width: 230px; padding: 4px;
  animation: tst-pop .14s var(--ease);
}
.tst-dd-opt {
  display: flex; align-items: center; gap: 8px;
  width: 100%; padding: 10px 12px; border: none;
  background: transparent; border-radius: 6px;
  font-family: var(--font); font-size: .83rem; color: var(--text);
  cursor: pointer; text-align: left;
  transition: background .1s var(--ease);
}
.tst-dd-opt:hover { background: var(--off-white); }
.tst-dd-opt.is-sel { font-weight: 700; color: var(--navy); }
.tst-dd-opt-txt { flex: 1; }
.tst-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.tst-chk { flex-shrink: 0; opacity: 0; color: var(--brand); transition: opacity .1s; }
.tst-dd-opt.is-sel .tst-chk { opacity: 1; }

/* Botón limpiar */
.tst-clear-btn {
  background: none; border: none; color: var(--brand);
  font-family: var(--font); font-weight: 700; font-size: .8rem;
  cursor: pointer; padding: 6px 10px; border-radius: 5px;
  transition: background .1s var(--ease); letter-spacing: .02em;
}
.tst-clear-btn:hover { background: var(--off-white); }

/* ══ TOGGLE CHALLENGER / ITF inline ══ */
.tst-minor-toggle-inline {
  display: flex; gap: 6px; align-items: center;
}
.tst-minor-toggle-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 14px; border-radius: 7px;
  border: 1.5px solid var(--border); background: var(--white);
  font-family: var(--font); font-size: .83rem; font-weight: 600; color: var(--text);
  cursor: pointer; white-space: nowrap; box-shadow: var(--sh);
  transition: border-color .15s var(--ease), background .15s var(--ease), color .15s var(--ease);
  line-height: 1; -webkit-tap-highlight-color: transparent;
}
.tst-minor-toggle-btn:hover { border-color: #b0b8c8; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
/* Activo — azul marino igual que los demás filtros */
.tst-minor-toggle-btn--active,
.tst-minor-toggle-btn[aria-pressed="true"] {
  background: var(--navy); border-color: var(--navy); color: #fff;
}
.tst-minor-toggle-btn:disabled { opacity: .5; cursor: not-allowed; }

/* Dot de color: ATP/WTA=azul sólido, Challenger=naranja, ITF=violeta */
.tst-minor-toggle-btn--main::before {
  content: ''; display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; background: var(--navy); flex-shrink: 0;
}
.tst-minor-toggle-btn--main.is-active::before,
.tst-minor-toggle-btn--main[aria-pressed="true"]::before {
  background: rgba(255,255,255,.7);
}
.tst-minor-toggle-btn--chal::before {
  content: ''; display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; background: #C2410C; flex-shrink: 0;
}
.tst-minor-toggle-btn--itf::before {
  content: ''; display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; background: #7C3AED; flex-shrink: 0;
}
.tst-minor-toggle-btn--active::before,
.tst-minor-toggle-btn[aria-pressed="true"]::before { background: rgba(255,255,255,.6); }

/* ══ NOTICE ══ */
.tst-notice {
  padding: 10px 14px; background: var(--off-white);
  border-left: 3px solid var(--brand); border-radius: 6px;
  font-family: var(--font); font-size: .83rem; color: var(--navy); margin-bottom: 14px;
}
.tst-notice[data-type="error"]  { background: #FFF1F0; border-color: var(--live-red); color: #b71c1c; }
.tst-notice[data-type="empty"]  { background: var(--paper); border-color: var(--dim); color: var(--muted); }

/* ══ TIMELINE ══ */
.tst-timeline { display: flex; flex-direction: column; gap: 32px; }

/* ══ MES ══ */
.tst-month-hd { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.tst-month-name {
  font-family: var(--font); font-size: .72rem; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase; color: var(--dim); margin: 0;
}
.tst-month-count {
  font-family: var(--font-mono); font-size: .69rem; color: var(--dim);
  background: var(--paper); padding: 2px 8px; border-radius: 99px;
}

/* ══ LISTA ══ */
.tst-list {
  border: 1px solid var(--border); border-radius: var(--rad);
  overflow: hidden; background: var(--white); box-shadow: var(--sh);
}

/* ══ FILA DE TORNEO ══ */
.tst-row {
  display: flex; align-items: center;
  background: var(--white);
  text-decoration: none !important; color: inherit !important;
  border-bottom: 1px solid var(--border);
  min-height: 72px; position: relative; overflow: hidden;
  transition: background .14s var(--ease);
}
.tst-row:last-child { border-bottom: none; }
a.tst-row { cursor: pointer; }
a.tst-row:hover { background: var(--off-white); }
a.tst-row:hover .tst-arrow { transform: translateX(4px); color: var(--lime-dark); }

/* Barra de nivel — colores del Design System */
.tst-row-bar { width: 4px; align-self: stretch; flex-shrink: 0; }
.tst-row-bar--gs   { background: #1565c0; }
.tst-row-bar--ms   { background: #1b5e20; }
.tst-row-bar--500  { background: #6a1b9a; }
.tst-row-bar--spec { background: #e65100; }
.tst-row-bar--250,
.tst-row-bar--chal,
.tst-row-bar--itf  { background: var(--dim); }

/* Logo */
.tst-row-logo {
  flex-shrink: 0; width: 66px; height: 72px;
  display: flex; align-items: center; justify-content: center; padding: 0 6px;
}
.tst-row-logo img {
  width: 44px; height: 44px; object-fit: contain;
  border-radius: 6px; display: block;
}
/* Fallback logo — gradient azul + lime del Design System */
.tst-row-logo-fb {
  width: 44px; height: 44px;
  background: linear-gradient(135deg, var(--brand) 0%, var(--navy) 100%);
  border-radius: 6px; display: flex; align-items: center; justify-content: center;
  font-family: var(--font); font-size: 13px; font-weight: 900; color: var(--lime);
}

/* Cuerpo */
.tst-row-body { flex: 1; min-width: 0; padding: 12px 8px 12px 4px; }
.tst-row-top  { display: flex; align-items: center; gap: 8px; margin-bottom: 3px; }
.tst-row-name {
  font-family: var(--font); font-size: .97rem; font-weight: 700;
  color: var(--navy); line-height: 1.2;
}

/* EN VIVO — rojo del Design System */
.tst-live {
  flex-shrink: 0; font-family: var(--font);
  font-size: .58rem; font-weight: 800; letter-spacing: .1em;
  background: var(--live-red); color: #fff;
  padding: 2px 6px; border-radius: 3px;
  animation: tst-blink 1.4s var(--ease) infinite;
}

/* Meta */
.tst-row-meta {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 0 5px; font-family: var(--font); font-size: .75rem; color: var(--muted); line-height: 1.5;
}
.tst-meta-sep   { color: var(--dim); font-size: .7rem; }
.tst-meta-city  { display: inline-flex; align-items: center; gap: 3px; }
.tst-meta-city svg { opacity: .5; flex-shrink: 0; }
.tst-meta-dates { font-weight: 700; color: var(--text); }

/* Superficie — colores del Design System */
.tst-meta-surf { font-family: var(--font); font-weight: 700; font-size: .73rem; }
.tst-surf-hard   { color: #2563EB; }
.tst-surf-clay   { color: #C4632A; }
.tst-surf-grass  { color: #3A7D44; }
.tst-surf-indoor { color: #6B7280; }

/* Campeón */
.tst-row-champ {
  display: inline-flex; align-items: center; gap: 4px; margin-top: 4px;
  font-family: var(--font); font-size: .74rem; font-weight: 600; color: #92680a;
}

/* Lado derecho */
.tst-row-side {
  flex-shrink: 0; padding: 0 14px 0 8px;
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
}

/* Badge de nivel — colores del Design System */
.tst-lvl {
  font-family: var(--font); font-size: .59rem; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; padding: 2px 7px; border-radius: 3px; white-space: nowrap;
}
.tst-lvl--gs   { background: #dbeafe; color: #1e40af; }
.tst-lvl--ms   { background: #dcfce7; color: #14532d; }
.tst-lvl--500  { background: #f3e8ff; color: #5b21b6; }
.tst-lvl--spec { background: #ffedd5; color: #9a3412; }
.tst-lvl--250,
.tst-lvl--chal,
.tst-lvl--itf  { background: var(--paper); color: var(--muted); }

/* Flecha — lime del Design System */
.tst-arrow {
  color: var(--lime-dark);
  transition: transform .18s var(--ease), color .18s var(--ease);
  flex-shrink: 0;
}

/* ══ CONTENEDOR LAZY (Challenger/ITF) ══ */
.tst-minor-lazy-container {
  margin-top: 20px; padding-top: 16px;
  border-top: 2px dashed var(--border);
}
.tst-minor-lazy-container[hidden] { display: none; }

/* Label de grupo dentro del contenedor lazy */
.tst-minor-group__label {
  padding: 8px 16px 6px;
  font-family: var(--font); font-size: .7rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: .08em; color: var(--dim);
  background: var(--paper); border-bottom: 1px solid var(--border);
}

/* ══ EMPTY ══ */
.tst-empty {
  padding: 40px 20px; text-align: center; color: var(--muted);
  background: var(--white); border: 1px solid var(--border);
  border-radius: var(--rad); font-family: var(--font); font-size: .9rem;
}
.tst-empty-filter { font-style: italic; }

/* ══ ANIMACIONES ══ */
@keyframes tst-pop   { from{opacity:0;transform:translateY(-5px) scale(.98)} to{opacity:1;transform:none} }
@keyframes tst-blink { 0%,100%{opacity:1} 50%{opacity:.5} }

/* ══ MOBILE ══ */
@media (max-width: 520px) {
  .tst-bar { gap: 6px; }
  .tst-minor-toggle-inline { width: 100%; }
  .tst-minor-toggle-btn { flex: 1; justify-content: center; }
  .tst-row-logo { width: 52px; }
  .tst-row-logo img, .tst-row-logo-fb { width: 36px; height: 36px; }
  .tst-row-name { font-size: .88rem; }
  .tst-row-meta { font-size: .7rem; }
  .tst-row-side { padding: 0 8px; }
  .tst-lvl { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .tst-row, .tst-dd-btn, .tst-arrow { transition: none; }
  .tst-live { animation: none; }
}

/* ══ SECCIÓN FINALIZADOS — divisor simple, sin JS ═════════════ */
.tst-section-divider {
  display: flex; align-items: center; gap: 10px;
  margin: 28px 0 16px;
}
.tst-section-divider__label {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .75rem; font-weight: 700; color: var(--dim);
  letter-spacing: .07em; text-transform: uppercase;
  white-space: nowrap; flex-shrink: 0;
}
.tst-section-divider__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--dim); flex-shrink: 0;
}
.tst-section-divider__count {
  background: var(--paper); color: var(--dim);
  font-size: .68rem; font-weight: 700;
  padding: 1px 6px; border-radius: 20px;
  border: 1px solid var(--border);
}
.tst-section-divider__line {
  flex: 1; height: 1px; background: var(--border);
}

/* Torneos finalizados — opacidad reducida */
/* Torneos finalizados — opacidad reducida */
.tst-month--finished .tst-row,
[data-status="finished"] .tst-row {
  opacity: .65;
}
.tst-month--finished .tst-row:hover,
[data-status="finished"] .tst-row:hover {
  opacity: 1;
}
.tst-month--finished .tst-row-name,
[data-status="finished"] .tst-row-name {
  color: var(--muted);
}