/* ── Oanaqa Booking – Styles v3 ──────────────────────────────────── */

.oanaqa-booking-wrap,
.woocommerce .oanaqa-booking-wrap,
.woocommerce-page .oanaqa-booking-wrap,
.entry-content .oanaqa-booking-wrap,
.product .oanaqa-booking-wrap {
    font-family: inherit;
    width: 100% !important;
    max-width: none !important;
    padding: 0;
    box-sizing: border-box;
}

/* Header */
.oanaqa-header { text-align: center; margin-bottom: 22px; }
.oanaqa-title  { font-size: 1.45rem; font-weight: 600; margin-bottom: 5px; color: #2c2c2c; }
.oanaqa-subtitle { color: #777; font-size: 0.88rem; margin: 0; }

/* Loading */
.oanaqa-calendar-loading { text-align: center; padding: 40px; color: #999; }
.oanaqa-spinner {
    width: 30px; height: 30px;
    border: 3px solid #eee; border-top-color: #8b7355;
    border-radius: 50%;
    animation: oanaqa-spin 0.7s linear infinite;
    margin: 0 auto 12px;
}
@keyframes oanaqa-spin { to { transform: rotate(360deg); } }

/* ── Calendrier ───────────────────────────────────────────────────── */

.oanaqa-calendar-wrap {
    background: #fff;
    border: 1px solid #e0dbd4;
    border-radius: 16px;
    padding: 24px 28px;
    margin-bottom: 22px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    max-width: 540px;
    margin-left: auto;
    margin-right: auto;
}

/* Header nav : flèches + mois sur une seule ligne */
.oanaqa-cal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    gap: 8px;
}
.oanaqa-cal-monthname {
    font-size: 1rem;
    font-weight: 600;
    color: #2c2c2c;
    flex: 1;
    text-align: center;
    text-transform: capitalize;
    white-space: nowrap;
}
/* Cibler la classe utilisée dans le JS aussi */
.oaac-cal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    gap: 8px;
}
.oanaqa-nav-btn {
    background: none;
    border: 1px solid #e0dbd4;
    border-radius: 50%;
    width: 34px; height: 34px;
    flex-shrink: 0;
    font-size: 1.25rem;
    cursor: pointer;
    color: #2c2c2c;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s, border-color 0.15s;
    padding: 0; line-height: 1;
}
.oanaqa-nav-btn:hover:not(:disabled) { background: #f5f0ea; border-color: #8b7355; }
.oanaqa-nav-btn:disabled { opacity: 0.25; cursor: not-allowed; }

/* Jours de la semaine */
.oanaqa-cal-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    margin-bottom: 4px;
}
.oanaqa-cal-weekdays span {
    text-align: center;
    font-size: 0.68rem;
    font-weight: 700;
    color: #bbb;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 4px 0;
}

/* Grille — aspect-ratio pour des cellules toujours carrées */
.oanaqa-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3px 0;
}

.oanaqa-day {
    position: relative;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.88rem;
    color: #9a9a9a;
    cursor: default;
    user-select: none;
    /* Hauteur min pour éviter trop petit sur mobile */
    min-height: 36px;
    max-height: 64px;
}
.oanaqa-day__num { position: relative; z-index: 2; pointer-events: none; }
.oanaqa-day--empty { visibility: hidden; }
.oanaqa-day--past  { opacity: 0.28; }

/* ── Week-end disponible ── */

/* Bande colorée sur les 3 jours */
.oanaqa-day--avail::before {
    content: '';
    position: absolute;
    top: 8%; bottom: 8%;
    left: 0; right: 0;
    background: #f3ede3;
    z-index: 0;
}
.oanaqa-day--avail .oanaqa-day__num { color: #5c4030; font-weight: 600; }

/* Coins arrondis seulement sur ven (gauche) et dim (droite) */
.oanaqa-day--avail-start::before  { border-radius: 100px 0 0 100px; }
.oanaqa-day--avail-end::before    { border-radius: 0 100px 100px 0; }
.oanaqa-day--avail-middle::before { border-radius: 0; }

/* Cercle accentué sur le vendredi — taille fixe centrée */
.oanaqa-day--avail-start::after {
    content: '';
    position: absolute;
    width: 72%; height: 72%;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    background: #8b7355;
    border-radius: 50%;
    z-index: 1;
}
.oanaqa-day--avail-start .oanaqa-day__num { color: #fff; }

/* Cursor pointer sur les 3 */
.oanaqa-day--avail { cursor: pointer; }
.oanaqa-day--avail:hover::before { background: #e8ddd0; }
.oanaqa-day--avail-start:hover::after { background: #7a6347; }

/* Vendredi fin de mois (sam/dim n'existent pas) — couper la bande à droite */
.oanaqa-day--avail-start-only::before { border-radius: 100px; }

/* ── Week-end sélectionné ── */
.oanaqa-day--sel::before { background: #e6ddd0 !important; }
.oanaqa-day--sel-start::before { border-radius: 100px 0 0 100px !important; }
.oanaqa-day--sel-end::before   { border-radius: 0 100px 100px 0 !important; }
.oanaqa-day--sel-start::after  { background: #5c3d1e !important; }
.oanaqa-day--sel .oanaqa-day__num { color: #3a2008 !important; font-weight: 700; }
.oanaqa-day--sel-start .oanaqa-day__num { color: #fff !important; }
.oanaqa-day--sel-start-only::before { border-radius: 100px !important; }

/* Légende */
.oanaqa-cal-legend {
    margin-top: 14px;
    font-size: 0.72rem;
    color: #aaa;
    display: flex;
    align-items: center;
    gap: 6px;
}
.oanaqa-legend-dot {
    width: 11px; height: 11px;
    border-radius: 50%;
    background: #8b7355;
    flex-shrink: 0;
}

.oanaqa-no-slots { text-align: center; padding: 40px; color: #999; font-style: italic; }

/* ── Formulaire ───────────────────────────────────────────────────── */

.oanaqa-booking-form {
    background: #faf8f5;
    border: 1px solid #e8e2d9;
    border-radius: 16px;
    padding: 22px 26px;
}

.oanaqa-selected-summary {
    display: flex; align-items: center; gap: 12px;
    margin-bottom: 22px; padding-bottom: 16px;
    border-bottom: 1px solid #e8e2d9;
}
.oanaqa-selected-summary .oanaqa-icon { font-size: 1.9rem; }
.oanaqa-selected-summary div { flex: 1; }
.oanaqa-selected-summary strong { font-size: 0.97rem; color: #2c2c2c; }
.oanaqa-selected-summary p { margin: 2px 0 0; color: #888; font-size: 0.8rem; }

.oanaqa-back {
    background: none; border: none; color: #8b7355;
    cursor: pointer; font-size: 0.82rem;
    padding: 5px 9px; border-radius: 6px;
    transition: background 0.15s; white-space: nowrap;
}
.oanaqa-back:hover { background: #f0ebe3; }

.oanaqa-label { font-weight: 600; color: #2c2c2c; margin-bottom: 10px; font-size: 0.93rem; }
.oanaqa-payment-options {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 10px; margin-bottom: 18px;
}
.oanaqa-payment-option { cursor: pointer; }
.oanaqa-payment-option input[type="radio"] { display: none; }
.oanaqa-payment-card {
    display: flex; flex-direction: column;
    border: 2px solid #e8e2d9; border-radius: 10px;
    padding: 13px 15px; transition: all 0.15s; background: #fff;
}
.oanaqa-payment-option input:checked + .oanaqa-payment-card {
    border-color: #8b7355; background: #fdf9f5;
}
.oanaqa-payment-card .oanaqa-amount { font-size: 1.25rem; font-weight: 700; color: #2c2c2c; }
.oanaqa-payment-card .oanaqa-desc   { font-size: 0.86rem; font-weight: 600; color: #444; margin-top: 3px; }
.oanaqa-payment-card .oanaqa-sub    { font-size: 0.74rem; color: #999; margin-top: 2px; }

.oanaqa-btn-reserve {
    width: 100%; padding: 14px;
    background: #8b7355; color: #fff; border: none;
    border-radius: 10px; font-size: 0.97rem; font-weight: 600;
    cursor: pointer; transition: background 0.2s; letter-spacing: 0.02em;
}
.oanaqa-btn-reserve:hover    { background: #7a6347; }
.oanaqa-btn-reserve:disabled { background: #ccc; cursor: not-allowed; }

.oanaqa-notice { text-align: center; font-size: 0.73rem; color: #aaa; margin-top: 7px; }
.oanaqa-error  {
    background: #fdecea; color: #c62828;
    border-radius: 8px; padding: 11px 15px;
    margin-top: 10px; font-size: 0.85rem;
}

/* Mobile */
@media (max-width: 480px) {
    .oanaqa-booking-wrap { width: 100%; }
    .oanaqa-cal-weekdays span { font-size: 0.6rem; }
    .oanaqa-day { font-size: 0.76rem; }
    .oanaqa-payment-options { grid-template-columns: 1fr; }
    .oanaqa-booking-form { padding: 16px; }
}

/* ── Calendrier jours (journée/pause) ────────────────────────────── */
.oanaqa-day--avail-day {
    cursor: pointer;
}
.oanaqa-day--avail-day::after {
    content: '';
    position: absolute;
    inset: 4px;
    background: #8b7355;
    border-radius: 50%;
    z-index: 1;
}
.oanaqa-day--avail-day .oanaqa-day__num { color: #fff !important; font-weight: 700; z-index: 2; }
.oanaqa-day--avail-day:hover::after { background: #7a6347; }
.oanaqa-day--sel-day::after { background: #5c3d1e !important; }

/* ── Sélecteur créneaux ──────────────────────────────────────────── */
.oanaqa-slot-header {
    display: flex; align-items: center; justify-content: space-between;
    margin: 16px 0 8px; flex-wrap: wrap; gap: 8px;
}
.oanaqa-slot-header strong { font-size: 0.95rem; color: #2c2c2c; }
.oanaqa-back-date {
    background: none; border: none; color: #8b7355;
    cursor: pointer; font-size: 0.82rem; padding: 4px 8px;
    border-radius: 6px; transition: background 0.15s;
}
.oanaqa-back-date:hover { background: #f0ebe3; }
.oanaqa-slot-subtitle { color: #777; font-size: 0.85rem; margin: 0 0 10px; }
.oanaqa-slots-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 8px; margin-bottom: 16px;
}
.oanaqa-slot-btn {
    padding: 10px 6px; border: 2px solid #e0dbd4;
    border-radius: 8px; background: #fff; cursor: pointer;
    font-size: 0.85rem; font-weight: 600; color: #2c2c2c;
    transition: all 0.15s; text-align: center;
}
.oanaqa-slot-btn:hover  { border-color: #8b7355; background: #fdf9f5; }
.oanaqa-slot-btn.selected { border-color: #8b7355; background: #8b7355; color: #fff; }

/* ── Sélecteur de type [oanaqa_all] ─────────────────────────── */
.oanaqa-type-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}
.oanaqa-type-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 18px 12px;
    border: 2px solid #e0dbd4;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
    transition: all 0.18s;
    text-align: center;
    width: 100%;
}
.oanaqa-type-btn:hover {
    border-color: #8b7355; background: #fdf9f5;
    transform: translateY(-2px); box-shadow: 0 4px 12px rgba(139,115,85,0.12);
}
.oanaqa-type-btn.active {
    border-color: #8b7355; background: #fdf9f5;
    box-shadow: 0 4px 12px rgba(139,115,85,0.18);
}
.oanaqa-type-icon  { font-size: 1.8rem; }
.oanaqa-type-name  { font-weight: 700; font-size: 0.88rem; color: #2c2c2c; }
.oanaqa-type-desc  { font-size: 0.72rem; color: #999; }
.oanaqa-type-price { font-size: 1rem; font-weight: 700; color: #8b7355; }

/* ── Compteur de personnes ───────────────────────────────────────── */
.oanaqa-persons-row {
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid #e8e2d9;
}
.oanaqa-persons-input {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
}
.oanaqa-persons-btn {
    width: 34px; height: 34px;
    border: 1px solid #ddd; border-radius: 50%;
    background: #fff; font-size: 1.1rem; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.15s; color: #2c2c2c;
}
.oanaqa-persons-btn:hover { background: #f0ebe3; border-color: #8b7355; }
#oanaqa-num-persons {
    width: 48px; text-align: center;
    border: 1px solid #ddd; border-radius: 6px;
    padding: 6px; font-size: 1rem; font-weight: 600;
}
.oanaqa-persons-max { font-size: 12px; color: #aaa; }

/* Note stationnement */
.oanaqa-parking-note {
    margin-top: 10px;
    padding: 10px 14px;
    background: #fdf8f0;
    border-left: 3px solid #8b7355;
    border-radius: 0 6px 6px 0;
    font-size: 13px;
    color: #5c4030;
    display: flex;
    gap: 8px;
    align-items: flex-start;
}
.oanaqa-parking-icon { flex-shrink: 0; }

/* Politiques */
.oanaqa-policies { margin-bottom: 18px; }
.oanaqa-policy {
    background: #faf8f5;
    border: 1px solid #e8e2d9;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 13px;
    color: #5c4030;
    margin-bottom: 8px;
}
.oanaqa-policy-title {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
    color: #2c2c2c;
}
.oanaqa-policy p { margin: 0; line-height: 1.6; color: #666; }