@charset "utf-8";
/****************************************************PANIER TOP */
#compteur_panier {
     padding: 10px 0px;
    background-image: url("../../../medias/shopping-cart.png");
    background-position: center right;
}
#compteur_panier a {
    font-size: 18px;
    color: var(--color-clair);
    text-decoration: none;
    font-family: 'd-dindin-bold';
    border-left: var(--gris-fonce) solid 1px;
    display: inline-block;
    padding: 0px 30px 0 20px;
    position: relative;
}
 #count_panier {
    color: #fff;
    text-align: center;
    width: 22px;
    height: 22px;
    font-size: 12px;
    line-height: 2;
    border-radius: 20px;
    background: #ffffff;
    margin-left: 5px;
    position: absolute;
    background-color: var(--color-clair);
    right: -20px;
     top: -5px;
}
/********************page panier global */
#panier_list > .cke_editable > table{
    border-collapse: collapse;
 	margin:0 0 40px 0;
	width: 100%;
}
#panier_list > .cke_editable > table th, .block_commande table th  {
    padding: 7px 10px 5px 10px;
    background-color: var(--color-clair);
    color: #fff;
    border: 1px solid #fff;
    font-weight: normal;
    text-align: center;
}
#panier_list > .cke_editable > table tr:nth-child(even), .block_commande table tr:nth-child(even) { background-color:var(--gris-clair); }
#panier_list > .cke_editable > table td, .block_commande table td{
	vertical-align:top;
	border:1px solid #fff;
	border-width:0px 1px 1px 0px;
	padding:5px 10px 5px 10px;
}

/*******************************************************menu tunnel*/
#panier_list #tunnel {	
    margin-bottom:30px; 
    display: flex; 
    padding: 0; 
    justify-content: space-between;
}
#panier_list #tunnel li {
	list-style:none;
	width:32%;
	background-color:var(--color-fonce);
	color:#fff;
	padding: 0px 3px;
    text-align: center;
    font-size: 16px;
    border-left: #fff solid 1px;
    margin: 0;
}
#panier_list #tunnel li  p { position: relative;}
#panier_list #tunnel li:hover { 
    background-color:var(--color-clair);
    cursor: default;
}
#panier_list #tunnel p:before {
    color: #fff;
    margin-right: 10px;
    font-family: 'P900'; 
}
#panier_list #tunnel .etape_panier p:before  { content: "\f290";}
#panier_list #tunnel .etape_adresse p:before {	content: "\f3c5";}
#panier_list #tunnel .etape_paiement p:before { content: "\f09d";}
#panier_list #tunnel .etape_trans p:before { content: "\f0d1"; }
#panier_list #tunnel .tunel_actif { background-color:var(--color-clair)!important;}
#panier_list #tunnel .tunel_actif a{ color:#fff !important;}
#panier_list #tunnel li a{
	color:#fff;
	text-decoration:none;
}
/********************************panier*/
#panier_list .panier_vide, .result_command{
    display: table;
    margin: 30px auto;
    background-color: var(--gris-clair);
    text-align: center;
	font-size:18px;
	padding: 50px;
}
#contenu__js__pop__ #panier_list {text-align: left;}
.tab_panier{   margin-bottom:40px; width:100%; }
.tab_panier a {  color: #000; text-decoration:none; }
.tab_panier th:first-child { text-align: left;}
.tab_panier .p_art {padding-left: 0; text-align: left;}
.tab_panier .ref_panier {	display: none;}
.tab_panier td { vertical-align: middle !important;}
.tab_panier td .tb_basket {
	float:left;
	margin-right:20px;
}
.tab_panier .option_msg {display: block;}
.tab_panier .input_shop_qte{
    width: 30px;
    text-align: center;
}
.tab_panier .pqtt  {
	width: 80px;
    text-align: center;
}
.tab_panier .pprix  {
	width: 100px;
    text-align: right;
}
.tab_panier .psup  {
    text-align: center;
    width: 30px;
}
.tab_panier .panier_suppr {
	width:20px;
	height:20px;
	display:block;
	cursor:pointer;
}
.tab_panier .panier_suppr::before {
    font-family: 'P900';
    content: "\f00d";
    color: var(--color-clair);
}
.tab_panier .ligne_total {font-weight:bold; text-align: right !important; background-color: #fff;}
#panier_list .tab_panier #panier_code_promo { width: 100%; }
#panier_list .valid_etape { text-align: right; }
#panier_list .valid_etape .valider_panier{ 
    transition: all, 0.3s;
    background: var(--color-clair);
    color: #ffffff;
    padding: 10px 15px;
    text-decoration: none;
    display: table;
    margin: 0 0 0 auto;
    text-transform: uppercase;
    border: 0;
}
#panier_list .valid_etape .valider_panier:hover{ 
    background-color: var(--color-fonce) ;
    transition: all, 0.3s;
	color: #fff ;
}
#contenu__js__pop__ #panier_list #tunnel {	display:none; }
#contenu__js__pop__ #panier_list .valid_etape {display: flex; justify-content: space-between;}
#contenu__js__pop__ #panier_list #tunnel {	display:none; }
#contenu__js__pop__ #panier_list .continuer_panier {
    transition: all, 0.3s;
    background: var(--color-fonce);
    color: #ffffff;
    padding: 10px 15px;
    text-decoration: none;
    display: table;
    text-transform: uppercase;
    border: 0;
}
#contenu__js__pop__ #panier_list .continuer_panier:hover {
	background-color: var(--color-clair) ;
    transition: all, 0.3s;
	color: #fff ;
}
/**************************************Adresse  */
#panier_list .tab_adresse th { font-size: 16px;}
#panier_list .tab_adresse tr:nth-child(3) td { text-align: center;}
#panier_list .tab_adresse td { 	width:50%; padding: 20px 20px  !important; }
#panier_list .tab_adresse label  {
	padding:10px;
	display:flex;
	align-items: flex-start;
}
#panier_list .tab_adresse label p  {	padding:0 0 0 20px; }
#panier_list .tab_adresse p span  {display:block;}
#panier_list .tab_adresse label p span:first-child  { font-weight:bold; }
#panier_list .tab_adresse .adr_active{
  	border: var(--gris-fonce) solid 1px;
	background-color:#FFF !important;
}
#panier_list .tab_adresse .change_livraison, .tab_adresse .change_retrait a  {
    padding: 5px 14px 5px 14px;
    color: var(--color-clair);
    text-decoration: none;
    display: inline-block;
    border:var(--color-clair) solid 1px;
	margin: 15px 0;
	transition:all 0.3s;
}
#panier_list .tab_adresse .change_livraison:hover,#panier_list .tab_adresse .change_retrait a:hover {
    background-color: var(--color-clair);
    color: #fff;
    transition: all, 0.3s;
}
#panier_list .tab_adresse .add_adress {margin: 20px auto 0 auto;}

/**************************************Choix transport  */
#panier_list .list_transport {
    background-color: var(--gris-clair);
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
}
/*#panier_list .list_transport label { width: 50%; }*/
#panier_list .list_transport > div { width: 50%; }
#panier_list .list_transport .plugin_transport { width: 100%; margin: 30px 0 0 0;}
#panier_list .list_transport .selected_transport {
    background-color: #fff;
    border:    var(--gris-fonce) solid 1px
}
#panier_list .list_transport .cout_transport {
    margin-left: 20px;
    display: inline-block;
    color: var(--color-clair);
}
#panier_list .list_transport label{
    display: block;
    padding: 10px;
}

/******************************************************calendrier**/
#panier_list .p_dispo { padding: 0; }
#panier_list .p_dispo .p1_dispo, #panier_list .p_dispo .p2_dispo { display: none; }
#panier_list .nav_calendar{text-align: center;}
#panier_list .nav_calendar > *{
	background-color: var(--color-clair);
	margin: 8px;
	padding: 8px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
}
 #panier_list #calendar_scroll{
     text-align: left;
     width: 100%;
     white-space: nowrap;
     overflow: overlay;
    margin-bottom: 30px;
}
@-moz-document url-prefix() {
    #panier_list #calendar_scroll{
       overflow: auto;
    }
}

#panier_list .calendrier .noclique span{visibility:hidden;}
#panier_list .calendrier {
    width: auto!important;
    display: inline-table;
    margin: 0 0 10px 0!important;
    text-align: center;
    border-collapse: collapse;
}
#panier_list .calendrier thead td {
	background-color: var(--color-clair);
	color: #fff;
}
#panier_list .calendrier thead td span{margin: 0 2px; }
#panier_list .calendrier td {padding: 5px 7px;}
#panier_list .calendrier tbody tr td { 	transition: all, 0.3s; }
#panier_list .calendrier tbody tr td:hover {transition: all, 0.3s;}
#panier_list .calendrier .noclique {
	background-color: var(--gris-fonce);
	cursor: not-allowed;
	line-height: 0px;
	padding: 0 ;
}
#panier_list .calendrier .clique {
	cursor: pointer;
    position: relative;
}
#panier_list .calendrier tbody td span { text-align: center; display: block;}
#panier_list .calendrier .clicked, #panier_list .calendrier .clique:hover{
    color: #fff;
    background-color: var(--color-clair);
}
#panier_list .calendrier .clique:hover:before, #panier_list .calendrier .clicked:before {
	content: '\f00c';
    font-family: 'p900';
    position: absolute;
    top: 10px;
    left:10px;
    color: #fff;
}
#panier_list .calendrier .clique:hover span, #panier_list .calendrier .clicked span{padding-left:25px;}
#panier_list .calendrier td {	border: 1px solid var(--gris-fonce);}

/***********************************************Paiement + comment*/
#panier_list .pay_comm {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    column-gap: 30px;
}
#panier_list .type_pay, #panier_list .tab_commentaire {     width: calc(50% - 15px);}
#panier_list .type_pay div {
    background-color: var(--gris-clair);
	padding:20px 20px;
	background-image:url(../medias/image_cb.png);
	background-position:right 15px top 15px;
}
#panier_list .type_pay div label{
    padding-bottom: 10px;
    font-size: 16px;
    display: block;
}
#panier_list .tab_commentaire div  {
	background-color:var(--gris-clair);
	padding: 10px;
}
#panier_list .tab_commentaire  textarea{
    width:100%;
	height: 86px;
	background-color: #fff;
}
#panier_list .cgv{
	text-align:right;
	margin:20px 0;	
}
/******************************************************Paiement*/
#payment-form {
	width: 100%;
	max-width: 500px;
	background-color: #d7d7d7;
	margin: 0 auto;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 70px 30px 10px 30px;
	margin-top: 60px;
	background-image: url(../medias/image_cb.png);
	background-position: center top 20px;
}
#payment-form #submit {
    padding: 5px 14px 5px 14px;
    color: #fff;
    text-decoration: none;
    display: block;
	background-color: #E02080;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 1.1em;
	border: none;
	margin-left: auto;
	margin-top: 15px;
	transition:all 0.3s;
}
#payment-form #submit:hover {
	background-color: #E02080;
	color: #2B2B2B;
	transition: all, 0.3s;
}
#card-element {
	background-color: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 10px 15px;
	 border: var(--gris-fonce) solid 1px;
	box-shadow: 0 0 3px rgba(0,0,0,.05);
}
#card-errors {
	text-align: center;
	padding: 10px;
	color: red;
}

/*********************************************liste_commande */
.liste_commandes{ width: 100%;border-collapse: collapse; margin: 0 0 0px 0;  }
.ligne_commande{ background-color: var(--gris-clair); cursor: pointer;}
.ligne_commande td{ padding: 7px 10px 5px 10px; font-size: 16px;}
.ligne_commande .date_commande{ width: 32%; text-align: right;}
.ligne_commande_act{background-color: var(--color-clair); color:#fff; }
.block_commande .adrfact span{margin: 0 5px;display: block;}

.block_commande {
	display: none;
	border:var(--color-clair) solid 1px;
	border-top:0px;
	margin-bottom:20px;
	padding:20px;
}
.block_commande .recap_adress span {display: block;}
.block_commande .recap_command {width: 100%;}
.block_commande .tab_panier { margin-bottom: 0;}
.liste_commandes .facture {text-align: right;}
.liste_commandes .facture a{color: #fff !important; text-decoration: none; display: inline-block;}
.liste_commandes .recap_transporteur{
    padding: 10px 2px 10px 2px;
	font-weight:normal !important;
}
.liste_commandes .adr_livraison span { display: block; }



/********************************************************CGV*/
.no_transport{
    padding: 20px;
	background-color: #F5F5F5;
    text-align: center;
	color: #FE5757;
}
.hidden_basket_button{ visibility: hidden;}