/* Crédit Auto Solutions — règles que le convertisseur Oxygen ne peut pas porter.
 *
 * Le <style> passé à html-to-page n'accepte que des sélecteurs de classe plats : pas de
 * sélecteur de balise, pas d'id, pas de @keyframes utile sur html/body. Ces quelques règles
 * vivent donc dans une feuille à part, chargée APRÈS celles d'Oxygen. Tout ce qui peut être
 * exprimé en classes reste dans Oxygen, où le client peut le voir et le modifier.
 */

/* Pleine largeur réelle. `clip` et non `hidden` : `hidden` sur html/body casse
 * position:sticky et le défilement d'ancrage dans plusieurs navigateurs. */
html, body {
  overflow-x: clip;
  max-width: 100%;
}

body {
  margin: 0;
  background: #fff;
  /* Le thème peut imposer une largeur de contenu ; le plein écran demandé l'emporte. */
  max-width: none;
}

/* Le conteneur de contenu du thème ne doit pas re-brider la page. */
body .cas-page {
  width: 100%;
  max-width: none;
  margin: 0;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
::selection { background: #bfdbfe; color: #0f172a; }

/* Verrou de défilement pendant l'ouverture de la modale. */
html.cas-noscroll, html.cas-noscroll body { overflow: hidden; }

/* Centrage de la modale.
 * Oxygen jette les propriétés flex d'un sélecteur en `display:none` (.cas-modal l'est au
 * repos), et une reconstruction de la page réécrit .cas-modal-open à partir du <style>
 * source — un correctif posé dans le magasin de sélecteurs d'Oxygen est donc perdu à chaque
 * rebuild. Il vit ici, où rien ne le normalise. Le panneau se retrouvait collé à gauche. */
.cas-modal.cas-modal-open {
  align-items: center;
  justify-content: center;
}

/* Entrée de la modale. Uniquement transform + opacity — jamais de propriété de layout. */
@keyframes cas-modal-in  { from { opacity: 0 } to { opacity: 1 } }
@keyframes cas-panel-in  { from { opacity: 0; transform: translateY(14px) scale(.985) }
                           to   { opacity: 1; transform: translateY(0) scale(1) } }

.cas-modal.cas-modal-open { animation: cas-modal-in 180ms cubic-bezier(.16,1,.3,1) both; }
.cas-modal.cas-modal-open .cas-modal-panel { animation: cas-panel-in 260ms cubic-bezier(.16,1,.3,1) both; }

/* Le bouton de fermeture est une croix textuelle : sans ça elle hérite d'une graisse
 * de police variable selon la plateforme. */
.cas-modal-close { font-family: system-ui, sans-serif; }

/* Contour parasite autour des boutons.
 * Oxygen normalise ce qu'il stocke et jette `border:none` en le jugeant sans effet — le
 * bouton retombe alors sur le style par défaut du navigateur, `2px outset black`, d'où le
 * liseré gris/noir visible autour de chaque bouton. La remise à zéro doit donc vivre ici,
 * dans une feuille qu'Oxygen ne retouche pas. Les boutons qui ont une vraie bordure
 * (.pq-opt, .cas-modal-close) ne sont pas concernés : leur valeur, elle, a survécu. */
.cas-cta-pill,
.cas-cta-btn,
.pq-submit,
.pq-back {
  border: 0;
  -webkit-appearance: none;
  appearance: none;
}

/* iOS zoome sur un champ dont la police descend sous 16px. Les champs sont déjà à 16px
 * dans Oxygen ; ce garde-fou empêche une modification dans le constructeur de le casser. */
@supports (-webkit-touch-callout: none) {
  .pq-input { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  /* Le mouvement spatial retombe sur un fondu court, il ne disparaît pas : l'apparition
   * de la modale doit rester perceptible. */
  .cas-modal.cas-modal-open,
  .cas-modal.cas-modal-open .cas-modal-panel {
    animation-duration: 140ms;
    animation-name: cas-modal-in;
  }
  .cas-card, .cas-step, .cas-cta-btn, .cas-cta-pill, .pq-opt, .pq-submit, .cas-navlink {
    transition-duration: 1ms !important;
  }
  .cas-card:hover, .cas-step:hover, .cas-cta-btn:hover, .cas-cta-pill:hover, .pq-submit:hover {
    transform: none !important;
  }
}

@media print {
  .cas-modal, .cas-cta-pill, .cas-cta-btn { display: none !important; }
}