/*
Theme Name:   Hello Elementor Child
Theme URI:    https://elementor.com/hello-theme/
Description:  Child theme for Hello Elementor
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-elementor-child
*/


/* ==========================================================================
   1. RESET / GENERAL
   ========================================================================== */

body, html {
    width: 100vw;
    max-width: 100%!important;
    overflow-x: hidden;
}


/* ==========================================================================
   2. LAYOUT
   ========================================================================== */

/* --- Ancho base (contenedor principal) --- */

.ancho-base {
    padding-left: 0;
    padding-right: 0;
}

.ancho-base > .e-con-inner {
    width: 100%!important;
    max-width: 1310px!important;
    padding-left: 40px!important;
    padding-right: 40px!important;
	margin-left: auto;
    margin-right: auto;
}

@media (max-width: 767px) {
    .ancho-base > .e-con-inner {
        padding-left: 20px!important;
        padding-right: 20px!important;
    }
}

@media (max-width: 767px) {
    .ancho-base > .e-con-inner {
        max-width: unset!important;
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (min-width: 1600px) {
    .ancho-base > .e-con-inner {
        max-width: 1600px!important;
        padding-left: 120px!important;
        padding-right: 120px!important;
    }
}

@media (min-width: 2560px) {
    .ancho-base > .e-con-inner {
        max-width: 1600px!important;
        padding-left: 120px!important;
        padding-right: 120px!important;
    }
}

/* --- Ancho total normalmente, ancho base en monitor grande --- */

.ancho-base.wide > .e-con-inner {
    padding: 0!important;
    max-width: unset!important;
}

@media (min-width: 1920px) {
    .ancho-base.wide > .e-con-inner {
        padding: 0!important;
        max-width: 1720px!important;
    }
}

/* --- Media columna (layout de ancho completo) --- */

.media-col-ancho-base.derecha {
    padding-right: calc(((100vw - 1310px) / 2) + 40px);
}

@media (max-width: 1300px) {
    .media-col-ancho-base.derecha {
        padding-right: 40px!important;
        padding-left: 40px!important;
    }
}

@media (max-width: 767px) {
    .media-col-ancho-base.derecha {
        padding-left: 20px!important;
        padding-right: 20px!important;
    }
}

@media (min-width: 1600px) {
    .media-col-ancho-base.derecha {
        /*padding-right: calc(((100vw - 2560px) / 2) + 120px)!important;
        padding-left: min(calc(((100vw - 2560px) / 2) + 120px), 10vw)!important;*/
        padding-right: 120px!Important;
        padding-left: 120px!important;
    }
}

@media (min-width: 2560px) {
    .media-col-ancho-base.derecha {
        padding-right: calc(((100vw - 2560px) / 2) + 120px)!important;
        padding-left: min(calc(((100vw - 2560px) / 2) + 120px), 10vw)!important;
        /*padding-right: 120px!Important;
        padding-left: 120px!important;*/
    }
}


/* ==========================================================================
   3. TIPOGRAFÍA
   ========================================================================== */

.tk-freight-display-pro * { 
    font-family: "freight-display-pro",serif!important; 
}


/* ==========================================================================
   4. BOTONES
   ========================================================================== */

/* --- Variables --- */

:root {
    --btn-padding-desktop: 14px 24px;
    --btn-padding-mobile: 20px 16px;
    --btn-border-radius: 2px;
    --btn-font-size-desktop: 16px;
    --btn-font-size-mobile: 13px;
    --btn-font-weight: 700;
}

/* --- Estilos base para todos los botones --- */

[class*="btn-"] a {
    display: inline-block !important;
    padding: var(--btn-padding-desktop) !important;
    border-radius: var(--btn-border-radius) !important;
    font-size: var(--btn-font-size-desktop) !important;
    font-weight: var(--btn-font-weight) !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

@media (max-width: 768px) {
    [class*="btn-"] a {
        padding: var(--btn-padding-mobile) !important;
        font-size: var(--btn-font-size-mobile) !important;
    }
}

/* --- Botón wgray10 (solid) --- */

.btn-wgray10 a {
    background: #817364 !important;
    color: #fff !important;
}

.btn-wgray10 a:hover {
    background: #A6A39D !important;
}

.btn-wgray10 a:active {
    background: #686765 !important;
}

.btn-wgray10.disabled a {
    background: #B6B1AB !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

@media (min-width: 2560px) {
    .btn-wgray10 span {
        font-size: 23px;
    }

    .btn-wgray10 a {
        padding: 25px 32px!important;
    }
}

/* --- Botón wgray10 (outline) --- */

.btn-wgray10-outline a {
    background: transparent !important;
    color: #817364 !important;
    border: 1px solid #817364 !important;
}

.btn-wgray10-outline a:hover {
    color: #A6A39D !important;
    border-color: #A6A39D !important;
}

.btn-wgray10-outline a:active {
    color: #686765 !important;
    border-color: #686765 !important;
}

.btn-wgray10-outline.disabled a {
    color: #B6B1AB !important;
    border-color: #B6B1AB !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

@media (max-width: 1300px) {
    .btn-wgray10-outline a {
        font-size: 14px;
        padding: 20px 10px;
    }
}

@media (min-width: 1600px) {
    .btn-wgray10-outline a {
        font-size: 18px;
    }
}

/* --- Botón wgray10 (sin outline / ghost) --- */

.btn-wgray10-no-o a {
    background: transparent !important;
    color: #817364 !important;
}

.btn-wgray10-no-o a:hover {
    color: #A6A39D !important;
}

.btn-wgray10-no-o a:active {
    color: #686765 !important;
}

.btn-wgray10-no-o.disabled a {
    color: #B6B1AB !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón blanco (solid) --- */

.btn-blanco a {
    background: #FFFFFF !important;
    color: #000 !important;
}

.btn-blanco a:hover {
    background: #E9E3D7 !important;
}

.btn-blanco a:active {
    background: #BBB7AF !important;
}

.btn-blanco.disabled a {
    background: #E6E6E6 !important;
    color: #858585 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón blanco (outline) --- */

.btn-blanco-outline a {
    background: transparent !important;
    color: #FFFFFF !important;
    border: 1px solid #FFFFFF !important;
}

.btn-blanco-outline a:hover {
    color: #E9E3D7 !important;
    border-color: #E9E3D7 !important;
}

.btn-blanco-outline a:active {
    color: #BBB7AF !important;
    border-color: #BBB7AF !important;
}

.btn-blanco-outline.disabled a {
    color: #E6E6E6 !important;
    border-color: #E6E6E6 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón blanco (sin outline / ghost) --- */

.btn-blanco-no-o a {
    background: transparent !important;
    color: #FFFFFF !important;
}

.btn-blanco-no-o a:hover {
    color: #E9E3D7 !important;
}

.btn-blanco-no-o a:active {
    color: #BBB7AF !important;
}

.btn-blanco-no-o.disabled a {
    color: #E6E6E6 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón negro (solid) --- */

.btn-negro a {
    background: #000 !important;
    color: #fff !important;
}

.btn-negro a:hover {
    background: #A6A39D !important;
}

.btn-negro a:active {
    background: #686765 !important;
}

.btn-negro.disabled a {
    background: #858585 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón negro (outline) --- */

.btn-negro-outline a {
    background: transparent !important;
    color: #000 !important;
    border: 1px solid #000 !important;
}

.btn-negro-outline a:hover {
    color: #A6A39D !important;
    border-color: #A6A39D !important;
}

.btn-negro-outline a:active {
    color: #686765 !important;
    border-color: #686765 !important;
}

.btn-negro-outline.disabled a {
    color: #858585 !important;
    border-color: #858585 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón negro (sin outline / ghost) --- */

.btn-negro-no-o a {
    background: transparent !important;
    color: #000 !important;
}

.btn-negro-no-o a:hover {
    color: #A6A39D !important;
}

.btn-negro-no-o a:active {
    color: #686765 !important;
}

.btn-negro-no-o.disabled a {
    color: #858585 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón destructive (solid) --- */

.btn-destructive a {
    background: #A35B52 !important;
    color: #fff !important;
}

.btn-destructive a:hover {
    background: #8B4D45 !important;
}

.btn-destructive a:active {
    background: #73403A !important;
}

.btn-destructive.disabled a {
    background: #C9ADA7 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón destructive (outline) --- */

.btn-destructive-outline a {
    background: transparent !important;
    color: #A35B52 !important;
    border: 1px solid #A35B52 !important;
}

.btn-destructive-outline a:hover {
    color: #8B4D45 !important;
    border-color: #8B4D45 !important;
}

.btn-destructive-outline a:active {
    color: #73403A !important;
    border-color: #73403A !important;
}

.btn-destructive-outline.disabled a {
    color: #C9ADA7 !important;
    border-color: #C9ADA7 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* --- Botón destructive (sin outline / ghost) --- */

.btn-destructive-no-o a {
    background: transparent !important;
    color: #A35B52 !important;
}

.btn-destructive-no-o a:hover {
    color: #8B4D45 !important;
}

.btn-destructive-no-o a:active {
    color: #73403A !important;
}

.btn-destructive-no-o.disabled a {
    color: #C9ADA7 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}


/* ==========================================================================
   5. UTILIDADES
   ========================================================================== */

@media (max-width: 767px) {
    .mobile-hidden {
        display: none;
    }
}

@media (min-width: 768px) {
    .only-mobile {
        display: none;
    }
}

.no-wrap * {
    white-space: nowrap!important;
}

/* ==========================================================================
   6. COMPONENTES REUTILIZABLES
   ========================================================================== */

/* --- Hero con video de fondo --- */

.hero-vid-container {
    height: 100%;
}

.hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* --- Video backgrounds (fix para borde blanco) --- */

.has-video-bg {
    overflow: hidden;
}

.has-video-bg .elementor-background-video-container {
    transform: scale(1.0000001);
}

/* --- Quote --- */

.al-quote {
    max-width: 528px!important;
}

@media (min-width: 1600px) {
    .al-quote p {
        font-size: 28px!important;
    }

    .al-quote-citation > * {
        font-size: 18px!important;
    }
}

@media (min-width: 2560px) {
    .al-quote p {
        font-size: 35px!important;
    }

    .al-quote-citation > * {
        font-size: 23px!important;
    }
}

/* --- Párrafos (al-p) --- */

@media (min-width: 1600px) {
    .al-p p {
        font-size: 22px!important;
    }
}

@media (min-width: 2560px) {
    .al-p p {
        font-size: 27px!important;
    }
}

/* --- Layout dos columnas --- */

@media (min-width: 2560px) {
    .al-dos-col {
        min-height: 60vh;
    }

    .al-dos-col .col-img {
        background-size: cover;
    }
    
    .al-dos-col .col-txt {
        justify-content: center;
    }
}


/* ==========================================================================
   7. HEADER
   ========================================================================== */

/* --- Botones activos - cambiar ID si se construye alguna sección de cero en una página nueva --- */

body.page-id-14 .btn-menu.inicio a,
body.page-id-454 .btn-menu.nosotros a,
body.page-id-64 .btn-menu.contacto a {
    font-weight: 400!important;
    color: #E9E3D7!important;
}

/* --- Menú mobile --- */

.menu-movil {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    z-index: 9999;
}

.menu-movil.active {
    transform: translateX(0);
}

body.menu-movil-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
}

.mobile-menu-btn a {
    width: 100%!important;
}

/* --- botones más centrados y sin tanto espaciado en pantallas gigantes --- */
@media (min-width: 1920px) {
    header .desktop-bar .nav-tienda {
        margin-left: 10vw;
    }
    
    header .desktop-bar .nav-logo {
        margin-right: 10vw;
    }
}

/* ==========================================================================
   8. FOOTER
   ========================================================================== */

footer a {
    color: inherit;
}


/* ==========================================================================
   9. HOME
   ========================================================================== */

/* --- Slider principal --- */

.home-slider .swiper-slide-inner img {
    aspect-ratio: 2560/754;
    object-fit: cover;
    object-position: center;
}

.home-slider .swiper-wrapper {
    margin-bottom: -2px;
}

/* Paginación */
.home-slider .swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
    width: auto;
    background-color: rgba(255, 255, 255, 0.7);
    left: 50%;
    transform: translateX(-50%);
    padding: 15px 11px 15px 11px;
    border-radius: 2px;
    display: flex;
    bottom: 18px;
    gap: 2px;
}

.home-slider .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
}

/* Flechas de navegación */
.home-slider .elementor-swiper-button {
    background-color: rgba(255, 255, 255, 70%);
    height: 48px;
    width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
}

.home-slider .elementor-swiper-button svg {
    width: 16px!important;
}

.home-slider .elementor-swiper-button.elementor-swiper-button-prev {
    left: max(20px, calc(((100vw - 1310px) / 2) + 40px));
}

.home-slider .elementor-swiper-button.elementor-swiper-button-next {
    right: max(20px, calc(((100vw - 1310px) / 2) + 40px));
}

@media (max-width: 767px) {
    .home-slider .elementor-swiper-button.elementor-swiper-button-prev {
        left: 15px;
    }

    .home-slider .elementor-swiper-button.elementor-swiper-button-next {
        right: 15px;
    }

    .home-slider img.swiper-slide-image {
        aspect-ratio: 9/10;
        object-fit: cover;
    }

    .home-slider .swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
        padding: 8px 3px;
    }
}

@media (min-width: 1281px) {
    .home-slider .elementor-swiper-button.elementor-swiper-button-prev {
        left: 30px;
    }

    .home-slider .elementor-swiper-button.elementor-swiper-button-next {
        right: 30px;
    }
}

/* --- Vinos destacados (widget reutilizable) --- */

@media (min-width: 1600px) {
    .elementor-kit-9 h5 {
        font-size: 29px;
    }

    .vinos-destacados .item p {
        font-size: 22px;
    }

    .vinos-destacados .item .precio {
        font-size: 34px;
    }
}

@media (max-width: 1300px) {
    .vinos-destacados .item .precio {
        font-size: 25px;
    }
}

@media (max-width: 1100px) {
    .vinos-destacados .item .precio {
        font-size: 22px;
    }
    
    .vinos-destacados .btn-wgray10-outline a {
        font-size: 13px;
        padding: 15px 8px;
    }

    .vinos-destacados .item h5 {
        font-size: 20px;
    }
}

@media (max-width: 360px) {
    .vinos-destacados .btn-wgray10-outline a {
        font-size: 12px;
        text-align: center;
        padding: 10px;
    }

    .vinos-destacados .item p {
        font-size: 15px;
    }
}

/* --- Finca Kondor (logo/imagen) --- */

@media (min-width: 1600px) {
    .finca-kondor-h img {
        width: 233px;
        max-width: 233px;
    }
}

@media (min-width: 2560px) {
    .finca-kondor-h img {
        width: 450px;
        max-width: 450px;
    }
}

/* ==========================================================================
   10. NOSOTROS
   ========================================================================== */

/* --- Finca y Vino --- */

.al-text-1 h5 {
    margin: 45px 0 5px;
}

/* --- slider --- */

.home-slider.about,
.home-slider.about .elementor-image-carousel-wrapper,
.home-slider.about .elementor-image-carousel-wrapper .swiper-slide-inner,
.home-slider.about .elementor-image-carousel-wrapper .swiper-slide-image {
    height: 100%;
}

.home-slider.about .swiper-slide-inner img {
    aspect-ratio: 16/17;
}

.home-slider.about .swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 25px;
}

@media (min-width: 1920px) {
    .home-slider.about .swiper-slide-inner img {
        border-radius: 8px;
    }
}

/* ==========================================================================
   11. TIENDA (CORREGIDO - ALINEACIÓN DERECHA EN MÓVIL)
   ========================================================================== */

/* Shop Grid Styles */
.shop-grid-container {
    width: 100%;
    margin-bottom: 80px;
}

.shop-grid-header {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 30px;
}


.shop-grid-sort-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.shop-grid-sort-label {
    color: #686765;
    font-size: 14px;
    margin-bottom: 8px;
    line-height: 1.2; 
}


.select2-container {
    width: 250px !important;
}

.select2-container--default .select2-selection--single {
    border: none !important;
    border-bottom: 1px solid #686765 !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 10px 15px !important;
    height: auto !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #1c1c1c !important;
    font-size: 15px !important;
    padding: 0 !important;
    line-height: normal !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    right: 8px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #686765 transparent transparent transparent !important;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #686765 transparent !important;
}

.select2-dropdown {
    border: none !important;
    border-radius: 0 0 16px 16px !important;
    box-shadow: 0px 2px 6px 2px #00000026, 0px 1px 2px 0px #0000004D !important;
    padding: 16px 0 !important;
    
    margin-top: 10px !important; 
    transform: none !important; 
    z-index: 99999 !important;
}

.select2-results__option {
    padding: 8px 12px !important;
    color: #1c1c1c !important;
    font-size: 15px !important;
    background: transparent !important;
}

.select2-results__option--highlighted[aria-selected] {
    background: rgba(129, 115, 100, 0.2) !important;
    color: #1c1c1c !important;
}

.select2-results__option[aria-selected="true"] {
    background: rgba(129, 115, 100, 0.38) !important;
    color: #1c1c1c !important;
}

/* Grilla */
.shop-grid-products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 44px;
}

/* Items */
.producto {
    border: 1px solid #E5E7EB;
    box-shadow: 1px 1px 4px 0px #A6A39D80;
}

.producto .inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.producto .top {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top:10px;
    padding-bottom:10px;
}

.producto .top img {
    width: auto;
    height: 256px;
    object-fit: contain;
    display: block;
}

.producto .bottom {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.producto .txt {
    flex-grow: 1;
    padding: 20px;
    border-top: 1px solid #E9E3D7;
}

.producto .txt h5 {
    margin: 0 0 10px 0;
}

.producto .txt a {
    text-decoration: none;
    color: inherit;
}

.producto .txt p {
    margin: 0;
    color: #686765;
}

.producto .price-cart {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 0 20px 20px 20px;
}

.producto .precio {
    margin: 0;
    color: #A35B52;
    font-family: 'Crimson Text', serif;
    font-size: 30px;
}

/* Tablet */
@media (max-width: 1024px) {
    .shop-grid-products {
        grid-template-columns: repeat(3, 1fr);
        gap: 44px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .shop-grid-products {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    
    .shop-grid-header {
        margin-bottom: 20px;
        /* CAMBIO: Justificamos a la derecha en lugar de al centro */
        justify-content: flex-end !important; 
    }

    .shop-grid-sort-wrapper {
        width: 100%;
        /* CAMBIO: Alineamos los items internos (label y select) a la derecha */
        align-items: flex-end !important; 
    }
    
    .shop-grid-sort-label {
        font-size: 12px;
        margin-bottom: 2px !important;
        text-align: right; /* Asegura que el texto de la etiqueta también se alinee */
    }
    
    .select2-container {
        width: 200px !important;
    }
    
    .select2-container--default .select2-selection--single .select2-selection__rendered {
        font-size: 14px !important;
    }
    
    .select2-dropdown {
        border-radius: 0 0 8px 8px !important;
        padding: 8px 0 !important;
    }
    
    .select2-results__option {
        padding: 6px 10px !important;
        font-size: 14px !important;
    }
    
    .producto .txt p {
        display: none;
    }
    
    .producto .price-cart {
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }
    
    .producto .precio {
        font-size: 24px;
    }
}
/* ==========================================================================
   12. NOTIFICACIONES WOOCOMMERCE - DISEÑO MINIMALISTA ACTUALIZADO
   ========================================================================== */

/* Contenedor principal: Quitamos el ancho fijo para que sea flexible */
.woocommerce-notices-wrapper {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 99999;
    width: auto; /* Cambiado de 350px a auto */
    max-width: calc(100vw - 40px);
    pointer-events: none;
}

.woocommerce-notices-wrapper > * {
    pointer-events: auto;
}

/* Base de las notificaciones: Flexbox para alinear todo en una fila */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
    position: relative;
    padding: 12px 25px !important; /* Padding más ajustado */
    margin-bottom: 15px;
	margin-top: 75px;
    border-radius: 4px; /* Bordes ligeramente más suaves */
    font-size: 15px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    animation: slideInRight 0.4s ease-out;
    display: flex;
    flex-direction: row; /* Asegura que sea una sola fila */
    align-items: center;
    justify-content: flex-start;
    gap: 15px; /* Espacio entre el texto y el botón */
    border: none;
    min-width: fit-content;
}

/* Colores de fondo */
.woocommerce-message { background: #7A8A5A !important; color: #fff !important; }
.woocommerce-error   { background: #A35B52 !important; color: #fff !important; }
.woocommerce-info    { background: #C79C4A !important; color: #fff !important; }

/* Texto del mensaje: Quitamos el ícono por defecto */
.woocommerce-message::before, 
.woocommerce-error::before, 
.woocommerce-info::before {
    display: none !important;
}

/* Botón "VER CARRITO": Sin fondo y pegado al texto */
.woocommerce-message .button,
.woocommerce-message a.button {
    background: transparent !important;
    color: #fff !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 700 !important; /* Más negrita como en la imagen */
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
}

.woocommerce-message a.button:hover {
    text-decoration: underline !important;
}

/* Botón Cerrar (X): Lo posicionamos al final del flex */
.woocommerce-notice-close {
    position: relative !important; /* Cambiado de absolute a relative */
    top: auto !important;
    right: auto !important;
    order: 3; /* Asegura que la X sea lo último */
    background: transparent !important;
    border: none !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    cursor: pointer;
    padding: 0 0 0 10px !important;
    line-height: 1;
    opacity: 0.8;
}

.woocommerce-notice-close:hover {
    opacity: 1;
}

/* Animación */
@keyframes slideInRight {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

/* Ajustes Mobile */
@media (max-width: 768px) {
    .woocommerce-notices-wrapper {
        top: 10px;
        right: 10px;
        width: auto;
        max-width: calc(100vw - 20px);
    }
    
    .woocommerce-message, .woocommerce-error, .woocommerce-info {
        padding: 10px 15px !important;
        font-size: 13px;
        gap: 10px;
    }
}

/* Eliminar el borde negro/celeste de enfoque en todos los navegadores */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.woocommerce-message *,
.woocommerce-error *,
.woocommerce-info * {
    outline: none !important;
    box-shadow: none !important; /* En algunos casos iOS usa shadow para el foco */
    -webkit-tap-highlight-color: transparent; /* Elimina el destello azul al tocar en iOS */
}

/* Si quieres mantener la sombra de elevación original que pusimos pero sin el borde de foco */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15) !important;
}






/*AJUSTE VISUAL VINOS DESTACADOS*/
.vinos-destacados a.added_to_cart.wc-forward {
    display: none !important;
}

/*TIENDA AJUSTE HERO*/

@media (max-width:768px) {

.elementor-634 .elementor-element.elementor-element-dba69dd:not(.elementor-motion-effects-element-type-background), .elementor-634 .elementor-element.elementor-element-dba69dd > .elementor-motion-effects-container > .elementor-motion-effects-layer {
	margin-top:70px!important;
}}


/*OCULTAR TEMPORALMENTE EL MENSAJE DE ELIMINAR PRODUCTO*/

.woocommerce-cart .woocommerce-message {
    display: none !important;
}

/*ajuste HERO tienda*/
.elementor-634 .elementor-element.elementor-element-dba69dd {
	--min-height: 25vw!important;
}

@media (max-width:768px){
	.elementor-634 .elementor-element.elementor-element-dba69dd {
	--min-height: 60vw!important;
}

/*AJUSTE HERO MOBILE TAMAÑO*/
@media (max-width:768px){
    .hero-logo {width:280px!important;}
}

/*AJUSTE CARDS EN MOBILE*/
@media (max-width: 1024px) {
	.vinos-destacados .grilla-items {
		padding-bottom:10px!important;
		padding-left: 10px !important;
        padding-top: 10px !important;
	}
	
/*Nuestros vinos Mobile*/
	@media (max-width:768px){
	.elementor-634 .elementor-element.elementor-element-5e75cff img {
    width: 100%;
    max-width: 144px!important;
		}
		.elementor-634 .elementor-element.elementor-element-5e75cff {padding: 40px 0px 40px 0px!important;}
	}
	
	
	
@media (max-width: 768px) {
    .shop-grid-products .producto .btn-wgray10-outline {
        text-align: center !important;
        display: block !important; /* Asegura que el contenedor ocupe el ancho disponible */
    }

    .shop-grid-products .producto .btn-wgray10-outline a {
        display: inline-block !important; /* Permite que el texto se centre respecto al contenedor */
        width: 100%; /* Si quieres que el botón ocupe todo el ancho del cuadro */
    }
}

	@media (max-width: 768px){
		.shop-grid-sort-label {font-size: 16px;}
		
	}
	
/*Ajuste distancias texto tienda mobile*/	
	
	@media (max-width: 768px) {

    .producto .txt {
        text-align: center !important;
				margin-bottom: 0px !important; 
				padding-bottom:0px!important;
    }

    .producto .price-cart {
        display: flex !important;
        flex-direction: column !important; 
        align-items: center !important;
        gap: 25px !important;           
    }
    .producto .precio {
        margin: 0 !important;
        line-height: 1 !important;
    }
}
	
	        @media (max-width: 768px) {
            .shop-grid-products .producto .btn-wgray10-outline a {
                padding-left: 5px !important;
                padding-right: 5px !important;
            }

				
/*AJUSTE TOAST SEPARADO DEL HEADER*/
				
				@media (max-width: 768px) {
    .woocommerce-message, .woocommerce-error, .woocommerce-info {
        margin-top: 75px;
    }
}

/*----------------------------NUEVOS AJUSTES VERSION 1.1-----------------------*/
				
				.hero-logo {display:none!important}
				
/* Localiza y reemplaza la regla .shop-grid-header con esta */
.shop-grid-header {
    display: flex !important;
    justify-content: space-between !important; /* Esto separa los elementos a los extremos */
    align-items: flex-end !important; /* Alinea el texto a la base del selector */
    margin-bottom: 30px;
    width: 100% !important;
}

/* Asegura que el título no tenga márgenes que lo empujen */
.titulo-tienda-izq {
    font-family: 'Crimson Text', serif !important;
    font-weight: 600 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #1c1c1c !important;
    line-height: 1 !important;
    /* En PC tamaño 28px */
    font-size: 28px !important;
}

/* Ajuste para móviles (según la referencia 4 de Figma) */
@media (max-width: 768px) {
    .shop-grid-header {
        flex-direction: column !important;
        align-items: flex-start !important; /* Alinea a la izquierda en móvil */
        gap: 20px !important; /* Espacio vertical entre título y select */
    }

    .titulo-tienda-izq {
        /* En móvil tamaño 50px */
        font-size: 50px !important;
    }
}
				
				.shop-grid-header {
    display: flex;
    justify-content: space-between!important;
    margin-bottom: 30px;
}