/* ==========================================================================
   SOLARTECH — Quote Area : formulaire multi-panneaux (wizard V3)
   Auteur : FLASSCHOEN Jonathan — 2026-05-25 — v2.1.0

   Hérite du theme Konta-Solartech (--theme-color #AFCA0B, --title-color #0E121D,
   --body-color #4D5765, --smoke-color #F8F8F8).

   FIX V3 : remplacement des pseudo-elements Font Awesome \f00c par unicode
   universel ✓ pour éviter le bug "carré" si la font FA n'est pas chargée.
   ========================================================================== */

/* -- Conteneur wizard -- */
.st-wizard { position: relative; width: 100%; }

/* -- FIX BACKGROUND ZOOM : background-attachment fixed pour stabiliser l'image
   et éviter le "zoom" qui suit la hauteur du contenu (problème en cover sur div
   très haute). En mobile, on bascule sur scroll (fixed cassé sur iOS / Android). -- */
.th-container6 {
    background-attachment: fixed !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
@media (max-width: 991.98px) {
    .th-container6 {
        background-attachment: scroll !important;
        background-size: cover !important;
    }
}

/* -- FIX ALIGNEMENT VERT/BLANC : la col blanche (col-lg-8) faisait 30px de moins
   que la col verte (col-lg-4). Solution : forcer le row interne en display:flex
   pour étirer les colonnes ET les enfants à la même hauteur. -- */
.contact-wrap4 > .row.gx-0 {
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch !important;
}
.contact-wrap4 > .row.gx-0 > [class*="col-"] {
    display: flex !important;
    flex-direction: column;
}
.contact-wrap4 .bg-theme.box-wrap1,
.contact-wrap4 .contact-form-wrap.bg-white {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 100% !important;
}

/* -- Ancrage scroll pour le bouton CONTACTEZ-NOUS (#rdv-sec) --
   Pas de scroll-behavior:smooth global pour éviter tout effet "auto-scroll"
   indésirable au chargement quand l'URL contient un fragment hash mémorisé. -- */
#rdv-sec { scroll-margin-top: 180px; }  /* compense le header sticky (~167px) */

/* -- Barre de progression du wizard -- */
.st-wizard__progress {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 30px; padding: 0 4px; position: relative;
}
.st-wizard__progress::before {
    content: "";
    position: absolute; top: 18px; left: 4%; right: 4%;
    height: 2px; background-color: #e6e6e6; z-index: 0;
}
.st-wizard__progress-fill {
    position: absolute; top: 18px; left: 4%;
    height: 2px; background-color: var(--theme-color, #AFCA0B);
    z-index: 1; transition: width 0.4s ease-in-out; width: 0%;
}
.st-wizard__step-dot {
    position: relative; z-index: 2;
    display: flex; flex-direction: column; align-items: center;
    flex: 1;
}
/* Demi-step (adresse installation conditionnelle) */
.st-wizard__step-dot--half { flex: 0.5; }
.st-wizard__step-dot--half .st-wizard__step-label {
    font-size: 10px; opacity: 0.8;
}
.st-wizard__step-circle--half {
    width: 22px !important; height: 22px !important;
    margin-top: 7px;
    background-color: #fff;
    border: 2px solid #e6e6e6;
}
.st-wizard__step-dot--half.is-active .st-wizard__step-circle--half,
.st-wizard__step-dot--half.is-done .st-wizard__step-circle--half {
    background-color: var(--theme-color, #AFCA0B);
    border-color: var(--theme-color, #AFCA0B);
}

.st-wizard__step-circle {
    width: 36px; height: 36px; border-radius: 50%;
    background-color: #fff; border: 2px solid #e6e6e6;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 14px; color: #8a92a0;
    transition: all 0.3s ease;
}
.st-wizard__step-dot.is-active .st-wizard__step-circle {
    background-color: var(--theme-color, #AFCA0B);
    border-color: var(--theme-color, #AFCA0B);
    color: #fff;
    box-shadow: 0 0 0 4px rgba(175, 202, 11, 0.18);
}
.st-wizard__step-dot.is-done .st-wizard__step-circle {
    background-color: var(--theme-color, #AFCA0B);
    border-color: var(--theme-color, #AFCA0B);
    color: #fff;
}
/* ✓ unicode (pas d'icône FA pour éviter le bug carré) */
.st-wizard__step-dot.is-done .st-wizard__step-circle::after {
    content: "✓";
    font-family: inherit;
    font-size: 16px;
    line-height: 1;
}
.st-wizard__step-dot.is-done .st-wizard__step-circle-num { display: none; }

.st-wizard__step-label {
    margin-top: 8px; font-size: 11px; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.4px;
    color: #8a92a0; text-align: center; line-height: 1.2;
}
.st-wizard__step-dot.is-active .st-wizard__step-label,
.st-wizard__step-dot.is-done .st-wizard__step-label {
    color: var(--title-color, #0E121D);
}

/* -- Panneaux d'étape -- */
.st-wizard__panel {
    display: none;
    animation: stFadeIn 0.35s ease-in-out;
}
.st-wizard__panel.is-active { display: block; }
@keyframes stFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.st-wizard__panel-title {
    font-size: 22px; font-weight: 700;
    color: var(--title-color, #0E121D);
    margin-bottom: 6px; line-height: 1.2;
}
.st-wizard__panel-subtitle {
    font-size: 14px; color: var(--body-color, #4D5765);
    margin-bottom: 22px;
}
.st-optional {
    font-size: 12px; font-weight: 400; color: var(--body-color);
    text-transform: none; letter-spacing: 0;
}
.st-field-label {
    display: block; margin-bottom: 8px;
    font-weight: 600; color: var(--title-color, #0E121D);
    font-size: 14px;
}

/* -- Textarea agrandissable (limite à ~10 lignes) -- */
.st-textarea-auto {
    resize: vertical;
    min-height: 70px !important;
    max-height: 280px;
    padding: 12px 18px !important;
}

/* ============================================================
   FIX : col-*.form-group écrasé par width:100% du theme Konta
   On force la largeur Bootstrap et on garde inline-block compatible
   avec le flex de .row
   ============================================================ */
.st-wizard .row > .form-group {
    display: block;
}
.st-wizard .row > .form-group[class*="col-"] {
    padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
    padding-left:  calc(var(--bs-gutter-x, 1.5rem) * 0.5);
}
.st-wizard .row > .col-1.form-group  { width: 8.3333% !important;  flex: 0 0 8.3333%;  max-width: 8.3333%; }
.st-wizard .row > .col-2.form-group  { width: 16.6666% !important; flex: 0 0 16.6666%; max-width: 16.6666%; }
.st-wizard .row > .col-3.form-group  { width: 25% !important;      flex: 0 0 25%;      max-width: 25%; }
.st-wizard .row > .col-4.form-group  { width: 33.3333% !important; flex: 0 0 33.3333%; max-width: 33.3333%; }
.st-wizard .row > .col-5.form-group  { width: 41.6666% !important; flex: 0 0 41.6666%; max-width: 41.6666%; }
.st-wizard .row > .col-6.form-group  { width: 50% !important;      flex: 0 0 50%;      max-width: 50%; }
.st-wizard .row > .col-7.form-group  { width: 58.3333% !important; flex: 0 0 58.3333%; max-width: 58.3333%; }
.st-wizard .row > .col-8.form-group  { width: 66.6666% !important; flex: 0 0 66.6666%; max-width: 66.6666%; }
.st-wizard .row > .col-9.form-group  { width: 75% !important;      flex: 0 0 75%;      max-width: 75%; }
.st-wizard .row > .col-10.form-group { width: 83.3333% !important; flex: 0 0 83.3333%; max-width: 83.3333%; }
.st-wizard .row > .col-11.form-group { width: 91.6666% !important; flex: 0 0 91.6666%; max-width: 91.6666%; }
.st-wizard .row > .col-12.form-group { width: 100% !important;     flex: 0 0 100%;     max-width: 100%; }
/* idem col-md-* (utilisé étape 1 et 4 contact) */
@media (min-width: 768px) {
    .st-wizard .row > .col-md-3.form-group  { width: 25% !important;      flex: 0 0 25%;      max-width: 25%; }
    .st-wizard .row > .col-md-4.form-group  { width: 33.3333% !important; flex: 0 0 33.3333%; max-width: 33.3333%; }
    .st-wizard .row > .col-md-6.form-group  { width: 50% !important;      flex: 0 0 50%;      max-width: 50%; }
    .st-wizard .row > .col-md-8.form-group  { width: 66.6666% !important; flex: 0 0 66.6666%; max-width: 66.6666%; }
    .st-wizard .row > .col-md-9.form-group  { width: 75% !important;      flex: 0 0 75%;      max-width: 75%; }
    .st-wizard .row > .col-md-12.form-group { width: 100% !important;     flex: 0 0 100%;     max-width: 100%; }
}
/* Repositionnement des icônes : maintenir leur position absolue à droite du champ */
.st-wizard [class*="col-"].form-group > i.fa-road,
.st-wizard [class*="col-"].form-group > i.fa-city,
.st-wizard [class*="col-"].form-group > i.fa-landmark,
.st-wizard [class*="col-"].form-group > i.fa-user,
.st-wizard [class*="col-"].form-group > i.fa-envelope,
.st-wizard [class*="col-"].form-group > i.fa-phone,
.st-wizard [class*="col-"].form-group > i.fa-mail-bulk,
.st-wizard [class*="col-"].form-group > i.fa-hashtag {
    right: calc((var(--bs-gutter-x, 1.5rem) * 0.5) + 18px);
}

/* ============================================================
   ÉTAPE 3 — Drill-down catégories
   ============================================================ */
.st-cat-view { display: none; animation: stFadeIn 0.3s ease; }
.st-cat-view.is-active { display: block; }

/* Grille des catégories */
.st-cat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
@media (max-width: 767px) {
    .st-cat-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .st-cat-grid { grid-template-columns: 1fr; }
}

.st-cat-tile {
    position: relative;
    background-color: var(--smoke-color, #F8F8F8);
    border: 2px solid transparent;
    border-radius: 0;
    padding: 18px 14px 16px;
    cursor: pointer;
    text-align: left;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 120px;
}
.st-cat-tile--full { grid-column: 1 / -1; }
.st-cat-tile:hover {
    background-color: #fff;
    border-color: rgba(175, 202, 11, 0.5);
    transform: translateY(-2px);
}
.st-cat-tile.has-selection {
    background-color: #fff;
    border-color: var(--theme-color, #AFCA0B);
    box-shadow: 0 4px 14px rgba(175, 202, 11, 0.18);
}
.st-cat-tile__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 44px; height: 44px;
    background-color: rgba(175, 202, 11, 0.15);
    color: var(--theme-color, #AFCA0B);
    border-radius: 0;
    margin-bottom: 10px;
}
.st-cat-tile__label {
    display: block;
    font-size: 13px; font-weight: 700;
    color: var(--title-color, #0E121D);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    line-height: 1.2;
    margin-bottom: 4px;
}
.st-cat-tile__hint {
    display: block;
    font-size: 11px;
    color: var(--body-color, #4D5765);
    line-height: 1.3;
}
.st-cat-tile__count {
    position: absolute;
    top: 10px; right: 10px;
    min-width: 22px; height: 22px;
    padding: 0 6px;
    background-color: var(--theme-color, #AFCA0B);
    color: #fff;
    border-radius: 11px;
    font-size: 11px; font-weight: 700;
    display: none;
    align-items: center; justify-content: center;
}
.st-cat-tile.has-selection .st-cat-tile__count { display: inline-flex; }

/* Vue détail catégorie */
.st-cat-back {
    background: transparent; border: none;
    color: var(--theme-color, #AFCA0B);
    font-weight: 700; font-size: 12px;
    text-transform: uppercase; letter-spacing: 0.4px;
    padding: 6px 0; margin-bottom: 8px;
    cursor: pointer; transition: opacity 0.2s ease;
}
.st-cat-back:hover { opacity: 0.7; }
.st-cat-detail__title {
    font-size: 16px; font-weight: 700;
    color: var(--title-color, #0E121D);
    margin-bottom: 14px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--theme-color, #AFCA0B);
    display: inline-block;
}
.st-cat-motifs {
    display: none;
    flex-direction: column;
    gap: 8px;
}
.st-cat-motifs.is-active { display: flex; }

/* ============================================================
   Cartes CHECKBOX (motifs)
   Layout pleine largeur (1 par ligne) en vue détail
   ============================================================ */
/* Layout flex : case + icône + texte alignés au centre verticalement */
.st-checkbox-card {
    position: relative; cursor: pointer;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background-color: var(--smoke-color, #F8F8F8);
    border: 2px solid transparent;
    transition: all 0.18s ease;
    min-height: 56px;
}
.st-checkbox-card input[type="checkbox"] {
    position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px;
}
/* Faux checkbox (élément flex, pas absolute) */
.st-checkbox-card::before {
    content: "";
    flex-shrink: 0;
    width: 22px; height: 22px;
    border: 2px solid #c8cdd4;
    background-color: #fff;
    border-radius: 4px;
    transition: all 0.18s ease;
}
.st-checkbox-card.is-selected::before {
    content: "✓";
    background-color: var(--theme-color, #AFCA0B);
    border-color: var(--theme-color, #AFCA0B);
    color: #fff;
    font-family: inherit;
    font-weight: 900;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
/* Icône thématique du motif */
.st-checkbox-card__icon {
    flex-shrink: 0;
    width: 26px;
    font-size: 20px;
    color: var(--theme-color, #AFCA0B);
    text-align: center;
}
.st-checkbox-card__label {
    flex: 1;
    font-size: 13px; font-weight: 600;
    color: var(--title-color, #0E121D);
    line-height: 1.3;
}
.st-checkbox-card__hint {
    display: block;
    font-size: 11px; font-weight: 400;
    color: var(--body-color, #4D5765);
    text-transform: none; letter-spacing: 0;
    margin-top: 3px;
}
.st-checkbox-card:hover {
    background-color: #fff;
    border-color: rgba(175, 202, 11, 0.4);
}
.st-checkbox-card.is-selected {
    background-color: #fff;
    border-color: var(--theme-color, #AFCA0B);
    box-shadow: 0 3px 10px rgba(175, 202, 11, 0.14);
}

/* Bloc "expliquez" conditionnel */
.st-explain-wrap {
    background-color: #fffbe6;
    padding: 12px 14px;
    border-left: 3px solid var(--theme-color, #AFCA0B);
    margin-top: 4px;
}
.st-explain-wrap .st-field-label {
    margin-bottom: 6px;
    font-size: 12px;
}

/* ============================================================
   Pills (radio inline compact)
   ============================================================ */
.st-radio-pill-group { display: flex; flex-wrap: wrap; gap: 8px; }
.st-radio-pill {
    position: relative; cursor: pointer;
    display: inline-block;
    padding: 10px 18px;
    background-color: var(--smoke-color, #F8F8F8);
    border: 2px solid transparent;
    font-size: 13px; font-weight: 600;
    color: var(--body-color, #4D5765);
    text-transform: uppercase; letter-spacing: 0.3px;
    transition: all 0.2s ease-in-out;
}
.st-radio-pill input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.st-radio-pill:hover {
    background-color: #fff;
    border-color: rgba(175, 202, 11, 0.4);
}
.st-radio-pill.is-selected {
    background-color: var(--theme-color, #AFCA0B);
    border-color: var(--theme-color, #AFCA0B);
    color: #fff;
}

/* ============================================================
   DROPZONE drag & drop
   ============================================================ */
.st-dropzone {
    position: relative;
    border: 2px dashed #cdd3dc;
    background-color: var(--smoke-color, #F8F8F8);
    padding: 32px 20px;
    text-align: center;
    cursor: pointer;
    transition: all 0.25s ease;
}
.st-dropzone:hover, .st-dropzone:focus-visible {
    border-color: var(--theme-color, #AFCA0B);
    background-color: rgba(175, 202, 11, 0.06);
    outline: none;
}
.st-dropzone.is-dragover {
    border-color: var(--theme-color, #AFCA0B);
    background-color: rgba(175, 202, 11, 0.12);
    transform: scale(1.01);
}
.st-dropzone__icon {
    color: var(--theme-color, #AFCA0B);
    margin-bottom: 10px;
}
.st-dropzone__text strong {
    display: block;
    font-size: 16px; font-weight: 700;
    color: var(--title-color, #0E121D);
    margin-bottom: 4px;
}
.st-dropzone__text span {
    display: block;
    font-size: 13px; color: var(--body-color, #4D5765);
}
.st-dropzone__text a {
    color: var(--theme-color, #AFCA0B);
    font-weight: 600; text-decoration: underline;
}

/* Liste fichiers (tuiles uploadées) */
.st-files-list {
    margin-top: 16px;
    display: flex; flex-direction: column; gap: 10px;
}
.st-file-tile {
    display: grid;
    grid-template-columns: 42px 1fr 220px 30px;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    background-color: var(--smoke-color, #F8F8F8);
    border-left: 3px solid var(--theme-color, #AFCA0B);
    position: relative;
    transition: all 0.2s ease;
}
.st-file-tile__icon {
    width: 42px; height: 42px;
    display: flex; align-items: center; justify-content: center;
    background-color: #fff;
    color: var(--theme-color, #AFCA0B);
    font-size: 11px; font-weight: 700;
    text-transform: uppercase;
    border-radius: 4px;
    letter-spacing: 0.3px;
}
.st-file-tile__main { min-width: 0; }
.st-file-tile__name {
    display: block;
    font-size: 13px; font-weight: 600;
    color: var(--title-color, #0E121D);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.st-file-tile__meta {
    font-size: 11px; color: var(--body-color, #4D5765);
    margin-top: 2px;
}
.st-file-tile__qualification {
    height: 38px; padding: 0 14px;
    border: 1px solid #e0e3e8;
    background-color: #fff;
    font-size: 12px;
    color: var(--body-color);
    width: 100%;
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><polyline points='1,1 5,5 9,1' fill='none' stroke='%234D5765' stroke-width='1.5'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 30px;
}
.st-file-tile__remove {
    width: 30px; height: 30px;
    border: none; background: transparent;
    color: #8a92a0; cursor: pointer;
    font-size: 18px; line-height: 1;
    transition: color 0.18s ease;
}
.st-file-tile__remove:hover { color: #d63031; }

.st-file-tile__progress {
    position: absolute; bottom: 0; left: 0; right: 0;
    height: 3px; background-color: #e6e6e6; overflow: hidden;
}
.st-file-tile__progress-fill {
    height: 100%;
    background-color: var(--theme-color, #AFCA0B);
    width: 0%; transition: width 0.2s ease;
}
.st-file-tile.is-done .st-file-tile__icon {
    background-color: var(--theme-color, #AFCA0B);
    color: #fff;
}
.st-file-tile.is-error { border-left-color: #d63031; }
.st-file-tile.is-error .st-file-tile__icon {
    background-color: #fceaea; color: #d63031;
}

@media (max-width: 575px) {
    .st-file-tile {
        grid-template-columns: 42px 1fr 30px;
        grid-template-areas: "icon main remove" "qual qual qual";
        gap: 8px 10px;
    }
    .st-file-tile__icon { grid-area: icon; }
    .st-file-tile__main { grid-area: main; }
    .st-file-tile__remove { grid-area: remove; }
    .st-file-tile__qualification { grid-area: qual; }
}

/* ============================================================
   Footer wizard
   ============================================================ */
.st-wizard__footer {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: 26px; gap: 12px;
}
.st-wizard__back {
    background: transparent; border: none;
    color: var(--body-color, #4D5765);
    font-weight: 600; text-transform: uppercase;
    font-size: 13px; letter-spacing: 0.4px;
    padding: 12px 6px; cursor: pointer;
    transition: color 0.2s ease;
}
.st-wizard__back:hover { color: var(--theme-color, #AFCA0B); }
.st-wizard__back[disabled] { visibility: hidden; }

/* Récap final */
.st-recap {
    background-color: var(--smoke-color, #F8F8F8);
    padding: 16px 20px;
    margin-bottom: 22px;
    border-left: 3px solid var(--theme-color, #AFCA0B);
}
.st-recap__row {
    display: flex; justify-content: space-between;
    padding: 5px 0;
    font-size: 13px;
    border-bottom: 1px dashed #e0e0e0;
}
.st-recap__row:last-child { border-bottom: none; }
.st-recap__label { color: var(--body-color, #4D5765); font-weight: 500; }
.st-recap__value {
    color: var(--title-color, #0E121D);
    font-weight: 700; text-align: right; max-width: 60%;
}

/* ============================================================
   Bloc Disponibilités RDV (step 5) — grille 5 colonnes x 3 lignes
   Ligne 1 : jours (Lun → Ven)
   Ligne 2 : créneaux matin (9h → 14h)
   Ligne 3 : créneaux après-midi (14h → 19h)
   ============================================================ */
.st-availability-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
    background-color: var(--smoke-color, #F8F8F8);
    padding: 12px;
    border-left: 3px solid var(--theme-color, #AFCA0B);
}
.st-avail-cell {
    padding: 9px 4px !important;
    font-size: 12px !important;
    letter-spacing: 0.2px !important;
    text-align: center;
    margin: 0 !important;
}
@media (max-width: 480px) {
    .st-availability-grid { grid-template-columns: repeat(5, 1fr); gap: 4px; padding: 8px; }
    .st-avail-cell { font-size: 11px !important; padding: 8px 2px !important; }
}

/* Fix : pills avec checkbox (toggle indépendant, pas mutex comme les radios) */
.st-radio-pill input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Mention légale courte (remplace l'ancienne case RGPD) */
.st-legal-note {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background-color: #fffbe6;
    border-left: 3px solid var(--theme-color, #AFCA0B);
    font-size: 12px;
    color: var(--body-color, #4D5765);
    line-height: 1.5;
    margin: 14px 0 6px;
}
.st-legal-note i {
    flex-shrink: 0;
    font-size: 18px;
    color: var(--theme-color, #AFCA0B);
}
.st-legal-note a {
    color: var(--theme-color, #AFCA0B);
    text-decoration: underline;
    font-weight: 600;
}

/* RGPD case (custom : grosse case stylée + icône shield + texte alignés au centre) */
.st-consent {
    display: flex; align-items: center; gap: 14px;
    padding: 16px 18px;
    background-color: #fffbe6;
    border-left: 4px solid var(--theme-color, #AFCA0B);
    font-size: 13px; color: var(--body-color, #4D5765);
    line-height: 1.5;
    margin-bottom: 6px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.st-consent__icon {
    flex-shrink: 0;
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    color: var(--theme-color, #AFCA0B);
    font-size: 22px;
}
.st-consent > span {
    flex: 1;
}
.st-consent:hover { background-color: #fff8d6; }
/* FIX critique : le theme Konta a `input { height:55px; width:100%; padding:0 25px; ... }`
   qui rendait la case invisible (étirée à 100% de largeur + background gris fondu).
   On force tout avec !important pour vaincre la règle globale du theme. */
.st-consent input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    border: 2px solid #8a92a0 !important;
    background-color: #fff !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    position: relative !important;
    transition: all 0.2s ease !important;
    outline: none !important;
    box-shadow: none !important;
    display: inline-block !important;
}
.st-consent input[type="checkbox"]:hover {
    border-color: var(--theme-color, #AFCA0B) !important;
}
.st-consent input[type="checkbox"]:checked {
    background-color: var(--theme-color, #AFCA0B) !important;
    border-color: var(--theme-color, #AFCA0B) !important;
}
.st-consent input[type="checkbox"]:checked::after {
    content: "✓";
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-weight: 900;
    font-size: 20px;
    line-height: 1;
}
.st-consent input[type="checkbox"]:focus-visible {
    box-shadow: 0 0 0 3px rgba(175, 202, 11, 0.4) !important;
}
.st-consent a {
    color: var(--theme-color, #AFCA0B);
    text-decoration: underline;
    font-weight: 600;
}

/* Erreurs validation */
.st-field-error {
    color: #d63031; font-size: 12px; margin-top: 4px;
    display: none; padding-left: 4px;
}
.st-wizard .form-control.is-invalid,
.st-wizard .form-select.is-invalid {
    border-color: #d63031 !important;
}
.st-wizard .form-group.has-error .st-field-error { display: block; }

/* Écran succès */
.st-success {
    text-align: center; padding: 40px 20px;
    display: none;
}
.st-success.is-visible { display: block; animation: stFadeIn 0.4s ease-in-out; }
.st-success__icon {
    width: 80px; height: 80px;
    background-color: rgba(175, 202, 11, 0.15);
    color: var(--theme-color, #AFCA0B);
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: 18px;
}
.st-success__title {
    font-size: 26px; font-weight: 700;
    color: var(--title-color, #0E121D);
    margin-bottom: 10px;
}
.st-success__text {
    font-size: 15px; color: var(--body-color, #4D5765);
    max-width: 460px; margin: 0 auto 18px;
}
.st-success__ref {
    display: inline-block;
    padding: 6px 14px;
    background-color: var(--smoke-color, #F8F8F8);
    font-family: monospace; font-size: 13px;
    color: var(--title-color, #0E121D);
}

/* Barre de progression globale */
.st-global-progress {
    margin-top: 18px;
    padding: 14px 16px;
    background-color: var(--smoke-color, #F8F8F8);
    border-left: 3px solid var(--theme-color, #AFCA0B);
}
.st-global-progress__label {
    font-size: 13px; font-weight: 600;
    color: var(--title-color, #0E121D);
    margin-bottom: 8px;
}
.st-global-progress__bar {
    height: 6px; background-color: #e6e6e6;
    overflow: hidden;
}
.st-global-progress__fill {
    height: 100%; width: 0%;
    background-color: var(--theme-color, #AFCA0B);
    transition: width 0.3s ease;
}

/* Spinner sur bouton envoi */
@keyframes stSpin { to { transform: rotate(360deg); } }
.st-wizard__panel.is-submitting .form-btn .th-btn {
    pointer-events: none; opacity: 0.7;
}
.st-wizard__panel.is-submitting .form-btn .th-btn::after {
    content: ""; display: inline-block;
    width: 14px; height: 14px;
    border: 2px solid #fff; border-right-color: transparent;
    border-radius: 50%; animation: stSpin 0.7s linear infinite;
    margin-left: 10px; vertical-align: middle;
}

/* Mobile */
@media (max-width: 575px) {
    .st-wizard__step-label { display: none