/* ==========================================================================
   AVA Membership — FullCalendar override
   Sustituye los estilos por defecto de FullCalendar v6 con un look moderno
   que aguanta lasOverrides agresivas de Divi.

   Paleta:
     --primary-color  → var CSS del tema (azul WP por defecto)
     fondo            → #ffffff / #fafbfc
     bordes           → #e5e9f0
     texto secundario → #5b6573
     texto base       → #1f2937
   ========================================================================== */

/* ── Reset defensivo contra Divi ─────────────────────────────────────────── */
.fc,
.fc * {
    box-sizing: border-box;
}

.fc {
    /* Divi suele forzar Open Sans y line-height 1.7em en todo. */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif !important;
    font-size: 0.9rem !important;
    line-height: 1.4 !important;
    color: #1f2937 !important;
    letter-spacing: 0 !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.fc th,
.fc td,
.fc table {
    padding: 0 !important;
    color: inherit !important;
    font-weight: inherit !important;
    margin: 0 !important;
    line-height: inherit !important;
    border-color: #e5e9f0 !important;
}

.fc table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #ffffff;
    /* border-radius: 10px; */
    overflow: hidden;
}

/* ── Toolbar (header con título + botones de navegación) ─────────────────── */
.fc .fc-toolbar {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0.75rem !important;
    margin-bottom: 1rem !important;
}

.fc .fc-toolbar.fc-header-toolbar {
    margin-bottom: 1.25rem !important;
}

.fc .fc-toolbar-title {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    margin: 0 !important;
    line-height: 1.2 !important;
    text-transform: capitalize;
}

.fc .fc-toolbar-chunk {
    display: flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
}

/* ── Botones ─────────────────────────────────────────────────────────────── */
.fc .fc-button {
    border: 1px solid #dde2e8 !important;
    /* background: #ffffff !important;
    color: #374151 !important; */
    box-shadow: none !important;
    padding: 0.45rem 0.9rem !important;
    border-radius: 6px !important;
    font-size: 0.825rem !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-transform: none !important;
    transition: background 0.15s ease, border-color 0.15s ease,
                color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
    cursor: pointer;
}

.fc .fc-button:hover:not(:disabled) {
    background: #eef2f7 !important;
    border-color: #c9d2dd !important;
    color: #1f2937 !important;
}

.fc .fc-button:focus-visible {
    outline: none !important;
    border-color: var(--primary-color, #2271b1) !important;
    box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.18) !important;
}

.fc .fc-button:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
}

.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
    background: var(--primary-color, #2271b1) !important;
    border-color: var(--primary-color, #2271b1) !important;
    color: #ffffff !important;
}

.fc .fc-button .fc-icon {
    font-size: 0.95em !important;
    vertical-align: -0.05em;
}

/* ── Cabecera de días (L M M J V S D) ────────────────────────────────────── */
.fc-col-header-cell {
    background: #f7f9fc !important;
    border-bottom: 1px solid #e5e9f0 !important;
}

.fc-col-header-cell-cushion {
    display: block !important;
    padding: 0.7rem 0.4rem !important;
    color: #5b6573 !important;
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    text-decoration: none !important;
}

.fc-col-header-cell-cushion:hover {
    color: #1f2937 !important;
}

/* ── Celdas del grid ─────────────────────────────────────────────────────── */
.fc-daygrid-day-frame {
    padding: 0.4rem !important;
    min-height: 110px !important;
    transition: background 0.12s ease;
}

.fc-daygrid-day-top {
    padding: 0 !important;
    flex-direction: row !important;
}

.fc-daygrid-day-number {
    display: inline-block !important;
    padding: 0.2rem 0.45rem !important;
    color: #1f2937 !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-radius: 999px;
    transition: background 0.15s ease, color 0.15s ease;
}

.fc-daygrid-day-number:hover {
    background: rgba(34, 113, 177, 0.08) !important;
    color: var(--primary-color, #2271b1) !important;
}

/* Día actual */
.fc-day-today {
    background: #eaf2fa !important;
}

.fc-day-today .fc-daygrid-day-number {
    background: var(--primary-color, #2271b1) !important;
    color: #ffffff !important;
}

/* Días de relleno (mes anterior/siguiente) */
.fc-day-other {
    background: #fbfbfc !important;
}

.fc-day-other .fc-daygrid-day-number {
    color: #9aa3af !important;
    font-weight: 500 !important;
}

/* Fin de semana: diferenciación sutil */
.fc-day-sat,
.fc-day-sun {
    background-color: #fafbfc !important;
}

.fc-day-today.fc-day-sat,
.fc-day-today.fc-day-sun {
    background: #eaf2fa !important;
}

/* Hover sutil en celdas (no días de otros meses) */
.fc-daygrid-day:not(.fc-day-other):hover {
    background: #f5f8fc !important;
}

/* ── Eventos ─────────────────────────────────────────────────────────────── */
.fc-daygrid-event {
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    padding: 2px 5px !important;
    border: 0 !important;
    border-radius: 6px !important;
    /* background: var(--primary-color, #2271b1) !important; */
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08) !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
    cursor: pointer;
}

.fc-daygrid-event:hover {
    transform: translateY(-1px);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.12) !important;
    filter: brightness(1.05);
}

/* .fc-daygrid-event.fc-event {
    /* FullCalendar v6: por defecto la clase es .fc-event * /
    background: var(--primary-color, #2271b1) !important;
} */

.fc-daygrid-event .fc-event-title {
    color: #ffffff !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    padding: 0 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fc-daygrid-event .fc-event-time {
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 0.7rem !important;
    font-weight: 500 !important;
    margin-right: 4px;
}

/* Más eventos (+) */
.fc-daygrid-more-link {
    color: var(--primary-color, #2271b1) !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    padding: 2px 6px !important;
    border-radius: 4px;
    transition: background 0.15s ease;
}

.fc-daygrid-more-link:hover {
    background: rgba(34, 113, 177, 0.08) !important;
    text-decoration: underline !important;
}

/* ── Bordes del scrollgrid ────────────────────────────────────────────────── */
.fc-scrollgrid {
    border: 1px solid #e5e9f0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: #ffffff;
}

.fc-scrollgrid-section > * {
    border-color: #e5e9f0 !important;
}

.fc-scrollgrid-section-header > * {
    border-bottom: 1px solid #e5e9f0 !important;
}

.fc-scrollgrid-section-body > * {
    border-top: 0 !important;
}

/* .fc-scrollgrid-section-body table {
    border-radius: 0 !important;
} */

/* ── Popover (tooltip de "más eventos") ──────────────────────────────────── */
.fc-popover {
    border: 1px solid #e5e9f0 !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    background: #ffffff !important;
    overflow: hidden;
}

.fc-popover-header {
    background: #f7f9fc !important;
    padding: 0.6rem 0.8rem !important;
    border-bottom: 1px solid #e5e9f0 !important;
}

.fc-popover-title {
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    margin: 0 !important;
}

.fc-popover-close {
    color: #6b7280 !important;
    font-size: 1.1rem !important;
    opacity: 0.7 !important;
    transition: opacity 0.15s ease;
}

.fc-popover-close:hover {
    opacity: 1 !important;
}

.fc-popover-body {
    padding: 0.4rem !important;
}

/* ── Vista listMonth (FullCalendar) ──────────────────────────────────────── */
.fc-list {
    border: 1px solid #e5e9f0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: #ffffff;
}

.fc-list-day-cushion {
    background: #f7f9fc !important;
    padding: 0.7rem 0.9rem !important;
}

.fc-list-day-text,
.fc-list-day-side-text {
    color: #1f2937 !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.fc-list-event {
    padding: 0.6rem 0.9rem !important;
    transition: background 0.12s ease;
    cursor: pointer;
}

.fc-list-event:hover {
    background: #f5f8fc !important;
}

.fc-list-event-time {
    color: #5b6573 !important;
    font-size: 0.78rem !important;
    font-weight: 500 !important;
}

.fc-list-event-title {
    color: #1f2937 !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
}

.fc-list-event-graphic .fc-list-event-dot {
    border-width: 6px !important;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
    .fc .fc-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .fc .fc-toolbar-title {
        text-align: center;
        font-size: 1.1rem !important;
    }

    .fc .fc-toolbar-chunk {
        justify-content: center !important;
    }

    .fc-daygrid-day-frame {
        min-height: 70px !important;
        padding: 0.25rem !important;
    }

    .fc-daygrid-day-number {
        font-size: 0.75rem !important;
        padding: 0.15rem 0.35rem !important;
    }

    .fc-daygrid-event .fc-event-title {
        font-size: 0.7rem !important;
    }

    .fc .fc-button {
        padding: 0.4rem 0.7rem !important;
        font-size: 0.78rem !important;
    }
}

/* ── Leyenda (la pinta la vista, no FullCalendar) ────────────────────────── */
.ava-calendar-legend {
    display: flex;
    gap: 1.5em;
    margin-top: 1em;
    margin-bottom: 1em;
    flex-wrap: wrap;
    font-size: 0.85em;
    color: #5b6573;
}
.ava-calendar-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}
.ava-calendar-legend .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 1) inset,
                0 1px 2px rgba(0, 0, 0, 0.15);
}