/**
 * Formulaire de newsletter et popup — Le Cueilleur / systeme.io
 *
 * Volontairement sobre : la feuille est chargée avant `child-style`, donc tout
 * peut être surchargé depuis style.css du thème enfant.
 */

.lec-sio-form { margin: 0; }

/* Un formulaire réglé sur le titre « widget » utilise le balisage de Storefront
   (<span class="gamma widget-title">) et hérite de son style ; c'est le cas du
   pied de page. Cette règle vaut donc pour le popup et pour tout formulaire posé
   par code court avec un titre normal. */
.lec-sio-form__title {
    margin: 0 0 .35em;
    font-weight: 600;
}

/* Le thème enfant met tous les <label> en gras (style.css : « label, .wpcf7 h3 »)
   pour Contact Form 7 et WPForms. On rétablit une graisse normale ici seulement,
   sans toucher à cette règle dont dépendent les autres formulaires du site. */
.lec-sio-form label {
    font-weight: 400;
}

.lec-sio-form__text {
    margin: 0 0 .75em;
    font-size: .9em;
    line-height: 1.45;
}

.lec-sio-form__field {
    display: flex;
    flex-wrap: wrap;
    gap: .5em;
    margin: 0 0 .6em;
}

.lec-sio-form__field input[type="email"] {
    flex: 1 1 12em;
    min-width: 0;
    padding: .55em .7em;
}

.lec-sio-form__field--name input[type="text"] {
    flex: 1 1 100%;
    min-width: 0;
    padding: .55em .7em;
}

.lec-sio-form__field button {
    flex: 0 0 auto;
    padding: .55em 1.1em;
    background: #0081ff;
    border: 0;
    color: #fff;
    cursor: pointer;
}

.lec-sio-form__field button:hover,
.lec-sio-form__field button:focus {
    background: #0069d1;
}

.lec-sio-form__consent {
    margin: 0 0 .6em;
    font-size: .78em;
    line-height: 1.4;
}

.lec-sio-form__consent label {
    display: flex;
    align-items: flex-start;
    gap: .5em;
}

.lec-sio-form__consent input { margin-top: .2em; }

/* Piège à robots : masqué sans display:none, que certains robots détectent. */
.lec-sio-form__hp {
    position: absolute !important;
    left: -9999px !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.lec-sio-form__message {
    margin: 0;
    font-size: .85em;
    min-height: 1.2em;
}

.lec-sio-form__message.is-error { color: #b32d2e; }
.lec-sio-form__message.is-success { color: #1a7f37; }

.lec-sio-form.is-busy { opacity: .6; pointer-events: none; }

/* Après inscription : champs grisés, bouton neutralisé. */
.lec-sio-form.is-done input[type="email"],
.lec-sio-form.is-done input[type="text"] {
    background: #f1f1f1;
    color: #666;
    cursor: not-allowed;
}

.lec-sio-form.is-done button[type="submit"] {
    background: #d6d6d6;
    color: #555;
    cursor: not-allowed;
}

.lec-sio-form.is-done .lec-sio-form__consent {
    opacity: .7;
}


/* --- Popup ------------------------------------------------------------- */

.lec-sio-popup[hidden] { display: none; }

.lec-sio-popup {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.lec-sio-popup__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .5);
}

.lec-sio-popup__box {
    position: relative;
    width: 100%;
    max-width: 380px;
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    padding: 1.75rem 1.5rem 1.25rem;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
    animation: lec-sio-slideup .28s ease-out;
}

@keyframes lec-sio-slideup {
    from { transform: translateY(24px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .lec-sio-popup__box { animation: none; }
}

.lec-sio-popup__close {
    position: absolute;
    top: .4rem;
    right: .5rem;
    width: 2rem;
    height: 2rem;
    padding: 0;
    background: #000;
    border: 0;
    border-radius: 50%;
    color: #fff;
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
}

.lec-sio-popup__image {
    display: block;
    width: 80px;
    height: auto;
    margin: 0 auto .75rem;
}
