/* Sección "Sedes y canchas" (sec-sedes.js), pantalla 13 del diseño. Tokens de panel.css. */

.sd-titulo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sd { display: flex; flex-direction: column; gap: 14px; }
.sd-pie { display: flex; align-items: center; gap: 8px; margin-top: 4px; }

.sd-icono { width: 44px; height: 44px; border-radius: var(--r-medio); display: grid; place-items: center; flex-shrink: 0; color: var(--cyan); background: var(--accent-soft); border: 1px solid var(--border-hi); }
.sd-icono.apagado { color: var(--text-muted); background: var(--bg-card-pressed); border-color: var(--border-fuerte); }

.sd-fila { font: inherit; color: inherit; text-align: left; width: 100%; display: flex; align-items: center; gap: 14px; padding: 16px 20px; cursor: pointer; }
.sd-fila:hover { background: var(--bg-card-pressed); }
.sd-fila-textos { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.sd-sede { display: flex; flex-direction: column; gap: 16px; }
.sd-sede-cabeza { display: flex; align-items: center; gap: 14px; }
.sd-sede-textos { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }

.sd-canchas { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; padding-bottom: 16px; border-bottom: 1px solid var(--border); }
.sd-cancha { position: relative; display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: var(--r-grande); border: 1px solid var(--border-fuerte); background: var(--bg-sutil); cursor: pointer; min-height: 64px; }
.sd-cancha:hover { border-color: var(--border-hover); }
.sd-cancha.elegida { border-color: var(--border-hi); background: var(--accent-soft); }
.sd-cancha.inactiva .sd-cancha-textos { opacity: .55; }
.sd-cancha-textos { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sd-cancha-textos > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd-cancha-predio { color: var(--cyan); }
.sd-cancha .sello { text-transform: none; letter-spacing: 0; font-size: 12px; }
.sd-cancha-editar { width: 28px; height: 28px; border-color: transparent; background: transparent; }
.sd-cancha-editar svg { width: 14px; height: 14px; }
.sd-cancha-nueva { font: inherit; justify-content: center; color: var(--text-dim); border-style: dashed; background: transparent; font-weight: 600; font-size: 14px; }
.sd-cancha-nueva:hover { color: var(--cyan); border-color: var(--border-hi); }

.sd-libre { display: flex; flex-direction: column; gap: 12px; }
.sd-libre-cabeza { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.sd-libre-cabeza .t-subtitulo { margin: 0; }
.sd-guardado { min-width: 70px; text-align: right; }
.sd-grilla-marco { overflow-x: auto; position: relative; }
.sd-grilla { display: grid; grid-template-columns: 72px repeat(7, minmax(78px, 1fr)); gap: 8px; min-width: 640px; }
.sd-esquina { }
.sd-dia { text-align: center; padding: 4px 0; }
.sd-hora { display: flex; align-items: center; justify-content: space-between; gap: 4px; font-weight: 600; font-size: 14px; }
.sd-quitar-hora { border: 0; background: none; color: var(--text-muted); cursor: pointer; font-size: 16px; line-height: 1; padding: 2px 4px; border-radius: 6px; opacity: 0; }
.sd-hora:hover .sd-quitar-hora, .sd-quitar-hora:focus-visible { opacity: 1; }
.sd-quitar-hora:hover { color: var(--err); }
.sd-celda { font: inherit; height: 36px; border-radius: var(--r-medio); border: 1px solid var(--border-fuerte); background: var(--bg-sutil); color: var(--text-muted); font-size: 13px; cursor: pointer; }
.sd-celda:hover:not(:disabled) { border-color: var(--border-hover); color: var(--text-dim); }
.sd-celda.libre { color: var(--cyan); background: var(--accent-soft); border-color: var(--border-hi); font-weight: 600; }
.sd-celda:disabled { cursor: default; }
.sd-libre-pie { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

@media (max-width: 760px) {
  .sd-sede-cabeza { flex-wrap: wrap; }
  .sd-canchas { grid-template-columns: 1fr; }
  .sd-quitar-hora { opacity: 1; }
  .sd-fila { flex-wrap: wrap; }
}

/* Grilla de Fixture con Sedes y canchas (sec-fixture.js): casilla donde la cancha no está libre. */
.fx-celda.no-libre { background: repeating-linear-gradient(135deg, var(--rayado) 0 6px, transparent 6px 12px); }
.fx-celda.no-libre .fx-libre { color: var(--text-muted); opacity: .7; }

/* Generar fixture con Sedes y canchas (fixture-generar.js). */
.fxg-canchas-sedes { display: flex; flex-direction: column; gap: 6px; }
.fxg-cancha-sede { display: flex; flex-direction: column; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--r-medio); background: var(--bg-sutil); }
.fxg-modal-sedes .encabezado h1 { display: none; }
.fxg-modal-sedes .encabezado { margin-bottom: 12px; }
