/* Champs Fox : libellé flottant, erreurs, indications, combobox. Norme theme.css (36 px, rayon 6 px). */
.field{position:relative}
.field label{position:absolute;left:10px;top:18px;margin:0;transform:translateY(-50%);font-size:var(--fox-control-font);font-weight:400;color:#8b949e;background:transparent;pointer-events:none;white-space:nowrap;max-width:calc(100% - 20px);overflow:hidden;text-overflow:ellipsis;transition:top .18s ease,transform .18s ease,font-size .18s ease,color .15s ease,padding .15s ease}
.field:focus-within label,.field :is(input,select):not(:placeholder-shown)+label,.field input[type=hidden]+label,.field select+label,.field:has(:-webkit-autofill) label,.field:has(:autofill) label{top:0;left:8px;transform:translateY(-50%);font-size:12px;font-weight:600;padding:0 5px;background:#fff;color:#657486}
.field:focus-within label{color:var(--fox-control-focus)}
.field input:not([type=hidden]),.field select{display:block;width:100%;height:var(--fox-control-height);min-height:var(--fox-control-height);max-height:var(--fox-control-height);font:inherit;font-size:var(--fox-control-font);-webkit-appearance:none;appearance:none;border:1px solid var(--fox-control-border);border-radius:var(--fox-control-radius);background:#fff;padding:var(--fox-control-pad);color:var(--fox-navy);box-shadow:none;transition:border-color .15s}
.field input:not([type=hidden]):focus,.field input:not([type=hidden]):focus-visible,.field select:focus,.field select:focus-visible{outline:0;box-shadow:none;border-color:var(--fox-control-focus);caret-color:var(--fox-control-focus)}
.field.has-error input:not([type=hidden]),.field.has-error select{border-color:#b3261e}
.field.has-error label{color:#b3261e}
.field-error{margin:6px 0 0;font-size:12.5px;line-height:1.4;color:#b3261e}.field-error a{color:inherit;font-weight:600}
.field-hint{margin:6px 0 0;font-size:12.5px;line-height:1.4;color:#7a8693}
.field-status{margin:6px 0 0;font-size:12.5px;line-height:1.4;min-height:0;color:#7a8693}.field-status:empty{display:none}.field-status[data-state=ok]{color:#1d7a46}.field-status[data-state=error]{color:#b3261e}.field-status[data-state=pending]{color:#7a8693}
/* Sélecteur natif : chevron discret */
.field-select select{padding-right:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a8693' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px}
/* Combobox : liste sous le champ */
.field-combo input[role=combobox]{padding-right:30px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a8693' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px}
.combo-list{position:absolute;z-index:20;left:0;right:0;top:calc(var(--fox-control-height) + 4px);margin:0;padding:6px;list-style:none;background:#fff;border:1px solid var(--fox-control-border);border-radius:8px;box-shadow:0 14px 40px -12px rgba(23,44,67,.25),0 2px 6px rgba(23,44,67,.06);max-height:264px;overflow-y:auto}
.combo-list li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:8px 10px;border-radius:6px;font-size:14px;cursor:pointer;color:var(--fox-navy)}
.combo-list li small{font-size:12px;color:#7a8693;white-space:nowrap}
.combo-list li[aria-selected=true],.combo-list li:hover{background:#f4f6f9}
.combo-list li.combo-empty{color:#7a8693;cursor:default}.combo-list li.combo-empty:hover{background:transparent}
.combo-list mark{background:transparent;color:inherit;font-weight:600}
/* Œil du mot de passe */
.field-secret input{padding-right:38px}
button.field-eye{position:absolute;top:0;right:0;width:var(--fox-control-height);height:var(--fox-control-height);margin:0;padding:0;display:grid;place-items:center;background:transparent;border:0;color:#7a8693;cursor:pointer}
button.field-eye:hover,button.field-eye:focus-visible{color:var(--fox-navy);outline:0}
button.field-eye svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.field-eye .eye-pupil{transform-box:fill-box;transform-origin:center;transition:transform .22s ease,opacity .22s ease}
.field-eye .eye-slash{stroke-dasharray:24;stroke-dashoffset:0;transition:stroke-dashoffset .22s ease}
.field-eye[aria-pressed=true] .eye-slash{stroke-dashoffset:24}
.field-eye[aria-pressed=false] .eye-pupil{transform:scale(.55);opacity:.45}
@media(prefers-reduced-motion:reduce){.field label,.field-eye .eye-slash,.field-eye .eye-pupil{transition:none}}
/* Champ vérifié en direct (Sirene) : attente, succès, erreur, préremplissage */
.field-sirene input{padding-right:44px}
.field-dots{position:absolute;top:0;right:12px;height:var(--fox-control-height);display:none;align-items:center;gap:4px;color:#7a8693}
.field-dots i{width:4px;height:4px;border-radius:50%;background:currentColor;animation:field-dot 1.1s ease-in-out infinite}
.field-dots i:nth-child(2){animation-delay:.15s}.field-dots i:nth-child(3){animation-delay:.3s}
.field[data-state=pending] .field-dots{display:flex}
.field[data-state=ok] input{border-color:#1d7a46}.field[data-state=ok] label,.field[data-state=ok]:focus-within label{color:#1d7a46}
.field[data-state=ok] input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d7a46' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4 4L19 6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px}
.field[data-state=error] input{border-color:#b3261e}.field[data-state=error] label{color:#b3261e}
.field.prefilled input{animation:field-prefill 1.6s ease}
@keyframes field-dot{0%,70%,100%{opacity:.4;transform:translateY(0)}35%{opacity:1;transform:translateY(-2px)}}
@keyframes field-prefill{0%{background-color:#e7f5ec;border-color:#1d7a46}100%{background-color:#fff}}
@media(prefers-reduced-motion:reduce){.field-dots i,.field.prefilled input{animation:none}}
/* Adresse (sous-domaine) : suffixe fixe dans le champ, aperçu, propositions */
.field-address input{padding-right:calc(var(--suffix-w,180px) + 40px)}
.field-suffix{position:absolute;top:0;right:36px;height:var(--fox-control-height);display:flex;align-items:center;font-size:14px;color:#7a8693;pointer-events:none;white-space:nowrap}
.field[data-state=ok] .field-suffix,.field[data-state=error] .field-suffix{right:36px}
.field-address[data-state=ok] input{background-position:right 12px center}
.ob-address-preview{display:flex;flex-direction:column;gap:6px;justify-content:center;padding:0 4px;font-size:14px;color:#657486}
.ob-address-label{font-size:12.5px;color:#7a8693}
.ob-address-preview strong{font-size:15px;color:#172c43;word-break:break-all}
.ob-suggestions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.ob-suggestions button{font:inherit;font-size:13px;color:#172c43;background:#f4f6f9;border:1px solid #e3e6eb;border-radius:999px;padding:5px 11px;cursor:pointer}
.ob-suggestions button:hover{border-color:#172c43}

/* Cases de code (vérification admin) : un chiffre par case. */
.otp{border:0;padding:0;margin:0;min-width:0}
.otp-legend{padding:0;margin:0 0 8px;font-size:13px;color:#657486}
.otp-boxes{display:flex;gap:8px;justify-content:space-between}
.otp-box{flex:1;min-width:0;height:52px;padding:0;text-align:center;font:inherit;font-size:22px;font-weight:600;letter-spacing:0;border:1px solid var(--fox-control-border);border-radius:var(--fox-control-radius);background:#fff;color:var(--fox-navy);caret-color:var(--fox-orange);-moz-appearance:textfield}
.otp-box::-webkit-outer-spin-button,.otp-box::-webkit-inner-spin-button{-webkit-appearance:none}
.otp-box:focus{outline:none;border-color:var(--fox-control-focus);box-shadow:0 0 0 3px rgba(23,44,67,.12)}
