/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
.product p.price {
    font-size: 25px;
    font-weight: 900;
}
#masthead{
    display:none;
}


.home .col-full-nav{
    margin-top:-20px!important;
}

/* =========================
   HEADER: ESTADO INICIAL
   ========================= */
.mi-header {
    background: transparent !important;
    transition: background 0.3s ease, color 0.3s ease;
}

/* Texto blanco al inicio */
.mi-header a,
.mi-header .e-n-menu-title-text,
.mi-header .e-n-menu-item,
.mi-header svg,
.mi-header .elementor-button {
    color: #fff !important;
    fill: #fff !important;
    border-color: #fff !important;
    --e-n-menu-item-color: #ffffff;
    --e-n-menu-item-color-hover: #ffffff;
    transition: color 0.3s ease, fill 0.3s ease, border-color 0.3s ease;
}

/* =========================
   SCROLL (body.scrolled)
   ========================= */
body.scrolled .mi-header {
    background: #ffffff !important;
}

/* Texto negro al hacer scroll */
body.scrolled .mi-header a,
body.scrolled .mi-header .e-n-menu-title-text,
body.scrolled .mi-header .e-n-menu-item,
body.scrolled .mi-header svg,
body.scrolled .mi-header .elementor-button {
    color: #000 !important;
    fill: #000 !important;
    border-color: #000 !important;
    --e-n-menu-item-color: #000000;
    --e-n-menu-item-color-hover: #000000;
}

/* =========================
   HOVER (cuando pasas por el header)
   ========================= */

/* El fondo se vuelve blanco */
.mi-header:hover {
    background: rgba(255,255,255,.75) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Texto negro al hover */
.mi-header:hover a,
.mi-header:hover .e-n-menu-title-text,
.mi-header:hover .e-n-menu-item,
.mi-header:hover svg,
.mi-header:hover .elementor-button {
    color: #000 !important;
    fill: #000 !important;
    border-color: #000 !important;
    --e-n-menu-item-color: #000;
    --e-n-menu-item-color-hover: #000;
}
/* HEADER BLANCO EN TODAS LAS PÁGINAS MENOS EN HOME */
body:not(.home) .mi-header {
    background: rgba(255,255,255,.75) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Texto negro en todas las páginas menos en home */
body:not(.home) .mi-header a,
body:not(.home) .mi-header .e-n-menu-title-text,
body:not(.home) .mi-header .e-n-menu-item,
body:not(.home) .mi-header svg,
body:not(.home) .mi-header .elementor-button {
    color: #000 !important;
    fill: #000 !important;
    border-color: #000 !important;
    --e-n-menu-item-color: #000;
    --e-n-menu-item-color-hover: #000;
}

/* Evitar hover en no-home */
body:not(.home) .mi-header:hover {
   background: rgba(255,255,255,.75) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(0,0,0,.06);
}


/* WooCommerce Product Categories (sidebar) — subcategorías “pro” */

/* Base */
.widget_product_categories ul.product-categories{
  list-style:none;
  margin:0;
  padding:0;
}
.widget_product_categories li{ margin:5px 0; }

/* Link estilo “pill” */
.widget_product_categories a{
  display:block;
  padding:9px 26px 9px 12px;   /* right extra for chevron */
  border-radius:5px;
  text-decoration:none;
  line-height:1.3;
  font-weight:500;
  color:rgba(0,0,0,.82);
  background:rgba(0,0,0,.025);
  border:1px solid rgba(0,0,0,.06);
  position:relative;
  transition:background .12s ease, border-color .12s ease;
}
.widget_product_categories a:hover{
  background:rgba(0,0,0,.05);
  border-color:rgba(0,0,0,.10);
}

/* Activo: fondo + barra lateral */
.widget_product_categories .current-cat > a,
.widget_product_categories .current-cat-parent > a{
  background:rgba(0,0,0,.10);
  box-shadow:inset 3px 0 0 rgba(0,0,0,.35);
  padding-left:14px;           /* compensa la barra */
}

/* Chevron sutil */
.widget_product_categories a:after{
  content:"›";
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  opacity:.35;
}
.widget_product_categories a:hover:after{ opacity:.6; }

/* Hijas (subcategorías) */
.widget_product_categories ul.children{
  margin:6px 0 6px 14px;
  padding:0;
}
.widget_product_categories ul.children a{
  padding:8px 26px 8px 12px;
  color:rgba(0,0,0,.72);
  background:rgba(0,0,0,.018);
  font-size:.95em;
}


.widget-area .widget a {
    font-size: 12px;
}
/* Hover premium: solo fade con micro-delay */
.widget_product_categories a{
  transition:
    background-color .18s ease .10s,
    border-color .18s ease .10s,
    box-shadow .18s ease .10s;
}

/* Hover: sube un pelín el contraste (sin moverse) */
.widget_product_categories a:hover{
  background: rgba(0,0,0,.055);
  border-color: #dc9814;
}

/* Chevron: aparece un poco más al hover (fade) */
.widget_product_categories a:after{
  transition: opacity .18s ease .10s;
}

.widget_product_categories a:hover:after{
  opacity: .65;
}

/* (Opcional) Activo un poco más “premium” */
.widget_product_categories .current-cat > a,
.widget_product_categories .current-cat-parent > a{
  box-shadow: inset 3px 0 0 rgba(0,0,0,.35), 0 1px 0 rgba(0,0,0,.04);
}
/* Quitar subrayado siempre (y evitar que vuelva en hover/visited) */
.widget_product_categories a,
.widget_product_categories a:hover,
.widget_product_categories a:focus,
.widget_product_categories a:visited{
  text-decoration: none !important;
}

/* Fade también en el texto */
.widget_product_categories a{
  transition:
    background-color .18s ease .10s,
    border-color .18s ease .10s,
    color .18s ease .10s,
    box-shadow .18s ease .10s;
}

.widget_product_categories a:hover{
  color: rgba(0,0,0,.90);
}
.widget_product_categories a:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(0,0,0,.12);
}
.widget_product_categories{ padding-right:0;}




.shoptimizer-archive .col-full{
    margin-top:30px;
}
.woocommerce-breadcrumb{
  font-size:12px;
  color:rgba(0,0,0,.55);
 
}
.woocommerce-breadcrumb a{
  color:rgba(0,0,0,.55);
  text-decoration:none !important;
}
.woocommerce-breadcrumb a:hover{ color:rgba(0,0,0,.75); }
.woocommerce-breadcrumb span:last-child{ color:rgba(0,0,0,.75); font-weight:500; }


body.single-product:has(.woocommerce-breadcrumb) .site-main {
    padding-top: 60px;
}

/* Asegura que el icono está oculto SIEMPRE por defecto */
.card-hover .cart-fab{
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(6px) scale(.95);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
  pointer-events: none;
}

/* Solo aparece cuando haces hover en ESA card */
.card-hover:hover .cart-fab{
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1);
  transition: opacity .25s ease, transform .25s ease, visibility 0s;
  pointer-events: auto;
}
/* El contenedor de imagen será el “anchor” */
.media-box{
  position: relative;
}

/* Botón sobre la imagen (abajo-derecha) */
.media-box .cart-fab{
  position: absolute !important;
  right: 5px !important;
  bottom: 5px !important;

  top: auto !important;
  left: auto !important;

  width: 36px !important;
  height: 36px !important;
  border-radius: 999px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  line-height: 0 !important;
  background: #123a63 !important;
  color: #fff !important;

  z-index: 50 !important;
}

.media-box .cart-fab svg{
  display: block;
  width: 16px;
  height: 16px;
}



.card-hover .cart-fab:hover{
  transform: translateY(0) scale(1.06) !important;
}

.card-hover{ position: relative; }

/* El widget botón ocupa toda la card */
.card-hover .card-link{
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
}

/* El <a> del botón cubre toda la card y no se ve */
.card-hover .card-link a.elementor-button,
.card-hover .card-link a.elementor-button-link{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;

  opacity: 0 !important; /* invisible */
  display: block !important;
}

/* El carrito por encima */
.media-box .cart-fab{ z-index: 50 !important; }


.elementor-menu-cart__container{
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
}

.elementor-menu-cart__container .elementor-menu-cart__main,
.elementor-menu-cart__container .dialog-widget-content{
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  height: 100vh !important;
  width: min(420px, 92vw) !important;
  overflow: auto !important;
}
 h2, h3, h4, h5, h6 {
   
    margin-block-start: 2.5rem;
}

/* Make sure the product card wrapper is relative */
.elementor-loop-item {
  position: relative;
}

/* The badge */
.wc-discount-badge{
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 20;

  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 12px;
  line-height: 1;

  background: #E53935;
  color: #fff;
}
