/* =========================================
   1. Fix global & anti-scroll horizontal
========================================= */
html, body {
    max-width: 100%;
    overflow-x: hidden; /* évite le défilement horizontal sur mobile */
}

/* =========================================
   2. Police N27
========================================= */
@font-face {
    font-family: "N27";
    src: url("/fonts/n27-regular-webfont.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

/* Police globale */
body, button, input, select, textarea {
    font-family: "N27", sans-serif !important;
    font-weight: 400 !important;
}

/* Simuler le gras pour Bootstrap */
b, strong, .fw-bold, th, .navbar-brand, .nav-link.active {
    font-weight: 700 !important;
}

/* Titres Bootstrap en “gras” */
h1, h2, h3, h4, h5, h6 {
    font-family: "N27", sans-serif !important;
    font-weight: 700 !important;
}

/* =========================================
   3. Couleurs mois / année (olive pastel)
========================================= */
.month-title,
.year-title {
    color: #C5BA8F !important; /* Olive pastel */
}

/* =========================================
   4. Calendrier : carte & responsive
========================================= */

/* Carte du calendrier sur desktop */
.calendar-card {
    max-width: 900px;
    margin: 0 auto;
}

/* Version mobile : on élargit correctement et on centre */
@media (max-width: 576px) {
    .calendar-card {
        max-width: 100% !important;
        margin: 0 0.75rem !important;
        padding: 1rem !important;
    }
}

/* Header du calendrier (Mois précédent / Janvier 2026 / Mois suivant) */
@media (max-width: 576px) {
    .calendar-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 0.5rem;
    }

    .calendar-header .btn {
        width: 100%;
        max-width: 260px;
    }
}