/* ============================================================
   Event pages — MyPadel.rocks theme
   Formato compacto tipo Padel America sobre los tokens rock.
   Requiere rock.css cargado antes.
   ============================================================ */

/* ---- Hero banner (imagen ancha {Key}-banner) ---- */
.ev-hero {
  width: 100%; height: clamp(150px, 26vw, 320px);
  background-size: cover; background-position: center;
  border-bottom: 2px solid var(--ink);
}

/* ---- Banda de título (fondo tinta) ---- */
.ev-band { background: var(--ink); color: var(--paper); display: flex; justify-content: center; padding: 28px 16px; }
.ev-band__inner {
  width: 100%; max-width: var(--container-max);
  display: flex; gap: 24px; align-items: center; flex-wrap: wrap;
}
.ev-band__thumb {
  width: clamp(110px, 18vw, 170px); flex: none; border: 2px solid var(--paper);
  border-radius: var(--radius-md); box-shadow: 4px 4px 0 rgba(255, 255, 255, 0.25);
  display: block;
}
.ev-band__info { flex: 1; min-width: 260px; display: flex; flex-direction: column; gap: 10px; }
.ev-band__title {
  margin: 0; font-family: var(--font-display); font-weight: 400;
  font-size: clamp(28px, 5.5vw, 48px); line-height: 1.05;
  text-transform: uppercase; letter-spacing: 0.01em; transform: var(--display-skew);
}
.ev-band__meta { display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--gray-3); }
.ev-band__meta span { display: inline-flex; align-items: center; gap: 8px; }
.ev-band__meta svg { flex: none; color: var(--accent); }
.ev-band__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; }

/* Botón video (rojo YouTube dentro del sistema sticker) */
.btn--video { background: #FF0033; color: #fff; }
.btn--video:hover { color: #fff; }

/* ---- Tabs ---- */
.ev-tabs { background: var(--paper); border-bottom: 2px solid var(--ink); display: flex; justify-content: center; }
.ev-tabs__inner {
  width: 100%; max-width: var(--container-max); padding: 12px 16px;
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
}
.ev-tab {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 16px;
  font-family: var(--font-body); font-weight: 700; font-size: 13px; text-decoration: none;
  color: var(--ink); background: var(--paper);
  border: 2px solid var(--ink); border-radius: var(--radius-pill);
  transition: all var(--speed-fast) var(--ease-out);
}
.ev-tab:hover { color: var(--ink); background: var(--gray-1); }
.ev-tab--active { background: var(--ink); color: var(--paper); }
.ev-tab--active:hover { background: var(--ink); color: var(--paper); }
.ev-tabs__video { margin-left: auto; }

/* ---- Contenido ---- */
.ev-main { display: flex; justify-content: center; padding: 32px 16px 64px; }
.ev-main__inner { width: 100%; max-width: var(--container-max); display: flex; flex-direction: column; gap: 28px; }

.ev-grid { display: grid; gap: 28px; grid-template-columns: 1fr; padding: 4px; align-items: start; }
@media (min-width: 900px) { .ev-grid { grid-template-columns: 1fr 1fr; } }

.ev-card {
  background: var(--paper); border: 2px solid var(--ink); border-radius: var(--radius-md);
  box-shadow: var(--shadow-sticker); overflow: hidden;
}
.ev-card__head {
  background: var(--ink); color: var(--paper); padding: 12px 18px;
  font-family: var(--font-display); font-weight: 400; font-size: 18px;
  text-transform: uppercase; letter-spacing: 0.04em;
}
.ev-card__body { padding: 18px 20px; }

/* Contenido rico (Model.Description) */
.ev-prose { font-size: 15px; line-height: 1.55; color: var(--gray-6); }
.ev-prose p { margin: 0 0 8px; }
.ev-prose strong, .ev-prose b { color: var(--ink); }
.ev-prose ul { margin: 0 0 14px; padding-left: 22px; }
.ev-prose li { margin-bottom: 4px; }
.ev-prose a { color: var(--accent-dim); font-weight: 700; }

/* Lista de info estructurada (fallback sin Description) */
.ev-info { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.ev-info li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; line-height: 1.45; }
.ev-info svg { flex: none; margin-top: 2px; color: var(--accent); }
.ev-info strong { display: block; font-size: 12px; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--gray-5); }

/* Categorías */
.ev-cats { display: flex; flex-direction: column; gap: 16px; }
.ev-cats__group-title {
  margin: 0; font-size: 12px; font-weight: 700; letter-spacing: var(--tracking-caps);
  text-transform: uppercase; color: var(--gray-5);
}
.ev-cats ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ev-cats li {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 0; border-bottom: 1px solid var(--border-soft); font-size: 14px; font-weight: 600;
}
.ev-cats li:last-child { border-bottom: 0; }
.ev-cats__price { font-weight: 800; white-space: nowrap; }
.ev-cats__link { font-size: 13px; font-weight: 700; white-space: nowrap; }

/* ---- Inscritos ---- */
.ev-filter { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.ev-filter input[type="text"], .ev-filter select {
  height: 44px; padding: 0 14px; font-family: var(--font-body); font-size: 15px;
  color: var(--ink); background: var(--paper); border: 2px solid var(--ink); border-radius: var(--radius-md);
}
.ev-filter input[type="text"] { flex: 1; min-width: 220px; }
.ev-filter select { min-width: 200px; appearance: none; -webkit-appearance: none; cursor: pointer; }
.ev-filter input:focus-visible, .ev-filter select:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.ev-filter__count { font-size: 13px; font-weight: 700; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--gray-5); margin-left: auto; }

.ev-teams { display: flex; flex-direction: column; gap: 14px; padding: 4px; }
.ev-team {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: var(--paper); border: 2px solid var(--ink); border-radius: var(--radius-md);
  box-shadow: var(--shadow-sticker-sm); padding: 14px 16px; text-decoration: none; color: var(--ink);
  transition: all var(--speed-fast) var(--ease-out);
}
a.ev-team:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--ink); color: var(--ink); }
.ev-team--inactive { background: var(--gray-1); opacity: 0.75; }
.ev-team[hidden] { display: none; }
.ev-team__avatar {
  width: 46px; height: 46px; flex: none; border: 2px solid var(--ink); border-radius: 50%;
  background: var(--gray-1); display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: 18px; text-transform: uppercase;
}
.ev-team__who { flex: 1; min-width: 180px; display: flex; flex-direction: column; }
.ev-team__name { font-weight: 800; font-size: 15px; }
.ev-team__sede { font-size: 12px; color: var(--gray-5); }
.ev-team__cat {
  font-size: 11px; font-weight: 700; letter-spacing: var(--tracking-caps); text-transform: uppercase;
  padding: 4px 10px; border: 2px solid var(--ink); border-radius: var(--radius-sm); background: var(--paper);
}

/* ---- Fotos ---- */
.ev-gallery {
  list-style: none; margin: 0; padding: 4px;
  display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
}
.ev-gallery li {
  border: 2px solid var(--ink); border-radius: var(--radius-md); box-shadow: var(--shadow-sticker-sm);
  overflow: hidden; background: var(--gray-1);
}
.ev-gallery img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--speed-base) var(--ease-out); }
.ev-gallery li:hover img { transform: scale(1.06); }

/* ---- Vacíos ---- */
.ev-empty[hidden] { display: none !important; }
.ev-empty {
  border: 2px dashed var(--gray-3); border-radius: var(--radius-md); padding: 40px 20px;
  display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center;
}
.ev-empty__title { margin: 0; font-family: var(--font-display); font-size: 20px; text-transform: uppercase; }
.ev-empty__sub { margin: 0; font-size: 14px; color: var(--gray-5); }

/* ---- Draws / brackets (formato Padel America) ---- */
.dw-list { display: flex; flex-direction: column; gap: 12px; }
.dw-scroll { overflow-x: auto; }
.dw-bracket { display: flex; gap: 24px; align-items: stretch; min-width: max-content; padding: 4px; }
.dw-ronda { display: flex; flex-direction: column; min-width: 260px; }
.dw-ronda__title {
  font-size: 12px; font-weight: 700; letter-spacing: var(--tracking-caps);
  text-transform: uppercase; color: var(--gray-5); text-align: center; margin-bottom: 12px;
}
.dw-ronda__matches { display: flex; flex-direction: column; gap: 14px; justify-content: space-around; flex: 1; }
.dw-partido {
  background: var(--paper); border: 2px solid var(--ink); border-radius: var(--radius-md);
  box-shadow: var(--shadow-sticker-sm); overflow: hidden;
}
.dw-partido__meta {
  display: flex; gap: 12px; padding: 4px 12px; background: var(--gray-1);
  border-bottom: 1px solid var(--border-soft);
  font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--gray-5);
}
.dw-partido__teams { display: flex; flex-direction: column; }
.dw-equipo {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 12px; font-size: 14px;
}
.dw-equipo + .dw-equipo { border-top: 1px solid var(--border-soft); }
.dw-equipo__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dw-equipo__bandera { height: 14px; border-radius: 2px; vertical-align: -2px; margin-right: 6px; }
.dw-equipo__grupo { font-size: 10px; padding: 1px 6px; margin-right: 6px; vertical-align: 1px; }
/* Distintivo de grupo/federación junto al nombre de la pareja */
.grupo-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; padding: 1px 7px; margin-right: 6px; vertical-align: 1px; white-space: nowrap; }
.grupo-badge img { height: 13px; border-radius: 2px; display: block; }
.dw-equipo__sets { display: inline-flex; gap: 8px; font-variant-numeric: tabular-nums; }
.dw-equipo--win { font-weight: 800; }
.dw-equipo--win .dw-equipo__sets b { color: var(--accent); }
.dw-equipo--lost { color: var(--gray-4); }
.dw-campeon { margin: 0 0 14px; display: flex; align-items: center; gap: 10px; font-size: 15px; }
.dw-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.dw-table th {
  text-align: left; font-size: 11px; letter-spacing: var(--tracking-caps); text-transform: uppercase;
  color: var(--gray-5); border-bottom: 2px solid var(--ink); padding: 6px 8px;
}
.dw-table td { padding: 8px; border-bottom: 1px solid var(--border-soft); }
.dw-table tr:last-child td { border-bottom: 0; }
.dw-table__name { font-weight: 700; }

/* ---- Admin: toggle activo/inactivo ---- */
.toggle {
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  background: none; border: 0; padding: 0; font-family: var(--font-body);
}
.toggle__knob {
  width: 42px; height: 24px; flex: none; position: relative;
  background: var(--paper); border: 2px solid var(--ink); border-radius: var(--radius-pill);
  transition: background var(--speed-base) var(--ease-out);
}
.toggle__knob::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px;
  border-radius: 50%; background: var(--ink);
  transition: left var(--speed-base) var(--ease-out), background var(--speed-base) var(--ease-out);
}
.toggle--on .toggle__knob { background: var(--ink); }
.toggle--on .toggle__knob::after { left: 20px; background: var(--paper); }
.toggle__label { font-size: 12px; font-weight: 700; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--gray-6); }

/* ---- Admin: alertas flash ---- */
.alert-rock {
  border: 2px solid var(--ink); border-radius: var(--radius-md); box-shadow: var(--shadow-sticker-sm);
  padding: 12px 16px; font-size: 14px; font-weight: 600; margin-bottom: 4px;
}
.alert-rock--ok { background: #eafaf0; }
.alert-rock--err { background: #fff2f2; color: var(--danger); border-color: var(--danger); }

/* ---- Admin: formularios ---- */
.adm-form { display: flex; flex-direction: column; gap: 14px; }
.adm-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.adm-field { display: flex; flex-direction: column; gap: 6px; }
.adm-field > label { font-size: 12px; font-weight: 700; letter-spacing: var(--tracking-caps); text-transform: uppercase; color: var(--gray-6); }
/* Buscador de tablas y botones sin cambios (admin-ux.js) */
.ev-card__head--con-buscador { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.tabla-buscador {
  min-height: 30px; padding: 3px 12px; max-width: 220px; flex: 0 1 220px;
  font: inherit; font-size: 12px; font-weight: 600; text-transform: none; letter-spacing: normal;
  border: 2px solid currentColor; border-radius: 999px; background: transparent; color: inherit;
}
.tabla-buscador::placeholder { color: inherit; opacity: .55; }
.btn--sin-cambios { opacity: .45; cursor: not-allowed; }

/* Mensaje inline del guardado AJAX en la tabla de partidos */
.pm-msg { font-size: 11px; font-weight: 700; line-height: 1.3; max-width: 150px; }
.pm-msg--ok { color: #16a34a; }
.pm-msg--error { color: var(--danger, #c0392b); }

/* Campos de formularios en rejilla: controles alineados a la misma altura
   aunque las etiquetas ocupen 1 o 2 líneas */
.adm-grid { align-items: stretch; }
.adm-grid > .adm-field { display: flex; flex-direction: column; justify-content: flex-end; }

.adm-field input[type="text"], .adm-field input[type="number"], .adm-field input[type="url"],
.adm-field input[type="email"], .adm-field input[type="tel"], .adm-field input[type="password"],
.adm-field input[type="date"], .adm-field input[type="file"],
.adm-field input[type="datetime-local"], .adm-field textarea, .adm-field select {
  width: 100%; box-sizing: border-box; min-height: 42px; padding: 8px 12px;
  font-family: var(--font-body); font-size: 15px; color: var(--ink);
  background: var(--paper); border: 2px solid var(--ink); border-radius: var(--radius-md);
}
.adm-field textarea { min-height: 120px; resize: vertical; }
.adm-field input:focus-visible, .adm-field textarea:focus-visible, .adm-field select:focus-visible {
  outline: 2px solid var(--focus-ring); outline-offset: 2px;
}
.adm-check { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.adm-check input { width: 18px; height: 18px; accent-color: var(--ink); }
.adm-inline { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.adm-inline .adm-field { flex: 1; min-width: 120px; }

/* ============================================================
   Cabecera del torneo — póster protagonista sobre banner de fondo
   ============================================================ */
.ev-header {
  position: relative; background: var(--ink); color: var(--paper);
  border-bottom: 2px solid var(--ink);
  display: flex; justify-content: center; padding: 44px 16px 30px;
}
.ev-header__bg {
  position: absolute; inset: 0; overflow: hidden;
  background-size: cover; background-position: center;
}
.ev-header__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10,10,10,.45) 0%, rgba(10,10,10,.86) 100%);
}
.ev-header__inner {
  position: relative; z-index: 1; width: 100%; max-width: var(--container-max);
  display: flex; gap: 30px; align-items: flex-end; flex-wrap: wrap;
}
.ev-header__poster {
  width: clamp(170px, 24vw, 260px); flex: none; display: block;
  border: 3px solid var(--paper); border-radius: var(--radius-md);
  box-shadow: 8px 8px 0 rgba(0,0,0,.5);
  margin-bottom: -46px;               /* se encima sobre el contenido de abajo */
}
.ev-header .ev-band__info { flex: 1; min-width: 240px; padding-bottom: 6px; }
.ev-header .ev-band__title { text-shadow: 0 2px 18px rgba(0,0,0,.55); }

/* Deja espacio para el póster que se encima (desktop: a la izquierda) */
.ev-header + .ev-tabs .ev-tabs__inner { padding-left: clamp(200px, calc(24vw + 30px), 290px); }

@media (max-width: 767px) {
  .ev-header { padding: 30px 16px 22px; }
  .ev-header__inner { flex-direction: column; align-items: center; text-align: center; gap: 16px; }
  .ev-header__poster { width: clamp(160px, 54vw, 230px); margin-bottom: 0; }
  .ev-header .ev-band__meta { align-items: center; }
  .ev-header .ev-band__meta span { justify-content: center; }
  .ev-header .ev-band__actions { justify-content: center; }
  .ev-header + .ev-tabs .ev-tabs__inner { padding-left: 16px; }
}

/* ---- Draws: selector de sección (Resumen / Partidos / Cuadro / Consolación) ---- */
.dw-sections { display: flex; gap: 8px; flex-wrap: wrap; padding: 0 4px; }
.dw-section-tab {
  display: inline-flex; align-items: center; min-height: 34px; padding: 4px 14px;
  font-family: var(--font-body); font-weight: 700; font-size: 12px; text-decoration: none;
  text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--gray-6); background: var(--gray-1);
  border: 2px solid var(--border-soft); border-radius: var(--radius-pill);
  transition: all var(--speed-fast) var(--ease-out);
}
.dw-section-tab:hover { color: var(--ink); border-color: var(--ink); }
.dw-section-tab--active { color: var(--paper); background: var(--accent); border-color: var(--ink); }
.dw-section-tab--active:hover { color: var(--paper); }

/* ---- Fotos: banda de Instagram ---- */
.ev-ig {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  border: 2px solid var(--ink); border-radius: var(--radius-md); box-shadow: var(--shadow-sticker-sm);
  padding: 14px 18px; background: var(--paper);
}
.ev-ig__text { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; }
.ev-ig__text svg { color: var(--accent); flex: none; }
.ev-ig__links { display: inline-flex; gap: 10px; flex-wrap: wrap; }