.elementor-kit-2021{--e-global-color-primary:#030AA4;--e-global-color-secondary:#D22779;--e-global-color-text:#95959F;--e-global-color-accent:#FFC01D;--e-global-color-23443cb:#07070C;--e-global-color-7f68d29:#11111B;--e-global-color-5bfeee0:#FFFFFF;--e-global-color-556c863:#FFFFFF1A;--e-global-color-8754e74:#FFFFFF00;--e-global-color-ffa2fd4:#11111B4D;--e-global-color-0b30af8:#1B1B2B;--e-global-color-519e156:#000000;--e-global-color-53e0c5b:#FFFFFF;--e-global-color-5a52846:#FF3333;--e-global-color-703d3eb:#4CAF50;--e-global-typography-primary-font-family:"Oxanium";--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-font-style:normal;--e-global-typography-text-line-height:1.688em;--e-global-typography-accent-font-family:"Oxanium";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:700;--e-global-typography-accent-font-style:normal;--e-global-typography-accent-line-height:1.25em;--e-global-typography-239073c-font-family:"Oxanium";--e-global-typography-239073c-font-size:12px;--e-global-typography-239073c-font-weight:700;--e-global-typography-239073c-font-style:normal;--e-global-typography-239073c-line-height:1.25em;--e-global-typography-c3a1499-font-family:"Oxanium";--e-global-typography-c3a1499-font-size:20px;--e-global-typography-c3a1499-font-weight:700;--e-global-typography-c3a1499-font-style:normal;--e-global-typography-c3a1499-line-height:1.25em;--e-global-typography-2337b54-font-family:"Inter";--e-global-typography-2337b54-font-size:12px;--e-global-typography-2337b54-font-weight:400;--e-global-typography-2337b54-font-style:normal;--e-global-typography-2337b54-line-height:1.5em;--e-global-typography-bf1b26b-font-family:"Inter";--e-global-typography-bf1b26b-font-size:20px;--e-global-typography-bf1b26b-font-weight:400;--e-global-typography-bf1b26b-font-style:normal;--e-global-typography-bf1b26b-line-height:1.4em;--e-global-typography-f075b97-font-family:"Oxanium";--e-global-typography-f075b97-font-size:64px;--e-global-typography-f075b97-font-weight:700;--e-global-typography-f075b97-font-style:normal;--e-global-typography-f075b97-line-height:1.25em;--e-global-typography-45e96e5-font-family:"Oxanium";--e-global-typography-45e96e5-font-size:48px;--e-global-typography-45e96e5-font-weight:700;--e-global-typography-45e96e5-font-style:normal;--e-global-typography-45e96e5-line-height:1.25em;--e-global-typography-c0d4b17-font-family:"Oxanium";--e-global-typography-c0d4b17-font-size:40px;--e-global-typography-c0d4b17-font-weight:700;--e-global-typography-c0d4b17-font-style:normal;--e-global-typography-c0d4b17-line-height:1.25em;--e-global-typography-15dca88-font-family:"Oxanium";--e-global-typography-15dca88-font-size:36px;--e-global-typography-15dca88-font-weight:700;--e-global-typography-15dca88-font-style:normal;--e-global-typography-15dca88-line-height:1.25em;--e-global-typography-61cbcfc-font-family:"Oxanium";--e-global-typography-61cbcfc-font-size:32px;--e-global-typography-61cbcfc-font-weight:700;--e-global-typography-61cbcfc-font-style:normal;--e-global-typography-61cbcfc-line-height:1.25em;--e-global-typography-db77ff3-font-family:"Oxanium";--e-global-typography-db77ff3-font-size:24px;--e-global-typography-db77ff3-font-weight:700;--e-global-typography-db77ff3-font-style:normal;--e-global-typography-db77ff3-line-height:1.25em;--e-global-typography-9686da8-font-family:"Inter";--e-global-typography-9686da8-font-size:13px;--e-global-typography-9686da8-font-weight:900;--e-global-typography-9686da8-text-transform:uppercase;--e-global-typography-9686da8-font-style:normal;--e-global-typography-9686da8-line-height:1.385em;--e-global-typography-9686da8-letter-spacing:4px;--e-global-typography-25e710d-font-family:"Inter";--e-global-typography-25e710d-font-size:12px;--e-global-typography-25e710d-font-weight:400;--e-global-typography-25e710d-font-style:normal;--e-global-typography-25e710d-text-decoration:line-through;--e-global-typography-25e710d-line-height:1.5em;--e-global-typography-3341bd4-font-family:"Oxanium";--e-global-typography-3341bd4-font-size:64px;--e-global-typography-3341bd4-font-weight:700;--e-global-typography-3341bd4-font-style:normal;--e-global-typography-3341bd4-line-height:0.8em;background-color:var( --e-global-color-7f68d29 );color:var( --e-global-color-519e156 );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );font-style:var( --e-global-typography-text-font-style );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-2021 button,.elementor-kit-2021 input[type="button"],.elementor-kit-2021 input[type="submit"],.elementor-kit-2021 .elementor-button{background-color:#FFC107;font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );font-style:var( --e-global-typography-accent-font-style );line-height:var( --e-global-typography-accent-line-height );color:var( --e-global-color-23443cb );border-style:solid;border-width:0px 0px 0px 0px;border-radius:2px 2px 2px 2px;padding:12px 012px 12px 012px;}.elementor-kit-2021 button:hover,.elementor-kit-2021 button:focus,.elementor-kit-2021 input[type="button"]:hover,.elementor-kit-2021 input[type="button"]:focus,.elementor-kit-2021 input[type="submit"]:hover,.elementor-kit-2021 input[type="submit"]:focus,.elementor-kit-2021 .elementor-button:hover,.elementor-kit-2021 .elementor-button:focus{background-color:var( --e-global-color-23443cb );color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-5bfeee0 );}.elementor-kit-2021 e-page-transition{background-color:#FFBC7D;}.elementor-kit-2021 p{margin-block-end:32px;}.elementor-kit-2021 a{color:var( --e-global-color-519e156 );}.elementor-kit-2021 a:hover{color:#FFB800;}.elementor-kit-2021 h1{color:var( --e-global-color-519e156 );font-family:var( --e-global-typography-f075b97-font-family ), Sans-serif;font-size:var( --e-global-typography-f075b97-font-size );font-weight:var( --e-global-typography-f075b97-font-weight );font-style:var( --e-global-typography-f075b97-font-style );line-height:var( --e-global-typography-f075b97-line-height );}.elementor-kit-2021 h2{color:var( --e-global-color-519e156 );font-family:var( --e-global-typography-45e96e5-font-family ), Sans-serif;font-size:var( --e-global-typography-45e96e5-font-size );font-weight:var( --e-global-typography-45e96e5-font-weight );font-style:var( --e-global-typography-45e96e5-font-style );line-height:var( --e-global-typography-45e96e5-line-height );}.elementor-kit-2021 h3{color:var( --e-global-color-519e156 );font-family:var( --e-global-typography-c0d4b17-font-family ), Sans-serif;font-size:var( --e-global-typography-c0d4b17-font-size );font-weight:var( --e-global-typography-c0d4b17-font-weight );font-style:var( --e-global-typography-c0d4b17-font-style );line-height:var( --e-global-typography-c0d4b17-line-height );}.elementor-kit-2021 h4{color:var( --e-global-color-519e156 );font-family:var( --e-global-typography-15dca88-font-family ), Sans-serif;font-size:var( --e-global-typography-15dca88-font-size );font-weight:var( --e-global-typography-15dca88-font-weight );font-style:var( --e-global-typography-15dca88-font-style );line-height:var( --e-global-typography-15dca88-line-height );}.elementor-kit-2021 h5{color:var( --e-global-color-519e156 );font-family:var( --e-global-typography-61cbcfc-font-family ), Sans-serif;font-size:var( --e-global-typography-61cbcfc-font-size );font-weight:var( --e-global-typography-61cbcfc-font-weight );font-style:var( --e-global-typography-61cbcfc-font-style );line-height:var( --e-global-typography-61cbcfc-line-height );}.elementor-kit-2021 h6{color:var( --e-global-color-519e156 );font-family:var( --e-global-typography-db77ff3-font-family ), Sans-serif;font-size:var( --e-global-typography-db77ff3-font-size );font-weight:var( --e-global-typography-db77ff3-font-weight );font-style:var( --e-global-typography-db77ff3-font-style );line-height:var( --e-global-typography-db77ff3-line-height );}.elementor-kit-2021 label{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );font-style:var( --e-global-typography-text-font-style );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-2021 input:not([type="button"]):not([type="submit"]),.elementor-kit-2021 textarea,.elementor-kit-2021 .elementor-field-textual{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );font-style:var( --e-global-typography-text-font-style );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );background-color:var( --e-global-color-5bfeee0 );border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-text );border-radius:2px 2px 2px 2px;padding:8px 16px 8px 16px;}.elementor-kit-2021 input:focus:not([type="button"]):not([type="submit"]),.elementor-kit-2021 textarea:focus,.elementor-kit-2021 .elementor-field-textual:focus{color:var( --e-global-color-text );background-color:var( --e-global-color-5bfeee0 );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1170px;}.e-con{--container-max-width:1170px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-2021{--e-global-typography-f075b97-font-size:48px;--e-global-typography-45e96e5-font-size:40px;--e-global-typography-c0d4b17-font-size:36px;--e-global-typography-15dca88-font-size:32px;--e-global-typography-61cbcfc-font-size:25px;--e-global-typography-db77ff3-font-size:20px;--e-global-typography-3341bd4-font-size:48px;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-2021 h1{font-size:var( --e-global-typography-f075b97-font-size );line-height:var( --e-global-typography-f075b97-line-height );}.elementor-kit-2021 h2{font-size:var( --e-global-typography-45e96e5-font-size );line-height:var( --e-global-typography-45e96e5-line-height );}.elementor-kit-2021 h3{font-size:var( --e-global-typography-c0d4b17-font-size );line-height:var( --e-global-typography-c0d4b17-line-height );}.elementor-kit-2021 h4{font-size:var( --e-global-typography-15dca88-font-size );line-height:var( --e-global-typography-15dca88-line-height );}.elementor-kit-2021 h5{font-size:var( --e-global-typography-61cbcfc-font-size );line-height:var( --e-global-typography-61cbcfc-line-height );}.elementor-kit-2021 h6{font-size:var( --e-global-typography-db77ff3-font-size );line-height:var( --e-global-typography-db77ff3-line-height );}.elementor-kit-2021 button,.elementor-kit-2021 input[type="button"],.elementor-kit-2021 input[type="submit"],.elementor-kit-2021 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-kit-2021 label{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-2021 input:not([type="button"]):not([type="submit"]),.elementor-kit-2021 textarea,.elementor-kit-2021 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-2021{--e-global-typography-f075b97-font-size:40px;--e-global-typography-45e96e5-font-size:36px;--e-global-typography-c0d4b17-font-size:32px;--e-global-typography-15dca88-font-size:28px;--e-global-typography-61cbcfc-font-size:24px;--e-global-typography-db77ff3-font-size:18px;--e-global-typography-3341bd4-font-size:40px;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-2021 h1{font-size:var( --e-global-typography-f075b97-font-size );line-height:var( --e-global-typography-f075b97-line-height );}.elementor-kit-2021 h2{font-size:var( --e-global-typography-45e96e5-font-size );line-height:var( --e-global-typography-45e96e5-line-height );}.elementor-kit-2021 h3{font-size:var( --e-global-typography-c0d4b17-font-size );line-height:var( --e-global-typography-c0d4b17-line-height );}.elementor-kit-2021 h4{font-size:var( --e-global-typography-15dca88-font-size );line-height:var( --e-global-typography-15dca88-line-height );}.elementor-kit-2021 h5{font-size:var( --e-global-typography-61cbcfc-font-size );line-height:var( --e-global-typography-61cbcfc-line-height );}.elementor-kit-2021 h6{font-size:var( --e-global-typography-db77ff3-font-size );line-height:var( --e-global-typography-db77ff3-line-height );}.elementor-kit-2021 button,.elementor-kit-2021 input[type="button"],.elementor-kit-2021 input[type="submit"],.elementor-kit-2021 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-kit-2021 label{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-kit-2021 input:not([type="button"]):not([type="submit"]),.elementor-kit-2021 textarea,.elementor-kit-2021 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS */#video-pay-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    z-index: 999999; /* Por encima de todo */
    display: flex;
    justify-content: center;
    align-items: center;
}

.video-wrapper video {
    max-width: 90%;
    max-height: 80vh;
    border-radius: 15px;
    box-shadow: 0 0 20px rgba(255, 102, 0, 0.5); /* Usando el naranja vibrante */
}

.fade-out {
    opacity: 0;
    transition: opacity 0.5s ease;
}

/* Oculta los logos gigantes del tema que NO están dentro de Elementor */
body :not(.elementor-element) > .custom-logo-link,
body :not(.elementor-element) > .custom-logo {
    display: none !important;
}

/* Por si el tema lo envuelve en un div clásico de WordPress */
.site-branding .custom-logo, 
.footer-widget-area .custom-logo {
    display: none !important;
}

/* Forzar relación de aspecto 4:5 y alineación de productos */
.products .product img {
    aspect-ratio: 4 / 5 !important;
    object-fit: cover !important;
    width: 100% !important;
    height: auto !important;
}

/* Opcional: Centrar el contenido de la imagen por si el recorte es agresivo */
.products .product img {
    object-position: center top;
}

/* Ocultar el footer dinámico de WordPress en todo el sitio */
#site-footer.site-footer.dynamic-footer {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* --- CONFIGURACIÓN PARA NAVEGADORES CHROME, EDGE, SAFARI Y OPERA --- */
::-webkit-scrollbar {
    width: 12px; /* Ancho de la barra vertical */
    height: 12px; /* Alto de la barra horizontal (si apareciera) */
}

/* El fondo de la barra (lo que ahora tenés en gris claro) */
::-webkit-scrollbar-track {
    background: #111116; /* Un fondo oscuro profundo que combina con tu plantilla */
}

/* El tirador / la barrita que se mueve (lo que ahora tenés en gris) */
::-webkit-scrollbar-thumb {
    background: #f5c518; /* El color amarillo/dorado de tus textos destacados */
    border-radius: 6px; /* Bordes redondeados para que quede fina */
    border: 3px solid #111116; /* Margen transparente alrededor para que flote y no sature */
}

/* Cuando el usuario pasa el mouse por arriba de la barra */
::-webkit-scrollbar-thumb:hover {
    background: #ff4a9e; /* Cambia a tu rosa/fucsia de acento al pasar el cursor */
}

/* --- CONFIGURACIÓN PARA FIREFOX (Usa reglas más simples) --- */
* {
    scrollbar-width: thin;
    scrollbar-color: #f5c518 #111116; /* [Color del tirador] [Color del fondo] */
}



/* 1. ESTADO POR DEFAULT (PASIVO) CON ALINEACIÓN */
.woocommerce-account .woocommerce table.shop_table td p a.woocommerce-button.button {
    background-color: #f5c518 !important; /* Tu amarillo permanente */
    color: #111111 !important;            /* Letras negras */
    border: 2px solid #111111 !important; /* Borde negro de 2px */
    border-radius: 4px;                   
    transition: all 0.3s ease !important; 
    
    /* ALINEACIÓN EN LÍNEA Y PADDING OPTIMIZADO */
    display: inline-block !important;
    padding: 6px 10px !important;         /* Reducido para que entren uno al lado del otro */
    margin: 2px 4px !important;           /* Separación justa entre botones */
    white-space: nowrap !important;       /* Evita que el texto de adentro se corte en dos renglones */
    font-size: 13px !important;           /* Ajuste fino del tamaño de letra */
    font-weight: bold !important;         
}

/* Fuerza al contenedor <p> a no romper la línea */
.woocommerce-account .woocommerce table.shop_table td p {
    white-space: nowrap !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 2. ESTADO HOVER (AL PASAR EL MOUSE) */
.woocommerce-account .woocommerce table.shop_table td p a.woocommerce-button.button:hover {
    background-color: #ffffff !important; /* Fondo blanco */
    color: #f5c518 !important;            /* Letras amarillas */
    border: 2px solid #111111 !important; /* Mantiene el borde negro */
}
/* 1. BOTÓN SIGUIENTE - ESTADO POR DEFAULT (PASIVO) */
.woocommerce-account .woocommerce a.woocommerce-button--next.button {
    border: 2px solid #f5c518 !important;   /* Borde amarillo */
    background-color: #111111 !important;   /* Fondo negro */
    color: #ffffff !important;              /* Texto blanco */
    
    /* Estilo general y animación */
    border-radius: 4px;
    padding: 8px 16px !important;
    font-weight: bold !important;
    display: inline-block !important;
    transition: all 0.3s ease !important;
    text-align: center;
}

/* 2. BOTÓN SIGUIENTE - ESTADO HOVER (AL PASAR EL MOUSE) */
.woocommerce-account .woocommerce a.woocommerce-button--next.button:hover {
    border: 2px solid #f5c518 !important;   /* Mantiene el borde amarillo */
    background-color: #ffffff !important;   /* Fondo blanco */
    color: #f5c518 !important;              /* Letras amarillas */
}

/* 1. ENLACE CERRAR SESIÓN - ESTADO DEFAULT (PASIVO) */
.woocommerce-account .woocommerce a[href*="logout"] {
    border: 2px solid #f5c518 !important;   /* Borde amarillo por defecto */
    
    /* Le damos formato de botón para que el borde luzca prolijo */
    display: inline-block !important;
    padding: 6px 14px !important;
    border-radius: 4px;
    font-weight: bold !important;
    text-decoration: none !important;       /* Le saca el subrayado común de link */
    transition: all 0.3s ease !important;   /* Animación suave para el cambio de borde */
    
    /* Conserva sus colores actuales (letra/fondo) si ya los tenías seteados */
}

/* 2. ENLACE CERRAR SESIÓN - ESTADO HOVER (AL PASAR EL MOUSE) */
.woocommerce-account .woocommerce a[href*="logout"]:hover {
    border: 2px solid #f5c518 !important;   /* Cambia a borde negro en hover */
}

/* 1. BOTÓN EXPLORAR PRODUCTOS - ESTADO POR DEFAULT (PASIVO) */
.woocommerce-account .woocommerce a.button.wc-forward {
    background-color: #f5c518 !important; /* Tu amarillo permanente */
    color: #111111 !important;            /* Letras negras */
    border: 2px solid #111111 !important; /* Borde negro de 2px */
    border-radius: 4px;                   
    transition: all 0.3s ease !important; 
    
    /* Formato compacto igual a los anteriores */
    display: inline-block !important;
    padding: 6px 14px !important;         
    white-space: nowrap !important;       
    font-weight: bold !important;         
    text-decoration: none !important;
}

/* 2. BOTÓN EXPLORAR PRODUCTOS - ESTADO HOVER (AL PASAR EL MOUSE) */
.woocommerce-account .woocommerce a.button.wc-forward:hover {
    background-color: #ffffff !important; /* Fondo blanco */
    color: #f5c518 !important;            /* Letras amarillas */
    border: 2px solid #111111 !important; /* Mantiene el borde negro */
}

/* 1. TEXTO DE LOS LABELS EN NEGRO */
.woocommerce-EditAccountForm label {
    color: #111111 !important;    /* Forzamos a que el texto sea negro oscuro */
    font-weight: bold !important;  /* Le da un toque más firme para que se lea impecable */
    display: inline-block;
    margin-bottom: 5px !important;
}

/* El texto aclaratorio que sale abajo de "Nombre visible" también en oscuro */
.woocommerce-EditAccountForm #account_display_name_description em {
    color: #444444 !important;    /* Un gris oscuro bien legible */
}

/* El título de "Cambio de contraseña" */
.woocommerce-EditAccountForm legend {
    color: #111111 !important;
    font-weight: bold !important;
}

/* 2. BOTÓN GUARDAR CAMBIOS - ESTADO DEFAULT (PASIVO) */
.woocommerce-EditAccountForm button.woocommerce-Button.button {
    background-color: #f5c518 !important; /* Tu amarillo permanente */
    color: #111111 !important;            /* Letras negras */
    border: 2px solid #111111 !important; /* Borde negro de 2px */
    border-radius: 4px;                   
    transition: all 0.3s ease !important; 
    
    /* Formato compacto y prolijo */
    display: inline-block !important;
    padding: 8px 18px !important;         
    font-weight: bold !important;         
    text-transform: none !important;      /* Evita que se fuerce a mayúsculas si tu theme lo hace */
    cursor: pointer;
}

/* 3. BOTÓN GUARDAR CAMBIOS - ESTADO HOVER (AL PASAR EL MOUSE) */
.woocommerce-EditAccountForm button.woocommerce-Button.button:hover {
    background-color: #ffffff !important; /* Fondo blanco */
    color: #f5c518 !important;            /* Letras amarillas */
    border: 2px solid #111111 !important; /* Mantiene el borde negro */
}

/* ==========================================
   1. ETIQUETAS (LABELS) EN COLOR NEGRO
   ========================================== */
#customer_login label,
#customer_login label[for="username"],
#customer_login label[for="password"],
#customer_login label[for="reg_email"],
#customer_login .woocommerce-form__label-for-checkbox span {
    color: #000000 !important;
    font-weight: 600 !important;
}

/* ==========================================
   2. CAMPOS DE TEXTO (INPUTS): COLOR, GRIS MÁS OSCURO Y BORDE AMARILLO
   ========================================== */
#customer_login input[type="text"].input-text,
#customer_login input[type="password"].input-text,
#customer_login input[type="email"].input-text {
    /* Color del texto cuando el usuario escribe (Gris bien oscuro) */
    color: #222222 !important; 
    
    /* Borde de los rectángulos en amarillo */
    border: 2px solid #ffcc00 !important; 
    
    /* Ajustes estéticos de fondo y relleno interno */
    background-color: #ffffff !important;
    padding: 10px !important;
    border-radius: 4px !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

/* Color del texto cuando el campo está seleccionado (Focus) */
#customer_login input.input-text:focus {
    outline: none !important;
    border-color: #ffcc00 !important;
    color: #000000 !important;
    background-color: #ffffff !important;
}

/* ==========================================
   1. BORDES DE LAS COLUMNAS EN NEGRO OSCURO
   ========================================== */
#customer_login .u-column1.col-1, 
#customer_login .u-column2.col-2 {
    border: 2px solid #000000 !important; /* Cambia el gris claro por negro puro */
    padding: 25px !important;              /* Espaciado interno prolijo */
    border-radius: 6px !important;         /* Esquinas apenas redondeadas */
    background-color: #ffffff !important;  /* Fondo blanco interno */
    box-sizing: border-box !important;
}


/* ==========================================
   2. BOTONES DE ACCESO Y REGISTRARSE
   ========================================== */

/* --- ESTADO NORMAL (Para ambos botones) --- */
#customer_login .woocommerce-form-login__submit,
#customer_login .woocommerce-form-register__submit {
    background-color: #ffea00 !important; /* Amarillo brillante */
    color: #000000 !important;            /* Letras negras */
    border: 2px solid #000000 !important; /* Borde negro */
    
    font-size: 16px !important;            
    font-weight: 700 !important;           
    text-transform: uppercase !important;  
    padding: 12px 30px !important;         
    border-radius: 5px !important;         
    transition: all 0.2s ease-in-out !important;  
    cursor: pointer !important;
    display: inline-block !important;
    text-align: center !important;
}

/* --- ESTADO HOVER (Fondo negro, letras y borde amarillo) --- */
#customer_login .woocommerce-form-login__submit:hover,
#customer_login .woocommerce-form-register__submit:hover {
    background-color: #000000 !important; /* Fondo negro */
    color: #ffea00 !important;            /* Letras amarillas de siempre */
    border-color: #ffea00 !important;     /* Borde amarillo */
}

/* ==========================================
   FILTROS YITH: AMARILLO #FFC01D Y BORDE FINO
   ========================================== */

/* 1. Texto interno en tu amarillo exacto */
.yith-wcan-dropdown .dropdown-label {
    color: #FFff !important;
    font-weight: 500 !important;
}

/* 2. Borde sutil de 1px en tu amarillo */
.yith-wcan-dropdown,
.yith-wcan-dropdown.closed,
.yith-wcan-dropdown.open {
    border: 1px solid #FFC01D !important; /* Borde de 1px fino */
    border-radius: 4px !important;
}

/* 3. Ataque masivo al ícono / flecha para forzar el color */
/* Si es un pseudo-elemento o flecha de borde CSS */
.yith-wcan-dropdown::after,
.yith-wcan-dropdown::before,
.yith-wcan-dropdown .dropdown-label::after,
.yith-wcan-filter-item .yith-wcan-dropdown-icon {
    color: #FFC01D !important;
    border-top-color: #FFC01D !important;
}

/* Si el ícono es un tag de fuente o SVG */
.yith-wcan-dropdown i,
.yith-wcan-dropdown svg,
.yith-wcan-dropdown-icon {
    color: #FFC01D !important;
    fill: #FFC01D !important;
}

/* Si el ícono es una imagen de fondo (Background Image), la teñimos con filtro */
.yith-wcan-dropdown::after,
.yith-wcan-dropdown .yith-wcan-dropdown-icon,
.yith-wcan-dropdown.closed::after {
    filter: invert(79%) sepia(61%) saturate(1412%) x(14deg) brightness(101%) contrast(99%) !important;
    /* Este filtro convierte .elementor-kit-2021es oscuros/grises nativos al tono aproximado de tu amarillo */
}

/* ==========================================
   FORMULARIO LOGIN: TEXTOS Y ENLACES EN BLANCO
   ========================================== */

/* 1. Todos los labels del formulario (Usuario, Contraseña, etc.) */
.woocommerce-form-login label,
.woocommerce-form-login label .required {
    color: #ffffff !important;
}

/* 2. El texto "Recuérdame" (el span que está dentro del label) */
.woocommerce-form-login__rememberme span {
    color: #ffffff !important;
}

/* 3. Enlace "¿Has perdido tu contraseña?" en estado normal */
.woocommerce-form-login .lost_password a {
    color: #ffffff !important;
}

/* Opcional: Si querés que al pasar el mouse por el enlace cambie a tu amarillo, podés sumar esto: */
.woocommerce-form-login .lost_password a:hover {
    color: #FFC01D !important;
}

/* Cambiar el color de las flechas del slider a amarillo */
.wpcis-slider-slides .flex-direction-nav a,
.wpcis-slider-slides .flex-direction-nav a::before,
.wpcis-slider-slides .flex-direction-nav a::after {
    color: #FFD700 !important; /* Amarillo */
}

/* Por si usan un color de fondo en vez de texto (opcional) */
.wpcis-slider-slides .flex-direction-nav a:hover {
    color: #FFEA00 !important; /* Un amarillo un toque más brillante al pasar el mouse */
}

/* --- FORZAR TEXTO BLANCO EN LA DESCRIPCIÓN CORTA (SINGLE PRODUCT) --- */
.woocommerce-product-details__short-description,
.woocommerce-product-details__short-description p,
.woocommerce-product-details__short-description span,
.woocommerce-product-details__short-description strong,
.woocommerce-product-details__short-description ul,
.woocommerce-product-details__short-description li {
    color: #FFFFFF !important;
}

/* ==========================================================================
   REPARACIÓN BUSCADOR MODERN (YWCAS + WOOCOMMERCE BLOCKS)
   ========================================================================== */

@media (max-width: 767px) {
    
    /* 1. Forzar a que las columnas de Gutenberg se apilen verticalmente */
    .ywcas-container .wp-block-columns {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
    }

    /* 2. Romper los porcentajes fijos (20% y 80%) y darles el 100% del ancho */
    .ywcas-container .wp-block-column {
        flex-basis: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        box-sizing: border-box !important;
    }

    /* 3. Convertir la grilla de productos de WooCommerce Blocks en una lista vertical */
    .ywcas-container .wc-block-grid__products {
        display: flex !important;
        flex-direction: column !important;
        gap: 25px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* 4. Resetear cada tarjeta de producto individual */
    .ywcas-container .wc-block-grid__product {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
        margin: 0 auto !important;
        float: none !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    /* Centrar imágenes de los productos recomendados */
    .ywcas-container .wc-block-grid__product-image,
    .ywcas-container .wc-block-grid__product-image img {
        margin: 0 auto 10px auto !important;
        display: block !important;
        max-width: 100% !important;
        height: auto !important;
    }

    /* Ajustar el botón de "Añadir al carrito" de los bloques */
    .ywcas-container .wc-block-grid__product .wp-block-button__link {
        display: inline-block !important;
        width: auto !important;
        min-width: 160px !important;
        margin: 10px auto 0 auto !important;
        padding: 10px 20px !important;
    }
}

/* ==========================================================================
   ESTILO DE BOTONES: AÑADIR AL CARRITO EN EL BUSCADOR
   ========================================================================== */

/* Botón en estado normal */
.ywcas-container .wp-block-button__link.add_to_cart_button {
    background-color: #000000 !important;
    color: #ffffff !important;
    padding: 10px !important;
    border: none !important; /* Elimina bordes raros si los hay */
    text-decoration: none !important; /* Quita subrayados de enlaces */
    display: inline-block !important;
    transition: background-color 0.2s ease-in-out !important;
}

/* Efecto Hover (cuando pasás el mouse por arriba) */
.ywcas-container .wp-block-button__link.add_to_cart_button:hover {
    background-color: #333333 !important; /* Un gris oscuro para que se note el clic */
    color: #ffffff !important;
}

/* ==========================================================================
   AJUSTES DE TEXTO: TÍTULOS Y PRECIOS EN EL BUSCADOR
   ========================================================================== */

/* 1. Agrandar y destacar el título del producto */
.ywcas-container .wc-block-grid__product-title {
    font-size: 18px !important; /* Si lo querés más grande, subilo a 18px */
    font-weight: 600 !important; /* Lo hace un toque más negrita */
    line-height: 1.4 !important;
    margin-top: 12px !important;
    margin-bottom: 6px !important;
    color: #000000 !important; /* Por si las dudas, fuerza el color negro */
}

/* 2. Agrandar y dar peso al precio */
.ywcas-container .wc-block-grid__product-price,
.ywcas-container .wc-block-grid__product-price .woocommerce-Price-amount {
    font-size: 18px !important; /* Si lo querés más grande, subilo a 18px */
    font-weight: 700 !important; /* Negrita fuerte para que resalte */
    color: #000000 !important;
    margin-bottom: 12px !important;
    display: block !important; /* Le da su propio espacio alineado */
}

/* ==========================================================================
   ALINEACIÓN Y CENTRADO PERFECTO DE LA X DE CIERRE
   ========================================================================== */

/* 1. Modificar el contenedor del botón (El cuadrado) */
button.lapilliUI-Modal__close {
    display: flex !important;
    align-items: center !important;      /* Centrado vertical */
    justify-content: center !important;    /* Centrado horizontal */
    padding: 0 !important;                /* ELIMINA el padding viejo que lo descoloca */
    
    /* Forzar cuadrado perfecto */
    width: 42px !important;  
    height: 42px !important;
    
    /* Posición en la esquina superior derecha */
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 99999 !important;            /* Lo sube por encima de cualquier otra pestaña */
    
    /* Descomentá la línea de abajo si querés forzar el fondo amarillo desde acá */
    /* background-color: #ffb700 !important; */
}

/* 2. Modificar el icono de la X (El SVG interno) */
button.lapilliUI-Modal__close svg {
    width: 22px !important;               /* Tamaño de la X */
    height: 22px !important;
    margin: 0 !important;                 /* Resetea márgenes molestos */
    color: #000000 !important;            /* Color negro para la X */
    display: block !important;
    flex-shrink: 0 !important;            /* Evita que se deforme */
}

/* ==========================================================================
   TRADUCCIÓN DE "POPULAR PRODUCTS" A ESPAÑOL
   ========================================================================== */

/* 1. Escondemos el texto original en inglés */
.lapilliUI-Modal__paper .wp-block-heading.has-medium-font-size {
    font-size: 0 !important; 
    margin-bottom: 20px !important; /* Espacio con las fotos de abajo */
}

/* 2. Inyectamos el texto traducido y le devolvemos el tamaño */
.lapilliUI-Modal__paper .wp-block-heading.has-medium-font-size::before {
    content: "Productos populares" !important;
    font-size: 22px !important; /* Ajustá este número si lo querés más grande o chico */
    font-weight: 700 !important; /* Lo hace negrita igual que el original */
    color: #000000 !important;
    display: block !important;
}

/* ==========================================================================
   CORRECCIONES DE LAYOUT PARA MOBILE (X Y MENÚ HAMBURGUESA)
   ========================================================================== */

/* Ajuste de la X: La bajamos para que no se corte en celulares */
button.lapilliUI-Modal__close {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important; /* Elimina paddings que deforman */
    width: 42px !important;
    height: 42px !important;
    position: absolute !important;
    
    top: 45px !important;       /* ANTES: 15px. Al bajarlo a 45px ya no se corta arriba */
    right: 20px !important;     /* Le damos un toque más de aire al costado */
    z-index: 999999 !important; /* Ultra alto para que no lo tape nada dentro del modal */
}

/* Forzar al menú hamburguesa/cabecera a estar al frente de capas invisibles */
.elementor-menu-toggle, 
.eael-simple-menu-toggle,
header, 
#site-header {
    z-index: 99999 !important; /* Le da prioridad al botón del menú para que reciba el clic */
    position: relative !important;
}

/* ==========================================================================
   ESTILOS FIJOS Y CENTRADO: BOTONES DE APERTURA Y CIERRE DEL BUSCADOR
   ========================================================================== */

/* 1. CUANDO ESTÁ ABIERTO: Botón de cerrar (Fondo Negro, X Roja) */
button.lapilliUI-Modal__close {
    display: flex !important;
    align-items: center !important;      /* Centrado vertical perfecto */
    justify-content: center !important;    /* Centrado horizontal perfecto */
    padding: 0 !important;                /* Resetea paddings que desalinean */
    width: 44px !important;               /* Tamaño del cuadrado */
    height: 44px !important;
    position: absolute !important;
    top: 45px !important;                 /* Altura ideal para mobile (no se corta) */
    right: 20px !important;
    z-index: 999999 !important;
    
    background-color: #000000 !important; /* Fondo Negro */
    border: none !important;
    border-radius: 4px !important;        /* Suave redondeado en las esquinas */
}

/* Icono de la X interna */
button.lapilliUI-Modal__close svg {
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    color: #ff0000 !important;            /* X color Rojo */
    fill: #ff0000 !important;
    display: block !important;
    flex-shrink: 0 !important;
}


/* 2. CUANDO ESTÁ CERRADO: Botón de buscar / Lupa (Fondo Amarillo, Lupa Blanca) */
button.lapilliUI-IconButton__root:not(.lapilliUI-Modal__close) {
    display: flex !important;
    align-items: center !important;      /* Centrado vertical perfecto */
    justify-content: center !important;    /* Centrado horizontal perfecto */
    padding: 0 !important;                /* Resetea paddings molestos */
    width: 44px !important;               /* Mismo tamaño para que sean simétricos */
    height: 44px !important;
    
    background-color: #ffb700 !important; /* Fondo Amarillo de tu marca */
    border: none !important;
    border-radius: 4px !important;
}

/* Icono de la Lupa interna */
button.lapilliUI-IconButton__root:not(.lapilliUI-Modal__close) svg {
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    color: #ffffff !important;            /* Fuerza el icono a Blanco */
    stroke: #ffffff !important;           /* Al ser un trazo (stroke), aseguramos el color blanco */
    display: block !important;
    flex-shrink: 0 !important;
}

/* ==========================================================================
   FIX: EVITAR QUE EL HEADER SE SQUEEZE O SE CORRA A LA DERECHA
   ========================================================================== */

/* 1. Reservar el espacio del scrollbar de forma estable en toda la web */
html {
    scrollbar-gutter: stable !important;
}

/* 2. Bloquear el header horizontalmente para que no drifteé */
header, 
#site-header, 
.elementor-location-header {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   FORZAR VISIBILIDAD TOTAL DEL CARTEL "ELEGÍ TU DIVISA" (SÓLO DESKTOP)
   ========================================================================== */

/* 1. Forzamos al contenedor del plugin a flotar por encima de ABSOLUTAMENTE TODO */
.woocommerce-multi-currency.wmc-sidebar {
    overflow: visible !important;
    z-index: 9999999 !important; /* Z-index masivo para ganarle al buscador y al menu */
    display: block !important;
    visibility: visible !important;
}

/* 2. Aseguramos que la pestañita amarilla permita renderizar texto hacia afuera */
.woocommerce-multi-currency.wmc-sidebar .wmc-title {
    overflow: visible !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ==========================================================================
   ESTILOS EXCLUSIVOS PARA PANTALLAS GRANDES (DESKTOP Y TABLET)
   ========================================================================== */
@media only screen and (min-width: 768px) {

    /* 3. Construcción del cartel flotante amarillo */
    .woocommerce-multi-currency.wmc-sidebar .wmc-title::before {
        content: "Elegí tu divisa" !important;
        position: absolute !important;
        
        /* Diseño y Contraste */
        background-color: #ffc107 !important; 
        color: #000000 !important;
        font-size: 11px !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        white-space: nowrap !important;
        padding: 7px 12px !important;
        border-radius: 4px !important;
        box-shadow: -3px 3px 12px rgba(0, 0, 0, 0.35) !important;
        
        /* Ubicación exacta */
        top: 30% !important;
        right: 85% !important; 
        transform: translateY(-50%) !important;
        
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: none !important;
    }

    /* 4. Flechita indicadora que apunta hacia ABAJO */
    .woocommerce-multi-currency.wmc-sidebar .wmc-title::after {
        content: "" !important;
        position: absolute !important;
        top: 80% !important;
        right: 90% !important;
        transform: translateY(-50%) !important;
        
        /* Triángulo CSS hacia abajo */
        border-width: 6px 6px 0 6px !important; 
        border-style: solid !important;
        border-color: #ffc107 transparent transparent transparent !important;
        
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: none !important;
    }
}


/* Ocultar "(opcional)" */
label[for="billing_address_1"] .optional,
label[for="billing_city"] .optional,
label[for="billing_state"] .optional,
label[for="billing_postcode"] .optional {
    display: none !important;
}

/* Agregar asterisco */
label[for="billing_address_1"]::after,
label[for="billing_city"]::after,
label[for="billing_state"]::after,
label[for="billing_postcode"]::after {
    content: " *";
    color: #e2401c;
    font-weight: 700;
}/* End custom CSS */