/* Extiende css/styles.css para las páginas dinámicas del torneo */

.torneo-nav{
  display:flex; gap:2px; background:var(--line); margin-bottom:40px; flex-wrap:wrap;
}
.torneo-nav a{
  flex:1; min-width:140px; text-align:center;
  background: var(--surface); color: var(--paper-dim);
  font-family: var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  padding: 16px 10px;
}
.torneo-nav a:hover{ color: var(--gold-bright); background: var(--surface-2); }
.torneo-nav a.active{ color: var(--black); background: var(--gold); font-weight:700; }

.zone-selector{
  display:flex; gap:8px; flex-wrap:wrap; margin:0;
}
.zone-selector a{
  font-family: var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase;
  color: var(--paper-dim); border:1px solid var(--line); padding:8px 16px;
}
.zone-selector a:hover{ color: var(--gold-bright); border-color: var(--gold-deep); }
.zone-selector a.active{ color: var(--black); background: var(--gold); border-color: var(--gold); font-weight:700; }

.zone-photos-row{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
  margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid var(--line);
}
.photos-link{
  font-family: var(--font-mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color: var(--gold); border:1px solid var(--gold-deep); padding:9px 18px; white-space:nowrap;
}
.photos-link:hover{ color: var(--gold-bright); border-color: var(--gold); }
.photos-link.active{ color: var(--black); background: var(--gold); border-color: var(--gold); font-weight:700; }

.standings-table{ width:100%; border-collapse:collapse; font-family: var(--font-mono); font-size:14px; }
.standings-table th, .standings-table td{
  padding: 12px 10px; text-align:center; border-bottom:1px solid var(--line);
}
.standings-table th{ text-transform:uppercase; font-size:10px; letter-spacing:.08em; color: var(--gold); }
.standings-table td.team-name{ text-align:left; color: var(--paper); font-family: var(--font-body); font-weight:600; }
.standings-table td.pts{ color: var(--gold-bright); font-weight:700; }
.standings-table tbody tr:hover{ background: rgba(193,145,71,.05); }
.standings-table tbody tr:nth-child(-n+2) td.team-name{ border-left: 3px solid var(--gold); padding-left:12px; }

.matchday-block{ margin-bottom: 36px; }
.matchday-title{
  font-family: var(--font-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color: var(--gold); margin-bottom:14px; padding-bottom:8px; border-bottom:1px solid var(--line);
}
.match-row{
  display:grid; grid-template-columns: 1fr minmax(150px, 170px) 1fr; align-items:center; gap:16px;
  background: var(--surface); padding: 16px 20px; margin-bottom:2px;
}
.match-row .team{ font-family: var(--font-body); font-size:15px; }
.match-row .team.home{ text-align:right; }
.match-row .score{
  font-family: var(--font-mono); font-weight:700; font-size:18px; color: var(--gold-bright);
  min-width:80px; text-align:center;
}
.match-row .score.pending{ color: var(--paper-dim); font-size:12px; font-weight:400; }
@media (max-width:640px){
  .match-row{ grid-template-columns:1fr; text-align:center; gap:6px; }
  .match-row .team.home{ text-align:center; }
}

.scorers-list{ width:100%; border-collapse:collapse; font-family: var(--font-mono); font-size:14px; }
.scorers-list td, .scorers-list th{ padding:12px 14px; border-bottom:1px solid var(--line); }
.scorers-list th{ text-align:left; text-transform:uppercase; font-size:11px; color:var(--gold); }
.scorers-list td.rank{ color: var(--gold-deep); width:36px; }
.scorers-list td.goals{ color: var(--gold-bright); font-weight:700; text-align:center; width:70px; }
.scorers-list td.pname{ font-family: var(--font-body); color:var(--paper); }

.suspended-card{
  background: var(--surface); border-left:3px solid #b0392f;
  padding: 18px 20px; margin-bottom:10px; display:flex; justify-content:space-between; align-items:center;
}
.suspended-card .pname{ font-family: var(--font-body); font-size:16px; color:var(--paper); }
.suspended-card .team{ font-family: var(--font-mono); font-size:12px; color:var(--paper-dim); }
.suspended-card .tag{
  font-family: var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:#e07a6e; border:1px solid #b0392f; padding:4px 10px;
}

.empty-state{
  text-align:center; padding: 60px 20px; color: var(--paper-dim);
  font-family: var(--font-mono); font-size:14px;
}

/* ---------- admin ---------- */
.admin-shell{ display:grid; grid-template-columns: 220px 1fr; min-height: calc(100vh - 160px); }
.admin-sidebar{ background: var(--black-soft); border-right:1px solid var(--line); padding: 30px 0; }
.admin-sidebar a{
  display:block; padding: 12px 26px; font-family: var(--font-mono); font-size:13px;
  letter-spacing:.06em; text-transform:uppercase; color: var(--paper-dim);
}
.admin-sidebar a:hover, .admin-sidebar a.active{ color: var(--gold-bright); background: rgba(193,145,71,.06); }
.admin-main{ padding: 40px; }
@media (max-width:800px){
  .admin-shell{ grid-template-columns:1fr; }
  .admin-sidebar{ display:flex; overflow-x:auto; border-right:none; border-bottom:1px solid var(--line); padding:10px; }
  .admin-main{ padding:24px 16px; }
}

.login-shell{
  min-height: 70vh; display:flex; align-items:center; justify-content:center; padding: 40px 20px;
}
.login-box{ width:100%; max-width:380px; background: var(--surface); border:1px solid var(--line); padding: 40px; }
.login-box h1{ font-size:28px; text-transform:uppercase; margin-bottom:8px; }
.login-box p.hint{ color:var(--paper-dim); font-size:13px; margin-bottom:24px; }

.alert{
  padding: 14px 18px; margin-bottom:20px; font-family: var(--font-mono); font-size:13px;
  border-left:3px solid;
}
.alert-error{ background: rgba(176,57,47,.1); border-color:#b0392f; color:#e07a6e; }
.alert-ok{ background: rgba(193,145,71,.1); border-color: var(--gold); color: var(--gold-bright); }

.data-table{ width:100%; border-collapse:collapse; font-size:14px; margin-bottom:24px; }
.data-table th, .data-table td{ padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; }
.data-table th{ font-family: var(--font-mono); font-size:11px; text-transform:uppercase; color:var(--gold); }
.data-table .actions a{ font-family: var(--font-mono); font-size:12px; color: var(--gold); margin-right:12px; }
.data-table .actions a.danger{ color:#e07a6e; }

.inline-form{ display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; margin-bottom:30px; }
.inline-form .field{ min-width:160px; }

.event-row{
  display:grid; grid-template-columns: 1.6fr 1.6fr 1.1fr 70px auto; gap:10px; align-items:center;
  margin-bottom:10px;
}
.event-row select, .event-row input[type="number"]{
  width:100%; background: var(--surface); border:1px solid var(--line); color: var(--paper);
  padding:9px 10px; font-family: var(--font-body); font-size:14px;
}
.event-row select{ font-family: var(--font-mono); font-size:13px; }
.event-row input[type="number"]{ font-family: var(--font-mono); text-align:center; padding:9px 4px; }
@media (max-width:700px){
  .event-row{ grid-template-columns:1fr 1fr; }
  .event-row select:nth-child(3){ grid-column: 1 / -1; }
}

.btn-small{
  font-family: var(--font-mono); font-size:11px; padding:8px 14px; border:1px solid var(--gold);
  color: var(--gold-bright); background:none; cursor:pointer; letter-spacing:.06em; text-transform:uppercase;
}
.btn-small:hover{ background:var(--gold); color:var(--black); }
.btn-small.danger{ border-color:#b0392f; color:#e07a6e; }
.btn-small.danger:hover{ background:#b0392f; color:#fff; }

/* ---------- photo gallery (public) ---------- */
.photo-grid{
  display:grid; grid-template-columns: repeat(4, 1fr); gap:6px;
}
.photo-thumb{
  display:block; aspect-ratio:1; overflow:hidden; background: var(--surface); border:1px solid var(--line);
}
.photo-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .2s ease; }
.photo-thumb:hover img{ transform: scale(1.06); }
@media (max-width:700px){ .photo-grid{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width:480px){ .photo-grid{ grid-template-columns: repeat(2, 1fr); } }

.lightbox{
  position:fixed; inset:0; background:rgba(10,10,11,.94); z-index:1000;
  display:flex; align-items:center; justify-content:center; padding:30px;
}
.lightbox[hidden]{ display:none; }
.lightbox img{ max-width:100%; max-height:100%; box-shadow:0 20px 60px rgba(0,0,0,.6); }
.lightbox-close{
  position:absolute; top:20px; right:24px; background:none; border:1px solid var(--line);
  color:var(--paper); width:40px; height:40px; font-size:16px; cursor:pointer;
}
.lightbox-close:hover{ border-color: var(--gold); color: var(--gold-bright); }
.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  background:none; border:1px solid var(--line); color:var(--paper);
  width:48px; height:48px; font-size:26px; line-height:1; cursor:pointer;
}
.lightbox-nav:hover{ border-color: var(--gold); color: var(--gold-bright); }
.lightbox-prev{ left:20px; }
.lightbox-next{ right:20px; }
@media (max-width:700px){
  .lightbox-nav{ width:40px; height:40px; font-size:20px; }
  .lightbox-prev{ left:8px; }
  .lightbox-next{ right:8px; }
}

/* ---------- photo grid (admin) ---------- */
.admin-photo-grid{ display:grid; grid-template-columns: repeat(5, 1fr); gap:10px; }
.admin-photo-item{ position:relative; aspect-ratio:1; background: var(--surface); border:1px solid var(--line); overflow:hidden; }
.admin-photo-item img{ width:100%; height:100%; object-fit:cover; display:block; }
.admin-photo-delete{
  position:absolute; top:6px; right:6px; width:26px; height:26px; background:rgba(10,10,11,.8);
  color:#e07a6e; border:1px solid #b0392f; display:flex; align-items:center; justify-content:center;
  font-size:13px; line-height:1;
}
.admin-photo-delete:hover{ background:#b0392f; color:#fff; }
@media (max-width:700px){ .admin-photo-grid{ grid-template-columns: repeat(3, 1fr); } }

/* ---------- team logos ---------- */
.team-logo{
  width:34px; height:34px; object-fit:contain; border-radius:50%;
  background: var(--black-soft); border:1px solid var(--line);
  display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
}
.team-logo-placeholder{
  font-family: var(--font-mono); font-size:11px; font-weight:700; color: var(--gold);
  letter-spacing:.02em;
}
.team-logo-lg{ width:76px; height:76px; }
.team-logo-lg.team-logo-placeholder{ font-size:20px; }
a.team-link{
  display:inline-flex; align-items:center; gap:10px; color:inherit;
}
a.team-link:hover .team-name-text, a.team-link:hover{ color: var(--gold-bright); }

/* ---------- match row (clickable) ---------- */
.match-row-wrap{ margin-bottom:2px; }
.match-row .team{ display:flex; align-items:center; gap:10px; }
.match-row .team.home{ justify-content:flex-end; }
.match-row .team.away{ justify-content:flex-start; }
.match-row a.team-link{ color: var(--paper); }
.match-row a.team-link:hover .team-name-text{ color: var(--gold-bright); text-decoration: underline; text-underline-offset:3px; }
.score-toggle{
  background:none; border:none; padding:0; margin:0; cursor:pointer;
  display:flex; justify-content:center; width:100%;
  position:relative;
}
.score-toggle-inner{ display:flex; flex-direction:column; align-items:center; gap:6px; padding:4px 22px; }
.match-datetime{
  font-family: var(--font-mono); font-size:10.5px; letter-spacing:.02em;
  color: var(--paper-dim); white-space:normal; text-align:center; line-height:1.4;
}
.match-datetime.pending-label{ color: var(--gold-deep); text-transform:uppercase; letter-spacing:.08em; }
.score-toggle:hover .score{ color: var(--gold-bright); }
.score-toggle:hover .score.pending{ color: var(--gold); }
.score-toggle[aria-expanded="true"] .score{ color: var(--gold-bright); }
.score-toggle::after{
  content:"▼"; font-size:9px; color: var(--paper-dim);
  position:absolute; right:0; top:50%; transform: translateY(-50%);
}
.score-toggle[aria-expanded="true"]::after{ content:"▲"; color: var(--gold); }
@media (max-width:640px){
  .match-row{ grid-template-columns:1fr; }
  .match-row .team.home, .match-row .team.away{ justify-content:center; }
  .score-toggle::after{ display:none; }
  .score-toggle-inner{ padding:4px 0; }
}

.match-expand{
  background: var(--black-soft); border:1px solid var(--line); border-top:none;
  animation: expandIn .15s ease;
}
@keyframes expandIn{ from{ opacity:0; } to{ opacity:1; } }
.match-expand-meta{
  display:flex; gap:20px; flex-wrap:wrap; justify-content:center;
  padding:14px 20px; border-bottom:1px solid var(--line);
  font-family: var(--font-mono); font-size:12px; color: var(--paper-dim); text-transform:uppercase; letter-spacing:.06em;
}
.match-expand-mvp{
  text-align:center; padding:16px 20px; border-top:1px solid var(--line);
  font-family: var(--font-mono); font-size:13px; color: var(--paper-dim);
}
.match-expand-mvp strong{ color: var(--gold-bright); font-family: var(--font-display); font-size:16px; letter-spacing:.02em; }

/* ---------- match detail page ---------- */
.detail-block{
  background: var(--surface); border:1px solid var(--line); margin-bottom:24px;
}
.detail-block-title{
  background: var(--black); color: var(--gold-bright);
  font-family: var(--font-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  text-align:center; padding: 14px 20px;
}
.detail-row{
  padding: 16px 20px; text-align:center; border-bottom:1px solid var(--line);
  font-family: var(--font-mono); font-size:14px; color: var(--paper-dim);
}
.detail-row:last-child{ border-bottom:none; }
.detail-row strong{ color: var(--paper); font-weight:700; }

.matchup{
  display:grid; grid-template-columns: 1fr auto 1fr; align-items:center; gap:20px;
  padding: 30px 20px; text-align:center;
}
.matchup .side{ display:flex; flex-direction:column; align-items:center; gap:12px; }
.matchup .side .team-logo{ width:64px; height:64px; }
.matchup .side .team-logo-placeholder{ font-size:16px; }
.matchup .side .name{ font-family: var(--font-display); font-size:20px; text-transform:uppercase; letter-spacing:.02em; }
.matchup .center{ display:flex; flex-direction:column; align-items:center; gap:10px; }
.matchup .status-tag{
  font-family: var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  background: var(--line); color: var(--paper-dim); padding: 5px 12px; border-radius:12px;
}
.matchup .status-tag.played{ background: var(--gold); color: var(--black); }
.matchup .score-big{ font-family: var(--font-mono); font-weight:700; font-size:36px; color: var(--gold-bright); }

.events-cols{ display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid var(--line); }
.events-col{ padding: 22px 20px; }
.events-col:first-child{ border-right:1px solid var(--line); }
.event-line{ display:flex; align-items:center; gap:10px; padding:7px 0; font-size:14px; }
.event-line .icon{ width:18px; text-align:center; flex-shrink:0; }
.event-line .icon.goal::before{ content:"⚽"; font-size:13px; }
.event-line .icon.yellow::before{ content:""; display:inline-block; width:12px; height:16px; background:#f2c94c; border-radius:2px; }
.event-line .icon.red::before{ content:""; display:inline-block; width:12px; height:16px; background:#c0392b; border-radius:2px; }
@media (max-width:640px){
  .events-cols{ grid-template-columns:1fr; }
  .events-col:first-child{ border-right:none; border-bottom:1px solid var(--line); }
  .matchup{ grid-template-columns:1fr; }
}

/* ---------- team roster page ---------- */
.team-hero{ display:flex; align-items:center; gap:20px; margin-bottom:36px; flex-wrap:wrap; }
.roster-table{ width:100%; border-collapse:collapse; font-family: var(--font-mono); font-size:14px; }
.roster-table th, .roster-table td{ padding:12px 14px; border-bottom:1px solid var(--line); text-align:center; }
.roster-table th{ text-transform:uppercase; font-size:10px; letter-spacing:.08em; color: var(--gold); }
.roster-table td.pname{ text-align:left; font-family: var(--font-body); color: var(--paper); }
.roster-table td.num{ color: var(--paper-dim); width:40px; }
.roster-table .tag-yellow{ color:#f2c94c; }
.roster-table .tag-red{ color:#e07a6e; }
.roster-table .tag-goal{ color: var(--gold-bright); font-weight:700; }

/* ---------- admin logo upload ---------- */
.logo-preview{
  width:56px; height:56px; object-fit:contain; background: var(--black-soft);
  border:1px solid var(--line); border-radius:50%; vertical-align:middle;
}

/* ---------- lista de presentes (lineup) ---------- */
.lineup-cols{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; }
@media (max-width:700px){ .lineup-cols{ grid-template-columns:1fr; } }
.lineup-team-title{
  font-family: var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color: var(--gold); padding-bottom:8px; margin-bottom:10px; border-bottom:1px solid var(--line);
}
.lineup-check{
  display:flex; align-items:center; gap:10px; padding:7px 4px;
  font-size:14px; color: var(--paper-dim); cursor:pointer;
}
.lineup-check:hover{ color: var(--paper); }
.lineup-check input{ width:16px; height:16px; accent-color: var(--gold); cursor:pointer; }

/* Historial: desplegables de temporadas pasadas */
.history-season summary::-webkit-details-marker{ display:none; }
.history-season summary{ list-style:none; }
.history-season summary:hover{ background: rgba(193,145,71,.05); }
