:root {
    --rdv-couleur-primaire: #1a5f3f;
    --rdv-couleur-primaire-fonce: #0f3d28;
    --rdv-couleur-libre: #ffffff;
    --rdv-couleur-reserve: #e2e2e2;
    --rdv-couleur-verrouille: #f4d4d4;
    --rdv-couleur-texte: #1f2a24;
    --rdv-rayon: 8px;
}

* { box-sizing: border-box; }

body {
    font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    background: #f6f7f5;
    color: var(--rdv-couleur-texte);
    margin: 0;
    padding: 0 0 3rem;
}

.rdv-header {
    background: var(--rdv-couleur-primaire);
    color: #fff;
    padding: 2rem 1.5rem;
    text-align: center;
}
.rdv-header h1 { margin: 0 0 .5rem; font-size: 1.5rem; }
.rdv-header p { margin: 0; opacity: .9; }

#rdv-app { max-width: 960px; margin: 2rem auto; padding: 0 1rem; }

#rdv-chargement { text-align: center; color: #666; padding: 2rem; }

.rdv-jour {
    background: #fff;
    border-radius: var(--rdv-rayon);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.rdv-jour h2 { margin: 0 0 .75rem; font-size: 1.05rem; text-transform: capitalize; }
.rdv-jour-indisponible { color: #999; font-style: italic; margin: 0; }

.rdv-grille-creneaux {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: .5rem;
}

.rdv-creneau {
    padding: .6rem .4rem;
    border-radius: var(--rdv-rayon);
    border: 1px solid #d7dad7;
    font-size: .9rem;
    cursor: pointer;
    background: var(--rdv-couleur-libre);
    transition: background .15s, transform .1s;
}
.rdv-creneau:hover:not(:disabled) { background: #eaf5ef; border-color: var(--rdv-couleur-primaire); }
.rdv-creneau:active:not(:disabled) { transform: scale(.97); }
.rdv-creneau:disabled { cursor: not-allowed; color: #999; }
.rdv-creneau-reserve { background: var(--rdv-couleur-reserve); text-decoration: line-through; }
.rdv-creneau-verrouille { background: var(--rdv-couleur-verrouille); }

.rdv-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.45);
    padding: 1rem;
    z-index: 100;
    display: none;
}
.rdv-overlay:not([hidden]) {
    display: flex;
    align-items: center;
    justify-content: center;
}
.rdv-popin {
    background: #fff;
    border-radius: var(--rdv-rayon);
    padding: 1.75rem;
    max-width: 420px;
    width: 100%;
    position: relative;
    max-height: 90vh;
    overflow-y: auto;
}
.rdv-popin h2 { margin-top: 0; }
.rdv-popin-fermer {
    position: absolute; top: .75rem; right: .75rem;
    background: none; border: none; font-size: 1.5rem; cursor: pointer; color: #888;
    line-height: 1;
}

#rdv-form-reservation label { display: block; margin: .85rem 0 .3rem; font-size: .85rem; font-weight: 600; }
#rdv-form-reservation input,
#rdv-form-reservation textarea {
    width: 100%;
    padding: .55rem .65rem;
    border: 1px solid #d7dad7;
    border-radius: 6px;
    font-size: .95rem;
    font-family: inherit;
}

.rdv-erreur { color: #b3261e; font-size: .88rem; margin-top: .75rem; }

.rdv-popin-boutons {
    display: flex; justify-content: flex-end; gap: .6rem;
    margin-top: 1.25rem;
}
.rdv-popin-boutons button {
    padding: .55rem 1.1rem;
    border-radius: 6px;
    border: 1px solid #d7dad7;
    background: #fff;
    cursor: pointer;
    font-size: .9rem;
}
.rdv-popin-boutons button[type="submit"],
#rdv-fermer-succes {
    background: var(--rdv-couleur-primaire);
    border-color: var(--rdv-couleur-primaire);
    color: #fff;
}
.rdv-popin-boutons button[type="submit"]:hover { background: var(--rdv-couleur-primaire-fonce); }

.rdv-page-message {
    max-width: 560px;
    margin: 3rem auto;
    background: #fff;
    padding: 2rem;
    border-radius: var(--rdv-rayon);
    text-align: center;
}
