/*
 * Custom style goes here.
 * A template should always ship with an empty custom.css
 */
 :root{

    --negro-cuqui:#333;
    --grisbg: #f7f7f7;
    --accent:#327CBF; /*ffacbc;*/
    --accent2:#327CBF77;

    --bordecuqui:1px solid rgba(50, 124, 191, 0.57);


 }
img {
    image-rendering: auto !important;
}

 .cuqui-miniatura-title{
    display:flex;
    align-items: flex-start;
    height:3em;
    /* border:1px solid #c00; */
 }

 /*En miniaturas*/
.product-miniature .elementor-widget-pkminiaturebrand{
    min-width:1px !important;
    min-height:29px !important;
    /* border:1px solid; */
}

#js-product-list-top .btn.pk-filter-button{
    display:block !important;
}
#search_filters {
    display:flex;
    justify-content: flex-start;
    align-items: flex-start;
    width:100%;
    /* border:1px dashed #c00; */
    padding:2px;
}

#search_filters >section.facet{
    width:48%;
}


#search_filters >section.facet h4{
    padding-bottom:10px;
    margin-bottom: 10px;;
}

div.product-list-container  > .product-miniature .elementor-row{
    flex-wrap: nowrap !important;
}


/*Productos de marca dada -->generated.css*/
body#manufacturer #main-content #products.view_grid .product_list .grid-container{
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    column-gap: 20px;
    row-gap: 20px;
}


.brands-list ul.flex-container {
    display:grid;
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    column-gap: 30px;
    row-gap: 40px;
}

.brands-list ul.flex-container li{
    width:auto;
}
@media screen and (max-width: 990px) {
   .brands-list ul.flex-container{
        grid-template-columns: repeat(3, minmax(130px, 1fr));
    }
    body#manufacturer #main-content #products.view_grid .product_list .grid-container{
        grid-template-columns: repeat(3, minmax(130px, 1fr));
    }
}
@media screen and (max-width: 768px) {
    .brands-list ul.flex-container{
        grid-template-columns: repeat(2, minmax(130px, 1fr));
    }
    body#manufacturer #main-content #products.view_grid .product_list .grid-container{
        grid-template-columns: repeat(2, minmax(130px, 1fr));
    }
}
@media screen and (max-width: 560px) {
    .brands-list ul.flex-container{
        grid-template-columns: repeat(1, minmax(130px, 1fr));
    }
    body#manufacturer #main-content #products.view_grid .product_list .grid-container{
        grid-template-columns: repeat(1, minmax(130px, 1fr));
    }
}


@media screen and (max-width: 768px) {
    .w-100.block-reassurance ul {
        flex-direction: column;
        align-items: flex-start !important;
        gap: .5rem;
    }
}

/*
    Listado productos en mvil a 1 columna (o elementos non deixa)
*/


@media (max-width: 520px) {
    #main-content .elementor-4020101 .elementor-element.elementor-element-bd6150d #products.view_grid .product_list .grid-container {
        grid-template-columns: repeat(1, minmax(130px, 1fr));
    }
}
/*Producto*/
body#product div#producto-titulo{
    margin:0;
    padding:0;
}

section.checkout-step.-current{
    padding-bottom:2vh;
}

.w-100.block-reassurance ul {
    list-style-type: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: .5rem;
}

.w-100.block-reassurance ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .5rem;
}

.w-100.block-reassurance ul li a:hover {
    color: #313537 !important;
}

.w-100.block-reassurance li img {
    width: 2rem !important;
    height: auto !important;
}

.w-100.block-reassurance li:hover img {
    transform: scale(1.25);
    transition: transform 0.3s ease-in-out;
}

@media screen and (max-width: 768px) {
    .w-100.block-reassurance ul {
        flex-direction: column;
        align-items: flex-start !important;
        gap: .5rem;
    }
}


/*Table Pedidos*/

/*reset*/
table.table-pedidos{
    border:var(--bordecuqui);
    border-collapse: collapse;
}
table.table-pedidos th, table.table-pedidos td{border:none;}
table.table-pedidos thead tr{
    border:var(--bordecuqui) !important;
}



table.table-pedidos thead tr th{
    background-color:var(--negro-cuqui);
    color:#fff;
    padding:5px 10px;
    text-align:left;
    border: 1px solid #fff;
}
table.table-pedidos tbody tr td{
    border:var(--bordecuqui);
    padding:5px 10px;
}
table.table-pedidos tbody tr td:not(:last-child){
    border-bottom:none;
}

@media screen and (max-width: 990px) {
    table.table-pedidos{ border:none !important;   }
    table.table-pedidos thead{display:none}
    table.table-pedidos tbody tr{border:none}
    table.table-pedidos tbody tr:nth-child(even){background-color:#f1f1f1;}
    table.table-pedidos tbody tr:nth-child(odd){background-color:#e1e1e1;}

    table.table-pedidos tbody tr td{
        display:block;
        text-align:left !important;
        padding:0;
    }

    table.table-pedidos tbody tr td:before{
        display:block;
        width:100%;
        box-sizing: border-box;
        padding:5px 10px;
        content: attr(data-title);
        color:#fff;
        background-color: var(--negro-cuqui);
        font-weight: bold;
        border:1px solid;
    }

    table.table-pedidos tbody tr td.order-actions .mywrapper{
        padding:10px 0;
        display:flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
        width:100%;
    }
    table.table-pedidos tbody tr td.order-actions .mywrapper a{
        font-weight:normal;
        color:var(--accent) !important;
        text-decoration: none;
        transition:all 150ms ease-in-out;
    }

    table.table-pedidos tbody tr td.order-actions .mywrapper a{
        font-weight:normal;
        color:var(--accent) !important;
        text-decoration: none;
    }

}


/*Basura alysum*/
.in_progress {
    border-radius: 0 !important;
    background: transparent !important;
    -webkit-animation: none !important;
    animation: none !important;
}
.in_progress >span{
  display:none;
}



/*Animacion reloxo de area*/
.sandclock-wrapper {
  position: relative;
  width: 50px;
  height: 100px;
  transform-origin: center center;
  -webkit-animation: rotate 3s 0.75s ease-in-out infinite;
          animation: rotate 3s 0.75s ease-in-out infinite;
  display:none;
  transform: scale(0.25);
}

.in_progress .sandclock-wrapper {
  display: block;

}


.sandclock-wrapper:before, .sandclock-wrapper:after {
  z-index: -1;
  content: "";
  border: solid 4px rgba(0, 0, 0, 0.2);
  border-bottom: none;
  border-left: none;
  border-right: none;
  border-radius: 50%;
  -webkit-clip-path: inset(0 60% 0 0);
          clip-path: inset(0 60% 0 0);
  width: 100%;
  height: 50%;
  -webkit-animation: shadow 3s 0.75s linear infinite;
          animation: shadow 3s 0.75s linear infinite;
  opacity: 0;
}
.sandclock-wrapper:after {
  position: absolute;
  top: -1px;
  left: -18px;
}
.sandclock-wrapper:before {
  position: absolute;
  bottom: -1px;
  right: -18px;
  transform: rotate(180deg);
}

.clock {
  position: relative;
  width: 0;
  height: 0;
  border-top: solid 50px #e67e22;
  border-bottom: solid 25px transparent;
  border-left: solid 25px transparent;
  border-right: solid 25px transparent;
}
.clock:before, .clock:after {
  content: "";
  position: absolute;
  left: -20px;
  top: -47px;
  width: 0;
  height: 0;
  border-top: solid 44px #f3f3f3;
  border-bottom: solid 20px transparent;
  border-left: solid 20px transparent;
  border-right: solid 20px transparent;
}
.clock:after {
  border-top: solid 44px #e67e22;
  will-change: transform;
  -webkit-animation: clock1 3s linear infinite;
          animation: clock1 3s linear infinite;
}
.clock:last-child {
  transform: rotate(180deg) translateY(50px);
}
.clock:last-child:after {
  transform: scale(0);
  -webkit-animation: clock2 3s linear infinite;
          animation: clock2 3s linear infinite;
}

@-webkit-keyframes clock1 {
  20%, 50% {
    transform: scale(0);
  }
  70%, 100% {
    transform: scale(1);
  }
}

@keyframes clock1 {
  20%, 50% {
    transform: scale(0);
  }
  70%, 100% {
    transform: scale(1);
  }
}
@-webkit-keyframes clock2 {
  20%, 50% {
    transform: scale(1);
  }
  70%, 100% {
    transform: scale(0);
  }
}
@keyframes clock2 {
  20%, 50% {
    transform: scale(1);
  }
  70%, 100% {
    transform: scale(0);
  }
}
@-webkit-keyframes shadow {
  10% {
    opacity: 1;
  }
  20%, 50% {
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
  70%, 100% {
    opacity: 0;
  }
}
@keyframes shadow {
  10% {
    opacity: 1;
  }
  20%, 50% {
    opacity: 0;
  }
  60% {
    opacity: 1;
  }
  70%, 100% {
    opacity: 0;
  }
}
/* @-webkit-keyframes rotate {
  20%, 50% {
    transform: rotate(180deg);
    transform: scale();

  }
  70%, 100% {
    transform: rotate(360deg);
  }
} */
@keyframes rotate {
  20%, 50% {
    transform: scale(0.25) rotate(180deg);
  }
  70%, 100% {
    transform: scale(0.25) rotate(360deg);
  }
}