/* ═══════════════════════════════════════════════════════════════════════
   CHAMPS CERCLEKIT — le blindage, UN seul, pour la Validation et Mon compte.

   Les champs portent le contrat de cercle-form.css (ckwc_ck_fields) : c'est
   CercleKit qui les dessine, avec Création › Forms. Il y avait DEUX copies de
   ce blindage (validation-widget.css et compte-page.css, avec des replis
   différents : libellé 13px/500 ici, 14px/600 là) et des redessins maison
   autour. Une copie de plus, c'est une divergence de plus.
   ═══════════════════════════════════════════════════════════════════════ */

/* Ce qui suit n'est que le BLINDAGE, identique à celui de cercle-form.css
   (`.ck-form .ck-f-input`) et de Création › Forms : mêmes déclarations, mêmes
   variables, aucune valeur à nous. Il faut le reposer parce que `.ck-form` est
   interdit ici (classe du moteur d'envoi AJAX : posée sur un formulaire
   WooCommerce elle bloque l'envoi — bug de connexion 1.0.264 ; posée dedans,
   elle rebranche une seconde fois l'autocomplétion d'adresse), et que le reset
   du thème (`input[type=text]`, 0,1,1) comme WooCommerce
   (`.woocommerce form .form-row input.input-text`, 0,3,2) battent la classe
   seule. Spécificité 0,4,0 : au-dessus, sans !important. Les réglages
   « Champs » / « Libellés » du widget Validation dans Elementor restent des
   surcharges facultatives (--ckwc-val-*) : vides, Création › Forms décide. */
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-input.ck-f-input.ck-f-input {
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    font-family: var(--ck-form-font, inherit);
    font-size: var(--ck-form-size, 15px);
    line-height: normal;
    color: var(--ckwc-val-input-color, var(--ck-form-text, inherit));
    background-color: var(--ckwc-val-input-bg, var(--ck-form-bg, #fff));
    height: var(--ck-form-height, 46px);
    /* 1.1.85 — les 4 côtés / 4 coins de Création › Formulaires (--ckwc-ck-*, ckwc_ck_champs_css) avant les
       anciennes clés ; les réglages du widget Validation dans Elementor (--ckwc-val-*) restent devant. */
    padding: var(--ckwc-val-input-pad, var(--ckwc-ck-pad, 0 var(--ck-form-pad-x, 14px)));
    border-style: solid;
    border-width: var(--ckwc-val-input-bw, var(--ckwc-ck-bw, var(--ck-form-border-width, 1px)));
    border-color: var(--ckwc-val-input-bc, var(--ck-form-border-color, #d4d4d8));
    border-radius: var(--ckwc-val-input-radius, var(--ckwc-ck-radius, var(--ck-form-radius, var(--ck-radius, 8px))));
    box-shadow: none;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-input.ck-f-input.ck-f-input:focus {
    border-color: var(--ckwc-val-input-bc-f, var(--ck-form-focus-color, #18181b));
    box-shadow: 0 0 0 var(--ck-form-focus-ring, 3px) var(--ck-form-focus-glow, rgba(0,0,0,.08));
}
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-input.ck-f-input.ck-f-input::placeholder { color: var(--ck-form-placeholder-color, currentColor); opacity: .45; }
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-textarea.ck-f-textarea.ck-f-textarea {
    height: auto;
    min-height: 90px;
    padding: var(--ckwc-ck-pad-zone, var(--ck-form-pad-x, 14px));
    line-height: 1.6;
    resize: vertical;
}
/* La flèche du select vient de cercle-form.css (`.ck-f-select`, background-image) :
   le blindage ne pose que `background-color`, jamais le raccourci. Marge
   droite : celle du blindage CercleKit (mesurée sur /contact/ de LH : 14px),
   pas une valeur à nous. */
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-select.ck-f-select.ck-f-select { cursor: pointer; }
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-label.ck-f-label.ck-f-label {
    display: block;
    font-family: var(--ck-form-label-font, inherit);
    font-size: var(--ck-form-label-size, 14px);
    font-weight: var(--ck-form-label-weight, 600);
    color: var(--ckwc-val-label-color, var(--ck-form-label-color, inherit));
    line-height: 1.4;
    padding: 0;
    /* Dans un .ck-f, CercleKit espace libellé et champ par un gap de 6px ;
       les rangées WooCommerce n'en sont pas : la marge fait le même écart. */
    margin: 0 0 6px;
}
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-sublabel.ck-f-sublabel { margin: 0 0 4px; }
/* Dans un vrai .ck-f (Mon compte › identité, adresse), c'est le gap de
   CercleKit qui espace : pas de marge en plus. */
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f > .ck-f-label.ck-f-label.ck-f-label { margin: 0; }
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-req { text-decoration: none; border: 0; }

/* Cases et boutons radio : le choix CercleKit (.ck-f-choice). Seul l'espace
   autour change : un libellé WooCommerce de case n'est pas dans un .ck-f. */
:is(.ckwc-valid-scope, .ckwc-acc-scope) .ck-f-choice.ck-f-choice { display: flex; align-items: flex-start; gap: 9px; font-weight: 400; margin: 0; }
