/* ==========================================================================
   DOMPA VOLEI · MIC CVSM OPTIMIZADO (STAFF PLANNER)
   Manual de Identidade Corporativa: Club Voleibol San Martiño (CVSM)
   Cores canónicas: Fucsia #DE1A7E, Negro #0D0D0E, Papel #FDFDFD
   Tipografía: Anton (Display, maiúsculas), Inter (UI, táboas, etiquetas)
   ========================================================================== */

:root {
  --primary:        #DE1A7E;  /* Fucsia eléctrico oficial */
  --primary-neon:   #D80073;  /* Acento de máxima enerxía */
  --primary-deep:   #B0006D;  /* Rosa profundo (5.85:1 sobre papel/blush) */
  --primary-light:  #FF5CA8;  /* Rosa claro (6.12:1 só sobre negro) */
  --ink:            #0D0D0E;  /* Negro estrutural 19.10:1 */
  --graphite:       #5B5F66;  /* Grafito para metadatos 6.31:1 */
  --paper:          #FDFDFD;  /* Fondo xeral de papel */
  --mist:           #F2F2F2;  /* Neutro suave, recheos */
  --line:           #E3E5E8;  /* Liñas e bordes de 1px */
  --blush:          #FBE9EF;  /* Fondo suave de aviso/destacado */
  
  --font-display: 'Anton', 'Oswald', Impact, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* --- RESET TIPOGRÁFICO INSTITUCIONAL --- */
body {
  background-color: var(--paper) !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11', 'tnum' !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Titulares e rótulos en Anton maiúsculas */
h1, h2, h3, h4, .font-heading, .mic-title, .day-number, th {
  font-family: var(--font-display) !important;
  letter-spacing: 0.025em !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
}

/* --- CABECEIRA PRINCIPAL --- */
header {
  background-color: rgba(253, 253, 253, 0.96) !important;
  backdrop-filter: blur(10px) !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: 0 1px 3px rgba(13, 13, 14, 0.04) !important;
}

header h1 {
  font-family: var(--font-display) !important;
  font-size: 1.35rem !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: var(--ink) !important;
}

header p {
  font-family: var(--font-body) !important;
  color: var(--graphite) !important;
  font-weight: 600 !important;
}

/* Icono volei da cabeceira */
.icon-dompa-badge, header .w-11.h-11 {
  background-color: var(--ink) !important;
  border: 2px solid var(--primary) !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 6px rgba(222, 26, 126, 0.2) !important;
}

/* Dot online en tempo real */
.pulse-online, .w-2\.5.h-2\.5.rounded-full.bg-\[\#DE1A7E\] {
  background-color: var(--primary) !important;
  animation: 2s cubic-bezier(0.4, 0, 0.6, 1) infinite pulseDompa !important;
}
@keyframes pulseDompa {
  0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 0 0 rgba(222, 26, 126, 0.45); }
  50% { opacity: 0.85; transform: scale(1.18); box-shadow: 0 0 0 4px rgba(222, 26, 126, 0); }
}

/* --- PESTANAS DE NAVEGACIÓN SUPERIORES --- */
header .flex.items-center.bg-slate-100\/90 {
  background-color: var(--mist) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  padding: 4px !important;
  box-shadow: none !important;
}

header .flex.items-center.bg-slate-100\/90 button {
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  border-radius: 10px !important;
  padding: 6px 14px !important;
  transition: all 0.15s ease !important;
  color: var(--graphite) !important;
}

header .flex.items-center.bg-slate-100\/90 button.bg-white {
  background-color: var(--ink) !important;
  color: #FFFFFF !important;
  box-shadow: 0 2px 4px rgba(13, 13, 14, 0.15) !important;
}

header .flex.items-center.bg-slate-100\/90 button:not(.bg-white):hover {
  background-color: rgba(255, 255, 255, 0.6) !important;
  color: var(--ink) !important;
}

/* --- BARRA DE ACCIÓNS E BOTÓNS DA TORRE DE CONTROL --- */
/* Unificación sobria e institucional dos botóns da cabeceira */
header a[href*="/laboral"],
header a[href*="/glosario"],
header a[href*="/control-tecnico"],
header button[title*="matriz"],
header button[title*="WhatsApp"],
header button[onclick*="print"],
button[title*="Dossier"],
button[title*="ITSS"] {
  background-color: #FFFFFF !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 7px 12px !important;
  box-shadow: 0 1px 2px rgba(13, 13, 14, 0.03) !important;
  transition: all 0.15s ease !important;
}

header a[href*="/laboral"]:hover,
header a[href*="/glosario"]:hover,
header a[href*="/control-tecnico"]:hover,
header button[title*="matriz"]:hover,
header button[title*="WhatsApp"]:hover,
header button[onclick*="print"]:hover,
button[title*="Dossier"]:hover,
button[title*="ITSS"]:hover {
  background-color: var(--blush) !important;
  border-color: var(--primary) !important;
  color: var(--primary-deep) !important;
}

/* Botón de Refresco (Sincronización Firestore) */
header button[aria-label="Refrescar datos del servidor"] {
  background-color: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
  border-radius: 12px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}
header button[aria-label="Refrescar datos del servidor"]:hover {
  background-color: var(--mist) !important;
  border-color: var(--graphite) !important;
}

/* Botóns de Acción Primaria (Gardar / Descargar Copia HTML) */
.bg-gradient-to-r,
header button[title*="Descargar copia"],
button.bg-gradient-to-r {
  background-image: none !important;
  background-color: var(--primary) !important;
  border: 1px solid var(--primary-deep) !important;
  color: #FFFFFF !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 4px rgba(222, 26, 126, 0.25) !important;
  transition: all 0.15s ease !important;
}

.bg-gradient-to-r:hover,
header button[title*="Descargar copia"]:hover,
button.bg-gradient-to-r:hover {
  background-color: var(--primary-deep) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 8px rgba(176, 0, 109, 0.3) !important;
}

/* Selector de Adestrador e Bloqueo */
header .flex.items-center.bg-slate-50 {
  background-color: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
}
header select {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
}

/* --- SEGUNDA BARRA: FILTRO DE EQUIPO E CONTROL DE MES --- */
#quickNavPanel, .bg-white.border-b.border-slate-200 {
  background-color: var(--paper) !important;
  border-bottom: 1px solid var(--line) !important;
}

/* Selector de Equipos (Torre de Control) */
select[aria-label="Filtrar por equipo"],
.bg-slate-50.border.border-slate-300 select {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  color: var(--ink) !important;
  background-color: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
}

/* Selector Segmentado Mes / Semanas / Rango */
.bg-slate-100.p-1.rounded-xl {
  background-color: var(--mist) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  padding: 3px !important;
}
.bg-slate-100.p-1.rounded-xl button {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  border-radius: 9px !important;
}
.bg-slate-100.p-1.rounded-xl button.bg-white {
  background-color: #FFFFFF !important;
  color: var(--ink) !important;
  box-shadow: 0 1px 3px rgba(13, 13, 14, 0.08) !important;
  border: 1px solid rgba(227, 229, 232, 0.8) !important;
}

/* Stepper de Mes (Sep '26, frechas) */
.flex.items-center.gap-1 button {
  background-color: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  color: var(--ink) !important;
  font-weight: 800 !important;
}
.flex.items-center.gap-1 button:hover {
  background-color: var(--mist) !important;
  border-color: var(--graphite) !important;
}

/* --- DIAS DA SEMANA (CABECEIRAS DO CALENDARIO) --- */
.grid.grid-cols-7.gap-2.mb-2 > div {
  background-color: var(--mist) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  font-family: var(--font-display) !important;
  font-size: 13px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--ink) !important;
  padding: 6px 4px !important;
  text-align: center !important;
  box-shadow: none !important;
}

/* Fin de semana en tono sobrio neutro (eliminando amarelo chillón) */
.grid.grid-cols-7.gap-2.mb-2 > div:nth-child(6),
.grid.grid-cols-7.gap-2.mb-2 > div:nth-child(7) {
  background-color: #EAECEF !important;
  color: var(--graphite) !important;
}

/* --- TARXETAS DE DÍA (.day-card) --- */
.day-card {
  background-color: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  padding: 10px !important;
  box-shadow: 0 1px 3px rgba(13, 13, 14, 0.02) !important;
  transition: all 0.15s ease !important;
}

.day-card:hover {
  border-color: var(--graphite) !important;
  box-shadow: 0 4px 12px rgba(13, 13, 14, 0.06) !important;
}

/* Número de día en Anton */
.day-card .font-black.text-base,
.day-card .text-base.font-black,
.day-card .text-sm.font-black {
  font-family: var(--font-display) !important;
  font-size: 1.25rem !important;
  letter-spacing: 0.02em !important;
  color: var(--ink) !important;
  line-height: 1 !important;
}

/* Estado: DÍA DE HOXE */
.day-card.border-\[\#DE1A7E\],
.day-card.ring-2.ring-rose-200\/80 {
  border: 1px solid var(--primary) !important;
  border-top: 4px solid var(--primary) !important;
  background-color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(222, 26, 126, 0.12) !important;
}
.day-card.border-\[\#DE1A7E\] .font-black.text-base {
  color: var(--primary) !important;
}

/* Estado: CHOQUE / CONFLITO DE PISTA */
.day-card.border-rose-500,
.day-card.ring-2.ring-rose-300\/70 {
  border: 1px solid var(--primary-deep) !important;
  border-left: 4px solid var(--primary) !important;
  background-color: var(--blush) !important;
  box-shadow: 0 4px 14px rgba(176, 0, 109, 0.15) !important;
}

/* Píldora de aviso de CHOQUE */
.day-card span.bg-rose-600,
.day-card span.bg-rose-500,
span[class*="bg-rose-600"] {
  background-color: var(--primary) !important;
  color: #FFFFFF !important;
  font-family: var(--font-display) !important;
  font-size: 10px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: 6px !important;
  padding: 2px 7px !important;
}

/* Fin de semana na grella (sábado e domingo neutros, non amarelos) */
.day-card.border-amber-300\/80,
.day-card.bg-amber-50\/20 {
  border-color: var(--line) !important;
  background-color: #FAFAFB !important;
}

/* Días fóra de mes / inactivos */
.day-card.bg-slate-50\/40,
.day-card.opacity-65 {
  background-color: #F8F9FA !important;
  border-color: rgba(227, 229, 232, 0.6) !important;
  opacity: 0.6 !important;
}

/* Botón de engadir sesión no día (+) */
.day-card button[title*="Añadir"] {
  background-color: var(--mist) !important;
  border: 1px solid var(--line) !important;
  color: var(--graphite) !important;
  border-radius: 8px !important;
}
.day-card button[title*="Añadir"]:hover {
  background-color: var(--primary) !important;
  border-color: var(--primary-deep) !important;
  color: #FFFFFF !important;
}

/* --- BLOQUES DE SESIÓN INTERNOS (CHIPS) --- */
.day-card .rounded-xl.border {
  border-radius: 10px !important;
  border: 1px solid var(--line) !important;
  background-color: #FFFFFF !important;
  box-shadow: 0 1px 2px rgba(13, 13, 14, 0.02) !important;
  transition: all 0.12s ease !important;
}

.day-card .rounded-xl.border:hover {
  border-color: var(--primary) !important;
  box-shadow: 0 2px 8px rgba(222, 26, 126, 0.08) !important;
}

/* Píldoras de Equipo canónicas MIC */
span:contains("DOMPAVOLEI CF1"),
.badge-team-cf1 {
  background-color: var(--primary) !important;
  color: #FFFFFF !important;
}
span:contains("DOMPAVOLEI SF1"),
.badge-team-sf1 {
  background-color: var(--primary-deep) !important;
  color: #FFFFFF !important;
}
.badge-team-rival {
  background-color: var(--ink) !important;
  color: #FFFFFF !important;
}

/* Enlace a "Ver tarefas detalladas" */
.day-card button.text-\[\#DE1A7E\],
.day-card button:contains("Ver"),
.day-card button[class*="text-[#DE1A7E]"] {
  color: var(--primary) !important;
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
}
.day-card button.text-\[\#DE1A7E\]:hover,
.day-card button[class*="text-[#DE1A7E]"]:hover {
  color: var(--primary-deep) !important;
  text-decoration: underline !important;
}

/* Partidos FGVB Oficiais: Tarxeta destacada */
.day-card .border-rose-200 {
  border-color: var(--line) !important;
}

/* --- MODAL DE AUTENTICACIÓN (PIN DE ADESTRADOR) --- */
.fixed.inset-0.z-\[120\].bg-slate-950\/85 {
  background-color: rgba(13, 13, 14, 0.88) !important;
  backdrop-filter: blur(10px) !important;
}

.fixed.inset-0.z-\[120\] .bg-white.rounded-3xl {
  background-color: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-radius: 24px !important;
  box-shadow: 0 20px 50px rgba(13, 13, 14, 0.35) !important;
}

.fixed.inset-0.z-\[120\] .w-16.h-16.rounded-2xl {
  background-color: var(--ink) !important;
  border: 2px solid var(--primary) !important;
  border-radius: 18px !important;
  box-shadow: 0 6px 18px rgba(222, 26, 126, 0.25) !important;
}

.fixed.inset-0.z-\[120\] span:contains("CVSM DOMPA VOLEI"),
.fixed.inset-0.z-\[120\] .text-xs.font-black.text-rose-600 {
  background-color: var(--blush) !important;
  color: var(--primary-deep) !important;
  font-family: var(--font-body) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
}

.fixed.inset-0.z-\[120\] h2,
.fixed.inset-0.z-\[120\] h3,
.fixed.inset-0.z-\[120\] .font-black.text-xl,
.fixed.inset-0.z-\[120\] .text-xl.font-black {
  font-family: var(--font-display) !important;
  font-size: 1.85rem !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: var(--ink) !important;
  margin-top: 8px !important;
  margin-bottom: 4px !important;
}

.fixed.inset-0.z-\[120\] p {
  font-family: var(--font-body) !important;
  color: var(--graphite) !important;
  font-size: 12px !important;
}

.fixed.inset-0.z-\[120\] .grid.grid-cols-3 button {
  background-color: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  color: var(--ink) !important;
  font-family: var(--font-display) !important;
  font-size: 1.5rem !important;
  height: 58px !important;
  box-shadow: 0 1px 3px rgba(13, 13, 14, 0.04) !important;
  transition: all 0.12s ease !important;
}

.fixed.inset-0.z-\[120\] .grid.grid-cols-3 button:hover {
  background-color: var(--mist) !important;
  border-color: var(--graphite) !important;
  transform: translateY(-1px) !important;
}

.fixed.inset-0.z-\[120\] .grid.grid-cols-3 button:active {
  background-color: var(--blush) !important;
  border-color: var(--primary) !important;
  color: var(--primary-deep) !important;
  transform: scale(0.96) !important;
}

.fixed.inset-0.z-\[120\] .w-3.h-3.rounded-full {
  border: 2px solid var(--line) !important;
  background-color: transparent !important;
  transition: all 0.15s ease !important;
}
.fixed.inset-0.z-\[120\] .w-3.h-3.rounded-full.bg-slate-900,
.fixed.inset-0.z-\[120\] .w-3.h-3.rounded-full.bg-\[\#DE1A7E\] {
  background-color: var(--primary) !important;
  border-color: var(--primary-deep) !important;
  transform: scale(1.15) !important;
}

/* --- DIÁLOGOS E MODAIS XERAIS (EDICIÓN DE SESIÓN, TAREFAS) --- */
.modal-dialog-responsive,
.fixed.inset-0 .bg-white.rounded-3xl {
  border: 1px solid var(--line) !important;
  border-radius: 20px !important;
  box-shadow: 0 16px 40px rgba(13, 13, 14, 0.2) !important;
}

.modal-dialog-responsive h3 {
  font-family: var(--font-display) !important;
  font-size: 1.4rem !important;
  letter-spacing: 0.02em !important;
  color: var(--ink) !important;
}

button[aria-label*="Cerrar"] {
  background-color: var(--mist) !important;
  border: 1px solid var(--line) !important;
  color: var(--graphite) !important;
}
button[aria-label*="Cerrar"]:hover {
  background-color: var(--ink) !important;
  color: #FFFFFF !important;
  border-color: var(--ink) !important;
}

/* Atallos rápidos de fin de semana no modal (Sáb / Dom) */
.modal-dialog-responsive .bg-amber-50.border-amber-300,
.modal-dialog-responsive button.text-amber-800 {
  background-color: var(--mist) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
}
.modal-dialog-responsive .bg-amber-50.border-amber-300:hover,
.modal-dialog-responsive button.text-amber-800:hover {
  background-color: #E2E4E8 !important;
}

/* Inputs e Selects dentro de Modais */
.modal-dialog-responsive input,
.modal-dialog-responsive select,
.modal-dialog-responsive textarea {
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  color: var(--ink) !important;
  background-color: #FFFFFF !important;
}
.modal-dialog-responsive input:focus,
.modal-dialog-responsive select:focus,
.modal-dialog-responsive textarea:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(222, 26, 126, 0.12) !important;
  outline: none !important;
}

/* Botóns de adestrador seleccionado no modal */
.modal-dialog-responsive .bg-slate-900.text-white {
  background-color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}

/* --- TAB CONTROL DE XOGADORAS --- */
/* Cifras de contadores en Anton */
.text-2xl.font-black,
.text-xl.font-black,
.font-black.text-2xl,
.font-black.text-xl {
  font-family: var(--font-display) !important;
  letter-spacing: 0.03em !important;
}

/* Píldoras de filtro de equipo activas */
.bg-rose-600.text-white,
button.bg-rose-600 {
  background-color: var(--primary) !important;
  color: #FFFFFF !important;
}
.bg-rose-600.text-white:hover,
button.bg-rose-600:hover {
  background-color: var(--primary-deep) !important;
}

/* --- TAB REGISTRO DE HORAS --- */
/* Reloxo en Anton */
.font-mono.text-5xl,
.font-mono.text-6xl,
.text-5xl.font-black,
.text-6xl.font-black {
  font-family: var(--font-display) !important;
  letter-spacing: 0.04em !important;
  color: var(--ink) !important;
}

/* Botón de fichar */
button.bg-rose-600,
button[class*="bg-rose-600"] {
  background-color: var(--primary) !important;
}
button.bg-rose-600:hover,
button[class*="bg-rose-600"]:hover {
  background-color: var(--primary-deep) !important;
}

/* --- RODAPÉ INFORMATIVO DA TEMPORADA --- */
footer, .border-t.border-slate-200.bg-white {
  background-color: var(--paper) !important;
  border-top: 1px solid var(--line) !important;
  color: var(--graphite) !important;
  font-family: var(--font-body) !important;
}

footer strong, footer .font-bold {
  color: var(--ink) !important;
}

/* Toast flotante inferior */
.fixed.bottom-4.right-4 {
  background-color: var(--ink) !important;
  border: 1px solid rgba(222, 26, 126, 0.4) !important;
  color: #FFFFFF !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(13, 13, 14, 0.3) !important;
}

/* Botón flotante 'Actualizado por...' */
.fixed.bottom-4.right-4.bg-slate-900,
button.fixed.bottom-4.right-4 {
  background-color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}

/* --- OPTIMIZACIÓN MÓBIL RESPONSIVE --- */
@media (max-width: 768px) {
  header {
    padding: 10px 12px !important;
  }
  header h1 {
    font-size: 1.15rem !important;
  }
  
  header .flex.items-center.gap-2.flex-wrap {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding-bottom: 4px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  header .flex.items-center.gap-2.flex-wrap::-webkit-scrollbar {
    display: none !important;
  }
  
  .day-card {
    padding: 6px !important;
    border-radius: 10px !important;
    min-height: 110px !important;
  }
  
  .day-card .font-black.text-base {
    font-size: 1.05rem !important;
  }
}