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

/* Aquí puedes añadir tu propio CSS 
 para sobrescribir los estilos del tema padre.
*/

/* ======================================================= */
/* Estilos para el GRID de Características (Simulando Imagen 2) */
/* ======================================================= */

/* Contenedor Principal y Fondo Oscuro */
.caracteristicas-vino-pampas-grid {
    background-color: #000000; /* Fondo negro como en la imagen 2 */
    color: #ffffff; /* Texto blanco */
    padding: 30px 20px;
    margin-top: 30px;
    border-radius: 5px;
}

/* Lista principal con Flexbox para alinear horizontalmente */
.caracteristicas-vino-pampas-grid .caracteristicas-lista {
    display: flex; /* Habilita el diseño horizontal */
    flex-wrap: wrap; /* Permite que los ítems salten de línea si la pantalla es pequeña */
    justify-content: space-around; /* Distribuye los ítems uniformemente */
    list-style: none; /* Elimina los puntos de la lista */
    padding: 0;
    margin: 0;
}

/* Estilo para cada Ítem de Característica */
.caracteristicas-lista .caracteristica-item {
    text-align: center;
    max-width: 200px; /* Ancho máximo para el Maridaje, que es más largo */
    padding: 10px;
    margin: 10px 5px;
}

/* Estilo de la Etiqueta (Título) */
.caracteristicas-lista .caracteristica-etiqueta {
    /* Usar Tipografía Secundaria Montserrat para subtítulos */
    font-family: 'Montserrat', sans-serif; 
    font-size: 1.0em;
    font-weight: 700;
    margin-top: 5px;
    margin-bottom: 2px;
    text-transform: uppercase;
}

/* Estilo del Valor (Texto que viene de ACF) */
.caracteristicas-lista .caracteristica-valor {
    /* Usar Tipografía Secundaria Montserrat para cuerpo */
    font-family: 'Montserrat', sans-serif; 
    font-size: 0.9em;
    font-weight: 400;
    line-height: 1.4;
    color: #cccccc; /* Un gris más suave para el valor */
}

/* ======================================================= */
/* Estilos para los Íconos (Simulando el color Vino/Magenta) */
/* ======================================================= */

.caracteristica-icono {
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.caracteristica-icono span {
    /* Esto es clave para reemplazar los placeholders con tus íconos */
    /* Deberás añadir aquí la URL o el código SVG/Fuente de íconos */
    display: inline-block;
    width: 48px;
    height: 48px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border: 2px solid #ffffff; /* Borde blanco */
    border-radius: 5px; 
    /* Si usas SVG o fuente de iconos, usa 'color: #A5254C;' */
}

.caracteristica-icono .icon-consumo {
    /* Cargar la imagen SVG desde el URL proporcionado */
    background-image: url('http://vino.freeclickcol.com/wp-content/uploads/2025/10/Mesa-de-trabajo-10icono.svg');
    border-color: #A5254C;
}

.caracteristica-icono .icon-tipo-vino {
    background-image: url('http://vino.freeclickcol.com/wp-content/uploads/2025/10/Mesa-de-trabajo-25icono.svg');
    border-color: #A5254C;
}
.caracteristica-icono .icon-temperatura {
    background-image: url('http://vino.freeclickcol.com/wp-content/uploads/2025/10/Mesa-de-trabajo-17icono.svg');
    border-color: #A5254C;
}
.caracteristica-icono .icon-maridaje {
    background-image: url('http://vino.freeclickcol.com/wp-content/uploads/2025/10/Mesa-de-trabajo-3icono.svg');
    border-color: #A5254C;
}

/* Media Query para pantallas pequeñas (ajustar el grid en móviles) */
@media (max-width: 768px) {
    .caracteristicas-vino-pampas-grid .caracteristicas-lista {
        flex-direction: column;
        align-items: center;
    }
    .caracteristicas-lista .caracteristica-item {
        max-width: 90%;
        width: 100%;
        border-bottom: 1px dashed #333333; /* Separador sutil en móvil */
    }
    .caracteristicas-lista .caracteristica-item:last-child {
        border-bottom: none;
    }
}

/* ======================================================= */
/* ESTILOS DE LA SECCIÓN DE PRODUCTOS DESTACADOS */
/* ======================================================= */

.pampas-destacados-home-section {
    text-align: center;
    padding: 60px 20px;
    max-width: 1300px;
    margin: 0 auto;
}

/* Títulos y Subtítulos */
.pampas-destacados-titulo {
    /* Tipografía Principal para el Título (Elegant Demo - Simulación) */
    font-family: 'Elegant Demo', cursive; 
    font-size: 2.5em;
    color: #333;
    margin-bottom: 5px;
}
.pampas-destacados-subtitulo {
    /* Tipografía Secundaria (Montserrat) */
    font-family: 'Montserrat', sans-serif;
    font-size: 1.1em;
    color: #666;
    margin-bottom: 40px;
}

/* --- GRID DE PRODUCTOS (4 Columnas) --- */
.pampas-destacados-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 columnas iguales */
    gap: 25px;
}

/* Estilo de la Tarjeta */
.producto-card {
    background-color: #fff;
    border: 1px solid #f0f0f0;
    transition: box-shadow 0.3s;
}

.producto-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Contenedor de la Imagen */
.producto-imagen-contenedor {
    position: relative;
    padding: 20px;
    background-color: #fafafa; /* Fondo muy claro para destacar la botella */
}

.producto-imagen-contenedor img {
    width: 100%;
    height: auto;
    display: block;
}

/* Etiquetas (SALE/NEW) */
.etiqueta-producto {
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 5px 10px;
    font-size: 0.8em;
    font-weight: 700;
    color: #fff;
    z-index: 10;
}
.etiqueta-sale {
    background-color: #A5254C; /* Rojo Oscuro/Vino de la marca */
}
.etiqueta-new {
    background-color: #53785F; /* Verde Oscuro/Cáñamo de la marca */
}

/* Información del Producto (Texto) */
.producto-info {
    padding: 15px;
    text-align: center;
}

.producto-nombre {
    font-family: 'Montserrat', sans-serif;
    font-size: 1em;
    font-weight: 600;
    margin: 0 0 5px;
}
.producto-nombre a {
    color: #333;
    text-decoration: none;
}
.producto-nombre a:hover {
    color: #A5254C; /* Hover con color de la marca */
}

/* Precios */
.producto-precio {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.1em;
    font-weight: 700;
    color: #A5254C; /* Color de la marca para destacar el precio */
}

/* Estilo para precio tachado (Oferta) */
.producto-precio del {
    font-size: 0.9em;
    color: #999;
    font-weight: 400;
    margin-right: 5px;
}

/* Ajustes para tablet y móvil */
@media (max-width: 992px) {
    .pampas-destacados-grid {
        grid-template-columns: repeat(2, 1fr); /* 2 columnas en tablet */
    }
}
@media (max-width: 576px) {
    .pampas-destacados-grid {
        grid-template-columns: 1fr; /* 1 columna en móvil */
    }
}


/* Estilo para dividir los campos de la página de Detalles de Cuenta en dos columnas */
/* Aplica a los campos por defecto y a los nuevos */
.woocommerce-account .woocommerce-EditAccountForm .form-row-first,
.woocommerce-account .woocommerce-EditAccountForm .form-row-last {
    width: 48% !important;
    float: left !important;
}

.woocommerce-account .woocommerce-EditAccountForm .form-row-first {
    margin-right: 4% !important; /* Espacio entre columnas */
}
.woocommerce-account .woocommerce-EditAccountForm .form-row-wide {
    clear: both !important;
}

/* Estilo para el título de las nuevas secciones */
.pampas-preferencias-title {
    font-size: 1.5em;
    color: #333;
    margin-top: 30px;
    margin-bottom: 15px;
    clear: both; /* Limpia el float de las columnas */
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
}

/* Estilo para los botones de la marca (opcional, si no usa Elementor) */
.woocommerce-account input[type="submit"] {
    background-color: #c1204c !important;
    color: white !important;
    padding: 10px 20px !important;
    border: none !important;
    border-radius: 3px !important;
    transition: background-color 0.3s;
}
.woocommerce-account input[type="submit"]:hover {
    background-color: #c1204c !important;
}

.woocommerce-Button button {
	background-color: #c1204c;
}