/*
 Theme Name:   Atelier Arteli
 Theme URI:    http://localhost/atelierarteli
 Description:  Thème enfant d'Astra pour Atelier Artéli
 Author:       Atelier Artéli
 Author URI:   http://localhost/atelierarteli
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child
*/

/* Police Fave Script Bold (logo) */
@font-face {
    font-family: 'Fave Script';
    src: url('fonts/fave-script-bold.woff2') format('woff2'),
         url('fonts/fave-script-bold.woff') format('woff'),
         url('fonts/fave-script-bold.ttf') format('truetype'),
         url('fonts/fave-script-bold.eot');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    color-scheme: light;
    --color-text: #702928;
    --art-color-muted: #999;
    --border-art: rgba(112,41,40,0.13);
    --bdg-1-bg: #F5E8E8;
    --bdg-1-tx: #702928;
    --bdg-2-bg: #FFE8E6;
    --bdg-2-tx: #8B2A22;
    --bdg-3-bg: #FDF0E0;
    --bdg-3-tx: #7B3800;
    --bdg-4-bg: #FFFAEB;
    --bdg-4-tx: #7A4F00;
}

.title-no-margin h1, .title-no-margin h2, .title-no-margin h3, .title-no-margin h4, .title-no-margin h5, .title-no-margin h6 {
    margin: 0 !important;
}

h1.title-no-margin, h2.title-no-margin, h3.title-no-margin, h4.title-no-margin, h5.title-no-margin, h6.title-no-margin {
    margin: 0 !important;
}

.no-margin p {
    margin: 0 !important
}

/* Chaque ligne : label à gauche, input à droite */
.form-field p {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 15px;
}

/* Supprimer le <br> généré par CF7 */
.form-field p br {
    display: none;
}

/* Label : largeur fixe pour aligner les inputs */
.form-field .custom-label {
    width: 200px;
    min-width: 200px;
    font-weight: 400;
    font-size: 16px;
}

.form-field .custom-label.text-color-secondary {
    color: #FAF0E6 !important;
}

/* Input : juste une ligne en bas, pas de box */
.form-field  .wpcf7-form-control {
    flex: 1;
    outline: none;
    font-size: 16px;
    border-radius: 0;
}

.text-color-secondary .form-field  .wpcf7-form-control {
    color: #FAF0E6 !important;
}

/* Textarea : même style ligne, hauteur réduite */
.form-field .wpcf7-textarea {
    resize: none;
    min-height: 40px;
}

/* Responsive */
@media (max-width: 767px) {
    .form-field p {
        flex-direction: column;
        align-items: flex-start;
    }
    .form-field .custom-label {
        width: 100%;
        min-width: 100%;
        margin-bottom: 5px;
    }
    .form-field .custom-label.text-color-secondary {
        color: #FAF0E6 !important;
    }
    .text-color-secondary .form-field  .wpcf7-form-control {
        color: #FAF0E6 !important;
    }
}

/* Lightbox Elementor — bouton fermer accessible sur mobile
   Sur mobile, .elementor-swiper-button-next couvre 20% de la largeur
   à pleine hauteur et bloque le touch sur le bouton X (z-index:2).
   On le passe en position fixed au-dessus de tout. */
@media (max-width: 767px) {
    .elementor-lightbox .dialog-lightbox-close-button {
        position: fixed;
        top: 10px;
        inset-inline-end: 10px;
        right: 10px;
        z-index: 99999;
        padding: 14px;
        background: rgba(0, 0, 0, 0.45);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* Message de succès (vert par défaut) */
.wpcf7-response-output.wpcf7-mail-sent-ok,
.wpcf7 form.sent .wpcf7-response-output {
    color: #f5f0e8;
    border-color: #f5f0e8;
    background: rgba(255, 255, 255, 0.1);
    font-size: 14px;
    text-align: center;
    padding: 12px 20px;
}

/* Message d'erreur global (rouge par défaut) */
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
    color: #ff6b6b;
    border-color: #ff6b6b;
    background: rgba(255, 107, 107, 0.1);
}

/* Erreur de validation (champs non remplis) */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    color: #ffa94d;
    border-color: #ffa94d;
    background: rgba(255, 169, 77, 0.1);
}

/* Message d'erreur sous chaque champ individuel */
.wpcf7-not-valid-tip {
    color: #ff6b6b;
    font-size: 12px;
    margin-top: 5px;
}

/* Spinner de chargement pendant l'envoi */
.wpcf7 .wpcf7-spinner {
    border-color: #f5f0e8;
}

#list-ateliers .elementor-widget-image {
    overflow: hidden;
}

#list-ateliers .atelier {
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
    border-radius: 5px
}

#list-ateliers img {
    transition: transform 0.5s ease;
    border-radius: 5px 5px 0 0;
}

#list-ateliers img:hover {
    transform: scale(1.05);
}

.elementor-widget-arteli_planning_image figure {
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.5) !important;
}

.art-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 3px;
    margin-bottom: 10px;
}

.art-badge.badge-1 {
    background: var(--bdg-1-bg, #F5E8E8);
    color: var(--bdg-1-tx, #702928);
}
.art-badge.badge-2 {
    background: var(--bdg-2-bg, #FFE8E6);
    color: var(--bdg-2-tx, #8B2A22);
}
.art-badge.badge-3 {
    background: var(--bdg-3-bg, #FDF0E0);
    color: var(--bdg-3-tx, #7B3800);
}
.art-badge.badge-4 {
    background: var(--bdg-4-bg, #FFFAEB);
    color: var(--bdg-4-tx, #7A4F00);
}

.zones-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.zone-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 0;
    border-bottom: 1px solid var(--border-art);
}
.zone-item:last-child { border-bottom: none; }
.zdot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--color-text);
    flex-shrink: 0;
}
.zdot.muted { background: var(--art-color-muted); }
.zone-name { font-size: 15px; color: var(--color-text); }
.zone-dept {
    font-size: 12px;
    color: var(--art-color-muted);
    margin-left: auto;
}

.zone-muted .zone-name {
    color: var(--art-color-muted) !important;
}