/* =========================================================
   NU ESPACIOS · CSS personalizado (Blocksy → Custom CSS)
   Última limpieza: 2026-11-02

   Índice
   0. Variables de marca
   1. Base y tipografía
   2. Encabezado, menús y pie de página
   3. Catálogo y filtros (Filter Everything)
   4. Ficha de producto
   5. Precios y MSI
   6. Panel de carrito (mini cart)
   7. Página de carrito
   8. Checkout
   9. Formularios (Gravity Forms)
   10. Contenido de páginas y banners
   11. Integraciones (Doofinder, Stackable, Mercado Pago, botones flotantes)
   12. Responsive

   Escala tipográfica (ratio 1.2): 0.694 · 0.833 · 1 · 1.2 · 1.44 · 1.728 · 2.074 em
   Marcado con [REVISAR]: posible legacy, confirmar en el sitio antes de borrar.
   ========================================================= */


/* ---------------------------------------------------------
   0. Variables de marca
   --------------------------------------------------------- */
:root {
    --nu-rojo: #D62F2E;
    --nu-negro: #1E1E1E;
    --nu-azul: #798da3;
}


/* ---------------------------------------------------------
   1. Base y tipografía
   --------------------------------------------------------- */
h1, h2, h3, h4 {
    text-wrap: balance;
}

/* Imágenes completas, sin recorte */
.ct-media-container img,
.ct-media-container picture {
    object-fit: contain;
}

/* [REVISAR] Fix viejo de rutas del icon font de WooCommerce.
   Si los iconos se ven bien sin él, se puede borrar. */
@font-face {
    font-family: "WooCommerce";
    src: url("/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.eot");
    src:
        url("/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.woff") format("woff"),
        url("/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.ttf") format("truetype"),
        url("/wp-content/plugins/woocommerce/assets/fonts/WooCommerce.svg") format("svg");
}


/* ---------------------------------------------------------
   2. Encabezado, menús y pie de página
   --------------------------------------------------------- */

/* Barra superior (carrusel de avisos): links en blanco */
.topcarrusel a {
    color: #fff !important;
}
.topcarrusel a * {
    color: inherit !important;
}
.topcarrusel a:hover {
    color: var(--nu-negro) !important;
    text-decoration: underline;
}

/* Outlet en rojo: menú principal y menú móvil */
li.menu-outlet a,
li.offcanvas-outlet a {
    color: var(--nu-rojo) !important;
}

/* Menú secundario */
ul li.menu-secondary a {
    font-size: 1em;
    margin-bottom: 5px;
}
ul li.menu-secondary span {
    margin-right: 7px;
}
ul li.menu-secondary.first {
    margin-top: 50px;
}

/* Pie de página: redes sociales más pegadas al menú de arriba.
   El espacio (40px) lo pone Blocksy en el widget que contiene .nu-foot-redes,
   por eso se ajusta el margen del widget y no el del div. */
#footer .ct-widget:has(.nu-foot-redes) {
    margin-top: 20px;
}

/* Pie de página: métodos de pago más pegados al título de su columna */
div.nu-foot-metodos-pago {
    margin-top: -25px !important;
}

/* Pie de página: enlaces dentro de texto (franja de contacto y "Ver condiciones" de MSI)
   en negro y subrayados; hover en rojo. El azul no daba contraste suficiente.
   Se cambian las variables de enlace de Blocksy para no pelear con !important.
   Los menús del pie no van dentro de <p>, así que no se tocan. */
#footer p {
    --theme-link-initial-color: var(--nu-negro);
    --theme-link-hover-color: var(--nu-rojo);
}
#footer p a {
    text-decoration: underline;
    text-underline-offset: 2px;
}


/* ---------------------------------------------------------
   3. Catálogo y filtros
   --------------------------------------------------------- */

/* Barra superior del listado: conteo + ordenar + filtros */
div.woo-listing-top {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
}
div.woo-listing-top select,
div.woo-listing-top a {
    --form-field-height: 35px;
    font-size: 1em;
    font-weight: 600;
    text-transform: uppercase;
}

/* Home: títulos y precios de productos destacados */
body.home h2.woocommerce-loop-product__title {
    font-size: 1.38em;
}
body.home h2.woocommerce-loop-product__title a {
    text-decoration: none;
}
body.home span.price {
    font-size: 0.9em;
}

/* Categoría Outlet: sin hero */
body.term-outlet div.hero-section {
    display: none;
}

/* --- Filtros: panel --- */
div.wpc-filters-widget-top-container {
    background-color: transparent;
}
.wpc-filters-section {
    margin-bottom: 50px;
}
div.wpc-filter-header {
    font-size: 1em;
    font-weight: bold;
    text-transform: uppercase;
}
div.wpc-filter-content label {
    font-size: 1em;
    white-space: nowrap;
}
div.wpc-custom-selected-terms {
    margin-bottom: 2em;
}
div.wpc-filters-main-wrap a.wpc-open-close-filters-button {
    font-weight: bold;
    text-transform: uppercase;
    border-radius: 3px;
}

/* --- Filtros: pills de filtros activos --- */
ul.wpc-filter-chips-list {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px !important;
    padding: 0 !important;
    list-style: none !important;
}
.wpc-filter-chips-list li {
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Todos los pills (<a> o <span>), incluido "Restablecer todo" */
body .wpc-filter-chips-list li a,
body .wpc-filter-chips-list li span[data-wpc-span-link] {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    padding: 6px 14px !important;
    border: 1px solid #d8d8d8;
    border-radius: 50px !important;
    background: #f7f7f7;
    color: #333;
    line-height: 1.2 !important;
    text-decoration: none;
    box-shadow: none;
}
body .wpc-filter-chips-list li a:hover {
    background: #eaeaea;
    border-color: #bbb;
    color: #111;
}

/* Contenido interno del pill */
.wpc-filter-chips-list .wpc-chip-content {
    display: flex;
    align-items: center;
    height: auto !important;
    min-height: 0 !important;
}
.wpc-filter-chips-list .wpc-filter-chip-name {
    max-width: 240px;
    margin-right: 6px;
}
.wpc-filter-chips-list .wpc-chip-remove-icon {
    height: auto !important;
    max-height: none !important;
    line-height: 1;
}

/* "Restablecer todo" con acento rojizo */
body .wpc-filter-chips-list li.wpc-chip-reset-all a {
    border-color: #d98e8e;
    background: #fff;
    color: #b04a4a;
}


/* ---------------------------------------------------------
   4. Ficha de producto
   --------------------------------------------------------- */
p.stock {
    display: none;
}

button.single_add_to_cart_button {
    font-weight: bold;
    text-transform: uppercase;
}

/* Etiquetas de grupos de swatches (tallas) */
li.iconic-was-swatches__label {
    margin-top: 1em;
    font-weight: bold;
}
li.iconic-was-swatches__label:first-child {
    margin-top: 0;
}

/* Pestaña de descripción y acordeones */
div#tab-description {
    font-size: 1.2em;
}
.ct-accordion-heading.ct-expandable-trigger {
    font-size: 1.2em;
}

/* Reseñas destacadas: foto alineada a la izquierda */
.foto-resena img {
    object-position: left center !important;
}


/* ---------------------------------------------------------
   5. Precios y MSI
   --------------------------------------------------------- */

/* Símbolo $ pequeño y elevado */
span.woocommerce-Price-currencySymbol {
    margin-right: 0.2em;
    font-size: 0.694em;
    vertical-align: 0.5em;
}

/* [REVISAR] Clase propia; confirmar si aún se usa en algún bloque */
span.monedaPrecio {
    font-size: 0.5em;
}

/* Precio en ficha: rojo; más grande en Outlet */
div.summary p.price {
    font-size: 1.2em;
    color: var(--nu-rojo);
}
div.product_cat-outlet div.summary p.price {
    font-size: 1.728em;
}

/* Precio rebajado en tarjetas */
span.card-price.card-price--sale {
    color: var(--nu-rojo) !important;
}

/* Leyendas de meses sin intereses */
p.nu-msi {
    margin-top: -1rem;
    margin-bottom: 2rem;
}
p.nu-msi-mini {
    text-align: center;
}
tr.nu-msi-total td {
    padding-top: 10px;
    font-size: 0.8rem !important;
    text-align: center !important;
}


/* ---------------------------------------------------------
   6. Panel de carrito (mini cart lateral)
   --------------------------------------------------------- */
#woo-cart-panel .woocommerce-mini-cart__total:has(+ .nu-envio) {
    margin-bottom: 0;
}
#woo-cart-panel .nu-envio {
    margin: 0;
    padding-top: 10px;
    border-top: 0;
}
#woo-cart-panel .nu-total {
    margin-top: 12px;
    padding-top: 12px;
}

/* En la página de carrito, el panel no muestra su bloque de carrito vacío */
body.woocommerce-cart #woo-cart-panel .nu-carrito-vacio {
    display: none;
}


/* ---------------------------------------------------------
   7. Página de carrito
   --------------------------------------------------------- */
body.woocommerce-cart h1.page-title {
    margin-bottom: 1em;
}

.ct-woocommerce-cart-form .cart_totals h2 {
    font-size: 2.074em;
}

div.ct-cart-form-actions div.coupon {
    margin-top: 2em;
}

/* Carrito vacío: botón "Volver a la tienda" centrado */
body.woocommerce-cart #main .return-to-shop {
    display: flex;
    justify-content: center;
    margin-top: 2em;
}

/* Carrito vacío: sin badge MÁS VENDIDO */
body.woocommerce-cart #main .nu-carrito-vacio .onsale {
    display: none;
}


/* ---------------------------------------------------------
   8. Checkout
   --------------------------------------------------------- */

/* Botones FINALIZAR MI COMPRA y REALIZAR PEDIDO, con candado */
.checkout-button,
#place_order {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 2em;
    font-size: 1.2em;
}
.checkout-button::after,
#place_order::after {
    content: "";
    order: -1; /* candado antes del texto */
    flex-shrink: 0;
    width: 0.9em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z'/%3E%3C/svg%3E") no-repeat center / contain;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Etiquetas de campos */
form.checkout label {
    margin-bottom: 0;
    font-size: 1.2em;
    font-weight: bold;
    color: rgba(30, 30, 30, 0.6);
}

/* Resumen del pedido */
div.ct-order-review {
    background-color: #FBFBFC;
}

ul#shipping_method,
.woocommerce-terms-and-conditions-checkbox-text {
    font-size: 0.833em;
}

/* Lista de países del teléfono (intl-tel-input) por encima del popup de promoción */
.iti--container {
    z-index: 1000000 !important;
}


/* ---------------------------------------------------------
   9. Formularios (Gravity Forms)
   --------------------------------------------------------- */
div.gform_footer input.gform_button {
    font-weight: bold;
}

/* Formularios con clase .esconder_obligatorio: sin leyenda de "obligatorio" y más compactos */
div.esconder_obligatorio_wrapper .gform_required_legend {
    display: none;
}
.gform-theme--foundation .esconder_obligatorio .gform_fields {
    grid-row-gap: 10px !important;
}
.esconder_obligatorio #gform_submit_button_8 {
    font-weight: bold !important;
}


/* ---------------------------------------------------------
   10. Contenido de páginas y banners
   --------------------------------------------------------- */
article.type-page p,
article.type-page ul {
    font-size: 15px;
}

div.entry-content img.mainbanner,
div.entry-content picture.mainbanner,
div.banner-secundario img {
    width: 100%;
    height: auto;
}

/* Columnas que no deben apilarse */
div.no-comprimir div {
    flex-wrap: nowrap;
}

.boton-interiorismo {
    border-width: 1px;
}


/* ---------------------------------------------------------
   11. Integraciones
   --------------------------------------------------------- */

/* Doofinder: ocultar título del widget, imágenes de filtros guiados y footer */
.dfwidget-title,
.dfd-guided-filters-card img,
div.dfd-footer {
    display: none !important;
}

/* Botón del asistente de IA */
button#product-ai-assistant-trigger {
    background-color: var(--nu-negro);
    border: none;
}
button#product-ai-assistant-trigger:hover {
    background: var(--nu-rojo);
}

/* Stackable: botón cerrar de notificaciones */
div button.stk-block-notification__close-button {
    top: 10px;
}

/* Mercado Pago: tooltip de créditos */
div.mp-credits-tooltip-container {
    margin-bottom: 2em;
}

/* --- Botones flotantes: WhatsApp (Simple Chat Button) y asistente Doofinder ---
   Mismo tamaño, mismo borde derecho, misma sombra y mismo hover.
   WhatsApp abajo; Doofinder encima con un espacio de --nu-fab-gap.
   Para moverlos o cambiar tamaño, ajusta solo las variables. */
:root {
    --nu-fab-size: 56px;
    --nu-fab-right: 20px;
    --nu-fab-bottom: 20px;
    --nu-fab-gap: 12px;
    --nu-fab-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
    --nu-fab-shadow-hover: 0 6px 16px rgba(0, 0, 0, 0.28);
}

/* WhatsApp */
#simple-chat-button--container {
    right: var(--nu-fab-right) !important;
    bottom: calc(var(--nu-fab-bottom) + env(safe-area-inset-bottom)) !important;
}
a#simple-chat-button--button {
    width: var(--nu-fab-size);
    height: var(--nu-fab-size);
    background-size: 32px 32px;
    box-shadow: var(--nu-fab-shadow);
}
a#simple-chat-button--button:hover {
    transform: scale(1.06);
    box-shadow: var(--nu-fab-shadow-hover);
}
/* Sin la onda pulsante del plugin (se veía como un flash de sombra) */
a#simple-chat-button--button::before {
    animation: none !important;
}

/* Doofinder: el círculo trae scale(0.93) de fábrica; lo dejamos en 1 para igualar tamaños */
.dfd-chat-bubble {
    right: calc(var(--nu-fab-right) + env(safe-area-inset-right)) !important;
    bottom: calc(var(--nu-fab-bottom) + var(--nu-fab-size) + var(--nu-fab-gap) + env(safe-area-inset-bottom)) !important;
}
.dfd-chat-bubble-trigger,
.dfd-chat-bubble-trigger .data-svg-wrapper,
.dfd-chat-bubble .dfd-bubble-circle {
    width: var(--nu-fab-size) !important;
    height: var(--nu-fab-size) !important;
}
.dfd-chat-bubble .dfd-bubble-circle {
    transform: scale(1) !important;
    box-shadow: var(--nu-fab-shadow) !important;
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
.dfd-chat-bubble-trigger:hover .dfd-bubble-circle {
    transform: scale(1.06) !important;
    box-shadow: var(--nu-fab-shadow-hover) !important;
}


/* ---------------------------------------------------------
   12. Responsive
   --------------------------------------------------------- */

/* Tablet y escritorio: código postal del mismo ancho que nombre y apellidos */
@media (min-width: 690px) {
    #billing_postcode_field,
    #shipping_postcode_field {
        float: left;
        clear: both;
        width: 48%;
    }
}

/* Móvil */
@media (max-width: 690px) {
    .ct-container {
        flex-direction: column;
        row-gap: 1px;
    }

    /* Altura del slider */
    .flexy-view .flexy-items {
        --sliderHeight: 250px !important;
    }

    /* Miniaturas de galería: 4 por fila */
    div.woocommerce-product-gallery li {
        --thumbs-width: 25% !important;
    }
}
