/**
 * Alignement des composants tiers des formulaires sur le systeme de design.
 *
 * POURQUOI CE FICHIER EXISTE. SureForms et TomSelect, la liste deroulante qu'il embarque,
 * sont livres pour un fond CLAIR. Poses sur le fond sombre du site, leurs bordures
 * — un noir translucide, color(srgb .117 .117 .117 / .25) — deviennent invisibles, et
 * leurs ombres portees, pensees pour du blanc, ne se voient pas davantage.
 *
 * Mesure du 27.08.2026 sur la page Contact : 29 elements hors systeme, six rayons
 * differents la ou le site n'en connait que deux, et trois familles d'ombres la ou il n'en
 * veut aucune sur un champ.
 *
 * CE FICHIER NE CORRIGE QUE L'APPARENCE. Aucun comportement de formulaire n'est touche :
 * ni validation, ni envoi, ni accessibilite native des composants.
 *
 * IL VIT DANS LE PLUGIN, PAS DANS LE CSS PERSONNALISE. C'est deliberé : le champ CSS de
 * WordPress echappe « > » en « &gt; » et « & » en « &amp; », ce qui y a deja tue sept
 * regles et casse l'import de police. Une feuille du plugin est versionnee, mise en cache
 * et ne traverse aucun filtre.
 */

/* --- Liste deroulante TomSelect ------------------------------------------- */
.fccv .ts-control,
.fccv .ts-dropdown,
.fccv .ts-dropdown-content,
.fccv .srfm-block-content-wrap{
    border-color:var(--f-line-str)!important;
}

.fccv .ts-control{
    border-radius:var(--radius-surface)!important;
    background:var(--f-raise)!important;
    color:var(--f-ink)!important;
    box-shadow:none!important;
}
.fccv .ts-control.focus,
.fccv .ts-wrapper.focus .ts-control{
    border-color:var(--f-petrol)!important;
    box-shadow:var(--ring-focus)!important;
}

/* Le menu ouvert : meme surface que les autres panneaux du site, et surtout pas
   l'ombre claire d'origine, qui ne se voit pas sur fond sombre et brouille le contour. */
.fccv .ts-dropdown{
    border-radius:var(--radius-surface)!important;
    background:var(--f-surface)!important;
    color:var(--f-body)!important;
    box-shadow:none!important;
}
.fccv .ts-dropdown .option{
    color:var(--f-body)!important;
    background:transparent!important;
}
.fccv .ts-dropdown .option.active,
.fccv .ts-dropdown .option:hover{
    background:var(--f-raise)!important;
    color:var(--f-ink)!important;
}

/* --- Drapeau du selecteur de pays ---------------------------------------- */
/* Une vignette de 16 px n'a besoin ni de coins arrondis ni d'une ombre grise. */
.fccv .iti__flag{
    border-radius:0!important;
    box-shadow:none!important;
}

/* --- Bloc de champ SureForms --------------------------------------------- */
.fccv .srfm-block-content-wrap{
    border-radius:var(--radius-surface)!important;
    box-shadow:none!important;
}

/* Case a cocher et bouton radio : la vignette de 16 px arrivait en rayon 4 px avec une
   bordure quasi noire translucide, invisible sur fond sombre. Le carre passe au rayon du
   site, le rond garde le sien : un bouton radio rond est une convention, pas une fantaisie. */
.fccv .srfm-span-wrap{
    border-color:var(--f-line-str)!important;
    border-radius:var(--radius-surface)!important;
}
.fccv input[type=radio] + .srfm-span-wrap,
.fccv .srfm-radio .srfm-span-wrap{
    border-radius:var(--radius-pill)!important;
}

/* Champ laisse aux valeurs d'usine du composant : bordure gris clair et rayon 2 px,
   les deux etrangers au site. */
.fccv .ts-wrapper input,
.fccv .ts-control input,
.fccv .iti input:not(.srfm-input-common){
    border-color:var(--f-line-str)!important;
    border-radius:var(--radius-surface)!important;
    background:transparent!important;
    color:var(--f-ink)!important;
}

/* Le sablier d'envoi reste rond : une roue qui tourne est ronde. */

/**
 * Mention secondaire dans le bloc de coordonnees.
 *
 * Sert au depot d'Aigle, qui doit apparaitre sous l'adresse de Vevey sans jamais lui faire
 * concurrence : ce n'est ni le siege, ni un bureau ouvert. La taille etait deja reduite par
 * heritage, mais la couleur restait celle du texte principal, ce qui le mettait au meme rang
 * visuel que l'adresse. Il passe en couleur de texte courant.
 */
.fccv .f-facts .f-note-sec,
.fcv .f-facts .f-note-sec{
    color:var(--f-body);
    font-weight:400;
}
