/* Modale d'accueil : formulaire court (e-mail, deux boutons). */

#modalWelcomePreinscription .modal-dialog { max-width: 500px; }

#modalWelcomePreinscription .cfy-welcome__content {
    position: relative;
    background: var(--cfy-t-surface) !important;
    color: var(--cfy-tx-ink);
    border: 1px solid var(--cfy-t-line-2) !important;
    border-radius: 0 !important;
    box-shadow: inset 0 3px 0 var(--cfy-t-fill), 0 24px 60px var(--cfy-t-shadow);
    padding: var(--cfy-sp-6) var(--cfy-sp-6) var(--cfy-sp-4);
    font-family: var(--cfy-font-sans, inherit);
    text-align: center;
}

#modalWelcomePreinscription .cfy-welcome__close {
    position: absolute;
    top: var(--cfy-sp-2);
    right: var(--cfy-sp-2);
    width: var(--cfy-ctl-sm);
    height: var(--cfy-ctl-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: var(--cfy-tx-muted);
    border: 1px solid transparent;
    border-radius: 0;
    cursor: pointer;
}
#modalWelcomePreinscription .cfy-welcome__close:hover,
#modalWelcomePreinscription .cfy-welcome__close:focus-visible {
    color: var(--cfy-t-accent);
    border-color: var(--cfy-t-line-2);
}

/* En-tête */
#modalWelcomePreinscription .cfy-welcome__logo {
    display: block;
    width: 180px;
    height: auto;
    margin: 0 auto var(--cfy-sp-4);
    filter: none !important;
}
body.dark-mode #modalWelcomePreinscription .cfy-welcome__logo.cfy-brand-logo--on-light,
body:not(.dark-mode) #modalWelcomePreinscription .cfy-welcome__logo.cfy-brand-logo--on-dark { display: none; }

#modalWelcomePreinscription .cfy-welcome__eyebrow {
    margin: 0 0 var(--cfy-sp-2);
    font-size: var(--cfy-fs-caption);
    font-weight: var(--cfy-fw-semibold);
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--cfy-tx-accent-strong, var(--cfy-tx-accent));
}
#modalWelcomePreinscription .cfy-welcome__title {
    margin: 0 0 var(--cfy-sp-2);
    font-size: var(--cfy-fs-h3);
    font-weight: var(--cfy-fw-bold);
    line-height: var(--cfy-lh-snug);
    letter-spacing: var(--cfy-ls-title);
    color: var(--cfy-tx-ink);
}
#modalWelcomePreinscription .cfy-welcome__lead {
    margin: 0 0 var(--cfy-sp-5);
    font-size: var(--cfy-fs-md);
    font-weight: var(--cfy-fw-regular);
    line-height: var(--cfy-lh-body);
    color: var(--cfy-tx-ink-2);
}

#modalWelcomePreinscription .cfy-welcome__audience {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr) minmax(0, 1fr);
    gap: var(--cfy-sp-2);
    margin: 0 0 var(--cfy-sp-3);
    padding: 0;
    list-style: none;
}
#modalWelcomePreinscription .cfy-welcome__audience li {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: var(--cfy-sp-2) var(--cfy-sp-2);
    background: var(--cfy-t-surface-2);
    border: 1px solid var(--cfy-t-line-2);
    border-radius: 0;
    font-size: var(--cfy-fs-sm);
    font-weight: var(--cfy-fw-semibold);
    line-height: var(--cfy-lh-snug);
    color: var(--cfy-tx-ink);
    text-align: center;
    overflow-wrap: normal;
    hyphens: manual;
    text-wrap: balance;
}

/* Formulaire */
#modalWelcomePreinscription .cfy-welcome__form {
    padding: var(--cfy-sp-4);
    background: var(--cfy-t-surface-2);
    border: 1px solid var(--cfy-t-line);
    text-align: left;
}
#modalWelcomePreinscription .cfy-welcome__cta {
    margin: 0 0 var(--cfy-sp-3);
    font-size: var(--cfy-fs-base);
    font-weight: var(--cfy-fw-semibold);
    color: var(--cfy-tx-ink);
    text-align: center;
}
#modalWelcomePreinscription .cfy-welcome__reassure {
    font-size: var(--cfy-fs-sm);
    font-weight: var(--cfy-fw-regular);
    line-height: var(--cfy-lh-body);
    color: var(--cfy-tx-ink-2);
}
#modalWelcomePreinscription .cfy-welcome__tag {
    display: block;
    margin-top: var(--cfy-sp-1);
    font-weight: var(--cfy-fw-semibold);
    color: var(--cfy-tx-accent-strong, var(--cfy-tx-accent));
}
#modalWelcomePreinscription .cfy-welcome__input {
    display: block;
    width: 100%;
    height: var(--cfy-ctl-lg);
    padding: 0 var(--cfy-sp-3);
    background: var(--cfy-t-surface);
    color: var(--cfy-tx-ink);
    border: 1px solid var(--cfy-t-line-2);
    border-radius: 0;
    font-family: inherit;
    font-size: var(--cfy-fs-md);
    box-shadow: none;
}
#modalWelcomePreinscription .cfy-welcome__input::placeholder { color: var(--cfy-tx-muted); opacity: 1; }
#modalWelcomePreinscription .cfy-welcome__input:focus {
    outline: none;
    border-color: var(--cfy-t-accent);
    box-shadow: 0 0 0 2px rgba(var(--cfy-t-accent-rgb), .25);
}
#modalWelcomePreinscription .cfy-welcome__input[aria-invalid="true"] { border-color: var(--cfy-tx-danger); }

#modalWelcomePreinscription .cfy-welcome__err {
    min-height: 0;
    margin-top: var(--cfy-sp-1);
    font-size: var(--cfy-fs-caption);
    font-weight: var(--cfy-fw-medium);
    color: var(--cfy-tx-danger);
}
#modalWelcomePreinscription .cfy-welcome__err:empty { display: none; }

/* Champ masqué hors écran */
#modalWelcomePreinscription .cfy-welcome__hp {
    position: absolute !important;
    left: -9999px !important;
    width: 1px;
    height: 1px;
    opacity: 0;
}

/* Boutons */
#modalWelcomePreinscription .cfy-welcome__actions {
    display: flex;
    flex-direction: column;
    gap: var(--cfy-sp-2);
    margin-top: var(--cfy-sp-4);
}
#modalWelcomePreinscription .cfy-welcome__btn {
    width: 100%;
    border-radius: 0 !important;
    font-weight: var(--cfy-fw-semibold);
    text-transform: none;
}
#modalWelcomePreinscription .cfy-welcome__btn--primary {
    min-height: var(--cfy-ctl-lg);
    font-size: var(--cfy-fs-md);
    background: linear-gradient(180deg, var(--cfy-t-fill-hi), var(--cfy-t-fill) 60%, var(--cfy-t-fill-lo)) !important;
    color: var(--cfy-t-on-fill) !important;
    border: 1px solid var(--cfy-t-fill-lo) !important;
}
#modalWelcomePreinscription .cfy-welcome__btn--primary:hover,
#modalWelcomePreinscription .cfy-welcome__btn--primary:focus-visible {
    filter: brightness(1.08);
    box-shadow: 0 0 0 2px rgba(var(--cfy-t-fill-rgb), .3);
}
#modalWelcomePreinscription .cfy-welcome__btn--secondary {
    min-height: var(--cfy-ctl-md);
    font-size: var(--cfy-fs-sm);
    background: var(--cfy-t-surface) !important;
    color: var(--cfy-tx-ink-2) !important;
    border: 1px solid var(--cfy-t-line-2) !important;
}
#modalWelcomePreinscription .cfy-welcome__btn--secondary:hover,
#modalWelcomePreinscription .cfy-welcome__btn--secondary:focus-visible {
    border-color: var(--cfy-t-accent) !important;
    color: var(--cfy-t-accent) !important;
}
#modalWelcomePreinscription .cfy-welcome__btn:disabled { opacity: .6; cursor: progress; }

#modalWelcomePreinscription .cfy-welcome__status {
    margin-top: var(--cfy-sp-3);
    font-size: var(--cfy-fs-sm);
    font-weight: var(--cfy-fw-medium);
    text-align: center;
    color: var(--cfy-tx-muted);
}
#modalWelcomePreinscription .cfy-welcome__status:empty { display: none; }
#modalWelcomePreinscription .cfy-welcome__status.is-success { color: var(--cfy-tx-success); }
#modalWelcomePreinscription .cfy-welcome__status.is-error { color: var(--cfy-tx-danger); }

/* Pied */
#modalWelcomePreinscription .cfy-welcome__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--cfy-sp-1) var(--cfy-sp-3);
    margin-top: var(--cfy-sp-4);
    font-size: var(--cfy-fs-caption);
    color: var(--cfy-tx-muted);
}
#modalWelcomePreinscription .cfy-welcome__link { color: var(--cfy-tx-link); text-decoration: underline; }
#modalWelcomePreinscription .cfy-welcome__later {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-weight: var(--cfy-fw-semibold);
    color: var(--cfy-tx-ink-2);
    text-decoration: underline;
    cursor: pointer;
}
#modalWelcomePreinscription .cfy-welcome__later:hover { color: var(--cfy-t-accent); }

@media (max-width: 575.98px) {
    #modalWelcomePreinscription .modal-dialog { margin: var(--cfy-sp-4); }
    #modalWelcomePreinscription .cfy-welcome__content { padding: var(--cfy-sp-5) var(--cfy-sp-4) var(--cfy-sp-4); }
    #modalWelcomePreinscription .cfy-welcome__title { font-size: var(--cfy-fs-h4); }
    #modalWelcomePreinscription .cfy-welcome__form { padding: var(--cfy-sp-3); }
    #modalWelcomePreinscription .cfy-welcome__audience li { padding: var(--cfy-sp-2) var(--cfy-sp-1); font-size: var(--cfy-fs-caption); }
}
