/*
Theme Name: Hello Elementor Child
Theme URI: https://farmaciaconesa.com/
Description: Child theme de Hello Elementor
Author: Tu Nombre
Author URI: https://farmaciaconesa.com/
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

/********************************** jreig ******************************************/

/* Variables de colors globals */
:root {
    --natural-green: #2D816A;
    --light-green:   #DFE5E6;
    --light-gray:    #E1E1E1;
    --dark-gray:     #B4B4B4;
}

/* Exemple d’ús */
body {
    background-color: var(--light-green);
    color: var(--dark-gray);
}

a {
    color: var(--natural-green);
}

hr {
    border-color: var(--light-gray);
}

/* carregar font */
/* === Load TWKEverett Regular === */
@font-face {
    font-family: 'TWKEverett';
    src: url('fonts/TWKEverett-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

html body {
    font-family: "TWKEverett", sans-serif;
}


.elementor-heading-title{font-family: 'TWKEverett', sans-serif !important}

/* Tipografia principal per headers */
h1 { font-size: 3.33rem; line-height: 1.2; }
h2 { font-size: 2rem;   line-height: 1.3; }
h3 { font-size: 1.17rem; line-height: 1.4; }
h4 { font-size: 0.83rem; line-height: 1.4; }



/* Opcional: petits ajustos responsive per pantalles molt petites */
@media (max-width: 480px) {
    h1 { font-size: 2.5rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1rem; }
    h4 { font-size: 0.75rem; }
}



/************************** header anf footer LAYOUTS ************************************/

@media (min-width: 768px) {
    .page-header .entry-title, .site-footer .footer-inner, .site-footer:not(.dynamic-footer), .site-header .header-inner, .site-header:not(.dynamic-header), body:not([class*=elementor-page-]) .site-main {
        width: 100% !important;
        max-width: 100% !important;
    }
}



/*********************************** HEADER *****************************/

/* logo Conesa */

.elementor-element.elementor-element-3cb5d3b.elementor-widget.elementor-widget-image img {
  width: 60px;
}

/* menu sticky */

/* Estat normal */
#header-conesa {
    position: relative;
    width: 100%;
    z-index: 9999;
    transition: all 0.3s ease;
}

/* Estat sticky actiu */
#header-conesa.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    background: #DFE5E6;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    z-index: 99999;
}

/* Important per evitar salt de contingut */
.header-spacer {
    height: 0;
}

/* fi menú sticky */

ul.header-menu-left__list {
    list-style: none;
    padding: 0rem;
}

ul.header-menu-left__list li {
    display: inline-block;
    padding: 0.6rem 1.5rem;
    background: #fff;
    margin-left: 1.5rem;
    border-radius: 2rem;
}

a.header-menu-left__link {
    color: var(--natural-green);
}

.header-menu-left__item .link-actiu {
    color: var(--natural-green);
    font-weight: bold;
    border-bottom: 2px solid var(--natural-green);
}

li.link-actiu a {
    color: #fff;
}

li.link-actiu {
    background: var(--natural-green) !important;
}

li.header-menu-left__item, li.header-menu-left__item a{
transition: background-color 0.3s ease, color 0.3s ease; 
}

.header-menu-left__item:hover .header-menu-left__link {
    color: #fff; 
}

li.header-menu-left__item:hover {
    background: var(--natural-green);
}

li.header-menu-left__item a:hover {
    color: #fff;
}


/*********************** MENU MOBILE LEFT **************************************/

/* Contenidor del menú esquerra */
.mobile-left__list {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
    margin-left: -7px;
}

/* Cada element del menú */
.mobile-left__item {
    display: flex;
    align-items: center;
    background: #fff;
    padding: 0.55rem 0.75rem;
    border-radius: 1.5rem;
    position: relative; /* IMPORTANT per al submenu absolut */
}

/* Icona de desplegable */
.mobile-left__dropdown img {
    display: block;
    width: 20px;
    height: auto;
}

/* Mida específica del botó desplegable */
.mobile-left__item.mobile-left__dropdown {
    min-width: 35px;
    width: 35px;
    justify-content: center;
}

.mobile-left__item.mobile-left__dropdown a img {
  padding: 0.45rem 0rem;
}

/* Enllaços */
a.mobile-left__link {
    color: var(--natural-green);
    text-decoration: none;
}

.left-mobile__container div {
  display: flex;
}



/*********************** SUBMENU (flotant) ********************************/

/* Submenu ocult per defecte */
.mobile-left__submenu {
    position: absolute;
    top: 100%;             /* just sota l’element */
    left: 0;
/*    background: #ffffff;*/
    padding: 8px 12px;
    border-radius: 1rem;
    list-style: none;
    margin: 5px 0 0 0;
    display: none;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    z-index: 9999;
}


/* Mostrar submenu amb classe active */
.mobile-left__dropdown.active .mobile-left__submenu {
    display: block;
    opacity: 1;
    width: 140px;   /* evita que el text es talli */
    margin-left: -1rem;
    margin-top: 2rem;
}

/* Estil dels items del submenu */
li.mobile-left__submenu-item a {
    color: var(--natural-green);
    margin-bottom: 0.5rem;
    display: block;        /* fa que tot l'enllaç clicable ocupi una línia */
    text-decoration: none; /* opcional: treu subratllat */
    background: #fff;
    padding: 0.40rem;
    border-radius: 1rem;
    text-align: center;
}


/* Capa difuminada quan s'obre el menú */
body.menu-open::before {
    content: "";
    position: fixed;
    inset: 0;
    backdrop-filter: blur(10px);
    background: rgba(0,0,0,0.3); /* opcional per enfosquir */
    z-index: 1; /* assegura que estigui sota el menú */
}

/* Assegura que el menú està per sobre del blur */
.mobile-left__dropdown {
    position: relative;
    z-index: 10;
}



/************************ MENU MOBILE RIGHT (carret) **************************************/

ul.mobile-right__llista {
    background: #ffffff;
    width: 53px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 0;
    border-radius: 1rem;
    margin: 0;
    margin-left: auto; /* Empeny a la dreta */
    list-style: none;
}



/********************* CISTELLA DEL HEADER **************************/

/* Container del cart al menú */
.header-menu-left__list .cart-menu-item {
    display: inline-flex !important;
    align-items: center;
    margin-left: 1.5rem;
}

/* Enllaç del cart */
.custom-cart-icon {
    display: inline-flex !important;
    align-items: center;
    position: relative;
    text-decoration: none;
}

/* Imatge del cart */
.custom-cart-icon .cart-img {
    width: 15px !important;
    height: 16px !important;
    object-fit: contain;
    display: block;
}

/* Badge del comptador (rodó, alineat i amb color personalitzat) */
.custom-cart-icon .cart-count {
    background: var(--natural-green) !important;
    color: #fff !important;
    min-width: 20px;
    height: 20px;
    line-height: 20px;
    padding: 0;
    border-radius: 50%;
    font-size: 12px;
    position: absolute;
    top: -15px;
    right: -15px;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* hover icona cistella */

.custom-cart-icon .cart-img {
    transition: opacity 0.2s ease-in-out;
}

/* Ocultem la imatge original en hover */
.custom-cart-icon:hover .cart-img {
    opacity: 0;
}

/* Afegim la imatge blanca com a pseudo-element */
.custom-cart-icon .cart-icon {
    position: relative;
    display: inline-block;
}

.custom-cart-icon:hover .cart-icon::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 15px; 
    height: 16px;
    background-image: url('https://farmaciaconesa.com/wp-content/uploads/2025/12/carret-blanc.png');
    background-size: contain;
    background-repeat: no-repeat;
}


/********************* FINAL CISTELLA DEL HEADER  **************************/


/************************** MEGA MENU DESKTOP ****************************/

.site-header.tf-custom-header {
    position: relative;
     z-index: 9999;
}

/* RESET Elementor */
.mega-menu-wrapper {
/*    position: absolute !important;*/
    position: fixed !important;
    left: 0;
    width: 100%;
    z-index: 2000;

    min-height: 0 !important;
    display: block !important;

    background: #fff;
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition: all 0.3s ease;
}



.mega-menu-wrapper.active {
    width: 95%;
    margin-left: 2.5%;
    margin-top: 2rem;
    border-radius: 1rem;
    padding: 2rem 0rem;

    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

/* Interior centrat */
.mega-menu-wrapper > .e-con-inner {
/*    max-width: 1200px;*/
    max-width: 80% !important;
    margin: 0 auto;
    padding: 40px 20px;
}


.mega-menu-inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

@media(max-width:767px){
    .mega-menu-inner {
        display: block;
    }
}


/* Columnes */
.mega-column {
    display: flex;
    flex-direction: column;
}

.mega-parent {
    font-weight: 400;
    margin-bottom: 12px;
    color:var(--natural-green); 
    text-transform: uppercase;
    text-decoration: underline !important;
}

.mega-sub {
    list-style: none;
    padding-left: 15px;
}

.mega-sub li {
    margin-bottom: 8px;
    position: relative;
}

.mega-sub li a{
  color:var(--natural-green);  
}

.mega-sub li::before {
    content: "•";
    position: absolute;
    left: -14px;
    color: #6E8B74;
    font-size: 14px;
}

.mega-menu-wrapper a:hover {
    color: #4a7c66;
    text-decoration: underline;
}

@media (max-width:1024px){
    .mega-menu-wrapper {
        display: none !important;
    }
}

/************************* FI MEGA MENU **************************/


/************************* MEGA MENU MOBILE ****************************/

/* OVERLAY */

.mega-mobile-overlay{
position:fixed;
top:0;
left:0;
width:100%;
height:100vh;

background:rgba(255,255,255,0.9);
backdrop-filter:blur(8px);

z-index:9999;

display:flex;
justify-content:center;
align-items:flex-start;

opacity:0;
visibility:hidden;
transition:0.3s;
}

/* PANEL */

.mega-mobile-panel{
    width:100%;
    max-width:500px;
    background:white;
    margin-top:80px;
    padding:25px;
    border-radius:16px;
    box-shadow:0 20px 40px rgba(0,0,0,0.15);
    transform:translateY(-30px);
    transition:0.3s;
}

/* HEADER */

.mega-mobile-header{

    display:flex;
    justify-content:space-between;
    align-items:center;

    font-weight:600;
    font-size:18px;

    margin-bottom:20px;
    color:var(--natural-green);
}

/* BOTON CLOSE */

.mega-mobile-close{
    background:none;
    border:none;
    font-size:24px;
    cursor:pointer;
    color: var(--natural-green);
}

/* ACTIVO */
.mega-mobile-overlay.active{

opacity:1;
visibility:visible;
}

.mega-mobile-overlay.active .mega-mobile-panel{

transform:translateY(0);
}

/************************* FI MEGA MENU MOBILE **************************/

/********************************* PAGES **********************/

/* fons general pages */
div#page {
    background: #DFE5E6;
}


/******************* NOSOTROS ************************/

.elementor-element .swiper .elementor-swiper-button svg, .elementor-element .swiper~.elementor-swiper-button svg, .elementor-lightbox .swiper .elementor-swiper-button svg, .elementor-lightbox .swiper~.elementor-swiper-button svg {
    fill: var(--natural-green) !important;
}

.elementor-element, .elementor-lightbox {
    --swiper-theme-color: var(--natural-green) !important;
}

/******************* SERVICIOS ***********************/

/* desplegable dreta */


.servicios__acordion .e-n-accordion-item-title-text {
  color: var(--natural-green);
  font-size: 24px !important;
}

.servicios__acordion .e-n-accordion-item p {
  color: var(--natural-green);
}

.servicios__acordion [role="region"] p,
.servicios__acordion [role="region"] ul,
.servicios__acordion [role="region"] li {
  color: var(--natural-green);
}

.servicios__acordion [role="region"] ul {
  margin-bottom: 1rem;
}

.servicios__acordion [role="region"] 
.elementor-widget-text-editor:last-child 
> :last-child {
  margin-bottom: 3rem;
}

.elementor-widget-n-accordion .e-n-accordion-item-title {
    border-top: 1px solid var(--natural-green) !important;
    border-bottom: 0px solid !important;
    border-left: 0px solid !important;
    border-right: 0px solid !important;
}

.servicios__acordion [role="region"]{
    border:0px solid !important;
}

.elementor-widget-n-accordion .e-n-accordion-item .e-n-accordion-item-title-icon span>svg {
    fill: var(--natural-green) !important;
}

.elementor-widget-n-accordion .e-n-accordion-item:not([open]):hover>.e-n-accordion-item-title .e-n-accordion-item-title-icon span>svg {
    fill: var(--natural-green) !important;
}

.elementor-widget-n-accordion .e-n-accordion-item[open]>.e-n-accordion-item-title .e-n-accordion-item-title-icon span>svg {
    fill: var(--natural-green) !important;
}


/***************** icona + - *****************/

.servicios__acordion .e-n-accordion-item-title {
  display: flex;
  align-items: center;
  /* Opcional: padding o estils que tinguis */
}

.servicios__acordion .e-n-accordion-item-title-header {
  flex-grow: 1; /* ocupa tot l'espai a l'esquerra */
}

.servicios__acordion .e-n-accordion-item-title-text {
  /* si cal */
}

.servicios__acordion .icon-toggle {
  margin-left: 1rem;
  font-weight: bold;
  font-size: 1.2rem;
  color: var(--natural-green);
}

/* Amaga les icones originals */
.servicios__acordion .e-n-accordion-item-title-icon {
  display: none !important;
}

/************************* CONTACTO *******************/

.general-info__container {
    font-family: 'TWKEverett';
}

p.contacto-intro__p {
    font-size: 1.5rem;
    color: var(--natural-green);
    margin-bottom: 3rem;
    font-family: 'TWKEverett', sans-serif;
    line-height: 2rem;
}

.general-info__container h5 {
    text-transform: uppercase;
    font-style: normal;
    color: var(--natural-green);
    font-size: 1rem;
    margin-bottom: 0.3rem;
}

.info-ubicacion__container, .info-contacto__container, .info-horarios__container{
    color: var(--natural-green);
    margin-bottom: 2rem;
}

.info-ubicacion__container ul, .info-contacto__container ul {
    list-style: none;
    padding: 0;
    font-style: normal;
}

/********************* form ***********************/


/* Inputs normals */
.form-contacto__container input[type="text"],
.form-contacto__container input[type="email"],
.form-contacto__container input[type="tel"] {
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
    margin-bottom: 15px;

}

/* Textarea forçat una mica més ample per igualar visualment */
.form-contacto__container .wpcf7-textarea {
    width: 110%;          /* A ojo per coincidir amb inputs */
    box-sizing: border-box;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
    min-height: 150px;
    resize: vertical;
    margin-bottom: 15px;
    margin-top:0.3rem;
}

input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
    margin-top: 0.3rem;
    border-radius: 0.5rem;
}



.form-contacto__container label {
    color: var(--natural-green);
    text-transform: uppercase;
    font-weight: 100;
    font-size: 14px;
}

.privacidad__container span {
    margin: 0rem;
}

.privacidad__container label {
   text-transform: none;
}

a.privacidad-link {
    color: var(--natural-green);
    text-decoration: underline !important;
}

/* Contenidor del botó submit */
.btn-submit__container {
    position: relative;       /* necessari per al spinner absolut */
    text-align: right;        /* alineem el botó a la dreta */
}

/* Botó submit ocupa només l’ample necessari */
.btn-submit__container input.wpcf7-submit {
    display: inline-block;    /* perquè text-align funcioni */
    position: relative;       /* referència per al spinner */
}

/* Spinner posat sobre el botó sense afectar l’ample */
.btn-submit__container .wpcf7-spinner {
    position: absolute;
    right: -30px;             /* ajusta segons el botó */
    top: 50%;
    transform: translateY(-50%);
}

.btn-submit__container input {
    border-radius: 2rem;
    padding: 0.5rem 2rem;
    background: var(--natural-green);
    color: #ffff;
    border: none;
}

.btn-submit__container input:hover {
    background: #fff;
    color: var(--natural-green);
}

:focus-visible {
    outline: 1px solid var(--natural-green);
}

/* Amagar només aquest checkbox */
input[name="acceptance-946"] {
    display: none;
}

/* Només el label d’aquest */
input[name="acceptance-946"] + .wpcf7-list-item-label {
    position: relative;
    padding-left: 35px;
    cursor: pointer;
}

/* Caixa custom */
input[name="acceptance-946"] + .wpcf7-list-item-label::before {
    content: "";
    position: absolute;
    left: -3px;
    top: -5px;
    width: 25px;
    height: 25px;
    border: 1px solid #ccc;
    border-radius: 8px;
    background: #fff;
}

/* Estat checked */
input[name="acceptance-946"]:checked + .wpcf7-list-item-label::before {
    background: #fff;
}

/* Tick */
input[name="acceptance-946"]:checked + .wpcf7-list-item-label::after {
    content: "✓";
    position: absolute;
    left: 5px;
    top: 0px;
    font-size: 16px;
    color: var(--natural-green);;
}

/* Focus (accessibilitat important) */
input[name="acceptance-946"]:focus + .wpcf7-list-item-label::before {
    outline: 2px solid var(--natural-green);
    outline-offset: 2px;
    border-color: #ccc;
}

input[name="acceptance-946"] + .wpcf7-list-item-label:hover::before {
    border-color: var(--natural-green);
}

/***** missatge error ******/

span.wpcf7-not-valid-tip {
    text-transform: none;
    margin-top: -10px;
    margin-bottom: 1rem;
    color: #dc3232b0;
}


/************************* FI CONTACTO ******************/

/************************* ENCARGO **********************/

/* estirar contenidor */
.elementor-1441 {
  min-height: calc(100vh - 116px);
}



.encargo__container {
    text-align: center;
    margin-bottom: 3rem;
    font-family: 'TWKEverett', sans-serif;
}

.encargo-h2__container {
    margin-bottom: 5rem;
}

h2.encargo-h2__h2 {
    text-align: center;
    color: var(--natural-green);
    margin: 0rem;
    font-family: 'TWKEverett', sans-serif;
    font-size: 3rem;
    line-height: 4rem;
}

.encargo-eleccion__container {
    margin-bottom: 2rem;
}

.encargo-eleccion__container p, .encargo-envio__container p {
    margin-bottom: 0rem;
    color: var(--natural-green);
}

.encargo-envio__container {
    margin-bottom: 3rem;
}

span.encargo-eleccion__p {
    font-size:14px;
    text-transform: uppercase;
    font-weight: 400;
}

p.encargo-eleccion__p {
    font-size: 14px;
    font-weight: 400;
}

.encargo-btn__container {
    margin-top: 5rem;
}

a.encargo-btn__link {
    background: var(--natural-green);
    padding: 0.7rem 2rem;
    color: #fff;
    border-radius: 2rem;
    transition: background-color 0.3s ease, color 0.3s ease; 
}

a.encargo-btn__link:hover {
    background: #fff;
    color:var(--natural-green);
}

.encargo-envio__container {
    color:var(--natural-green);
}

/************************ FI ENCARGO *********************/


/************************ HOME ***********************/

/*********************** TIENDA (CATEGORIES)  *********************/

/* Amplada centrada per a totes les pàgines WooCommerce */
body.archive.woocommerce main.site-main,
body.single-product.woocommerce main.site-main,
body.woocommerce-cart.woocommerce main.site-main,
body.woocommerce-checkout.woocommerce main.site-main {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 40px 20px !important;
    box-sizing: border-box !important;
}

/* Amplada centrada per a les pàgines WooCommerce */
body.woocommerce-cart main#content,
body.woocommerce-checkout main#content,
body.woocommerce-account main#content {
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 40px 20px !important;
    box-sizing: border-box !important;
}

/* amagar bredcrumbs, count i filtres */

nav.woocommerce-breadcrumb, .woocommerce .woocommerce-result-count, form.woocommerce-ordering {
    display: none;
}


/* Ajust opcional per al layout del cart i checkout (resums a la dreta) */
body.woocommerce-cart .cart-collaterals,
body.woocommerce-checkout .col2-set {
    width: 100%;
    box-sizing: border-box;
}

/* title pel archive-product.php */
h1.pages__h1-tienda {
    color: var(--natural-green);
    font-size: 14px;
    font-family: 'TWKEverett', sans-serif !important;
    text-transform: uppercase;
}

/* Centrar formularis dins del container */
body.woocommerce-checkout .woocommerce-checkout form.checkout,
body.woocommerce-cart .woocommerce-cart-form {
    width: 100%;
}

/* estils titols productes archive-product.php */
h2.woocommerce-loop-product__title {
    color: var(--natural-green);
    text-align: center;
    font-size: 14px !important;
    width: 80%;
    margin: 1rem auto !important;
    text-align: center !important;
}


span.price {
    text-align: center;
}

span.woocommerce-Price-amount.amount {
    color: var(--dark-gray);
    font-size: 14px;
}

span.woocommerce-Price-amount.amount bdi {
    font-size: 14px;
    color: var(--natural-green);
}


a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
    margin: 0 auto;
    width: 100%;
    text-align: center;
    background: #fff;
    color: var(--natural-green);
    border-radius: 1.5rem;
    transition: background-color 0.3s ease, color 0.3s ease; 
}

/*a.add_to_cart_button.ajax_add_to_cart.button.product_type_simple:hover {
    background: var(--natural-green);
    color: var(--light-green);
}*/

.woocommerce ul.products li.product a.button:hover {
    background: var(--natural-green);
    color: var(--light-green);
}

a.button.product_type_variable.add_to_cart_button {
    background: #fff;
    padding: 1.1rem;
    border-radius: 2rem;
    color: var(--natural-green);
    width: 100%;
    text-align: center;
    font-weight: 100;
    transition: background-color 0.3s ease, color 0.3s ease; 
}

a.button.product_type_variable.add_to_cart_button:hover {
    background: var(--natural-green);
    color: #fff;
}

/****** cards de productes categories ****/

/*.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
  border: 1px solid #2D816A45;
  padding: 0.5rem;
  border-radius: 0.5rem;
}*/

/*********** cards productes categories mateixa altura ******/

/* El contenidor ha d'estirar tots els items */
ul.products {
    display: flex;
    flex-wrap: wrap;
}

ul.products li.product {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: auto;
}

/* Contingut de dalt */
ul.products li.product .woocommerce-LoopProduct-link {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

/* Títol ocupa espai flexible */
ul.products li.product h2.woocommerce-loop-product__title {
    flex-grow: 1;
}

/* Botó sempre a baix */
ul.products li.product .button {
    margin-top: auto;
}


/*********** FI cards productes categories mateixa altura *****/

/* botóns a Tienda */


.woocommerce ul.products li.product .button {
    background: #fff;
    width: 100%;
    color:var(--natural-green);
    text-align: center;
    border-radius: 1rem;
    font-weight: normal;
}


/* efecte zoom-in zoom-out a les fitxes del producte */

/* Contenidor de la imatge per evitar overflow */
li.product a.woocommerce-LoopProduct-link {
    display: block;
    overflow: hidden; /* evita que la imatge “surti” del li */
}

/* Efecte de zoom a la imatge */
li.product a.woocommerce-LoopProduct-link img {
    transition: transform 0.3s ease; /* suavitat de l'efecte */
    transform: scale(1); /* estat inicial */
}

/* Zoom al passar el ratolí sobre la fitxa sencera */
li.product:hover a.woocommerce-LoopProduct-link img {
    transform: scale(1.1); /* augment del 10% */
}

/* fi efecte zoom-in zoom-out fitxes del producte */




/************* paginació categoría productes *************/

.woocommerce nav.woocommerce-pagination ul {
 border:1px solid var(--natural-green);
}

.page-numbers li a {
  color: var(--natural-green);
}

.woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current {
  background: #2D816A96;
  color: var(--natural-green);
}


/*************************** FITXA PRODUCTE *********************/


/**************** amagar elements ***************/
/******** imatge en zomm *****/

img.zoomImg {
    display: none !important;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper .zoomImg {
    display: none !important;
}

button.slick-next.slick-arrow,
button.slick-prev.slick-arrow {
    display: none !important;
}

.woocommerce div.product div.images img {
    width: 80%;
    height: auto;
    margin: 0 auto;
}

/* categoria producte*/

.product_meta {
    display: none;
}

/*************** galeria producte CORRECCIÓ DESBORDAMENT ****************/

@media (max-width:768px){

    div#pgsfw-gallery {
        display: none;
    }

 
    .pgsfw-slider-for .slick-track{
    width:100% !important;
    transform:none !important;
    display:flex !important;
    }


    .pgsfw-slider-for .slick-slide{
    width:100% !important;
    flex:0 0 100% !important;
    left:0 !important;
    }


    .pgsfw-slider-thumb{
    display:none !important;
    }


    .woocommerce-product-gallery{
    overflow:hidden;
    }

}




/*************** FI galeria producte CORRECCIÓ DESBORDAMENT ****************/


/**************** short description *************/

/* color general */
.woocommerce-product-details__short-description {
    color: var(--natural-green);
}


.summary.entry-summary h1 {
    color: var(--natural-green);
    font-size: 24px;
}


.woocommerce-variation-price span {
  visibility: hidden;
}


p.fitxa__text-darreparagraf {
    margin-bottom: 2rem;
}

/***************** packs adicionals **************/

.wapf-field-row {
    border-top: 1px solid var(--natural-green);
}

.wapf-field-label.wapf--above {
    margin-top: 1rem;
    margin-block: 1rem;
    color: var(--natural-green);
}

.wapf-checkboxes {
    color: var(--natural-green);
}

.wapf-field-description {
    color: var(--natural-green);
}

.wapf-input-label {
   padding: 0px !important;
}

span.wapf-label-text {
    font-size: 14px;
    font-weight: 200;
}

.wapf-product-totals div span:first-child {
    font-weight: 400;
}

/* 1️⃣ Eliminem estil natiu */
.wapf-input {
  appearance: none;
  -webkit-appearance: none;
  width: 24px;
  height: 24px;
  border: 2px solid var(--natural-green); /* filet verd personalitzat */
  border-radius: 6px;
  margin-right: 10px;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
}

/* 2️⃣ Quan està seleccionat */
.wapf-input:checked {
  background-color: var(--natural-green);
}

/* 3️⃣ Check blanc */
.wapf-input:checked::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 2px;
  width: 6px;
  height: 12px;
  border: solid white;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

/* 4️⃣ Layout més net */
.wapf-input-label {
  display: flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 8px;
  transition: all 0.2s ease;
}

/* 5️⃣ Opcional: text en verd quan està marcat */
.wapf-input:checked + .wapf-label-text {
  color: var(--natural-green);
  font-weight: 600;
}

.wapf--inner {
    color: var(--natural-green);
}

.wapf--inner div {
    padding-bottom: 0rem !important;
}

span.wapf-product-total.price.amount,
span.wapf-options-total.price.amount,
span.wapf-grand-total.price.amount {
    color: var(--natural-green) !important;
    font-size: 14px !important;
} 
   

/**************** fi pack adicional ******************/

/* El botó */
.btn-add-del__container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

/* estil de botó  */
.btn-add-del {
    background: #000;
    color: #fff;
    padding: 6px 14px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}


ul.pack-adicional__llista {
    margin-bottom: 2rem;
}


/* llista principal producte */
ul.productes__llista {
    margin-bottom: 2rem;
}


/* estils single-product.php */

button.single_add_to_cart_button.button.alt {
    background: var(--natural-green);
    padding: 0.85rem;
    border-radius: 1.3rem;
    width: 100%;
    margin: 1rem 0rem;
    font-weight: 200;
    transition: background-color 0.3s ease, color 0.3s ease; 
}

button.single_add_to_cart_button.button.alt:hover {
    background: #fff;
    color: var(--natural-green);
}

/*.woocommerce div.product form.cart div.quantity {
    width: 100% !important;
}

.woocommerce .quantity .qty {
    width: 18%;
    text-align: center;
    border-radius: 1.5rem;
    border:none;
}*/

/**** increments decrements modificats ******/

/* Contenidor */
.quantity {
  display: inline-flex;
  align-items: center;
  background: #fff;
  border: 1px solid var(--natural-green);
  border-radius: 10px;
  overflow: hidden;
}

/* Input */
.quantity input.qty {
  width: 50px;
  text-align: center;
  border: none;
  background: transparent;
  font-size: 16px;
  color: var(--natural-green);
}

/* Treure fletxes natives (important!) */
.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.quantity input.qty[type=number] {
  -moz-appearance: textfield;
}

/* Botons + i - */
.qty-btn {
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  color: var(--natural-green);
  font-size: 18px;
  cursor: pointer;
  transition: 0.2s;
}

/* Hover suau */
.qty-btn:hover {
  background: rgba(0,0,0,0.05);
}

.qty-btn.minus {
 color:var(--natural-green);
 border: none;
}

.qty-btn.plus {
  color:var(--natural-green);
  border: none;
}

button.qty-btn.plus:hover, button.qty-btn.plus:focus {
    background: var(--natural-green);
}

button.qty-btn.minus:hover, button.qty-btn.minus:focus {
    background: var(--natural-green);
}

/***** fi increments decrements modificats ****/


input[type="number"] {
    color: var(--natural-green);
}

input[type="number"]:focus-visible {
    outline: 1px solid var(--natural-green);
}

input[type="number"] {
  -moz-appearance: textfield;
}



/******** Añadir carrito personalitzat *************/
button#custom-add-to-cart-btn {
    background: var(--natural-green);
    border: none;
    margin-left: 1rem;
    border-radius: 2rem;
    color:#fff;
    width: 75%;
}


/* amagar taula de combinacions */

table.variations {
    display: none;
}


.woocommerce div.product div.summary {margin-bottom: 3em;}

/********************* tabs "Descripció llarga" ************/

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
  border-bottom: 1px solid var(--natural-green);
}

#tab-title-description a {
  color: var(--natural-green);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before {
  left: -5px;
  border-bottom-right-radius: 0px;
  border-width: 0 0px 0px 0;
  box-shadow: 0px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
  right: -5px;
  border-bottom-left-radius: 4px;
  border-width: 0 0 0px 0px;
  box-shadow: 0px 0px !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  border: 1px solid var(--natural-green);
  border-bottom-color: rgb(91, 68, 121);
  background-color: #e9e6ed;
}


.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--natural-green);
  font-size: 14px;
}

#tab-description {
  color: var(--natural-green);
}

#tab-description h2,
#tab-additional_information h2 {
  font-size: 1.5rem;
}

#tab-additional_information {
  color: var(--natural-green);
}

#tab-title-additional_information a {
  color: var(--natural-green);
}

table.woocommerce-product-attributes {
    border-collapse: separate; /* important! perquè border-radius funcioni */
    border-spacing: 0;         /* evita espais extra entre cel·les */
    border-radius: 0.3rem;       /* ajusta l'arrodoniment al teu gust */
    overflow: hidden;          /* assegura que les cel·les no sobresurtin */
}


table.woocommerce-product-attributes.shop_attributes tr:nth-child(odd) {
    background: #2d816a2e;
}

table.woocommerce-product-attributes.shop_attributes tr:nth-child(even) {
    background: #2d816a15;
}

table.woocommerce-product-attributes tr:nth-child(even) td,
table.woocommerce-product-attributes tr:nth-child(even) th {
    background: #2d816a15; /* mateix color que has posat abans per files parells */
}

table.woocommerce-product-attributes td,
table.woocommerce-product-attributes th {
    border: 0px solid var(--natural-green);
}


table.woocommerce-product-attributes th {
    border-right: 1px solid var(--natural-green);
}

.woocommerce-product-attributes {
    width: 100%;
    table-layout: fixed;
}


.woocommerce-product-attributes-item__value p {
  margin-left: 1rem !important;
}




/*********************** related products ********************/

section.related.products h2 {
    color: var(--natural-green);
    font-size: 24px;
}

section.related.products {
    border-top: 1px solid #2D816A;
    clear: both;
}


/******* misatges de "Alert" "Warning" ****/

.woocommerce-message {
    border-top-color: var(--natural-green);
}

.woocommerce-message::before {
    color: var(--natural-green);
}

a.button.wc-forward {
    margin-left: 1rem;
    background: #fff;
    color: var(--natural-green);
    border-radius: 1rem;
    padding: 0.75rem;
}

/************************** PAGE "CARRITO" *********************/

h1.entry-title {
    margin-bottom: 2rem;
}

.wp-block-woocommerce-cart.alignwide::before {
    content: "Carrito";
    display: block;
    font-size: 2rem;
    font-weight: 100;
    margin-bottom: 20px;
    color: var(--natural-green);
}

/* sobreescriure separació taula per defecte */
.wc-block-cart table.wc-block-cart-items, 
.wc-block-cart table.wc-block-cart-items td, 
.wc-block-cart table.wc-block-cart-items th {
    margin: 0 0 5px !important;
}

/********* listat taula esquerra *******/

/* sobreescriure estils defecte cel·la */
.wc-block-cart__main .wc-block-cart-items td{
    border-top:none !important;
}

th.wc-block-cart-items__header-image, 
th.wc-block-cart-items__header-product,
th.wc-block-cart-items__header-total {
    border-top: 1px solid var(--natural-green) !important;
}

.wc-block-cart__main .wc-block-cart-items {
    border-bottom: 1px solid var(--natural-green)!important;
}

@media(max-width:739px){
    .wc-block-cart__main .wc-block-cart-items {
        border-bottom: none !important;
    }
}


span.price.wc-block-components-product-price {
    text-align: left; 
}


a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained {
    background: var(--natural-green);
    color: #fff;
    border-radius: 2rem;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease; 
}

a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained:hover {
    background: #fff;
    color: var(--natural-green);
}

.page-header h1 {
    font-family: 'TWKEverett', sans-serif !important;
    color: var(--natural-green);
}


tr.wc-block-cart-items__row {
    border-top: 1px solid;
}

tr.wc-block-cart-items__header {
    color: var(--natural-green);
    border-color: var(--natural-green);
}


tr.wc-block-cart-items__header {
    border-color: var(--natural-green);
}

td.wc-block-cart-item__total {
    border-top: none !important;
}

.wp-block-woocommerce-cart-order-summary-totals-block {
    border-top: 1px solid var(--natural-green) !important;
}

.wc-block-cart-item__wrap .wc-block-components-product-details__capsula {
    color: var(--natural-green);
}

p.wc-block-components-totals-footer-item-tax {
    font-weight: 100 !important;
}

a.wc-block-components-product-name {
    color: var(--natural-green);
}

button.wc-block-cart-item__remove-link {
    color: var(--natural-green) !important;
}


/* botons increment decrement personalitzats estil saurasgarriga.com */

.wc-block-components-quantity-selector {
    background: #fff;
    border-radius: 1rem;
}



.wc-block-components-quantity-selector:after{
    border: none;
}


/******************** sidebar cart *************************/

.wc-block-components-sidebar.wc-block-cart__sidebar.wp-block-woocommerce-cart-totals-block {
    color: var(--natural-green);
}

.wc-block-cart .wp-block-woocommerce-cart-order-summary-block {
    border-bottom: 1px solid var(--natural-green) !important;
}


/********************* PAGE CHECKOUT *********************/

.wc-block-components-sidebar-layout .wc-block-components-main {
    width: 50% !important;
    color: var(--natural-green);
}

.wc-block-components-sidebar {
    width: 50% !important;
    color: var(--natural-green);
}


input#email{
    color: var(--natural-green);
    border-radius: 2rem;
    border-color: var(--natural-green);
    background: var(--light-green);
}


input#checkbox-control-0 {
    border-radius: 1rem;
    border-color: var(--natural-green);
}

label.wc-blocks-components-select__label {
    color: var(--natural-green)!important;
}

select#shipping-country,
input#shipping-first_name,
input#shipping-last_name,
input#shipping-address_1,
input#shipping-postcode,
input#shipping-city,
select#shipping-state,
input#shipping-phone
 {
    color: var(--natural-green);
    border-color: var(--natural-green);
    border-radius: 2rem;
    background: var(--light-green);
}

input#email+label,
input#shipping-first_name+label,
input#shipping-last_name+label,
input#shipping-address_1+label,
input#shipping-postcode+label,
input#shipping-city+label,
select#shippingstate+label,
input#shipping-phone+label
 {
    color: var(--natural-green);
}

.wc-blocks-components-select .wc-blocks-components-select__container {
    background: var(--light-green) !important;
}

.wc-block-checkout__terms.wc-block-checkout__terms--with-separator {
    border-top: var(--natural-green) !important;
}

span.wc-block-components-checkbox__label a {
    color: var(--natural-green) !important;
}

button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.contained {
    border: none;
    background:#fff;
    color: var(--natural-green);
    border-radius: 2rem;
    transition: background-color 0.3s ease, color 0.3s ease; 
}

button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.contained:hover {
    border: none;
    color: #fff;
    background: var(--natural-green); 
}



/************ Checkout summary *************/

p.wc-block-components-checkout-order-summary__title-text {
    font-size: 10px;
    font-weight: 100;
    color: var(--light-green);
}

.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-formatted-money-amount,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label
 {
    font-weight: 400 !important;

}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label, .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-size: 14px !important;
}

.wp-block-woocommerce-checkout-order-summary-block {
    background: var(--natural-green);
    color: var(--light-green);
    border-radius: 1rem !important;
    font-size: 14px;
    padding: 0rem 1rem;
}


.wp-block-woocommerce-checkout-order-summary-subtotal-block.wc-block-components-totals-wrapper {
    border-top: 1px solid #fff !important;
    border-bottom: 1px solid #fff !important;
}

.wc-block-components-totals-wrapper {
    border-top: none !important;
}

.wc-block-components-order-summary-item {
    display: flex;
    align-items: center;     
    gap: 10px;              
}

.wc-block-components-order-summary-item__image {
    flex: 0 0 15%;
}

.wc-block-components-order-summary-item__description {
    flex: 0 0 60%;
    text-align: center; 
}

.wc-block-components-order-summary-item__total-price {
    flex: 0 0 15%;
    text-align: right;   
}


.wc-block-components-order-summary .wc-block-components-order-summary-item__image {
    background: #fff;
    height: 60px;
    border-radius: 0.5rem;
    display: flex !important;                   
    justify-content: center;         
    align-items: center;        
    position: relative;              
}

.wc-block-components-order-summary .wc-block-components-order-summary-item__image>img {
    max-width: 80% !important;      
    height: auto;
    width: 80% !important;
}

.wc-block-components-order-summary .wc-block-components-order-summary-item {
    padding-bottom: 2rem !important;
}

.wc-block-checkout__actions_row {
    margin-top: 1rem;
}

@media(max-width:439px){
    button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.contained {
        width: 100%;
    }
}

/************************** FOOTER ***********************/

address.footer-ubicacion__container, .footer-contacto__container {
    margin-top: 1rem;
}


span.footer-ubicacion__title, .footer-contacto__title {
    display: block;
    font-size: 12px !important;
    font-weight: 400;
}


p.footer-contacto__title {
    margin-bottom: 0.5rem;
}

p.footer-contacto__paragraf {
    font-size: 16px;
    line-height: 16px;
}

p.contacto-line {
    line-height: 16px;
}

address.footer-ubicacion__container span {
    font-style: normal;
}


span.footer-ubicacion__address {
    display: block;
    font-size: 16px;
    font-weight: 400;
}

.footer-horario__paragraf {
  font-size: 16px;
  line-height: 16px;
}

.footer-contacto__container {
    color: var(--light-green);
}

/* logo KD */
.logo-kd__container {
    margin-top: 1rem;
}


/**************************MEDIA QUERIES **********************/


/********* header Ajustar responsive entre les mides **********/
@media (max-width: 1325px) and (min-width: 1028px) {
    

    .elementor-409 .elementor-element.elementor-element-e9e66f8 {
        width: 35% !important;
    }

    .elementor-409 .elementor-element.elementor-element-ecd3aab {
        width: 30% !important;
    } 

    .elementor-409 .elementor-element.elementor-element-a0bb254 {
        width: 30% !important;
    }
}


/* HEADER separar contenidor carrito del top */
@media(max-width:766px){

  .elementor-element-1d2aef8 {
      margin-top: 0.5rem ;
  }

/* separar logo del top */
  .elementor-element-3f196c9 {
      margin-top: 0.5rem;
  }

}



/* CART ajustar contenidor */
@media(max-width:1440px){

    .page-header {
        text-align: center;
    }

    .alignwide {
        margin-inline: 0px !important;
    }

    .wc-block-components-sidebar-layout {
        align-content: center;
    }

}

@media(max-width:739px){
    .wc-block-components-sidebar-layout .wc-block-components-main {
        width: 90% !important;
    }

    .wc-block-components-sidebar {
        width: 90% !important;
    }

}



/****************** Breakpoints saurasgarriga.com ************/

/**************** ajusta menu a mides mes gran ****************/
@media(max-width:1626px){
    ul.header-menu-left__list li {
        margin-left: 1rem;
    }
}

@media(max-width:1542px){
    ul.header-menu-left__list li {
        margin-left: 0.7rem;
        padding: 0.6rem 0.8rem;
    }
}

@media(max-width:880px){
    ul.header-menu-left__list li {
        margin-left: 0.65rem;
        padding: 0.6rem 0.7rem;
    }
}



/* desktop 1440 * 757*/

/* tablet 1024* 1366*/

/**** Phone 440*956 (es posa a 770px que es quan talla) *********/


@media(max-width:770px){

/* PAGES */

/*Nosotros */

    .nosotros__img {
      width: 399px;
      height: 610px;
      overflow: hidden;
      margin: 0 auto;
    }

  .nosotros__img img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;   /* la imatge omple el contenidor sense deformar-se */
    object-position: center; /* centra la imatge dins del contenidor */
  }

   /* Tienda */ 



   /* ficha producto */


   /****** phone saurasgarriga.com ****/

  @media(max-width:440px){

    .woocommerce ul.products[class*=columns-] li.product, .woocommerce-page ul.products[class*=columns-] li.product {
        width: 100%;
    }

    .woocommerce ul.products li.product a img {
        width: 80% !important;
    }

    a.woocommerce-LoopProduct-link.woocommerce-loop-product__link img {
        margin: 0 auto !important;
    }

  }
    

/************* footer ****************/


@media (max-width: 1199px) {
    .page-header .entry-title, .site-footer .footer-inner, .site-footer:not(.dynamic-footer), .site-header .header-inner, .site-header:not(.dynamic-header), body:not([class*=elementor-page-]) .site-main {
        max-width: 100% !important;
    }
}


@media (max-width: 1048px){

    p.contacto-line {
        line-height: 16px;
    }
     .footer-horario__paragraf {
        line-height: 16px;
    }

    .footer-horario__paragraf {
        line-height: 16px;
    }
    
}

@media (max-width: 440px){

    .footer-contacto__container {
      margin-left: 1rem;
  }
}



/************ Complinaz ****************/

/******** text polotica de cookies */
#cmplz-document, .editor-styles-wrapper .cmplz-unlinked-mode {
  max-width: 100% !important;
}


/************ Baner RGPD ****************/


.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept {
    border-radius: 2rem !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny {
    background-color: #fff;
    border: 1px solid #2d816a !important;
    color: #2d816a;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences {
    border-radius: 2rem !important;
    color: #2d816a;
    border: 1px solid #2d816a;
}

