/* =========================================================================
 * Thème Fabre - Panier, tunnel de commande, connexion et espace client
 * Consigne : structure et fonctionnement hummingbird conservés tels quels,
 * on n'applique que la DA du site d'origine (relevée sur produitfermedesfabres.com) :
 * fond bois, cartes blanches (rayon 4px, ombre douce), champs gris #ebebeb,
 * boutons orange / anthracite en Josefin Slab majuscules, titres Martel.
 * Pages ciblées par l'id du <body> (= nom de la page PrestaShop).
 * ========================================================================= */

/* ----- Couleurs du thème Bootstrap remplacées par celles du site ----- */
body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) {
  --bs-primary: #f37600;
  --bs-primary-rgb: 243, 118, 0;
  --bs-primary-text-emphasis: var(--fabre-dark); /* textes d'accordéon (récapitulatif du tunnel) */
  --bs-primary-bg-subtle: var(--fabre-cream);
  --bs-primary-border-subtle: #efe6d2;
  --bs-success: #7fb032;
  --bs-success-rgb: 127, 176, 50;
  --bs-link-color: #343434;
  --bs-link-color-rgb: 52, 52, 52;
  --bs-link-hover-color: #f37600;
  --bs-link-hover-color-rgb: 243, 118, 0;
  --bs-body-color: #666;
  --bs-heading-color: var(--fabre-dark);
  --bs-tertiary-bg: #f6f6f6;
  --bs-border-radius: 4px;
  --bs-border-radius-sm: 4px;
  --bs-border-radius-lg: 4px;
  --bs-body-font-family: var(--fabre-font);
  --fabre-btn-dark: #282d35;
}

/* ----- Fond bois (pas de bandeau image : cf. _partials/breadcrumb.tpl) ----- */
body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper {
  padding-bottom: 60px;
  background-image: url('../img/texture-background-full.jpg');
  background-size: contain;
}

body:is(#cart, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper > .container,
body:is(#cart, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper > .columns-container {
  padding-top: 90px; /* sous le logo qui déborde du header */
}

/* ----- Cartes blanches ----- */
/* Pages à une colonne (connexion, inscription, compte...) : la colonne centrale entière */
body:is(#authentication, #registration, #password, #guest-tracking, #my-account, #identity, #addresses, #address,
  #history, #order-detail, #order-follow, #order-slip, #discount, #module-psgdpr-gdpr,
  #module-ps_emailalerts-account, #order-confirmation) #center-column.page {
  padding: 30px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 4px;
  box-shadow: 2px 2px 11px rgba(0, 0, 0, 0.1);
}

/* Panier et commande : contenu à gauche + récapitulatif à droite, deux cartes séparées.
   La carte de gauche est dessinée en ::before pour garder les gouttières de la grille. */
#cart .cart-grid__content,
#checkout .checkout-grid__content {
  position: relative;
  z-index: 0;
  padding: 25px 32px;
}

#cart .cart-grid__content::before,
#checkout .checkout-grid__content::before {
  content: "";
  position: absolute;
  inset: 0 12px;
  z-index: -1;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 4px;
  box-shadow: 2px 2px 11px rgba(0, 0, 0, 0.1);
}

#cart .cart-grid__aside-wrapper,
#checkout .cart-summary {
  padding: 20px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 4px;
  box-shadow: 2px 2px 11px rgba(0, 0, 0, 0.1);
}

#cart .cart-summary {
  padding: 0;
  background: none;
  border-radius: 0;
  box-shadow: none;
}

#cart .cart-grid__aside-wrapper > hr:last-child {
  display: none;
}

@media (max-width: 991px) {
  #cart .cart-grid__content,
  #checkout .checkout-grid__content {
    margin-bottom: 30px;
  }

  /* header mobile : le #wrapper est déjà décalé de sa hauteur réelle (--fabre-header-h), pas de logo débordant */
  body:is(#cart, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
    #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
    #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper > :is(.container, .columns-container) {
    padding-top: 30px;
  }

}

@media (max-width: 575px) {
  #cart .cart-grid__content,
  #checkout .checkout-grid__content {
    padding: 20px 24px;
  }

  body:is(#authentication, #registration, #password, #guest-tracking, #my-account, #identity, #addresses, #address,
    #history, #order-detail, #order-follow, #order-slip, #discount, #module-psgdpr-gdpr,
    #module-ps_emailalerts-account, #order-confirmation) #center-column.page {
    padding: 20px;
  }
}

/* ----- Titres ----- */
body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) .page-title-section {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--fabre-dark);
  text-transform: uppercase;
}

#cart .cart-grid__aside-wrapper > h2,
#my-account .account-menu__title,
body:is(#identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) .account-menu__title {
  font-size: 18px;
  font-weight: 700;
  color: var(--fabre-dark);
  text-transform: uppercase;
}

/* ----- Boutons ----- */
body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper :is(.btn-primary, .btn-outline-primary, .btn-secondary, .btn-outline-secondary) {
  font-family: var(--fabre-font-btn);
  font-size: 16px;
  text-transform: uppercase;
  border-radius: 0;
}

body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper .btn-primary {
  --bs-btn-bg: var(--fabre-orange);
  --bs-btn-border-color: var(--fabre-orange);
  --bs-btn-hover-bg: var(--fabre-orange-dark);
  --bs-btn-hover-border-color: var(--fabre-orange-dark);
  --bs-btn-active-bg: var(--fabre-orange-dark);
  --bs-btn-active-border-color: var(--fabre-orange-dark);
  --bs-btn-disabled-bg: var(--fabre-orange);
  --bs-btn-disabled-border-color: var(--fabre-orange);
  --bs-btn-focus-shadow-rgb: 243, 118, 0;
}

body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper :is(.btn-outline-primary, .btn-basic) {
  --bs-btn-color: var(--fabre-orange);
  --bs-btn-border-color: var(--fabre-orange);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--fabre-orange);
  --bs-btn-hover-border-color: var(--fabre-orange);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--fabre-orange);
  --bs-btn-active-border-color: var(--fabre-orange);
  --bs-btn-focus-shadow-rgb: 243, 118, 0;
}

/* Bouton « œil » des mots de passe : petit bouton orange comme le « Montrer » d'origine */
body:is(#checkout, #authentication, #registration, #password, #identity) #wrapper .password-field .btn-primary {
  font-family: var(--fabre-font);
  font-size: inherit;
}

/* « Commander » et « Afficher les détails » : anthracite comme sur le site d'origine */
body:is(#cart, #checkout) #wrapper .cart-summary__actions .btn-primary,
body#checkout #wrapper .checkout__summary-accordion .accordion-button {
  --bs-btn-bg: var(--fabre-btn-dark);
  --bs-btn-border-color: var(--fabre-btn-dark);
  --bs-btn-hover-bg: var(--fabre-dark);
  --bs-btn-hover-border-color: var(--fabre-dark);
  --bs-btn-active-bg: var(--fabre-dark);
  --bs-btn-active-border-color: var(--fabre-dark);
  --bs-btn-disabled-bg: var(--fabre-btn-dark);
  --bs-btn-disabled-border-color: var(--fabre-btn-dark);
}

/* « Continuer mes achats » : orange clair plein */
body#cart #wrapper .cart__continue-shopping {
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--fabre-orange);
  --bs-btn-bg: #ff9a52;
  --bs-btn-border-color: #ff9a52;
  --bs-btn-hover-bg: var(--fabre-orange);
  --bs-btn-hover-border-color: var(--fabre-orange);
  margin-top: 15px;
}

/* ----- Champs de formulaire ----- */
body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper :is(.form-control, .form-select) {
  color: var(--fabre-dark);
  background-color: #ebebeb;
  border-color: #ebebeb;
  border-radius: 4px;
}

body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper :is(.form-control, .form-select):focus {
  background-color: #fff;
  border-color: var(--fabre-green);
  box-shadow: 0 0 0 0.2rem rgba(153, 205, 78, 0.35);
}

body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper .input-group > .form-control:not(:last-child) {
  border-radius: 4px 0 0 4px;
}

body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper .form-check-input:checked {
  background-color: var(--fabre-orange);
  border-color: var(--fabre-orange);
}

body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper .form-check-input:focus {
  border-color: var(--fabre-green);
  box-shadow: 0 0 0 0.2rem rgba(153, 205, 78, 0.35);
}

body:is(#cart, #checkout, #order-confirmation, #authentication, #registration, #password, #guest-tracking,
  #my-account, #identity, #addresses, #address, #history, #order-detail, #order-follow, #order-slip, #discount,
  #module-psgdpr-gdpr, #module-ps_emailalerts-account) #wrapper .form-label {
  color: #414141;
}

/* ----- Panier ----- */
.fabre-cart-banner {
  margin-bottom: 15px;
  padding: 20px;
  font-size: 13px;
  line-height: 1.6;
  color: #666;
  background: #fff;
  border: 3px solid #325d27;
  border-radius: 4px;
}

.fabre-cart-banner p {
  margin: 0;
}

.fabre-cart-banner .fabre-cart-top__alert {
  color: #d0121a;
}

.fabre-cart-banner .fabre-cart-top__big {
  font-size: 16px;
}

#cart .product-line__title,
#cart .product-line__title a {
  font-weight: 700;
  color: var(--fabre-dark);
  text-transform: uppercase;
}

#cart .product-line__price,
#wrapper :is(#cart, #checkout) .price,
#cart .product-line .current-price {
  color: var(--fabre-orange);
}

/* ----- Tunnel : étapes ----- */
/* le header (fixe, 140px avec le bandeau) recouvre le haut du #wrapper (padding 96px) */
#checkout .checkout-steps {
  padding-top: 76px;
  background-color: rgba(255, 255, 255, 0.92);
}

#checkout .checkout-steps__btn {
  font-family: var(--fabre-font);
  color: var(--fabre-dark);
}

#checkout .checkout-steps__step--current .checkout-steps__number {
  background: var(--fabre-orange);
}

#checkout .nav-underline .nav-link.active {
  color: var(--fabre-dark);
  border-bottom-color: var(--fabre-orange);
}

/* ----- Espace client ----- */
.account-menu--sidebar .account-menu__link--active,
.account-menu__link:hover {
  color: var(--fabre-orange);
}

.account-menu__icon {
  color: var(--fabre-green);
}

.account-menu__link--signout .account-menu__icon {
  color: inherit;
}

.account-menu--main .account-menu__link {
  color: var(--fabre-dark);
  background-color: var(--fabre-cream);
  border: 1px solid #efe6d2;
}

.account-menu--main .account-menu__link:hover {
  color: var(--fabre-orange);
  border-color: var(--fabre-green);
}

@media (max-width: 991px) {
  #checkout .checkout-steps {
    padding-top: 0.5rem;
  }
}