
/*=================================
Start Off Canvas Area Wrapper
==================================*/
.off-canvas-area-wrapper, .off-canvas-responsive-menu, .off-canvas-search-box {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  position: fixed;
  top: 0;
  right: 0;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
  height: 100vh;
  width: 100vw;
}

.off-canvas-area-wrapper .off-canvas-content-wrap, .off-canvas-responsive-menu .off-canvas-content-wrap, .off-canvas-search-box .off-canvas-content-wrap {
  background-color: white;
  margin-left: auto;
  height: 100%;
  position: relative;
  -webkit-transform: translateX(calc(100% + 40px));
  -ms-transform: translateX(calc(100% + 40px));
  transform: translateX(calc(100% + 40px));
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
  max-width: 500px;
  width: 100%;
}

@media only screen and (max-width: 575.98px) {
  .off-canvas-area-wrapper .off-canvas-content-wrap, .off-canvas-responsive-menu .off-canvas-content-wrap, .off-canvas-search-box .off-canvas-content-wrap {
      max-width: calc(100% - 45px) !important;
  }
}

.off-canvas-area-wrapper .off-canvas-content-wrap .off-canvas-content, .off-canvas-responsive-menu .off-canvas-content-wrap .off-canvas-content, .off-canvas-search-box .off-canvas-content-wrap .off-canvas-content {
  padding: 40px;
  height: 100%;
  overflow-y: auto;
}

@media only screen and (max-width: 575.98px) {
  .off-canvas-area-wrapper .off-canvas-content-wrap .off-canvas-content, .off-canvas-responsive-menu .off-canvas-content-wrap .off-canvas-content, .off-canvas-search-box .off-canvas-content-wrap .off-canvas-content {
      padding: 30px 15px;
  }
}

.off-canvas-area-wrapper .off-canvas-content-wrap .off-canvas-content .off-canvas-item, .off-canvas-responsive-menu .off-canvas-content-wrap .off-canvas-content .off-canvas-item, .off-canvas-search-box .off-canvas-content-wrap .off-canvas-content .off-canvas-item {
  margin-bottom: 60px;
}

.off-canvas-area-wrapper .off-canvas-content-wrap .off-canvas-content .off-canvas-item:last-child, .off-canvas-responsive-menu .off-canvas-content-wrap .off-canvas-content .off-canvas-item:last-child, .off-canvas-search-box .off-canvas-content-wrap .off-canvas-content .off-canvas-item:last-child {
  margin-bottom: 0;
}

.off-canvas-area-wrapper .off-canvas-content-wrap .off-canvas-content .off-canvas-item h2, .off-canvas-responsive-menu .off-canvas-content-wrap .off-canvas-content .off-canvas-item h2, .off-canvas-search-box .off-canvas-content-wrap .off-canvas-content .off-canvas-item h2 {
  font-size: 16px;
  line-height: 1;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 23px;
  margin-top: -2px;
}

.off-canvas-area-wrapper .off-canvas-content-wrap .btn-close, .off-canvas-responsive-menu .off-canvas-content-wrap .btn-close, .off-canvas-search-box .off-canvas-content-wrap .btn-close {
  background-color: white;
  position: absolute;
  right: 99%;
  top: 100px;
  line-height: 40px;
  height: 40px;
  width: 40px;
border:0;
}

.off-canvas-area-wrapper .off-canvas-content-wrap .btn-close:hover, .off-canvas-responsive-menu .off-canvas-content-wrap .btn-close:hover, .off-canvas-search-box .off-canvas-content-wrap .btn-close:hover {
  background-color: var(--primary);
  color: white;
}

.off-canvas-area-wrapper.show, .off-canvas-responsive-menu.show, .off-canvas-search-box.show {
  opacity: 1;
  visibility: visible;
  pointer-events: visible;
  z-index: 99999;
}

.off-canvas-area-wrapper.show .off-canvas-overlay, .off-canvas-responsive-menu.show .off-canvas-overlay, .off-canvas-search-box.show .off-canvas-overlay {
  background-color: rgba(0, 0, 0, 0.5);
  content: "";
  /* cursor: url("../img/icons/cancel.png"), auto; */
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
}

.off-canvas-area-wrapper.show .off-canvas-content-wrap, .off-canvas-responsive-menu.show .off-canvas-content-wrap, .off-canvas-search-box.show .off-canvas-content-wrap {
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}



.quantity_wanted input, .cantidad-carrito input{
max-width: 70px;
text-align: center;
display: inline;
}
.quantity_wanted input::-webkit-outer-spin-button,.quantity_wanted input::-webkit-inner-spin-button {
  /* display: none; <- Crashes Chrome on hover */
  -webkit-appearance: none;
  margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
.quantity_wanted input[type=number] {    -moz-appearance:textfield; /* Firefox */}

.quantity_wanted .button-plus,.quantity_wanted .button-minus{
padding:0 20px;
}
.cantidad-carrito .button-plus, .cantidad-carrito .button-minus{
padding: 0 10px;
height: 30px;
}
.recalcular{
padding: 0 0.5em;
font-size: .75rem;
border-radius: 0.2rem;
display: block;
height: 30px;
}
.btn,.form-control {  border-radius: 0px;}
#contentfitxa h1{font-size: clamp(18px,1.8vw,24px);}
#contentfitxa h2,#contentfitxa #preu h4 {
color: var(--primary);
font-size: 20px;font-size: clamp(18px,1.8vw,24px);line-height: normal;margin: 0;
}
#contentfitxa .cartBlock{padding: 0 30px;}
#comentario-compra {/*display:none;*/}
.btn-system.comprarbut {
background-color: var(--primary);
border-color: var(--primary);color: #fff;font-size: 20px;
}
.btn-system.comprarbut:hover {
background-color: #000!important;
border-color: #000!important;color: #fff;
}
.btn-system.btn-large{ background-color: var(--primary);  border-color: var(--primary);color: #fff;}
.hide{display:none;}
.shoppingcart-content h2{font-size: 28px;}

#preu{display: flex;flex-wrap: wrap;}
#preu label{color:var(--primary); font-weight: bold;font-size: clamp(18px,1.8vw,24px);display:block;}
#lotSelect{font-size: 16px;height: 48px;}
.Precio,.ptotal h4{color:#000; font-size: 26px;}
#precioTotal{font-size: 36px;font-weight: bold;}
.techData{color:#000;}
.techData li{border-bottom: 1px solid #eee;list-style: none;padding: 5px 0;}
.availability{margin-bottom:15px;}
.label_stock { color: black;   border-radius: 4px;  display: inline-block; font-size: 12px;  font-weight: normal;  line-height: 16px;  letter-spacing: 0.2px;  text-transform: uppercase; background-color: var(--groc) !important; color:#000;}

.extrascompra{width: 100%;}
#comentario-compra{}
#comentario-compra label{width: 100%; display:block;}
#comentario-compra #comment-shop{}

#direcciones{}
#direcciones ul.address{background-color: #efefef; color:#222;display: inline-block;padding: 15px 30px;box-shadow: 0 3px 10px rgb(0 0 0 / 0.3);}
#direcciones ul.address li{list-style: none;}
#direcciones ul.address li h3{font-size: 24px;line-height: normal;margin: 0;font-weight: 500;}
#direcciones .btn{background-color: var(--dark); color:#fff;}
#comentario-compra textarea {  overflow: auto;  resize: vertical;  padding: 15px;  font-size: 16px;background-color: #fff;
padding: 10px; border:none;
margin: 10px 10px;
box-shadow: 0 3px 10px rgb(0 0 0 / 0.3);}
/* .btn:hover {	background-color: var(--primary)!important;} */
html #politicas-cookie .buttons-cookies button:hover, html #politicas-cookies .aceptar-footer button:hover {background-color: var(--primary)!important; color: #fff !important;}
.alert-danger p{color:#fff; text-align: center;margin: 0;}
.alert-danger{margin-bottom:30px;}
.link-carrito{border:none; position:relative;}
#cant_carrito {
position: absolute;
top: 5px;
left: 50%;
margin-left: 2px;
z-index: 2;
width: 18px;
height: 18px;
line-height: 18px;
font-size: 12px;
border-radius: 50%;
display: block;
text-align: center;
font-weight: 500;
background-color: var(--groc) !important;
}
.link-carrito.btn-icon-transparent:hover {  color: rgba(255,255,255,0.5) !important;}
.link-carrito {
color: #000!important;
}
.formDataOrder .card {  border: none;   box-shadow: 0 3px 10px rgb(0 0 0 / 0.3);  margin: 15px 0;  border-radius: 0;}
#totalCount{padding: 15px;}
#pagamentslist { display: flex;  flex-wrap: wrap;}
#pagamentslist .payment-item {
/* padding: 8px 15px; */
/* border: 1px solid #fff; */
/* margin-right: 15px; */
display: flex;
align-items: center;
margin-bottom: 15px;
position: relative;
transition: all 0.3s linear;
}
#pagamentslist .payment-item {  display: block !important; color:#000; text-align: center;}
#pagamentslist .payment-item .logo-payment {
width: 100%;
display: block;
height: 30px;
background-repeat: no-repeat !important;
background-position-x: center !important;
background-size: contain !important;
}
#pagamentslist .payment-item input {
margin-right: 8px;
position: absolute;
right: 0;
height: 100%;
width: 100%;
opacity: 0;
top: 0;
}
/* #pagamentslist .payment-item.active {  border: 1px solid #abcd3e !important;} */
#pagamentslist .payment-item.Redsys .logo-payment {  background: url('../img/payment-methods/redsys-tarjetas.jpg');}
#pagamentslist .payment-item.PayPal .logo-payment {  background: url('../img/payment-methods/paypal.jpg');}
#pagamentslist .payment-item.PAYCOMET .logo-payment {  background: url('../img/payment-methods/paycomet.jpg');}
#pagamentslist .payment-item::before {  display: block;}
#pagamentslist .payment-item::before:hover{opacity: 0.6;}

#paymentAdditionalinfo .payinfo{background: #eee;padding: 30px;color: #000;}
#paymentAdditionalinfo #TransferInfo li{border-bottom: 1px solid #ccc;padding: 10px 0;list-style: none;}
.hidden{display:none;}

#floatcart a {  color: black;}
.itemfloatcart .descripcion{}
#fastCart h2,#fastCart h3,#fastCart h4,#fastCart h5{color:#000;}
#fastCart p{color:#333;}
#fastCart .btn-remove-product{background: transparent;border: none;bottom: -25px;position: absolute;z-index: 10; right: 0;}
.itemfloatcart .descripcion{padding-right: 30px;margin-bottom:0px;}
.itemfloatcart .descripcion a{color:#000!important; line-height: normal!important; }

.itemfloatcart .price,.itemfloatcart .producto-importe {display: flex;font-size: 16px;align-items: center; }
.carritoflotante{  padding:0px;}
li.itemfloatcart{  list-style: none;border-bottom: 1px solid #eee;  padding: 0px 0;border-bottom: 1px solid #eee;margin-top: 0.5rem;}
#products-carrito{margin-bottom: 30px!important;}



#fastCart .producto-cantidad{text-transform: lowercase;  background-color: var(--primary);  color: #fff;  padding: 3px 8px;  font-size: 12px;
border-radius: 8px;margin-right: 10px;}
#fastCart .link-carrito{color:#fff;}
#fastCart .link-carrito:hover{background-color:#000!important;}

#cart .shoppingcart-content .carrito_delete,#cart #delete-coupon{border:none; background-color: transparent;font-size: 20px;}
#cart #pedido-carrito th{font-weight: bold;}

#orderPage .btn-primary-outline{ background-color: #eee;}
/* #orderPage{padding-top: 30px;} */

#collapse-address form .address-form {display: flex;flex-wrap: wrap;}
#collapse-address form .form-group{width: 50%;padding: 0 30px 0 0;}
#collapse-address form label{color:#000;}
#collapse-address form button{margin-right: 30px; margin-top:15px;}
button .fa-angle-right{margin-left:15px;}
button .fa-angle-left{margin-right:15px;}

#orderPage label{color:#000;}
#orderPage #totalCount{display: table;padding: 30px;background: #eee;color: #333;}
#orderPage #totalCount .totalCountLine{border-bottom: 1px solid #eee;}
#acceptLegalsBuy label{color:#000;}
#orderPage #end-payment{margin-top:0;margin-left: 25px;/* text-transform: uppercase; */}

#continue-address{display: flex; flex-wrap:wrap;}
#continue-address .form-group{width: 50%;padding: 0 30px 0 0;}

.address-info .actions .btn{
  padding: 15px;
}

#linetable-clone{
display: none!important;
}
@media (max-width: 576px){
  #modal-order-details .modal-body{
    min-height: auto;
  }
}
/* RESPONSIVE TABLE */
#table-details {
border: 1px solid #ccc;
border-collapse: collapse;
margin: 0;
padding: 0;
width: 100%;
table-layout: fixed;
}

#table-details caption {
font-size: 1.5em;
margin: .5em 0 .75em;
}

#table-details tr, #table-error-lines tr {
background-color: #f8f8f8;
border: 1px solid #ddd;
padding: .35em;
}

#table-details th,
#table-details td,
#table-error-lines th, 
#table-error-lines td {
padding: .625em;
text-align: center;
}

#table-details th {
font-size: .85em;
letter-spacing: .1em;
text-transform: uppercase;
}

@media screen and (max-width: 600px) {


#table-details {
  border: 0;
}

#table-details caption {
  font-size: 1.3em;
}

#table-details thead {
  border: none;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

#table-details tr {
  border-bottom: 3px solid #ddd;
  display: block;
  margin-bottom: .625em;
}

#table-details td {
  border-bottom: 1px solid #ddd;
  display: block;
  font-size: .8em;
  text-align: right;
}

#table-details td::before {
  /*
  * aria-label has no advantage, it won't be read inside a table
  content: attr(aria-label);
  */
  content: attr(data-label);
  float: left;
  font-weight: bold;
  text-transform: uppercase;
}

#table-details td:last-child {
  border-bottom: 0;
}

}

/* END RESPONSIVE TABLE */
