/*
 * SLM Ateliers — page de l'atelier sur le site.
 * Mise en page en Flexbox uniquement (CSS Grid ne s'affiche pas correctement sur ce site).
 */

/* « Retrait sur place gratuit » n'a pas de sens pour un atelier. Le <body>
   du thème n'a pas de classes (pas de body_class()) : on vise donc la mention
   qui suit le formulaire de l'atelier dans le même bloc. */
.slm-produit-atelier .slm-recap-livraison,
.slm-atelier-form ~ .slm-recap-livraison,
.slm-atelier-vide ~ .slm-recap-livraison {
    display: none;
}

.slm-atelier-par-personne {
    font-size: 0.7em;
    font-weight: normal;
    color: #666;
}

.slm-atelier-form {
    margin: 1.2em 0;
}

.slm-atelier-form .slm-atelier-titre {
    margin: 0 0 0.6em;
    font-size: 1.15em;
    color: var(--slm-green-dark, #3f6b2a);
}

.slm-atelier-seances {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    margin-bottom: 1.2em;
}

.slm-atelier-seance {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3em 0.8em;
    padding: 0.7em 0.9em;
    border: 2px solid #e2e2d8;
    border-radius: 6px;
    background: #fdfcf5;
    cursor: pointer;
}

.slm-atelier-seance:hover {
    border-color: var(--slm-green, #5b8c3e);
}

.slm-atelier-seance:has(input:checked) {
    border-color: var(--slm-green, #5b8c3e);
    background: #f1f6ec;
}

.slm-atelier-seance input {
    margin: 0;
}

.slm-atelier-seance-date {
    display: inline-block;
    font-weight: 600;
}

.slm-atelier-seance-date::first-letter {
    text-transform: uppercase;
}

.slm-atelier-seance-places {
    margin-left: auto;
    font-size: 0.9em;
    color: var(--slm-green-dark, #3f6b2a);
}

.slm-atelier-seance.is-complet {
    opacity: 0.6;
    cursor: not-allowed;
}

.slm-atelier-seance.is-complet .slm-atelier-seance-places {
    color: #a33;
}

.slm-atelier-ligne {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.8em;
    margin-bottom: 0.8em;
}

.slm-atelier-ligne label {
    font-weight: 600;
}

.slm-atelier-ligne input[type="number"] {
    width: 5em;
}

.slm-atelier-total {
    font-size: 1.05em;
    margin: 0 0 1em;
}

.slm-atelier-modes {
    display: flex;
    flex-direction: column;
    gap: 0.4em;
    border: 0;
    padding: 0;
    margin: 0 0 1em;
}

.slm-atelier-modes legend {
    font-weight: 600;
    margin-bottom: 0.3em;
    padding: 0;
}

.slm-atelier-modes label {
    cursor: pointer;
}

.slm-atelier-coordonnees {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6em 1em;
    margin-bottom: 1em;
    padding: 0.8em;
    background: #f7f7f2;
    border-radius: 6px;
}

/* display:flex ci-dessus l'emporterait sur l'attribut hidden posé par le script. */
.slm-atelier-coordonnees[hidden] {
    display: none;
}

.slm-atelier-coordonnees p {
    display: flex;
    flex-direction: column;
    flex: 1 1 calc(50% - 1em);
    min-width: 200px;
    margin: 0;
}

.slm-atelier-coordonnees p.slm-atelier-note {
    flex-basis: 100%;
}

.slm-atelier-coordonnees input {
    padding: 0.5em;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* Champ piège pour les robots : invisible pour les visiteurs. */
.slm-atelier-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.slm-atelier-note {
    font-size: 0.9em;
    color: #555;
}

.slm-atelier-vide {
    padding: 0.8em 1em;
    background: #f7f7f2;
    border-left: 3px solid var(--slm-gold, #826E08);
}