/**
 * Calendrier Lodgify — styles par defaut.
 * Tout ce qui est reglable depuis Elementor est surcharge par des selecteurs
 * {{WRAPPER}} : ces valeurs ne sont que le point de depart.
 */

.lcal {
    --lcal-day-size: 46px;
    box-sizing: border-box;
    width: 100%;
    /* marges internes reduites : le calendrier respire par sa largeur */
    padding: 4px 0;
}

.lcal *,
.lcal *::before,
.lcal *::after { box-sizing: inherit; }

/* Par defaut le calendrier occupe toute la largeur de son conteneur : les mois
   se partagent l'espace, les cases suivent. Tout reste ajustable depuis
   Elementor (taille des cases, espacement entre mois, marges du cadre). */
.lcal-body {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
}

.lcal-months {
    display: flex;
    flex-wrap: nowrap;
    gap: 44px;
    flex: 1 1 auto;
    width: 100%;
    justify-content: space-between;
}

/* flex: 1 1 0 -> les mois se partagent la largeur a egalite */
.lcal-month { flex: 1 1 0; min-width: 0; }

.lcal-month-name {
    text-align: center;
    font-weight: 600;
    margin-bottom: 10px;
}

.lcal-dow,
.lcal-days {
    display: grid;
    /* fractions et non largeur fixe : la grille remplit le mois */
    grid-template-columns: repeat(7, 1fr);
    width: 100%;
}

.lcal-dow span {
    text-align: center;
    font-size: 12px;
    opacity: 0.7;
    padding-bottom: 6px;
}

.lcal-day {
    min-height: var(--lcal-day-size);
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    line-height: 1.1;
    border-radius: 50%;
    /* lecture seule : aucun curseur d'interaction */
    cursor: default;
    user-select: none;
}

.lcal-day.is-empty { visibility: hidden; }

/* Jour dont la nuit ET la veille sont occupees. Un jour "depart uniquement"
   n'entre pas ici : il s'affiche comme un jour libre. */
.lcal-day.is-booked {
    color: #b0b0b0;
    text-decoration: line-through;
}

.lcal-day.is-past { opacity: 0.35; }

.lcal-day.is-today { font-weight: 700; }

/* Emplacement prevu pour le prix par nuit. Masque tant que la donnee
   n'est pas alimentee : le simple fait d'activer le reglage l'affichera. */
.lcal-price {
    display: block;
    font-size: 10px;
    line-height: 1;
    opacity: 0.8;
    margin-top: 1px;
}

.lcal-nav {
    background: none;
    border: 0;
    font-size: 26px;
    line-height: 1;
    padding: 0 6px;
    cursor: pointer;
    color: inherit;
}

.lcal-nav[disabled] { opacity: 0.25; cursor: default; }

.lcal-loading {
    text-align: center;
    font-size: 13px;
    opacity: 0.7;
    padding: 12px 0;
}

.lcal-legend {
    display: flex;
    gap: 18px;
    justify-content: center;
    margin-top: 14px;
    font-size: 13px;
}

.lcal-legend-item { display: inline-flex; align-items: center; gap: 6px; }

.lcal-swatch {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    display: inline-block;
    border: 1px solid rgba(0, 0, 0, 0.12);
}

.lcal-swatch-free   { background: #ffffff; }
.lcal-swatch-booked { background: #e0e0e0; }

/* Mobile : un seul mois, cases un peu plus grandes pour rester tactiles. */
@media (max-width: 767px) {
    .lcal { --lcal-day-size: 38px; }
    .lcal-months { gap: 0; }
}

/* Mention : le prix affiche est le tarif nuitee seul. */
.lcal-note {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 12px;
    opacity: 0.7;
    margin-top: 6px;
}

.lcal-legend { flex-wrap: wrap; }


/* ---------- Selection des dates ---------- */

/* Le curseur ne devient une main que si la selection est active ET la date
   choisissable : un jour grise ne doit jamais avoir l'air cliquable. */
.lcal-selectable .lcal-day.is-free { cursor: pointer; }

.lcal-selectable .lcal-day.is-free:hover { outline: 1px solid currentColor; outline-offset: -1px; }

.lcal-day.is-start,
.lcal-day.is-end {
    background: #222;
    color: #fff;
}

.lcal-day.is-between {
    background: rgba(34, 34, 34, 0.08);
    border-radius: 0;
}

/* Pendant le survol, on montre la plage envisagee sans l'appliquer. */
.lcal-day.is-preview { background: rgba(34, 34, 34, 0.05); }

.lcal-message {
    display: none;
    margin-top: 10px;
    padding: 9px 12px;
    background: #fff4e5;
    border: 1px solid #f0c99a;
    border-radius: 6px;
    color: #8a4b00;
    font-size: 13px;
    text-align: center;
}