/* PRATINIUM v375 — alignement du cadre blanc du formulaire sur la CARTE
   bleue réellement visible (.pas-v353-card), et non sur son wrapper externe.
   Le JavaScript v375 calcule ensuite les coordonnées exactes. */

body#identity,
body.page-identity,
body.pratinium-identity-page-v375 {
  --pi375-fallback-gap: 24px;
}

/* Filet de sécurité immédiatement visible avant l'exécution du JavaScript. */
body#identity #customer-form,
body#identity form.js-customer-form,
body.page-identity #customer-form,
body.page-identity form.js-customer-form,
body.pratinium-identity-page-v375 #customer-form,
body.pratinium-identity-page-v375 form.js-customer-form {
  display: block !important;
  width: calc(100% - (2 * var(--pi375-fallback-gap))) !important;
  max-width: calc(100% - (2 * var(--pi375-fallback-gap))) !important;
  min-width: 0 !important;
  margin-left: var(--pi375-fallback-gap) !important;
  margin-right: var(--pi375-fallback-gap) !important;
  box-sizing: border-box !important;
}

body#identity #customer-form > section,
body#identity form.js-customer-form > section,
body.page-identity #customer-form > section,
body.page-identity form.js-customer-form > section,
body.pratinium-identity-page-v375 #customer-form > section,
body.pratinium-identity-page-v375 form.js-customer-form > section {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

@media (max-width: 991px) {
  body#identity,
  body.page-identity,
  body.pratinium-identity-page-v375 {
    --pi375-fallback-gap: 16px;
  }
}

@media (max-width: 575px) {
  body#identity,
  body.page-identity,
  body.pratinium-identity-page-v375 {
    --pi375-fallback-gap: 8px;
  }
}