/* Colonne chekout */
/* Boutons du parcours invité "COMMENT SOUHAITEZ-VOUS CONTINUER ?" :
   même largeur (min-width) pour que les deux boutons soient identiques
   malgré un libellé plus court ("Se connecter") vs plus long
   ("Continuer en tant qu'invité"). padding !important pour passer outre
   le padding .button (0 15px !important). */
#guest-checkout-flow .guest-checkout-btn{
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important;
    min-width: 320px !important;
    box-sizing: border-box;
}
/* Champs du parcours invité : mêmes dimensions que les inputs de la page
   compte client (#colonne-informations-personnelles) pour rester cohérent
   avec le reste du site. */
#guest-checkout-flow input:not([type="radio"]):not([type="checkbox"]),
#guest-checkout-flow select{
    width: 100%;
    height: 40px;
}
#guest-checkout-flow form label{
    font-size: 14px;
    font-weight: 500;
}
/* Liens « Modifier » du parcours invité : même style que la page compte client
   (icon crayon modifier.svg + underline), via la classe mon-adresse-modifier. */
#guest-checkout-flow .mon-adresse-modifier{
    background-position: left center;
    background-repeat: no-repeat;
    background-size: auto 16px;
    background-image: url('../img/user/modifier.svg');
    padding-left: 20px;
}

/* Formulaire « Créer un compte » de la page de confirmation (parcours invité).
   Reprend .register-section (signup) pour la mise en forme, mais le layout est
   mono-colonne : on ramène les inputs à 100 % de la largeur du formulaire
   (signup les met à 65 % car il a deux colonnes .fieldset-col). Ciblé par
   .guest-create-account pour ne pas impacter le formulaire d'inscription. */
.guest-create-account.register-section input.form-text,
.guest-create-account.register-section .show-password{
    width: 100%;
}
/* Mise en évidence au focus des champs éditables (mot de passe uniquement).
   Ciblé par id : les autres inputs du bloc sont readonly (e-mail, infos auto-
   remplies) et ne doivent pas « s'allumer » — même s'attrapent le focus par
   Tab, ils restent neutres. */
.guest-create-account #guestAccountPassword:focus,
.guest-create-account #guestAccountPasswordConfirm:focus{
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
}

#colonne-checkout.loading::after{
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #FFF;
    opacity: 0.5;
    z-index: 2;
    cursor: wait;
}
#colonne-checkout.loading .spinner{
    display: block;
    position: fixed;
    top: 48vh;
    left: calc(50vw - 14%);
    z-index: 3;
}
#colonne-checkout{
    flex: 1 1 auto;
}
#colonne-checkout #cart-table tr,
#colonne-checkout #cart-modes-livraison .mode-livraison,
#colonne-checkout #payment-modes .payment-choice{
    border-bottom: 1px solid #E8E8E8;
}
#colonne-checkout #cart-table tr th,
#colonne-checkout #cart-table tr .th-style{
    font-size: 14px;
    font-weight: 600;
    padding: 10px;
}
#colonne-checkout #cart-table tr td{
    padding: 25px 15px;
}
@media screen and (max-width: 767px){
    #colonne-checkout #cart-table tr td{
        padding: 0;
    }
}
#colonne-checkout .cart-quantite .buttonConversion{
    width: 15px;
    height: 15px;
    font-size: 13px !important;
    font-weight: 700;
    border-radius: 3px !important;
    line-height: 14px;
    padding: 0 !important;
}
#colonne-checkout .cart-quantite input{
    text-align: center;
    width: 50px;
    border: none;
    font-size: 13px !important;
    padding: 5px 0 !important;
}
#colonne-checkout .crossSellingArticle .crossSellingImage{
    height: 200px;
}
#colonne-checkout .crossSellingArticle .crossSellingImage img{
    max-height: 200px;
    padding: 10px;
}
#colonne-checkout #cart-adresses-livraison .adresse-livraison *,
#colonne-checkout #cart-adresses-facturation .adresse-facturation *,
#colonne-checkout #cart-modes-livraison .mode-livraison *,
#colonne-checkout #payment-modes .payment-choice *,
#cart-cgv input,
#cart-cgv label{
    cursor: pointer;
}
#colonne-checkout #cart-adresses-livraison .adresse-livraison:hover,
#colonne-checkout #cart-adresses-facturation .adresse-facturation:hover,
#colonne-checkout #cart-modes-livraison .mode-livraison:hover,
#colonne-checkout #payment-modes .payment-choice:hover{
    background-color: #F8F8F8;
}
#colonne-checkout #cart-add-adresse-livraison input[type="text"],
#colonne-checkout #cart-add-adresse-facturation input[type="text"],
#colonne-checkout #cart-add-adresse-livraison input[type="tel"],
#colonne-checkout #cart-add-adresse-facturation input[type="tel"],
#colonne-checkout #cart-add-adresse-livraison select,
#colonne-checkout #cart-add-adresse-facturation select{
    width: 100%;
    height: 40px;
}
#colonne-checkout #cart-add-adresse-livraison label,
#colonne-checkout #cart-add-adresse-facturation label{
    font-size: 14px;
    font-weight: 500;
}
#colonne-checkout #cart-add-adresse-livraison legend,
#colonne-checkout #cart-add-adresse-facturation legend{
    float: left;
    font-size: 14px;
    font-weight: 500;
}
#colonne-checkout #cart-modes-livraison .mode-livraison,
#colonne-checkout #payment-modes .payment-choice{
    min-height: 90px;
}
#colonne-checkout #cart-modes-livraison .mode-livraison-image img,
#colonne-checkout #payment-modes .payment-choice .payment-choice-image img{
    max-height: 50px;
}
#cart-commentary[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
}
#colonne-checkout #cart-table .product-personnalisation{
    background-color: #F8F8F8;
}
#colonne-checkout #cart-table .personnalisation-modifier{
    background-position: left center;
    background-repeat: no-repeat;
    background-size: auto 16px;
    background-image: url('../img/user/modifier.svg');
    padding-left: 20px;
}
/* pointRelais---Modal.html.twig */
.point-relais-modal #point-relais{
    max-height: 600px;
    border: 1px solid #E8E8E8;
    overflow-y: auto;
}
@media screen and (max-height: 850px){
    .point-relais-modal #point-relais{
        max-height: 450px;
    }
}
@media screen and (max-height: 650px){
    .point-relais-modal #point-relais{
        max-height: 300px;
    }
}
.point-relais-modal .point-relais-list{
    max-height: 365px;
}
.point-relais-modal .map-container,
.point-relais-modal .noValidCoordinates{
    height: 365px;
}
@media screen and (max-height: 850px) and (min-width: 1024px){
    .point-relais-modal .point-relais-list{
        max-height: 260px;
    }
    .point-relais-modal .map-container,
    .point-relais-modal .noValidCoordinates{
        height: 260px;
    }
}
@media screen and (max-height: 650px) and (min-width: 1024px){
    .point-relais-modal .point-relais-list{
        max-height: 155px;
    }
    .point-relais-modal .map-container,
    .point-relais-modal .noValidCoordinates{
        height: 155px;
    }
}
@media screen and (max-width: 1023px){
    .point-relais-modal .point-relais-list{
        max-height: 220px;
    }
    .point-relais-modal .map-container,
    .point-relais-modal .noValidCoordinates{
        height: 200px;
    }
}
@media screen and (max-height: 850px) and (max-width: 1023px){
    .point-relais-modal .point-relais-list{
        max-height: 135px;
    }
    .point-relais-modal .map-container,
    .point-relais-modal .noValidCoordinates{
        height: 200px;
    }
}
@media screen and (max-height: 650px) and (max-width: 1023px){
    .point-relais-modal .map-container,
    .point-relais-modal .noValidCoordinates{
        height: 100px;
    }
}
.point-relais-modal .point-relais-box:not(:last-child){
    border-bottom: 1px solid #E8E8E8;
}
.point-relais-modal .point-relais-box:hover,
.point-relais-modal .point-relais-box.selectedPointRelai,
.point-relais-modal .infos-point-relai-container,
.point-relais-modal .noValidCoordinates{
    background-color: #F8F8F8;
}
.point-relais-modal .map-container .custom-div-icon div:hover{
    transform: scale(1.1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.4);
}
/* floaInformationModal.html.twig*/
.floa-information-modal input:not([type="checkbox"]){
    width: 100%;
    height: 40px;
}
.floa-information-modal label{
    font-size: 14px;
    font-weight: 500;
}
.floa-information-modal input[type="number"]{
    -moz-appearance: textfield;
}


@media screen and (min-width: 640px) {
  .magasins {
    padding-left: 120px;
  }
}

#magagsin_info .magasins .magasin .magasins__lib,
#magagsin_info .magasins .magasin .magasins__address,
#magagsin_info .magasins .magasin .magasins__detail {
  font-size: 14px;
}
#magagsin_info .magasins .magasin .magasins__edit {
  display: inline-block;
  margin-left: 10px;
}

#magagsin_info .magasins .magasin .magasins__lib {
  margin-left: 10px;
}

#magagsin_info .magasins .magasin .magasins__pickup {
  margin: 14px 0 14px 28px;
}

#magagsin_info .magasins .magasin .magasins__pickup .magasins__pickup--title  {
  font-size: 12px;
  margin-right: 10px;
}

/** Custom Select box **/
.magasins__pickup--select-box {
  position: relative;
  display: inline-block;
  user-select: none;

}

.magasins__pickup--select-box select {
  display: none;
}

.magasins__pickup--select {
  position: relative;
  display: inline-block;
}

.magasins__pickup--select-trigger {
  border: 1px solid #d8d8d8;
  position: relative;
  display: block;
  width: 300px;
  height: 35px;
  line-height: 34px;
  padding: 0 40px 0 18px;
  font-size: 12px;
  color: #505050;
  background: #f9f9f9;
  cursor: pointer;
}

.magasins__pickup--select-trigger:after {
  position: absolute;
  display: block;
  content: '';
  top: 50%;
  right: 20px;
  margin-top: -3px;
  transform: rotate(45deg) translateY(-50%);
  transition: all .2s ease-in-out;
  transform-origin: 50% 0;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 0 solid transparent;
  border-bottom: 10px solid #2B73E4;
}

.magasins__pickup--select.opened .magasins__pickup--select-trigger:after {
  margin-top: 3px;
  transform: rotate(-135deg) translateY(-50%);
}

.magasins__pickup--options {
  position: absolute;
  display: block;
  top: 100%;
  left: 0;
  right: 0;
  min-width: 100%;
  margin: 15px 0;
  border: 1px solid #d8d8d8;
  box-sizing: border-box;
  box-shadow: 0 2px 1px rgba(0, 0, 0, .07);
  background: #f9f9f9;
  transition: all .2s ease-in-out;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-15px);
}

.magasins__pickup--select.opened .magasins__pickup--options {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
  transform: translateY(0);
  margin-top: 5px;
  z-index: 1;
}

.option-hover:before {
  background: #f9f9f9;
}

.magasins__pickup--option {
  position: relative;
  display: block;
  padding: 0 22px;
  font-size: 12px;
  color: #505050;
  line-height: 35px;
  cursor: pointer;
  transition: all .2s ease-in-out;
}

.magasins__pickup--option:hover {
  opacity: .8;
}

.magasins__pickup--option:hover,
.magasins__pickup--option.selection {
  background: #2B73E4;
  color: #fff;
}

.mode-click-collect-option .magasins__pickup--options {
  width: 150px !important;
}
/** End custom Select box **/

/* listMissingProductsMagasinModal.html.twig */
.missing__products__modal .missing__product__container {
  max-height: 500px;
  overflow-y: auto;
  margin-right: 20px;
  padding-left: 26px;
}

.scroll__custom::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.scroll__custom::-webkit-scrollbar {
  width: 6px;
  background-color: #F5F5F5;
}

.scroll__custom::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #D9D9D9;
}

.missing__products__modal .missing__product__container .missing__product__item {
  padding: 20px 0;
}

.missing__products__modal .missing__product__container .missing__product__item .missing__product__image {
  width: 100px;
}

.missing__products__modal .missing__product__container .missing__product__item .missing__product__lib {
  align-content: center;
}

.missing__products__modal .missing__product__container .missing__product__item .missing__product__detail {
  flex: 1;
  align-content: center;
}

.missing__product__action {
  padding: 0 20px;
}

.missing__product__action button {
  min-width: 300px;
}

#list_missing_products_magasin .modal-header {
  padding: 16px 0 0 20px;
}

#list_missing_products_magasin .modal-header button {
  display: none;
}

.modal-header .sous-titre {
  font-size: 24px;
  text-transform: initial;
}

@media screen and (min-width: 767px) {
  .missing__products__modal .missing__product__container .missing__product__item .missing__product__lib {
    flex: 5;
  }
}

@media screen and (max-width: 767px) {
  .missing__products__modal .missing__product__container .missing__product__item .missing__product__lib {
    flex: 3;
  }
}
/* end listMissingProductsMagasinModal.html.twig */

/* start magasinInfoModal.html.twig */
#magasin_info .modal-content {
  width: 500px;
}

#magasin_info .modal-content .modal-header button {
  top: 12px !important;
}

#magasin_info .magasin__popup {
  padding: 0 50px 40px 50px;
}

#magasin_info .magasin__popup .magasin__content .magasin__lib {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 20px;
}

#magasin_info .magasin__popup .magasin__content .magasin__time__list span,
#magasin_info .magasin__popup .magasin__content .magasin__time__title {
  color: #000E36;
}

/* end magasinInfoModal.html.twig */

/* start listMagasinTypeEnlevementModal.html.twig */
#list_magasin_type_enlevement .magasins__container {
  padding: 0 20px 14px 40px;
}

#list_magasin_type_enlevement .magasins__container .magasins__search {
  padding: 15px 0;
}

#list_magasin_type_enlevement .magasins__container .magasins__search .magasins__search--title {
  font-size: 12px;
}
#list_magasin_type_enlevement .magasins__container .magasins__search .magasins__search--box-input {
  position: relative;
  width: 50%;
}
#list_magasin_type_enlevement .magasins__container .magasins__search .magasins__search--box-input img {
  top: 9px;
  position: absolute;
  width: 18px;
  right: 12px;
}
#list_magasin_type_enlevement .magasins__container .magasins__search .magasins__search--box-input .magasins__search--input {
  font-size: 12px !important;
  color: #929292FC;
  width: 100%;
  border: 2px solid #E1E1E1;
  height: 36px;
}
#list_magasin_type_enlevement .magasins__container .magasins__title {
  font-size: 24px;
  font-weight: 600;
}
#list_magasin_type_enlevement .magasins__container .magasins__title .magasins__title--sub {
  font-size: 20px;
  color: #656565;
  font-weight: 400;
}
#list_magasin_type_enlevement .magasins__container .magasins__body {
  height: 450px;
  overflow-y: auto;
}
#list_magasin_type_enlevement .magasins__container .magasins__body > div {
  flex: 50%;
  margin-bottom: 30px;
}
#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item:hover {
  cursor: pointer;
}
#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item .magasins__radio {
  padding: 5px 10px 0 0;
}
#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item .magasins__content .magasin__lib {
  font-weight: 500;
  font-size: 16px;
  color: #000E36;
}

#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item .magasins__content .magasin__address,
#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item .magasins__content .magasins__slots ul li span,
#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item .magasins__content .magasin__timeslot--title {
  font-size: 12px;
}
#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item .magasins__content .magasin__timeslot--title {
  color: #000E36;
  font-weight: 500;
  margin: 8px 0;
}

#list_magasin_type_enlevement .magasins__container .magasins__body .magasins__item .magasins__content .magasins__slots ul li span {
  color: #000E36;
}

@media screen and (max-width: 600px){

  #list_magasin_type_enlevement .magasins__container .magasins__body > div {
    flex: none;
  }
  #list_magasin_type_enlevement .magasins__container .magasins__title .magasins__title--sub {
    display: block;
  }
  #list_magasin_type_enlevement .magasins__container .magasins__title .magasins__title--separator {
    display: none;
  }
  #list_magasin_type_enlevement .magasins__container .magasins__search .magasins__search--box-input {
    width: 100%;
  }
  #list_magasin_type_enlevement .magasins__container {
    padding: 0 30px;
  }
}
/* end listMagasinTypeEnlevementModal.html.twig */