/* ================================
   WooCommerce Blocks Uniform Styles
   ================================ */

/* Contenedor de productos (tienda y bloques) */
ul.products,
.wc-block-product-template,
.wc-block-grid__products {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Cada producto */
ul.products li.product,
.wc-block-product {
    text-align: center;
    border: 1px solid #d9d9d9;
    padding: 8px;
    border-radius: 5px;
    transition: all 0.3s ease;
    background: #fff;
}

/* ================================
   Imagen de producto
   ================================ */
.woocommerce ul.products li.product a img,
.wc-block-grid__product-image img {
    width: 100%;
    height: auto;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    display: block;
    margin: 0 0 1em;
    box-shadow: none;
}

/* ================================
   Título de producto
   ================================ */
ul.products li.product .woocommerce-loop-product__title,
.wc-block-product h2.wp-block-post-title a {
    font-size: 1em !important;
    font-weight: 200;
    font-family: 'Open Sans Condensed', "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.2;
    margin: 0.5em 0;
    text-align: center;
    color: #333;
    text-decoration: none;
}

ul.products li.product .woocommerce-loop-product__title:hover,
.wc-block-product h2.wp-block-post-title a:hover {
    color: #720eec;
}

/* ================================
   Precio de producto
   ================================ */
ul.products li.product .price,
ul.products li.product .woocommerce-Price-amount,
.wc-block-grid__product-price {
    font-size: 1em !important;
    font-weight: 200;
    font-family: 'Open Sans Condensed', "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.2;
    margin: 0.5em 0;
    text-align: center;
    color: #333;
}

/* ================================
   Botones (añadir al carrito / leer más)
   ================================ */
ul.products li.product a.button,
ul.products li.product a.button.add_to_cart_button,
.wc-block-components-product-button__button,
.wc-block-product .wp-block-button__link {
    box-shadow: none;
    transition: all 0.3s ease-in-out;
    border: 1px solid #d9d9d9 !important;
    border-radius: 3px;
    padding: 10px 20px;
    color: #181717;
    background-color: transparent;
    font-weight: 200;
    font-family: 'Open Sans Condensed', "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    text-align: center;
}

ul.products li.product a.button:hover,
ul.products li.product a.button:focus,
.wc-block-components-product-button__button:hover,
.wc-block-product .wp-block-button__link:hover {
    background-color: #5a0bbd;
    border-color: #5a0bbd;
    color: #fff;
    transform: scale(1.05);
}
/* ================================
   Modificaciones al Carrito
   ================================ */

/* Ocultar la raya y la letra O del separador de PayPal */
.paypal-buttons-separator,
.wc-block-components-separator {
    display: none !important;
}

.wc-block-components-express-payment-continue-rule,
.wc-block-components-express-payment-continue-rule--cart {
    display: none !important;
}

/* 1. Contenedor principal: lo convertimos en columna flexible */
li.wc-block-product {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    height: 100% !important;
}

/* 2. Título: Forzamos altura fija para 2 líneas y puntos suspensivos */
li.wc-block-product h2.wp-block-post-title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    /* Ajustamos altura según el line-height 1.4 del HTML */
    min-height: 2.8em !important; 
    max-height: 2.8em !important;
    margin-bottom: 1rem !important;
    line-height: 1.4 !important;
}

/* 3. Empujar Precio y Botón hacia abajo */
/* Seleccionamos el bloque de precio para que empiece a empujar */
li.wc-block-product .wp-block-woocommerce-product-price {
    margin-top: auto !important;
    margin-bottom: 0.5rem !important;
}

/* 4. El contenedor del botón */
li.wc-block-product .wp-block-woocommerce-product-button {
    margin-top: 0 !important;
    width: 100% !important;
}

/* 5. Estilo del botón para que ocupe todo el ancho */
li.wc-block-product .wp-block-button__link {
    width: 100% !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* 1. Preparar el título para la transición */
li.wc-block-product h2.wp-block-post-title {
    transition: all 0.3s ease;
    z-index: 1;
    position: relative;
}

/* 2. Efecto al pasar el ratón (Hover) */
li.wc-block-product:hover h2.wp-block-post-title {
    -webkit-line-clamp: unset !important; /* Elimina el límite de 2 líneas */
    max-height: none !important; /* Permite que crezca */
    background: rgba(255, 255, 255, 0.9); /* Fondo ligero por si se solapa */
    z-index: 10;
}

/* OPCIONAL: Si prefieres que aparezca un "Tooltip" nativo del navegador */
/* Esto muestra el título completo en una cajita negra al dejar el mouse quieto */
li.wc-block-product h2.wp-block-post-title a {
    display: block;
}




/* Bloqueo de imágenes extra de galería en BgfTech */
.wc-block-grid__product-image img:nth-of-type(n+2),
.woocommerce ul.products li.product a img:nth-of-type(n+2) {
    display: none !important;
}

/* Limitar tamaño de imágenes en bloques de BgfTech */
.wc-block-grid__products .wc-block-grid__product-image,
.wc-block-grid__product-image a,
.wp-block-woocommerce-product-image {
    display: block !important;
    max-width: 100% !important;
    height: 300px !important; /* Forzamos la altura de la miniatura */
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: hidden !important;
}

.wc-block-grid__products .wc-block-grid__product-image img,
.wp-block-woocommerce-product-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important; /* Mantiene la proporción sin estirar */
    object-position: center !important;
}

/* Forzar el quiebre de línea en títulos de BgfTech */
ul.products li.product .woocommerce-loop-product__title,
.wc-block-product h2.wp-block-post-title,
.wc-block-grid__product-title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important; /* Máximo 2 líneas */
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    white-space: normal !important; /* Permite el salto de línea */
    word-wrap: break-word !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    min-height: 2.8em !important; /* Altura para 2 líneas */
    line-height: 1.4em !important;
}

/* Redimensionar el contenedor de la imagen al ancho de la columna */
ul.products li.product, 
.wc-block-grid__product,
.wc-block-product {
    max-width: 250px !important; /* Ajusta este valor según cuántas columnas quieras */
    flex: 1 1 250px !important;
    box-sizing: border-box !important;
}

/* Forzar comportamiento de fila única en bloques de BgfTech */
.wc-block-product-template, 
.wc-block-grid__products,
.wp-block-woocommerce-product-collection ul {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important; /* Prohíbe saltar de línea */
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    gap: 20px !important;
    -webkit-overflow-scrolling: touch !important; /* Suavidad en iPhone */
    scrollbar-width: thin !important; /* Muestra una barra pequeña */
}

/* Forzar que cada producto no se encoja ni se estire */
.wc-block-product-template li,
.wc-block-grid__product,
.wp-block-woocommerce-product-collection li {
    flex: 0 0 280px !important; /* Ancho fijo de cada tarjeta */
    width: 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
    scroll-snap-align: start !important;
    list-style: none !important;
    display: block !important;
}

/* Opcional: Estilo de la barra de scroll para que no se vea fea */
.wc-block-product-template::-webkit-scrollbar {
    height: 6px;
}
.wc-block-product-template::-webkit-scrollbar-thumb {
    background: #720eec; /* El morado de tu marca */
    border-radius: 10px;
}


/* Ocultar barra de desplazamiento en todos los navegadores */
.wc-block-product-template, 
.wc-block-grid__products,
.wp-block-woocommerce-product-collection ul {
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important;  /* IE/Edge */
}

.wc-block-product-template::-webkit-scrollbar,
.wp-block-woocommerce-product-collection ul::-webkit-scrollbar {
    display: none !important; /* Chrome/Safari */
}

/* Contenedor relativo para posicionar las flechas */
.wp-block-woocommerce-product-collection, 
.wc-block-grid {
    position: relative;
    padding: 0 40px; /* Espacio para que las flechas no tapen el producto */
}



/*ddffffffffffffffffffffffffffffffffffffffffffffffffffffffffff




/* 1. Ajuste del contenedor general para 5 productos */
/* Reducimos el max-width que tenías en 250px a uno que permita 5 en fila */
ul.products li.product, 
.wc-block-grid__product,
.wc-block-product {
    max-width: 220px !important; 
    flex: 0 0 220px !important;
    box-sizing: border-box !important;
}

/* 2. Forzar que cada tarjeta mantenga el tamaño para los 5 productos */
/* Cambiamos el 280px que tenías por 220px */
.wc-block-product-template li,
.wc-block-grid__product,
.wp-block-woocommerce-product-collection li {
    flex: 0 0 220px !important; /* Ancho fijo para que quepan 5 */
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    scroll-snap-align: start !important;
    list-style: none !important;
    display: block !important;
}

/* 3. Ajuste de la imagen para que llene el nuevo ancho de 220px */
/* Reducimos la altura de 300px a 220px para que sea proporcional al nuevo ancho */
.wc-block-grid__products .wc-block-grid__product-image,
.wc-block-grid__product-image a,
.wp-block-woocommerce-product-image {
    display: block !important;
    max-width: 100% !important;
    height: 220px !important; 
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: hidden !important;
}






/* 1. FIJAR EL TÍTULO: Evita que el contenedor crezca */
ul.products li.product .woocommerce-loop-product__title,
.wc-block-product h2.wp-block-post-title,
.wc-block-grid__product-title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important; /* Mantiene 2 líneas máximo */
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    height: 2.8em !important; /* Altura fija obligatoria */
    max-height: 2.8em !important;
    transition: none !important; /* Eliminamos cualquier animación previa */
    position: relative;
    cursor: help; /* Indica al usuario que hay información al pasar el mouse */
}

/* 2. ELIMINAR EFECTO HOVER ANTERIOR: Aseguramos que no se expanda */
li.wc-block-product:hover h2.wp-block-post-title {
    -webkit-line-clamp: 2 !important;
    max-height: 2.8em !important;
}

/* 3. EL TOOLTIP (Aviso flotante) */
/* Usamos el atributo 'data-title' que llenaremos con JS */
[data-title]:hover::after {
    content: attr(data-title);
    position: absolute;
    bottom: 120%; /* Aparece justo arriba del título */
    right: 0;
    background: rgba(24, 23, 23, 0.95); /* Color oscuro elegante */
    color: #fff;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 1.2;
    border-radius: 4px;
    white-space: normal;
    width: 200px; /* Ancho del globo de texto */
    z-index: 999;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    pointer-events: none; /* Evita que el tooltip interfiera con clics */
    text-align: left;
    font-weight: normal;
}

/* Pequeña flecha del tooltip */
[data-title]:hover::before {
    content: '';
    position: absolute;
    bottom: 105%;
    right: 15px;
    border: 6px solid transparent;
    border-top-color: rgba(24, 23, 23, 0.95);
    z-index: 999;
}





/* Bloquear el crecimiento del contenedor en BgfTech */
.wc-block-grid__product-title, 
.wp-block-woocommerce-product-title, 
.woocommerce-loop-product__title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    height: 2.8em !important;
    position: relative !important;
}

/* El cuadro negro del Tooltip */
[data-title]::after {
    content: attr(data-title) !important;
    position: absolute !important;
    bottom: 120% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: rgba(24, 23, 23, 0.98) !important;
    color: #fff !important;
    padding: 8px 12px !important;
    font-size: 12px !important;
    border-radius: 4px !important;
    width: 200px !important;
    z-index: 9999999 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.2s ease-in-out !important;
    pointer-events: none !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.4) !important;
    text-align: center !important;
    line-height: 1.3 !important;
}

/* Mostrar el Tooltip al hacer hover */
[data-title]:hover::after {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Evitar que el carrusel corte el tooltip */
.wc-block-grid__products, 
.wc-block-grid__product, 
.wc-block-product-template li {
    overflow: visible !important;
}
















/* Contenedor principal de relacionados en Bgf Inversiones C.A. */
.related.products ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important; /* Rejilla responsiva */
    gap: 20px !important;
    padding: 20px 0 !important;
    list-style: none !important;
}

/* Tarjeta individual (el elemento <li> que pasaste) */
.related.products li.product {
    width: 100% !important; 
    float: none !important; /* Eliminamos el float que causa desorden */
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    border: 1px solid #f2f2f2 !important;
    padding: 15px !important;
    border-radius: 8px !important;
    background: #fff !important;
    transition: box-shadow 0.3s ease !important;
}

.related.products li.product:hover {
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
}

/* Forzar la fila de productos en BgfTech */
.related.products ul.products {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important; /* Evita que se bajen */
    overflow-x: auto !important; /* Permite scroll si no caben */
    gap: 15px !important;
    padding: 20px 5px !important;
    margin: 0 !important;
    list-style: none !important;
}

/* Ajuste de la Tarjeta para que no colapse */
.related.products li.product {
    flex: 0 0 calc(20% - 15px) !important; /* 5 productos exactos por fila */
    min-width: 180px !important;
    display: flex !important;
    flex-direction: column !important;
    background: #fff !important;
    border: 1px solid #eee !important;
    padding: 10px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    position: relative !important;
}

/* En tablets y móviles, mostrar 2 o 3 */
@media (max-width: 900px) {
    .related.products ul.products { flex-wrap: wrap !important; }
    .related.products li.product { flex: 0 0 calc(50% - 15px) !important; }
}

/* Limpiar el contenedor del producto */
.related.products li.product {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    height: 100% !important;
    position: relative !important;
    overflow: visible !important; /* Para que el tooltip se vea */
}

/* Resetear el enlace que envuelve Imagen, Título y Precio */
.related.products li.product .woocommerce-loop-product__link {
    display: block !important; /* Cambiamos a block para controlar el flujo */
    position: relative !important;
    margin-bottom: 10px !important;
}

/* Forzar el Título a ser un bloque independiente con altura mínima */
.related.products li.product .woocommerce-loop-product__title {
    display: block !important;
    margin: 10px 0 !important;
    padding: 0 !important;
    height: 3em !important; /* Espacio fijo para 2 líneas */
    line-height: 1.5em !important;
    position: relative !important;
    top: 0 !important;
    clear: both !important;
}

/* Forzar el Precio a estar debajo del título, SIEMPRE */
.related.products li.product .price {
    display: block !important;
    position: relative !important;
    top: 0 !important; /* Anula cualquier intento de subirlo */
    margin-top: 15px !important; /* Espacio extra de seguridad */
    margin-bottom: 15px !important;
    clear: both !important;
    z-index: 1 !important;
    line-height: 1 !important;
}

/* El botón de añadir al carrito al fondo */
.related.products li.product .add_to_cart_button {
    display: block !important;
    margin-top: auto !important; /* Lo empuja al final de la tarjeta */
    position: relative !important;
    bottom: 0 !important;
}


/* Contenedor Principal de Precio en Bs - BgfTech */
.bgf-price-container {
    background: #ffffff;
    border: 1px solid #e1e8ed;
    border-left: 5px solid #004481; /* Azul institucional */
    padding: 20px;
    border-radius: 12px;
    margin: 20px 0;
    box-shadow: 0 4px 12px rgba(0, 68, 129, 0.05);
    transition: transform 0.3s ease;
}

.bgf-price-container:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0, 68, 129, 0.1);
}

/* Etiqueta superior */
.bgf-bs-badge {
    background: #004481;
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
    padding: 3px 10px;
    border-radius: 50px;
    display: inline-block;
    margin-bottom: 10px;
    letter-spacing: 1px;
}

/* Fila del precio principal */
.bgf-bs-price-row {
    display: flex;
    align-items: baseline;
    gap: 5px;
    color: #1a1a1a;
}

.bgf-currency-symbol {
    font-size: 1.2em;
    font-weight: 400;
    color: #666;
}

.bgf-main-value {
    font-size: 2.4em;
    font-weight: 800;
    line-height: 1;
    color: #004481;
    letter-spacing: -1px;
}

/* Información de la tasa */
.bgf-rate-info {
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px dashed #e1e8ed;
    font-size: 12px;
    color: #888;
    display: flex;
    align-items: center;
    gap: 5px;
}

.bgf-rate-info strong {
    color: #333;
}

/* Ajuste del título del producto (opcional, para coherencia) */
.product_title {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #1a1a1a;
    margin-bottom: 15px !important;
}

/* 1. AJUSTE DE COLUMNAS (Imagen 60% - Contenido 40%) */
@media (min-width: 768px) {
    /* Contenedor de la Imagen (Izquierda) */
    .single-product div.product div.images {
        width: 60% !important;
        max-width: 60% !important;
        margin-right: 4% !important;
    }

    /* Contenedor del Resumen/Precio (Derecha) */
    .single-product div.product div.summary {
        width: 36% !important; /* El 40% restante menos un margen */
        max-width: 36% !important;
    }
}

/* 2. ESTILO DEL MARCO AZUL CLARO */
.bgf-price-card-minimal {
    border: 1px solid rgba(0, 68, 129, 0.15); /* Azul claro apenas visible */
    background: #ffffff;
    padding: 15px;
    border-radius: 10px;
    margin: 15px 0;
    max-width: 100%;
}

/* 3. DETALLES DE TEXTO */
.bgf-rate-footer {
    font-size: 10px;
    color: #bbb;
    margin-top: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Ajuste adicional para los botones Payhip */
.payhip-buttons {
    margin-top: 15px;
}







@media (min-width: 768px) {
    /* 1. Contenedor Raíz */
    .woocommerce-product-gallery {
        display: flex !important;
        flex-direction: row-reverse !important;
        gap: 20px !important;
        overflow: visible !important;
    }

    /* 2. El Visor (Marco azul claro) */
    .flex-viewport {
        width: 100% !important;
        height: 450px !important; /* Altura fija para evitar saltos de tamaño */
        border: 1px solid rgba(0, 68, 129, 0.15) !important;
        border-radius: 12px;
        background: #ffffff;
        padding: 40px !important; /* Reducción de la imagen al 60% aprox */
        box-sizing: border-box !important;
    }

    /* 3. El Wrapper (Anulamos el ancho infinito del slider) */
    .woocommerce-product-gallery__wrapper {
        width: 100% !important;
        height: 100% !important;
        transform: none !important; /* BLOQUEAMOS EL MOVIMIENTO LATERAL */
        display: block !important;
        position: relative !important;
    }

    /* 4. Las Imágenes (Las apilamos todas en el mismo sitio) */
    .woocommerce-product-gallery__image {
        position: absolute !important;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        /* opacity: 0; /* Ocultas todas */ */
        visibility: hidden;
        transition: opacity 0.3s ease-in-out;
        z-index: 1;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    /* 5. LA MAGIA: Solo mostramos la que el JS marca como activa */
    .woocommerce-product-gallery__image.flex-active-slide {
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 2 !important;
        position: relative !important; /* Para que mantenga el espacio */
    }

    .woocommerce-product-gallery__image img {
        max-width: 100% !important;
        max-height: 100% !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important; /* Ajuste sin recorte */
    }

    /* 6. Miniaturas a la izquierda */
    .flex-control-nav.flex-control-thumbs {
        width: 85px !important;
        min-width: 85px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        padding: 0 !important;
        margin: 0 !important;
    }
}

@media (min-width: 768px) {
    /* 1. Aseguramos que la columna use todo su ancho disponible */
    .flex-control-nav.flex-control-thumbs {
        width: 85px !important; 
        min-width: 85px !important;
        padding: 0 !important; /* Eliminamos rellenos laterales */
    }

    /* 2. Hacemos que cada item de la lista use el 100% del ancho */
    .flex-control-nav.flex-control-thumbs li {
        width: 100% !important;
        margin-bottom: 8px !important; /* Espacio sutil entre ellas */
    }

    /* 3. La imagen de la miniatura */
    .flex-control-nav.flex-control-thumbs img {
        width: 100% !important;  /* Obliga a la imagen a llenar los 85px */
        height: 85px !important; /* La hacemos cuadrada para consistencia ML */
        object-fit: cover !important; /* Llena el cuadro sin deformarse */
        border: 1px solid #ddd;
        border-radius: 4px;
        opacity: 1 !important; /* Que se vean claras desde el inicio */
        transition: all 0.2s ease;
    }

    /* 4. Efecto de resaltado para la miniatura activa */
    .flex-control-nav.flex-control-thumbs img.flex-active {
        border: 2px solid #004481 !important; /* Azul BgfTech */
        box-shadow: 0 0 5px rgba(0, 68, 129, 0.2);
    }
}

/* --- COMPACTACIÓN EXTREMA COLUMNA DERECHA BGFTECH --- */

@media (min-width: 768px) {
    /* 1. Contenedor General del Summary */
    .single-product div.product div.summary {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    /* 2. Encabezado (Nuevo | +50 vendidos) */
    .bgf-ml-header {
        margin-bottom: 5px !important; /* Reducido al mínimo */
    }

    .bgf-condition {
        margin-bottom: 2px !important;
        line-height: 1 !important;
    }

    /* 3. Título del Producto */
    .bgf-title {
        line-height: 1.1 !important; /* Interlineado muy apretado */
        margin-bottom: 10px !important;
        padding-bottom: 0 !important;
    }

    /* 4. Caja de Precios (Marco Azul Claro) */
    .bgf-price-card-minimal {
        margin-top: 0 !important; /* Pegado al título */
        margin-bottom: 10px !important;
        padding: 10px 15px !important; /* Reducimos aire interno de la tarjeta */
    }

    .bgf-usd-value {
        line-height: 1 !important;
        margin-bottom: 0 !important;
    }

    .bgf-ves-value {
        line-height: 1.2 !important;
        margin-top: 2px !important;
    }

    .bgf-rate-footer {
        margin-top: 5px !important; /* Tasa pegada al precio */
    }

    /* 5. Bloque de Botones */
    .payhip-buttons {
        margin-top: 10px !important;
        gap: 8px !important; /* Espacio entre botones comprar y carrito */
    }

    .payhip-buttons a {
        padding: 12px !important; /* Botones un poco menos altos */
    }

    /* 6. Footer Digital (🚀 Entrega automática) */
    .bgf-footer-summary-digital {
        margin-top: 8px !important;
        font-size: 11px !important;
    }
}


/* --- ALINEACIÓN HORIZONTAL EXTREMA BGFTECH --- */

.bgf-price-card-minimal {
    border: 1px solid rgba(0, 68, 129, 0.15);
    padding: 8px 12px !important; /* Más compacto */
    border-radius: 8px;
    margin: 5px 0 10px 0 !important;
}

.bgf-main-price-row {
    display: flex !important;
    justify-content: space-between !important; /* PRECIOS IZQ <---> TASA DER */
    align-items: center !important; /* Centrado vertical entre elementos */
    width: 100%;
}

/* Agrupación de precios a la izquierda */
.bgf-price-group {
    display: flex;
    align-items: baseline;
    gap: 10px; /* Espacio entre $ y Bs */
}

.bgf-usd-value {
    font-size: 24px !important; /* Reducido un poco para asegurar que quepa todo */
    font-weight: 700 !important;
    color: #333;
    line-height: 1 !important;
}

.bgf-ves-value {
    font-size: 16px !important;
    color: #000 !important;
    font-weight: 500;
    line-height: 1 !important;
}

/* Tasa alineada a la derecha */
.bgf-rate-tag {
    font-size: 13px !important;
    color: #777;
    white-space: nowrap; /* Evita que la tasa se rompa en dos líneas */
    text-align: right;
}

.bgf-rate-tag strong {
    color: #004481; /* Azul Bgf Inversiones C.A. */
    font-weight: 600;
}

/* Ajuste para pantallas pequeñas */
@media (max-width: 480px) {
    .bgf-main-price-row {
        flex-direction: column;
        align-items: flex-start !important;
    }
    .bgf-rate-tag {
        text-align: left;
        margin-top: 5px;
    }
}

/* Bloqueo total de botones de pago rápido para Bgf Inversiones C.A. */
/* div[id*="ppc-button"],  */
/* div[class*="paypal-button"], */
/* .wc-ppcp-product-payment-container, */
/* #ppc-button-product, */
/* .paypal-buttons-tool-tip { */
    /* display: none !important; */
    /* visibility: hidden !important; */
    /* height: 0 !important; */
    /* overflow: hidden !important; */
    /* opacity: 0 !important; */
    /* margin: 0 !important; */
    /* padding: 0 !important; */
/* } */



/* UNIFICACIÓN DE BLOQUES BGFTECH CON TEMA ENVO */

/* 1. Ajuste del contenedor del producto */
.wc-block-grid__product {
    padding: 15px !important;
    border-radius: 12px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    text-align: center !important;
}

.wc-block-grid__product:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

/* 2. Ajuste de Títulos */
.wc-block-grid__product-title {
    font-size: 20px !important;
    font-weight: 400 !important;
    color: #333 !important;
    margin: 10px 0 !important;
    line-height: 1.3 !important;
    min-height: 42px; /* Alineación de títulos */
}

/* 3. Estandarización de BOTONES (Añadir al carrito) */
.wc-block-grid__product-add-to-cart .wp-block-button__link {
    background-color: #004481 !important; /* El azul de Bgf Inversiones C.A. */
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 10px 20px !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    transition: 0.3s !important;
    display: block !important;
    width: 100% !important;
    cursor: pointer !important;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
    background-color: #002d56 !important;
    transform: scale(1.02);
}

/* 4. Estilo para los precios duales y GRATIS en bloques */
.wc-block-grid__product-price.price {
    margin-bottom: 15px !important;
    display: block !important;
}

.precio-gratis {
    color: #188a33 !important;
    font-weight: bold !important;
}


/* CONTENEDOR PRINCIPAL DEL PRODUCTO */
.wc-block-grid__product {
    border: 1px solid #e0e0e0 !important; /* Marco gris */
    padding: 5px !important;            /* Padding interno del contenedor */
    border-radius: 12px !important;
    background-color: #ffffff !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

/* EFECTO HOVER EN LA TARJETA */
.wc-block-grid__product:hover {
    border-color: #004481 !important; /* El azul de BgfTech al pasar el mouse */
    box-shadow: 0 8px 20px rgba(0,0,0,0.05) !important;
}

/* IMAGEN CON PADDING RESPECTO AL MARCO */
.wc-block-grid__product-image {
    padding: 5px !important;
    margin-bottom: 15px !important;
}

.wc-block-grid__product-image img {
    border-radius: 8px !important;
}

/* BOTÓN PERSONALIZADO (Estilo inicial: Minimalista) */
.wc-block-grid__product-add-to-cart .wp-block-button__link {
    background-color: transparent !important; /* Sin color de fondo */
    color: #333333 !important;                 /* Texto negro */
    border: 1px solid #cccccc !important;      /* Borde gris */
    border-radius: 6px !important;
    padding: 12px 15px !important;
    font-weight: 300 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
    display: block !important;
    text-align: center !important;
}

/* BOTÓN HOVER (Cambio a Azul Corporativo) */
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
    background-color: #004481 !important;      /* Fondo azul al puntero */
    color: #ffffff !important;                 /* Texto blanco al puntero */
    border-color: #004481 !important;
    transform: translateY(-2px) !important;
}

/* AJUSTE PRECIO DUAL */
/* .wc-block-grid__product-price { */
    /* margin-top: auto !important; */
    /* margin-bottom: 15px !important; */
    /* font-size: 1.3em !important; */
/* } */

/* CONTENEDOR DE IMAGEN - Llenado total */
.wc-block-grid__product-image {
    padding: 0 !important; /* Imagen toca los bordes laterales y superior */
    margin-bottom: 0 !important;
}

.wc-block-grid__product-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 12px 12px 0 0 !important; /* Solo redondeo superior */
    object-fit: cover !important;
}

/* CORRECCIÓN PARA LA TIENDA - BgfTech */
.woocommerce-loop-product__link {
    display: flex !important;
    flex-direction: column !important;
}

.woocommerce-loop-product__title {
    margin-bottom: 10px !important;
    line-height: 1.4 !important;
    display: block !important;
    min-height: 2.8em; /* Asegura espacio para 2 líneas de título sin mover el precio */
}

/* .price { */
    /* display: block !important; */
    /* margin-top: auto !important; /* Empuja el precio al fondo del bloque */ */
    /* line-height: 1.2 !important; */
/* } */

/* Ajuste específico para el Dual en la Tienda */
/* .woocommerce-loop-product__link .precio-bs-dual { */
    /* display: block !important; */
    /* margin-top: 5px !important; */
    /* padding-bottom: 10px !important; */
    /* position: relative !important; /* Evita que flote sobre el título */ */


/* } */

/* LIBERAR CONTENEDOR DE TÍTULO EN TIENDA - Bgf Inversiones C.A. */

/* 1. Eliminar cualquier altura fija que esté cortando el texto */
.woocommerce-loop-product__title {
    height: auto !important;          /* Permite que crezca */
    min-height: 3em !important;      /* Asegura espacio para al menos 2 líneas */
    max-height: none !important;     /* Evita que se bloquee el crecimiento */
    overflow: visible !important;    /* Muestra el texto que se salía */
    margin-bottom: 15px !important;  /* Separa el título del precio */
    display: block !important;
    line-height: 1.3 !important;     /* Interlineado cómodo */
}

/* 2. Asegurar que el contenedor del producto en la cuadrícula sea flexible */
ul.products li.product {
    display: flex !important;
    flex-direction: column !important;
}

/* 3. Ajustar el bloque de precio para que no se pegue al título liberado */
/* ul.products li.product .price { */
    /* margin-top: auto !important;    /* Empuja el precio hacia abajo si el título es corto */ */
    /* display: block !important; */
    /* padding-top: 5px !important; */
/* } */


/* AJUSTE DE TÍTULOS EN GRID - Bgf Inversiones C.A. */

.woocommerce-loop-product__title {
    /* Reseteamos los márgenes lógicos del navegador */
    margin-block-start: 0px !important;
    margin-block-end: 20px !important; /* Mantenemos los 15px pero de forma controlada */
    
    /* Forzamos que el contenedor crezca */
    display: block !important;
    height: auto !important;
    min-height: 2.5em !important; /* Espacio para que siempre quepan 2 líneas */
    
    /* Tipografía */
    font-size: 1.1em !important; /* Un poco más pequeño para que quepa más texto */
    line-height: 1.2 !important;
    font-weight: 700 !important;
}

/* Evitamos que el precio dual suba y se monte */
/* .woocommerce-loop-product__link .price { */
    /* display: block !important; */
    /* margin-top: 10px !important; */
    /* clear: both !important; */
/* } */


/* PRECIO DUAL EN UNA SOLA LÍNEA - Bgf Inversiones C.A. */

/* Forzamos al contenedor del precio a comportarse como una sola línea */
body.woocommerce ul.products li.product .price,
.woocommerce div.product p.price {
    display: flex !important;
    align-items: center !important; /* Centra verticalmente ambos precios */
    flex-wrap: nowrap !important; /* Evita que salten a la segunda línea */
    gap: 8px !important; /* Espacio entre el $ y el Bs */
    justify-content: center !important; /* Los centra en la tarjeta de producto */
}

/* Estilo para el precio en Dólares (Negrita resaltada) */
body.woocommerce ul.products li.product .price strong .woocommerce-Price-amount,
body.woocommerce ul.products li.product .price > .amount {
    font-weight: 800 !important; /* Negrita extra para BgfTech */
    color: #000000 !important;   /* Negro sólido para resaltar */
    font-size: 1.1em !important;
}

/* Estilo para el precio en Bolívares (Misma línea, más suave) */
.precio-bs-dual {
    display: inline-block !important; /* Cambiamos de block a inline */
    font-size: 0.9em !important;
    font-weight: 500 !important;
    color: #666 !important;
    white-space: nowrap !important; /* Asegura que (3.445,07 Bs) no se rompa */
}