/* ==========================================================================
TRICOMAR — Sistema de diseño de tienda · "Neón Nocturno"
Paso 1: tokens + tipografía + re-skin base sobre Transformer 4.
Identidad OSCURA por defecto (fijo = noche). data-tricomar-mode="dia" = clara.
Recurso de firma: degradado de espectro (violeta→azul→verde, colores del logo).
Las fotos de producto van SIEMPRE sobre blanco ("mesa de luz").
Los nombres --iv-* se conservan para compatibilidad con el resto del sistema.
========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@500;600;700;800&family=Hanken+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
/* ---------------- TOKENS · NOCHE (por defecto) ---------------- */
:root{
--iv-ground:#0B0912;
--iv-surface:#130F1D;
--iv-surface-2:#0F0C17;
--iv-raise-2:#1B1528;
--iv-ink:#F0ECF7;
--iv-ink-soft:#A99FC1;
--iv-ink-faint:#726889;
--iv-line:#241D37;
--iv-line-strong:#372B50;
--iv-primary:#2FE38A; /* verde de cultivo — acción / disponible */
--iv-primary-press:#22C878;
--iv-on-primary:#04160C;
--iv-accent:#B06CFF; /* violeta del logo — marca / interacción */
--iv-accent-press:#9E52F5;
--iv-blue:#5B9BFF; /* enlaces / información / foco */
--iv-spectrum:linear-gradient(90deg,#9B4DFF 0%,#3B82F6 52%,#2FE38A 100%);
--iv-spectrum-glow:0 0 24px -4px rgba(155,77,255,.45);
--n-glow-green:0 0 22px -4px rgba(47,227,138,.55);
--n-glow-violet:0 0 22px -4px rgba(176,108,255,.5);
--iv-radius:14px;
--iv-radius-sm:9px;
--iv-radius-lg:22px;
--iv-shadow-1:0 1px 2px rgba(0,0,0,.5), 0 12px 30px -14px rgba(0,0,0,.65);
--iv-shadow-2:0 2px 8px rgba(0,0,0,.5), 0 34px 70px -26px rgba(0,0,0,.8);
--iv-font:"Hanken Grotesk","Segoe UI",system-ui,-apple-system,sans-serif;
--iv-display:"Archivo","Arial Narrow","Segoe UI",system-ui,sans-serif;
--iv-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
--iv-ease:cubic-bezier(.2,.7,.2,1);
color-scheme:dark;
}
:root[data-tricomar-mode="noche"],
:root[data-tricomar-mode="auto"]{ color-scheme:dark; }
/* ---------------- TOKENS · DÍA ---------------- */
:root[data-tricomar-mode="dia"]{
color-scheme:light;
--iv-ground:#F5F6F9;
--iv-surface:#FFFFFF;
--iv-surface-2:#EEF0F5;
--iv-raise-2:#F7F5FB;
--iv-ink:#160F26;
--iv-ink-soft:#544A6B;
--iv-ink-faint:#8A7FA6;
--iv-line:#E4E1EE;
--iv-line-strong:#CFC8E2;
--iv-primary:#12A867;
--iv-primary-press:#0E8E56;
--iv-on-primary:#FFFFFF;
--iv-accent:#7A1F9E;
--iv-accent-press:#661784;
--iv-blue:#1E6FE0;
--iv-spectrum-glow:0 8px 24px -10px rgba(122,31,158,.4);
--n-glow-green:0 8px 22px -10px rgba(18,168,103,.5);
--n-glow-violet:0 8px 22px -10px rgba(122,31,158,.4);
--iv-shadow-1:0 1px 2px rgba(22,15,38,.05), 0 10px 26px -14px rgba(22,15,38,.16);
--iv-shadow-2:0 2px 8px rgba(22,15,38,.07), 0 30px 60px -26px rgba(22,15,38,.24);
}
@media (prefers-color-scheme:light){
:root[data-tricomar-mode="auto"]{
color-scheme:light;
--iv-ground:#F5F6F9; --iv-surface:#FFFFFF; --iv-surface-2:#EEF0F5; --iv-raise-2:#F7F5FB;
--iv-ink:#160F26; --iv-ink-soft:#544A6B; --iv-ink-faint:#8A7FA6;
--iv-line:#E4E1EE; --iv-line-strong:#CFC8E2;
--iv-primary:#12A867; --iv-primary-press:#0E8E56; --iv-on-primary:#FFFFFF;
--iv-accent:#7A1F9E; --iv-accent-press:#661784; --iv-blue:#1E6FE0;
--iv-shadow-1:0 1px 2px rgba(22,15,38,.05), 0 10px 26px -14px rgba(22,15,38,.16);
--iv-shadow-2:0 2px 8px rgba(22,15,38,.07), 0 30px 60px -26px rgba(22,15,38,.24);
}
}
/* ---------------- BASE / TIPOGRAFÍA ---------------- */
body{
background:var(--iv-ground) !important;
color:var(--iv-ink);
font-family:var(--iv-font);
-webkit-font-smoothing:antialiased;
}
body::before{
content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.9;
background:
radial-gradient(52vw 42vh at 8% -10%, rgba(155,77,255,.18), transparent 62%),
radial-gradient(46vw 40vh at 100% -6%, rgba(47,227,138,.10), transparent 58%);
}
:root[data-tricomar-mode="dia"] body::before,
:root[data-tricomar-mode="auto"] body::before{ opacity:.4; }
/* ---- matar TODO fondo blanco/claro de los contenedores del tema ---- */
html{ background:var(--iv-ground) !important; }
#wrapper,#content-wrapper,#content,.content,#main,.page-content,#columns,.columns-container,
#body_wrapper,#page_wrapper,.wrapper,.l-wrapper,.l-content,
.wide_container,.wide_container_box,.container,.container-fluid,
#center_column,#left_column,#right_column,.single_column,.row,
[class*="col-sm-"],[class*="col-md-"],[class*="col-lg-"],[class*="col-xs-"],
.wrapper_bottom_container,#footer_before_container,#wrapper_bottom_container,
#left-column,#right-column,.sidebar,
.page-home,#index .page-home,.home_container,
.block,.block_content,.products_container,.products_section,
.st_block,.st_block_content,.stblock,.tab-content,.card-block,
.swiper-container,.swiper-wrapper,.products_sldier_swiper,
#js-product-list-top,#js-product-list,#js-product-list-bottom,
.page-header,.page-footer-container,#footer-before-container,
.elementor-section,.e-con,.steasycontent,.st_easy_content,
.block-category,.category-top,.category-header,.subcategories,
.contact-rich,.contact-form,.cms-page,.page-cms,
.checkout,.cart-grid,.cart-container,#order-confirmation,
.page-my-account,#authentication,#history,#addresses,#identity{
background:transparent !important;
position:relative;z-index:1;
}
/* franjas / fondos residuales del tema */
.st_row,.st_section,.home-row,.page_content_container,#main_content,
#top_bar_container,#header_primary_container,#top_extra_container,
.products_container,.category_blogs_container,.brands_slider_container,
.sthomenew_container,.stfeaturedslider_container{
background-color:transparent !important;
}
h1,h2,h3,h4,h5,h6,
.page-heading,.h1,.h2,.h3,.products-section-title,.featured-products .title,
.block-title,.title_block,.st_block_title,.footer_block .title_block{
font-family:var(--iv-display) !important;
color:var(--iv-ink);
letter-spacing:-.02em;
text-wrap:balance;
font-weight:700;
}
h1,.page-heading{ font-size:clamp(1.8rem,1.3rem+2vw,2.9rem); line-height:1.04; font-weight:800; }
h2{ font-size:clamp(1.45rem,1.15rem+1.2vw,2.1rem); line-height:1.1; font-weight:800; }
h3{ font-size:clamp(1.18rem,1.05rem+.6vw,1.5rem); }
h4{ font-size:1.1rem; }
h5{ font-size:.96rem; }
h6{ font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.14em; color:var(--iv-ink-faint); font-family:var(--iv-mono) !important; }
.products-section-title,.featured-products .title,.h1.products-section-title{
position:relative; display:inline-block; padding-bottom:12px; margin-bottom:8px;
}
.products-section-title::after,.featured-products .title::after{
content:""; position:absolute; left:0; bottom:0; width:48px; height:3px; border-radius:3px;
background:var(--iv-spectrum);
}
a{ color:var(--iv-blue); transition:color .15s var(--iv-ease); }
a:hover{ color:var(--iv-accent); }
.text-muted,.small,.date{ color:var(--iv-ink-faint); }
[class*="reference"],.product-reference,.sku,.mono{ font-family:var(--iv-mono); }
::selection{ background:var(--iv-accent); color:#fff; }
*:focus-visible{ outline:2.5px solid var(--iv-blue); outline-offset:2px; }
hr{ border-color:var(--iv-line); }
/* ---------------- HEADER / NAV ---------------- */
.header-container,.easy_header,#header,.header-nav{
background:var(--iv-surface) !important;
color:var(--iv-ink);
border-bottom:0;
position:relative;
}
.header-container::after,#header::after{ content:none; }
/* --- barra de info superior --- */
.tn-strip{ background:var(--iv-ground); border-bottom:1px solid var(--iv-line); }
.tn-strip__in{
max-width:1200px;margin:0 auto;padding:8px 20px;
display:flex;justify-content:center;flex-wrap:wrap;gap:8px 26px;
font-family:var(--iv-mono);font-size:.72rem;letter-spacing:.03em;color:var(--iv-ink-soft);
}
.tn-strip__in span{ display:inline-flex;align-items:center;gap:8px; }
.tn-strip__in span::before{ content:"◆";color:var(--iv-accent);font-size:.7em; }
.tn-strip__in span:first-child::before{ content:none; }
#displayBanner.header-banner{ background:var(--iv-ground) !important;padding:0 !important;border:0 !important; }
/* --- fila principal: logo | menú | iconos, TODO en una fila --- */
#header_primary{
background:var(--iv-surface) !important;
border-bottom:3px solid transparent;border-image:var(--iv-spectrum) 1;
}
#header_primary .container,#header_primary .wide_container_box{ overflow:visible !important; }
.tn-headrow{
display:flex !important;align-items:center;gap:18px;min-height:70px;flex-wrap:nowrap;
}
#header_left{ flex:none; }
.shop_logo{ display:inline-block; }
.shop_logo img.logo{ height:38px;width:auto;max-width:none;display:block; }
.tn-navwrap{ flex:1 1 auto;min-width:0;display:flex;justify-content:flex-start; }
#header_right{ flex:none; }
#header_right_top{ gap:4px !important;align-items:center;display:flex; }
@media (max-width:1100px){
.tn-headrow{ flex-wrap:wrap;gap:10px 16px; }
.tn-navwrap{ order:3;flex-basis:100%; }
}
.header_icon_btn_text,.header_icon_btn_icon{ color:var(--iv-ink) !important; }
.header_icon_btn:hover .header_icon_btn_icon,.header_icon_btn:hover .header_icon_btn_text{ color:var(--iv-primary) !important; }
.nav_bar,.horizontal-s-fullheight,.main_menu,.easymenu_bar{ background:transparent !important; }
/* orden de los iconos: Buscar · Mi cuenta · Carrito */
#header_right_top{ display:flex !important;align-items:center;gap:6px; }
#header_right_top .stsearchbar_link,#header_right_top .search_widget_block{ order:1; }
#header_right_top .tn-acc{ order:2; }
#header_right_top .blockcart,#header_right_top .st_shopping_cart,#header_right_top .st_shopping_cart_wrap{ order:3; }
/* icono disparador de búsqueda en el header */
.stsearchbar_link > a,.stsearchbar_link .header_icon_btn_icon{ color:var(--iv-ink) !important; }
.stsearchbar_link > a{
display:grid;place-items:center;width:40px;height:40px;border-radius:10px;
transition:background .15s,color .15s;
}
.stsearchbar_link > a:hover{ background:var(--iv-raise-2);color:var(--iv-primary) !important; }
.stsearchbar_link .icon_text,.stsearchbar_link .header_icon_btn_text{ display:none !important; }
/* ==========================================================================
BÚSQUEDA DE PRODUCTOS — panel lateral a medida
========================================================================== */
.st-menu#side_search{
background:var(--iv-surface) !important;
border-left:3px solid transparent;border-image:var(--iv-spectrum) 1;
box-shadow:-30px 0 80px -20px rgba(0,0,0,.7) !important;
color:var(--iv-ink);
}
#side_search .st-menu-header{
display:flex !important;flex-wrap:nowrap !important;
margin:0 !important;padding:20px 20px 16px !important;
border-bottom:1px solid var(--iv-line) !important;
align-items:center;justify-content:space-between;background:transparent !important;
}
#side_search #search_block_side,
#side_search .search_widget_block,
#side_search .search_widget,
#side_search .search_widget_form,
#side_search .search_widget_form_inner{ margin:0 !important;width:auto !important; }
#side_search .st-menu-title{
font-family:var(--iv-display) !important;font-weight:800 !important;
font-size:1.15rem !important;color:var(--iv-ink) !important;letter-spacing:-.01em;
text-transform:none;
}
#side_search .st-menu-title{ font-size:0 !important; }
#side_search .st-menu-title::after{ content:"Buscar productos";font-size:1.15rem; }
#side_search .close_right_side{
width:38px;height:38px;border-radius:10px;display:grid;place-items:center;
color:var(--iv-ink-soft) !important;background:var(--iv-raise-2);border:1px solid var(--iv-line);
transition:color .15s,border-color .15s;
}
#side_search .close_right_side:hover{ color:var(--iv-accent) !important;border-color:var(--iv-accent); }
#side_search #search_block_side{ padding:20px !important; }
#side_search .search_widget_form_inner{
display:flex;align-items:center;
background:var(--iv-surface-2) !important;
border:1.5px solid var(--iv-line-strong) !important;border-radius:14px !important;
overflow:hidden;transition:border-color .2s,box-shadow .2s;
}
#side_search .search_widget_form_inner:focus-within{
border-color:var(--iv-accent) !important;
box-shadow:0 0 0 3px color-mix(in srgb,var(--iv-accent) 25%,transparent);
}
#side_search .search_widget_text{
flex:1;min-width:0;height:52px !important;border:0 !important;background:transparent !important;
color:var(--iv-ink) !important;font-family:var(--iv-font);font-size:1rem;padding:0 6px 0 16px !important;
}
#side_search .search_widget_text::placeholder{ color:var(--iv-ink-faint); }
#side_search .search_widget_btn{
order:-1;width:48px;height:52px !important;flex:none;
background:transparent !important;border:0 !important;color:var(--iv-ink-soft) !important;
font-size:1.05rem;line-height:52px !important;
}
#side_search .search_widget_btn:hover{ color:var(--iv-primary) !important; }
#side_search .search_widget_btn .icon_text{ display:none; }
/* resultados en vivo */
#side_search .search_results{
margin-top:16px;background:transparent !important;border:0 !important;box-shadow:none !important;
position:static !important;display:block;max-height:60vh;overflow-y:auto;
}
#side_search .search_results > *{
display:flex !important;align-items:center;gap:12px;
padding:10px 8px;border-radius:10px;border-bottom:1px solid var(--iv-line);
color:var(--iv-ink-soft) !important;text-decoration:none;
}
#side_search .search_results > *:hover{ background:var(--iv-raise-2); }
#side_search .search_results img{
width:52px;height:52px;object-fit:contain;background:#fff;border-radius:8px;flex:none;padding:4px;
}
#side_search .search_results .product_name,
#side_search .search_results .search_name,
#side_search .search_results a > span:not(.price):not(.search_price){
font-family:var(--iv-display);font-weight:700;color:var(--iv-ink) !important;font-size:.9rem;flex:1;
}
#side_search .search_results .price,
#side_search .search_results .search_price{
font-family:var(--iv-mono);color:var(--iv-primary) !important;font-weight:600;font-size:.88rem;flex:none;
}
#side_search .search_more_products{
display:block !important;margin-top:16px;text-align:center;
font-family:var(--iv-font);font-weight:700;font-size:.9rem;
background:var(--iv-primary) !important;color:var(--iv-on-primary) !important;
border-radius:999px;padding:12px 18px;box-shadow:var(--n-glow-green);
}
#side_search .search_more_products.display_none{ display:none !important; }
#side_search .search_no_products{
margin-top:18px;color:var(--iv-ink-faint);font-family:var(--iv-mono);font-size:.85rem;text-align:center;
}
#side_search .search_no_products.display_none{ display:none !important; }
/* fix real de las tarjetas de resultado (el selector anterior apuntaba al
contenedor .autocomplete-suggestions, no a cada fila .search_product_row) */
#side_search .autocomplete-suggestions{
background:transparent !important;border:0 !important;box-shadow:none !important;
}
#side_search .autocomplete-suggestion{
padding:0 !important;border-bottom:1px solid var(--iv-line);
}
#side_search .autocomplete-suggestion:last-child{ border-bottom:0; }
#side_search .autocomplete-suggestion:hover{ background:transparent !important; }
#side_search .search_product_row{
display:flex !important;align-items:center;gap:12px;
padding:10px 4px;border-radius:10px;text-decoration:none !important;
}
#side_search .search_product_row:hover{ background:var(--iv-raise-2); }
#side_search .search_product_img{
width:52px !important;height:52px;object-fit:contain;background:#fff;
border:1px solid var(--iv-line);border-radius:8px;flex:none;padding:4px;margin:0 !important;
}
#side_search .search_product_name{
flex:1;min-width:0;font-family:var(--iv-display);font-weight:700;
color:var(--iv-ink) !important;font-size:.88rem;line-height:1.3;
white-space:normal !important;
}
#side_search .search_product_price{
flex:none;font-family:var(--iv-mono);color:var(--iv-primary) !important;
font-weight:600;font-size:.86rem;
}
/* --- modal de Terminos y Condiciones / CGV en el pago (contenido CMS inyectado por AJAX) --- */
#modal{ z-index:2000; }
#modal .modal-dialog{
max-width:720px;width:calc(100% - 32px);margin:5vh auto;
}
#modal .modal-content{
border:1px solid var(--iv-line);border-radius:18px;overflow:hidden;
box-shadow:0 30px 60px -20px rgba(0,0,0,.35);
background:var(--iv-surface,#fff);
max-height:88vh;display:flex;flex-direction:column;padding:0 !important;
}
#modal .st_modal_close{
position:absolute;top:14px;right:14px;z-index:5;
width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
background:var(--iv-raise-2);color:var(--iv-ink-soft);border:1px solid var(--iv-line);
font-size:1.1rem;line-height:1;
}
#modal .st_modal_close:hover{ background:var(--iv-line);color:var(--iv-ink); }
#modal .js-modal-content{
overflow-y:auto;padding:44px 32px 28px;
}
#modal .js-modal-content .page-cms{ max-width:none !important;padding:0 !important;margin:0 !important; }
#modal .js-modal-content .tn-legal{ max-width:none !important; }
#modal .js-modal-content .tn-legal__title{ font-size:1.35rem !important;margin-top:0 !important; }
#modal .js-modal-content .tn-legal__toc{ display:none !important; }
#modal .js-modal-content .tn-legal__eyebrow{ margin-top:0; }
@media (max-width:600px){
#modal .js-modal-content{ padding:40px 18px 22px; }
#modal .js-modal-content .tn-legal__title{ font-size:1.1rem !important; }
}
/* header del panel: buscador pequeño del header (icono trigger, sin caja) */
.search_widget_block.search_widget_0,.search_widget_block.stsearchbar_builder{
min-width:0 !important;width:auto !important;
}
.search_widget_block.search_widget_0 .search_widget_form_inner{ display:none !important; }
/* --- deslizado suave de los paneles laterales (off-canvas del tema) --- */
.st-container .st-menu,
#side_search,#side_products_cart,#side_loved,#side_mobile_nav,#side_stmobilemenu,
#side_viewed,#side_wishlist,#side_share{
transition:transform .42s cubic-bezier(.22,.61,.36,1) !important;
will-change:transform;
}
.st-pusher{ transition:transform .42s cubic-bezier(.22,.61,.36,1) !important; }
.st-pusher::after{
transition:opacity .42s ease, background .42s ease !important;
}
.st-effect-0 .st-menu,.st-container.st-effect-0 .st-menu{
transition:transform .42s cubic-bezier(.22,.61,.36,1) !important;
}
@media (prefers-reduced-motion:reduce){
.st-container .st-menu,.st-pusher,.st-pusher::after{ transition:none !important; }
}
/* fondo oscuro al abrir cualquier panel lateral */
.st-pusher::after{ background:rgba(7,5,14,.55) !important; }
:root[data-tricomar-mode="dia"] .st-pusher::after{ background:rgba(20,15,38,.4) !important; }
/* pestañas flotantes redundantes (Cart / Loved / Top del lateral) — fuera,
el carrito ya está en el header */
#rightbar,#leftbar,.sidebar_box .rightbar_tri:not(.scroll_top_tri){ display:none !important; }
/* paneles laterales de carrito / favoritos al estilo neón */
#side_products_cart,#side_loved,#side_mobile_nav,#side_stmobilemenu,#side_viewed,#side_wishlist,.st-menu{
background:var(--iv-surface) !important;color:var(--iv-ink);
}
.st-menu .st-menu-title{ color:var(--iv-ink) !important;font-family:var(--iv-display) !important; }
.st-menu-header{ border-bottom:1px solid var(--iv-line) !important; }
/* iconos cuenta / carrito */
.tn-acc,.st_shopping_cart,.ajax_cart_bag{ color:var(--iv-ink) !important; }
.tn-acc{ display:grid;place-items:center;width:40px;height:40px;border-radius:10px; }
.tn-acc svg{ width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.tn-acc:hover{ background:var(--iv-raise-2);color:var(--iv-primary) !important; }
.blockcart .cart_icon_item,.ajax_cart_bag.cart_icon_item{
background:var(--iv-raise-2) !important;border:1px solid var(--iv-line) !important;
color:var(--iv-ink) !important;border-radius:10px !important;
}
.blockcart:hover .cart_icon_item{ color:var(--iv-primary) !important;border-color:var(--iv-primary) !important; }
.ajax_cart_quantity.amount_circle{ background:var(--iv-primary) !important;color:var(--iv-on-primary) !important;font-family:var(--iv-mono);font-weight:600; }
.cart_body .dropdown_box,.cart_body .dropdown_list{ background:var(--iv-surface) !important;border:1px solid var(--iv-line) !important;border-radius:var(--iv-radius) !important;box-shadow:var(--iv-shadow-2) !important;color:var(--iv-ink); }
/* restos del tema que ya no van */
#top_bar,#top_extra,#easymenu_container,.nav_full_container:empty{ display:none !important; }
/* --- MENÚ nivel 0: hoverOn (subrayado espectro) / clickOn (fondo + filo) --- */
.st_mega_menu > li,.mo_mu_level_0 > li{ position:relative; }
.st_mega_menu > li > .menu_a_wrap,
.st_mega_menu > li > a,
.mo_mu_level_0 > li > a{
font-family:var(--iv-font);
font-weight:600;
font-size:.85rem;
text-transform:uppercase;
letter-spacing:.05em;
color:var(--iv-ink-soft) !important;
padding:14px 15px !important;
border-radius:9px;
transition:color .17s var(--iv-ease), background .17s var(--iv-ease);
}
.st_mega_menu > li > a::after,
.st_mega_menu > li > .menu_a_wrap::after{
content:""; position:absolute; left:15px; right:15px; bottom:7px; height:2px; border-radius:2px;
background:var(--iv-spectrum);
transform:scaleX(0); transform-origin:50%;
transition:transform .26s var(--iv-ease);
}
.st_mega_menu > li:hover > a,
.st_mega_menu > li:hover > .menu_a_wrap,
.mo_mu_level_0 > li:hover > a{ color:var(--iv-ink) !important; }
.st_mega_menu > li:hover > a::after,
.st_mega_menu > li:hover > .menu_a_wrap::after{ transform:scaleX(1); }
.st_mega_menu > li.hover > a,
.st_mega_menu > li.sfHover > a,
.st_mega_menu > li[aria-expanded="true"] > a,
.st_mega_menu > li.hover > .menu_a_wrap,
.st_mega_menu > li.sfHover > .menu_a_wrap{
color:var(--iv-ink) !important;
background:var(--iv-raise-2) !important;
}
.st_mega_menu > li.hover > a::after,
.st_mega_menu > li.sfHover > a::after,
.st_mega_menu > li.hover > .menu_a_wrap::after,
.st_mega_menu > li.sfHover > .menu_a_wrap::after{ transform:scaleX(1); }
.st_mega_menu > li > a:active{ transform:translateY(1px); }
/* --- panel desplegable --- */
.st_mega_menu_container,.stmenu_sub,.mobile_menu_ul{
background:var(--iv-surface) !important;
border:1px solid var(--iv-line) !important;
box-shadow:var(--iv-shadow-2) !important;
border-radius:0 0 var(--iv-radius) var(--iv-radius) !important;
overflow:hidden;
animation:tnMenu .2s var(--iv-ease) both;
}
.st_mega_menu_container{ border-top:3px solid transparent !important; border-image:var(--iv-spectrum) 1 !important; }
@keyframes tnMenu{ from{ opacity:0; transform:translateY(-8px);} to{ opacity:1; transform:translateY(0);} }
.st_mega_menu_container .title_block,
.st_mega_menu_container .st_block_title,
.st_mega_menu_container h4,
.st_mega_menu_container .column_title,
.st_mega_menu_container .cbp-menu-title{
font-family:var(--iv-mono) !important;
font-size:.66rem !important;
letter-spacing:.16em; text-transform:uppercase;
color:var(--iv-accent) !important;
}
.st_mega_menu_container a{
color:var(--iv-ink-soft) !important;
border-radius:7px;
transition:color .15s var(--iv-ease), background .15s, padding-left .15s;
}
.st_mega_menu_container a:hover{
color:var(--iv-primary) !important;
background:color-mix(in srgb, var(--iv-primary) 12%, transparent) !important;
padding-left:9px !important;
text-decoration:none;
}
#mobile_bar,.mobile_bar_tri{ background:var(--iv-surface) !important; border-top:1px solid var(--iv-line); }
.mobile_menu_ul a{ color:var(--iv-ink-soft) !important; border-color:var(--iv-line) !important; }
.mobile_menu_ul a:hover,.mobile_menu_ul .selected > a{ color:var(--iv-primary) !important; }
#st_menu_toggle_btn,.st_menu_toggle span,.menu_toggle_bar{ background:var(--iv-ink) !important; }
/* ---------------- BOTONES ---------------- */
.btn-primary,.btn.btn-primary,button.btn-primary,
.add-to-cart,.product-add-to-cart .btn,
.cart-content-btn .btn,.checkout .btn,.continue,
#submit-login,.form-control-submit,.btn.button,
.product_list .button-container .button{
background:var(--iv-primary) !important;
border:1.5px solid var(--iv-primary) !important;
color:var(--iv-on-primary) !important;
border-radius:999px !important;
font-family:var(--iv-font);
font-weight:700;
letter-spacing:.015em;
box-shadow:var(--n-glow-green);
transition:transform .14s var(--iv-ease), box-shadow .2s, filter .15s;
}
.btn-primary:hover,.add-to-cart:hover,.btn.button:hover,
#submit-login:hover,.checkout .btn:hover,.continue:hover{
filter:brightness(1.07);
transform:translateY(-2px);
box-shadow:0 0 30px -4px rgba(47,227,138,.7);
}
.btn-primary:active,.add-to-cart:active{ transform:translateY(0); }
.btn-secondary,.btn-outline-primary,.btn.btn-default,.btn-tertiary{
background:transparent !important;
border:1.5px solid var(--iv-line-strong) !important;
color:var(--iv-ink) !important;
border-radius:999px !important;
box-shadow:none !important;
transition:border-color .15s, color .15s, box-shadow .2s;
}
.btn-secondary:hover,.btn-outline-primary:hover,.btn.btn-default:hover{
border-color:var(--iv-accent) !important; color:var(--iv-accent) !important;
box-shadow:var(--n-glow-violet);
}
/* ---------------- TARJETAS DE PRODUCTO ----------------
Borde fino + zona de imagen SIEMPRE blanca + specs mono + hover con lift/glow. */
.product-miniature,.js-product-miniature,
.product_list .product-container,.ajax_block_product,
.products .product-miniature{
background:var(--iv-surface);
border:1px solid var(--iv-line);
border-radius:var(--iv-radius);
overflow:hidden;
transition:transform .18s var(--iv-ease), box-shadow .18s var(--iv-ease), border-color .18s;
}
.product-miniature:hover,.js-product-miniature:hover,
.product_list .product-container:hover,.ajax_block_product:hover{
transform:translateY(-4px);
box-shadow:var(--n-glow-green), var(--iv-shadow-1);
border-color:var(--iv-line-strong);
}
.product-miniature .thumbnail-container,
.js-product-miniature .thumbnail-container,
.product-miniature .product-thumbnail,
.product_list .product-image,
.ajax_block_product .product_img_link,
.st_product_image_container,
.thumbnail-container{
background:#FFFFFF !important;
border-bottom:1px solid var(--iv-line);
border-radius:0 !important;
display:block;
padding:12px;
box-shadow:none !important;
}
.product-miniature .thumbnail-container img,
.js-product-miniature img,
.product_list .product-image img,
.ajax_block_product img{ border-radius:7px; mix-blend-mode:normal; }
.product-description,.product-miniature .product-desc,
.product_list .right-block,.ajax_block_product .product_desc,
.product-miniature .product-description{ padding:14px 14px 16px !important; }
.product-title a,.product-name a,.product_name a,.product-miniature .product-title{
font-family:var(--iv-display); font-weight:700; color:var(--iv-ink) !important; letter-spacing:-.01em;
}
.product-title a:hover,.product-name a:hover{ color:var(--iv-accent) !important; }
.product-brand,.product-miniature .manufacturer-name{
font-family:var(--iv-mono) !important; font-size:.66rem; letter-spacing:.12em;
text-transform:uppercase; color:var(--iv-accent) !important;
}
.product-price-and-shipping .price,.product-price,.price,.current-price span,
.product-miniature .price{
color:var(--iv-primary) !important; font-family:var(--iv-mono); font-weight:600;
}
.regular-price,.old-price,.product-discount .regular-price{
color:var(--iv-ink-faint) !important; font-family:var(--iv-mono); text-decoration:line-through;
}
.product-flags .discount,.discount-percentage,.on-sale,.product-flag.discount{
background:var(--iv-accent) !important; color:#fff !important; border-radius:999px !important;
font-family:var(--iv-mono); font-weight:600; box-shadow:var(--n-glow-violet);
}
.product-flag.new,.product-flags .new,.product-flag.online-only{
background:var(--iv-primary) !important; color:var(--iv-on-primary) !important;
border-radius:999px !important; font-family:var(--iv-mono); font-weight:600; box-shadow:var(--n-glow-green);
}
.comments_note .star,.star_content .star.star_on,.grade-stars .star-on{ color:#E8B34D; }
.product_list .button-container .button,.product-miniature .add-to-cart{ width:100%; justify-content:center; }
/* etiquetas de características tipo "chip" en la miniatura (si el tema las muestra) */
.product-miniature .product-feature,.product_list .features_block li{
font-family:var(--iv-mono); font-size:.66rem; color:var(--iv-ink-soft);
border:1px solid var(--iv-line); border-radius:5px; padding:3px 6px; display:inline-block;
}
/* ==========================================================================
CATÁLOGO — filtros a la izquierda como pills + barra de orden
========================================================================== */
#search_filters{
background:transparent !important;border:0 !important;padding:0 0 0 18px !important;
}
#search_filters .sticky_facet_title{ display:none; }
#search_filters .facet{
border:0 !important;border-bottom:1px solid var(--iv-line) !important;
padding:18px 0 !important;margin:0 !important;background:transparent !important;
}
#search_filters .facet:first-child{ padding-top:0 !important; }
#search_filters .facet-title,#search_filters .facet-title-mobile-inner{
font-family:var(--iv-mono) !important;font-size:.68rem !important;letter-spacing:.14em;
text-transform:uppercase;color:var(--iv-ink-faint) !important;font-weight:500;margin-bottom:12px;
}
#search_filters .facet-title-mobile{ color:var(--iv-ink) !important; }
#search_filters .facet-title-mobile .arrow{ color:var(--iv-ink-soft); }
#search_filters .facet_filter_box{ list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px; }
#search_filters .facet_filter_item_li{ display:contents; }
/* cada opción de filtro = pill (funciona para disponibilidad, atributos, marca…) */
#search_filters .facet-label{
display:inline-flex !important;align-items:center;gap:6px;margin:0 !important;
padding:8px 14px !important;border-radius:999px !important;cursor:pointer;
background:var(--iv-surface) !important;border:1px solid var(--iv-line-strong) !important;
font-family:var(--iv-font);font-size:.82rem;color:var(--iv-ink-soft) !important;
transition:background .15s var(--iv-ease),border-color .15s,color .15s;
}
#search_filters .facet-label:hover{ border-color:var(--iv-accent) !important;color:var(--iv-ink) !important; }
#search_filters .facet-label .custom-input-box{
width:0;height:0;overflow:hidden;position:absolute; /* checkbox real oculto, el pill hace de control */
}
#search_filters .facet-label .search-link,
#search_filters .facet-label a.search-link{
color:inherit !important;text-decoration:none !important;display:inline-flex;gap:6px;align-items:center;
}
#search_filters .facet-label .magnitude{
font-family:var(--iv-mono);font-size:.68rem;color:var(--iv-ink-faint);
}
/* estado marcado: pill llena, degradado sutil de marca */
#search_filters .facet-label:has(input:checked){
background:var(--iv-accent) !important;border-color:var(--iv-accent) !important;color:#fff !important;
}
#search_filters .facet-label:has(input:checked) .magnitude{ color:rgba(255,255,255,.75); }
/* variante verde para "en stock / disponibilidad" */
#search_filters .facet_availability .facet-label:has(input:checked){
background:var(--iv-primary) !important;border-color:var(--iv-primary) !important;color:var(--iv-on-primary) !important;
}
/* precio: slider jQuery UI */
#search_filters .price-min,#search_filters .price-max,.facet_slider_amount{
font-family:var(--iv-mono) !important;color:var(--iv-ink) !important;font-size:.85rem;
}
#search_filters [id^="slider-range"],.ui-slider{
background:var(--iv-line-strong) !important;border:0 !important;height:4px !important;
border-radius:999px !important;margin:18px 6px 8px;
}
#search_filters .ui-slider-range{ background:var(--iv-spectrum) !important; }
#search_filters .ui-slider-handle{
width:18px !important;height:18px !important;top:-7px !important;margin-left:-9px !important;
background:var(--iv-ink) !important;border:3px solid var(--iv-accent) !important;
border-radius:50% !important;box-shadow:var(--iv-shadow-1) !important;cursor:grab;
}
/* limpiar filtros / chips activos */
#search_filters .search_filters_clear_all,.active_filters .clear-all{
font-family:var(--iv-mono);font-size:.72rem;color:var(--iv-accent) !important;text-decoration:underline;
}
/* ---- barra superior: contador + orden ---- */
#js-product-list-top,.products-selection{
background:transparent !important;border:0 !important;padding:0 0 20px !important;
display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.total-products,.js-product-list-top .total-products{
font-family:var(--iv-mono) !important;font-size:.82rem;color:var(--iv-ink-faint) !important;
}
.products-sort-order{ position:relative; }
.products-sort-order .dropdown_tri{
display:inline-flex;align-items:center;gap:8px;
background:var(--iv-surface) !important;border:1px solid var(--iv-line-strong) !important;
border-radius:999px !important;padding:9px 16px;color:var(--iv-ink) !important;
font-family:var(--iv-mono);font-size:.8rem;
}
.products-sort-order .dropdown_tri:hover{ border-color:var(--iv-accent) !important; }
#js-product-list-top,.products-selection{ position:relative;z-index:40; }
.products-sort-order .dropdown_list{
position:absolute !important;top:calc(100% + 6px) !important;right:0 !important;left:auto !important;
z-index:60 !important;min-width:220px;
background:var(--iv-surface) !important;border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;box-shadow:var(--iv-shadow-2) !important;padding:6px !important;
}
.products-sort-order .dropdown_list_ul{ list-style:none;margin:0;padding:0; }
.products-sort-order .dropdown_list_item{
color:var(--iv-ink-soft) !important;border-radius:8px !important;font-family:var(--iv-font);font-size:.85rem;
display:block;padding:9px 12px !important;
}
.products-sort-order .dropdown_list_item:hover,
.products-sort-order .dropdown_list_item.current{ background:var(--iv-raise-2) !important;color:var(--iv-ink) !important; }
/* selector de vista grilla/lista, al lado del orden */
.grid_list_toggle,.product-view-switch,#list,#grid{
background:var(--iv-surface) !important;border:1px solid var(--iv-line-strong) !important;
border-radius:999px !important;color:var(--iv-ink-soft) !important;
}
.grid_list_toggle a.selected,.product-view-switch a.selected{
background:var(--iv-raise-2) !important;color:var(--iv-primary) !important;
}
/* breadcrumb + título de categoría */
.breadcrumb{ padding:16px 0 8px !important; }
.category-header h1,#category h1.h1,.page-heading{ margin-bottom:22px !important; }
@media (max-width:991px){
#search_filters .facet{ border-bottom:1px solid var(--iv-line) !important; }
}
/* ---------------- LISTADO / FILTROS ---------------- */
#search_filters,.facet,.faceted-search,.st_filter_block{
background:var(--iv-surface) !important; border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;
}
#search_filters .facet-title,.facet .h6,.facet-label{
font-family:var(--iv-mono) !important; font-size:.68rem; letter-spacing:.14em;
text-transform:uppercase; color:var(--iv-ink-faint) !important;
}
.facet .facet-label a,.faceted-search a{ color:var(--iv-ink-soft) !important; }
.facet .facet-label a:hover,.active_filters .filter-block{ color:var(--iv-primary) !important; }
.active_filters .filter-block{
background:var(--iv-raise-2) !important; border:1px solid var(--iv-line-strong) !important;
color:var(--iv-ink) !important; border-radius:999px !important; font-family:var(--iv-mono); font-size:.72rem;
}
.products-sort-order .select-title,.sort-by-row select,#js-product-list-top select{
background:var(--iv-surface) !important; border:1px solid var(--iv-line-strong) !important;
color:var(--iv-ink) !important; border-radius:var(--iv-radius-sm) !important; font-family:var(--iv-mono); font-size:.82rem;
}
.pagination{ display:flex;justify-content:center;padding:28px 0; }
.pagination .page-list{
display:flex !important;align-items:center;gap:6px;list-style:none;margin:0;padding:0;
background:var(--iv-surface);border:1px solid var(--iv-line);border-radius:999px;padding:6px !important;
}
.pagination .page-list > li{ display:flex; }
.pagination a,.pagination span{
display:grid !important;place-items:center;min-width:38px;height:38px;padding:0 10px !important;
border-radius:999px !important;color:var(--iv-ink-soft) !important;font-family:var(--iv-mono) !important;
font-size:.85rem;text-decoration:none !important;transition:background .15s,color .15s;
}
.pagination a:hover{ background:var(--iv-raise-2) !important;color:var(--iv-ink) !important; }
.pagination .current a,.pagination .current span{
background:var(--iv-spectrum) !important;color:#fff !important;font-weight:700;box-shadow:var(--iv-spectrum-glow);
}
.pagination .previous a,.pagination .next a{ color:var(--iv-accent) !important;font-size:1rem; }
.pagination .disabled a,.pagination .disabled span{ opacity:.35;pointer-events:none; }
/* ---------------- FICHA DE PRODUCTO ---------------- */
.product-container .images-container .product-cover,
#product .product-cover,.product-cover img,
.js-qv-mask .thumb-container{
background:#FFFFFF !important; border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;
}
.product-thumbs .thumb-container .thumb,.product-images img{
background:#fff !important; border:1px solid var(--iv-line) !important; border-radius:9px !important;
}
.product-prices .current-price span,#product .current-price .price,.product-price.current-price{
font-family:var(--iv-mono) !important; color:var(--iv-primary) !important; font-weight:600;
}
.product-information,.product-actions,.product-features table,
#product .product-features,.data-sheet{
color:var(--iv-ink-soft);
}
.product-features .data-sheet dt,.product-features table th,.data-sheet dt{
font-family:var(--iv-mono) !important; font-size:.72rem; letter-spacing:.05em;
text-transform:uppercase; color:var(--iv-ink-faint) !important; font-weight:500;
}
.product-features .data-sheet dd,.product-features table td,.data-sheet dd{
font-family:var(--iv-mono) !important; color:var(--iv-ink) !important;
}
.product-availability,.product-quantities .label,#stock_availability .in-stock{
color:var(--iv-primary) !important; font-weight:600;
}
.product-add-to-cart .qty .bootstrap-touchspin,.input-group.bootstrap-touchspin,
.product-quantity #quantity_wanted{
border:1.5px solid var(--iv-line-strong) !important; border-radius:999px !important;
background:var(--iv-surface) !important; color:var(--iv-ink) !important;
}
.tabs .nav-tabs,.product-tabs .nav-tabs,
.product_info_tabs .nav-tabs,.sttab_block .nav-tabs{ border-bottom:1px solid var(--iv-line) !important; }
.tabs .nav-tabs .nav-link,.product-tabs .nav-link,
.product_info_tabs .nav-tabs .nav-link,.sttab_block .nav-tabs .nav-link{
font-family:var(--iv-display) !important; color:var(--iv-ink-soft) !important; font-weight:700;
border:0 !important;background:transparent !important;position:relative;
}
.tabs .nav-tabs .nav-link.active,.product-tabs .nav-link.active,
.product_info_tabs .nav-tabs .nav-link.active,.sttab_block .nav-tabs .nav-link.active{
color:var(--iv-ink) !important;
}
/* mismo degradado de espectro que .breadcrumb_spacing, como subrayado del tab activo */
.tabs .nav-tabs .nav-link.active::after,.product-tabs .nav-link.active::after,
.product_info_tabs .nav-tabs .nav-link.active::after,.sttab_block .nav-tabs .nav-link.active::after{
content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:3px;
background:var(--iv-spectrum);
}
/* divisor entre el breadcrumb y el contenido: la misma barra de espectro */
.breadcrumb_spacing{
height:3px;background:var(--iv-spectrum);border-radius:3px;margin:0 0 18px;
}
/* ---------------- BLOQUES / TARJETAS / FORMS ---------------- */
.page-content,.card,.block,.st_block,.checkout-step,.cart-summary,
.cart-grid-body,.cart-item,.address,.block-categories,#authentication .card{
background:var(--iv-surface);
border-radius:var(--iv-radius);
border:1px solid var(--iv-line) !important;
}
.breadcrumb,.breadcrumb ol{ background:transparent; }
.breadcrumb a,.breadcrumb li::after,.breadcrumb li a span{ color:var(--iv-ink-faint); font-family:var(--iv-mono); font-size:.78rem; }
input.form-control,select.form-control,textarea.form-control,.input-group .form-control,
.form-control:not([type=checkbox]):not([type=radio]){
background:var(--iv-surface-2) !important;
border:1px solid var(--iv-line-strong) !important;
color:var(--iv-ink) !important;
border-radius:var(--iv-radius-sm) !important;
}
input.form-control::placeholder,textarea.form-control::placeholder{ color:var(--iv-ink-faint); }
input.form-control:focus,select.form-control:focus,textarea.form-control:focus{
border-color:var(--iv-blue) !important;
box-shadow:0 0 0 3px color-mix(in srgb, var(--iv-blue) 28%, transparent) !important;
}
.custom-checkbox input[type=checkbox]:checked + span,.psgdpr_consent_message .custom-checkbox span.checked{
background:var(--iv-primary) !important; border-color:var(--iv-primary) !important;
}
.alert-success{ background:color-mix(in srgb,var(--iv-primary) 15%,var(--iv-surface)) !important; border-color:var(--iv-primary) !important; color:var(--iv-ink) !important; }
.alert-warning{ background:color-mix(in srgb,#E8B34D 15%,var(--iv-surface)) !important; border-color:#E8B34D !important; color:var(--iv-ink) !important; }
.alert-danger{ background:color-mix(in srgb,#ff5c7a 14%,var(--iv-surface)) !important; border-color:#ff5c7a !important; color:var(--iv-ink) !important; }
/* ==========================================================================
CARRITO + CHECKOUT
========================================================================== */
/* matar fondos blancos residuales del checkout / cart */
.cart-grid,.cart-grid-right,.cart-grid-body,.checkout,#checkout,
.cart-summary,.cart-detailed,.card,.checkout-process,.order-confirmation,
#js-checkout-summary,.checkout-summary,#order-summary-content,
.page-cart #content-wrapper,.page-order #content-wrapper,.page-order-confirmation #content-wrapper{
background:transparent !important;
}
/* panel de resumen (derecha) */
.cart-summary,#cart-summary,.checkout-summary,#js-checkout-summary,.card.cart-summary{
background:var(--iv-surface) !important;border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;
}
.cart-summary-line,.cart-total,.summary-selected-carrier{ color:var(--iv-ink-soft) !important; }
.cart-summary-line .value,.cart-total .value,.cart-summary-line .label{ color:var(--iv-ink) !important; font-family:var(--iv-mono); }
.cart-summary-line.cart-total .value,.cart-total .value{ color:var(--iv-primary) !important;font-weight:600; }
.cart-summary-subtotals-container,.cart-summary-totals{ border-color:var(--iv-line) !important; }
/* filas de producto del carrito */
.cart-item,.cart-items .cart-item{
background:var(--iv-surface) !important;border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;
}
.cart-grid-body .card,.cart-overview{ background:transparent !important;border:0 !important; }
.product-line-grid{ align-items:center; }
.cart-line-product-actions .remove-from-cart,.cart-line-product-actions i{ color:var(--iv-ink-faint) !important; }
.cart-line-product-actions .remove-from-cart:hover{ color:var(--iv-accent) !important; }
.product-price .price,.cart__item .price,.cart-item .price{ font-family:var(--iv-mono) !important;color:var(--iv-primary) !important; }
/* stepper de cantidad */
.js-cart-line-product-quantity,.input-group.bootstrap-touchspin,.product-quantity .qty,
.cart-line-product-quantity .input-group{
border:1.5px solid var(--iv-line-strong) !important;border-radius:999px !important;
background:var(--iv-surface-2) !important;overflow:hidden;display:inline-flex;align-items:center;
}
.bootstrap-touchspin input,.js-cart-line-product-quantity{
background:transparent !important;border:0 !important;color:var(--iv-ink) !important;
text-align:center;font-family:var(--iv-mono) !important;width:48px !important;box-shadow:none !important;
font-size:1rem !important;
}
/* +/− grandes y visibles: se ocultaba el ícono chico de Bootstrap TouchSpin;
ahora se ponen los dos botones a los lados del input, con signos +/- dibujados
por CSS para que se vean siempre, sea cual sea el ícono que traiga el tema. */
.input-group.bootstrap-touchspin,.product-add-to-cart .qty .bootstrap-touchspin,
.js-cart-line-product-quantity-input,.qty_wrap .input-group,
.s_quantity_wanted .bootstrap-touchspin,.qty_wrap.bootstrap-touchspin{
display:flex !important;align-items:center;justify-content:center;gap:6px;
position:relative !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;
}
.input-group-btn-vertical{
display:contents !important; /* los botones pasan a ser hermanos flex directos */
position:static !important;width:auto !important;height:auto !important;
}
.bootstrap-touchspin-down,.js-touchspin-down,[data-action="down"]{ order:0 !important; }
.bootstrap-touchspin input,.js-cart-line-product-quantity,#quantity_wanted,.pro_quantity{ order:1 !important; }
.bootstrap-touchspin-up,.js-touchspin-up,[data-action="up"]{ order:2 !important; }
.bootstrap-touchspin .btn,.bootstrap-touchspin-up,.bootstrap-touchspin-down,
.js-touchspin,.input-group-btn-vertical .btn,
[data-action="up"],[data-action="down"]{
background:var(--iv-raise-2) !important;border:1.5px solid var(--iv-line-strong) !important;
color:transparent !important; /* se oculta el glyph original */
width:34px !important;height:34px !important;min-width:34px !important;max-width:34px !important;
border-radius:999px !important;box-shadow:none !important;
position:relative !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;
margin:0 !important;flex:none !important;float:none !important;
display:grid !important;place-items:center;font-size:0 !important;line-height:1 !important;
transform:none !important;
}
.bootstrap-touchspin-up::after,.js-touchspin-up::after,[data-action="up"]::after,
.bootstrap-touchspin-down::after,.js-touchspin-down::after,[data-action="down"]::after{
position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
font-weight:700;color:var(--iv-ink);line-height:1;
}
.bootstrap-touchspin-up::after,.js-touchspin-up::after,[data-action="up"]::after{
content:"+";font-size:1.3rem;
}
.bootstrap-touchspin-down::after,.js-touchspin-down::after,[data-action="down"]::after{
content:"\2212";font-size:1.1rem;
}
.bootstrap-touchspin .btn:hover,.bootstrap-touchspin-up:hover,.bootstrap-touchspin-down:hover{
border-color:var(--iv-primary) !important;
}
.bootstrap-touchspin .btn:hover::after{ color:var(--iv-primary) !important; }
/* selector de cantidad en la tarjeta del catálogo: mismo estilo, compacto */
.s_quantity_wanted.qty_wrap{ width:auto !important;margin:0 0 10px !important; }
.s_quantity_wanted .pro_quantity,.pro_quantity{
width:40px !important;height:34px !important;order:1 !important;
background:transparent !important;border:0 !important;color:var(--iv-ink) !important;
text-align:center;font-family:var(--iv-mono) !important;font-size:.9rem !important;box-shadow:none !important;
}
/* BOTONES del carrito/checkout */
.cart-detailed-actions .btn,.checkout-cart .btn,.cart-summary .btn,
.checkout a.btn,#cart .checkout .btn,.checkout-btn,
a[href*="?controller=order"],.continue.btn,
.text-sm-center .btn-primary,button[name="continue"],.form-footer .btn,
#conditions-to-approve ~ .form-footer .btn,.checkout-summary-btn{
background:var(--iv-primary) !important;border:1.5px solid var(--iv-primary) !important;
color:var(--iv-on-primary) !important;border-radius:999px !important;
font-family:var(--iv-font) !important;font-weight:800 !important;letter-spacing:.02em;
box-shadow:var(--n-glow-green) !important;text-transform:none !important;
padding:13px 24px !important;
}
.cart-detailed-actions .btn:hover,.checkout-btn:hover,.checkout a.btn:hover,
button[name="continue"]:hover,.form-footer .btn:hover{
filter:brightness(1.07);transform:translateY(-2px);box-shadow:0 0 30px -4px rgba(47,227,138,.7) !important;
}
/* "Seguir comprando" = ghost (NO ".label": esa clase es de etiquetas de
formulario del checkout — texto plano, sin reacción al mouse) */
.continue-shopping,a.continue-shopping,.cart-detailed-actions a.continue-shopping,
[href*="controller=category"].btn,.btn.text-uppercase.btn-tertiary{
background:transparent !important;border:1.5px solid var(--iv-line-strong) !important;
color:var(--iv-ink) !important;border-radius:999px !important;box-shadow:none !important;
font-weight:700 !important;
}
.continue-shopping:hover{ border-color:var(--iv-accent) !important;color:var(--iv-accent) !important; }
/* .label = etiqueta de texto (checkbox/campo), NO un botón: sin fondo,
sin borde, sin cambio de color al pasar el mouse (el click para marcar
el checkbox asociado sigue funcionando). */
.label,label.label,.checkout .label,.custom-checkbox .label{
background:transparent !important;border:0 !important;box-shadow:none !important;
color:var(--iv-ink-soft) !important;font-weight:600 !important;border-radius:0 !important;
padding:0 !important;transform:none !important;
}
.label:hover{ background:transparent !important;color:var(--iv-ink-soft) !important;transform:none !important; }
.label a{ color:var(--iv-accent) !important;text-decoration:underline; } /* el link de "términos y condiciones" sí se ve clicable */
/* header propio del checkout (páginas de pedido) */
.checkout_header{
background:var(--iv-surface) !important;
border-bottom:3px solid transparent;border-image:var(--iv-spectrum) 1;
}
.checkout_header #checkout_header_wrap{ min-height:70px;align-items:center;justify-content:space-between; }
.checkout_header .shop_logo img.logo{ height:38px !important;width:auto !important; }
.tn-checkout-trust{ display:flex;align-items:center;margin-left:auto; }
/* sin "pill" (sin borde ni fondo): solo el punto pulsante + ícono + texto en línea */
.tn-checkout-trust__pill{
display:inline-flex;align-items:center;gap:8px;
font-family:var(--iv-mono);font-size:.78rem;font-weight:700;letter-spacing:.02em;
color:var(--iv-ink-soft);
}
.tn-checkout-trust svg{ width:16px;height:16px;fill:none;stroke:var(--iv-primary);stroke-width:1.6;flex:none; }
.tn-checkout-trust .dot{
width:7px;height:7px;border-radius:50%;background:var(--iv-primary);flex:none;
box-shadow:0 0 0 0 rgba(47,227,138,.45);
animation:tnPillPulse 2.6s ease-out infinite;
}
@keyframes tnPillPulse{
0%{ box-shadow:0 0 0 0 rgba(47,227,138,.45); }
70%{ box-shadow:0 0 0 10px rgba(47,227,138,0); }
100%{ box-shadow:0 0 0 0 rgba(47,227,138,0); }
}
@media (prefers-reduced-motion:reduce){ .tn-checkout-trust .dot{ animation:none; } }
/* checkbox "retira en tienda" en el paso de direcciones */
.tn-pickup{
margin:0 0 18px !important;padding:14px 16px !important;
background:var(--iv-surface-2) !important;border:1px dashed var(--iv-line-strong) !important;
border-radius:var(--iv-radius) !important;
}
.tn-pickup__label{ display:flex !important;gap:12px;align-items:flex-start;cursor:pointer;margin:0 !important;font-weight:400 !important; }
.tn-pickup__check{ margin-top:3px;accent-color:var(--iv-primary);width:18px;height:18px;flex:none; }
.tn-pickup__label span{ font-size:.88rem;color:var(--iv-ink-soft); }
.tn-pickup__label strong{ color:var(--iv-ink); }
.checkout_header_right,.checkout_header .header_item,.checkout_header a{ color:var(--iv-ink-soft) !important; }
.tn-back-to-shop{
display:inline-flex !important;align-items:center;gap:8px;margin-left:14px;
background:transparent !important;border:1.5px solid var(--iv-line-strong) !important;
border-radius:999px !important;padding:9px 16px !important;
font-family:var(--iv-font);font-weight:700;font-size:.82rem;color:var(--iv-ink) !important;
text-decoration:none !important;transition:border-color .15s,color .15s;
}
.tn-back-to-shop svg{ width:15px;height:15px; }
.tn-back-to-shop:hover{ border-color:var(--iv-accent) !important;color:var(--iv-accent) !important; }
@media (max-width:600px){ .tn-back-to-shop span{ display:none; } }
/* selector +/- de cantidad: cobertura universal (mini-carrito, carrito, cualquier
instancia de Bootstrap TouchSpin en el sitio, tenga o no nuestras clases) */
.input-group:has(> .input-group-btn-vertical),
.input-group:has(.input-group-btn-vertical){
display:flex !important;align-items:center;justify-content:flex-start;gap:6px;
}
.input-group-btn-vertical{
display:flex !important;position:static !important;width:auto !important;height:auto !important;
}
.input-group-btn-vertical > .btn,.input-group-btn-vertical > button{
position:relative !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;
width:30px !important;height:30px !important;min-width:30px !important;margin:0 !important;flex:none !important;
border-radius:50% !important;background:var(--iv-raise-2) !important;border:1.5px solid var(--iv-line-strong) !important;
color:transparent !important;font-size:0 !important;display:grid !important;place-items:center;
}
.input-group-btn-vertical > .btn:first-child::after,.input-group-btn-vertical > button:first-child::after{
content:"\2212";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
font-size:1rem;font-weight:700;color:var(--iv-ink);
}
.input-group-btn-vertical > .btn:last-child::after,.input-group-btn-vertical > button:last-child::after{
content:"+";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
font-size:1.1rem;font-weight:700;color:var(--iv-ink);
}
/* ==========================================================================
STEPPER DE CANTIDAD DEL CARRITO — control nuevo, independiente del sistema
de Bootstrap TouchSpin (que no se comporta igual en el mini-carrito que en
el resto del sitio). Lo arma el JS (tn-qty), acá solo el estilo.
========================================================================== */
.tn-qty{
display:inline-flex !important;align-items:center;gap:0;flex:none;
background:var(--iv-surface-2);border:1.5px solid var(--iv-line-strong);
border-radius:999px;overflow:hidden;height:32px;
}
.tn-qty__btn{
display:flex;align-items:center;justify-content:center;flex:none;
width:30px;height:32px;font-size:1.1rem;font-weight:700;line-height:1;
color:var(--iv-ink) !important;text-decoration:none !important;cursor:pointer;
transition:background .15s,color .15s;
}
.tn-qty__btn:hover{ background:var(--iv-raise-2);color:var(--iv-primary) !important; }
.tn-qty__btn.is-disabled{
color:var(--iv-ink-faint) !important;cursor:not-allowed;pointer-events:none;opacity:.5;
}
.tn-qty__num{
min-width:26px;text-align:center;font-family:var(--iv-mono);font-size:.86rem;
font-weight:600;color:var(--iv-ink);padding:0 2px;
}
/* ==========================================================================
CHECKOUT EN MODO PESTAÑAS (no acordeón vertical)
========================================================================== */
.tn-checkout-tabs{
display:flex !important;flex-wrap:wrap;align-items:stretch;
background:var(--iv-surface);border:1px solid var(--iv-line);border-radius:var(--iv-radius);
overflow:hidden;margin-bottom:14px;
}
.tn-checkout-tabs .checkout-step{ display:contents; }
.tn-checkout-tabs .checkout-step .step-title{
order:1;flex:1 1 0;min-width:150px;margin:0 !important;padding:16px 14px !important;
border:0 !important;border-bottom:3px solid transparent !important;background:transparent !important;
cursor:pointer;justify-content:center !important;
}
.tn-checkout-tabs .checkout-step .step-title .heading_color{
display:flex !important;flex-direction:row !important;align-items:center;gap:10px;
font-size:.9rem !important;justify-content:center;text-align:left;white-space:nowrap;
}
.tn-checkout-tabs .checkout-step .step-title .step-number{
order:-1; /* numero primero, nombre al lado, nunca arriba/abajo */
}
.tn-checkout-tabs .checkout-step .step-title .step-edit{ display:none !important; }
.tn-checkout-tabs .checkout-step:not(.-current) .step-title:hover{ background:var(--iv-raise-2) !important; }
.tn-checkout-tabs .checkout-step.-current .step-title{
border-bottom-color:var(--iv-primary) !important;background:var(--iv-raise-2) !important;
}
.tn-checkout-tabs .checkout-step.-current .step-title .heading_color{ color:var(--iv-ink) !important; }
.tn-checkout-tabs .checkout-step.-complete .step-title .step-number{
background:var(--iv-primary) !important;color:var(--iv-on-primary) !important;
}
.tn-checkout-tabs .checkout-step:not(.-current):not(.-complete):not(.-reachable) .step-title{
opacity:.45;cursor:not-allowed;
}
.tn-checkout-tabs .checkout-step .content{
order:2;flex:1 1 100%;display:none;border-top:1px solid var(--iv-line);
}
.tn-checkout-tabs .checkout-step.-current .content{ display:block; }
@media (max-width:700px){
.tn-checkout-tabs .checkout-step .step-title{ min-width:auto;font-size:.78rem; }
.tn-checkout-tabs .checkout-step .step-title .heading_color{ font-size:.78rem !important;flex-direction:column;gap:4px; }
}
/* botón de Google (placeholder) + separador social */
.tn-social-login{
display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px 22px 4px;
}
.tn-google-btn{
display:inline-flex;align-items:center;gap:10px;
background:#fff;color:#1f1f1f;border:1px solid var(--iv-line-strong);border-radius:999px;
padding:10px 18px;font-family:var(--iv-font);font-weight:700;font-size:.86rem;
text-decoration:none;cursor:not-allowed;opacity:.92;
}
.tn-google-btn svg{ width:18px;height:18px; }
.tn-google-btn:hover{ text-decoration:none;filter:brightness(.97); }
.tn-social-login__note{ font-family:var(--iv-mono);font-size:.7rem;color:var(--iv-ink-faint); }
/* bloque "Crear una cuenta (opcional)" — al final, aparte del flujo principal */
.tn-create-account{
margin:22px !important;padding:18px !important;
border:1px dashed var(--iv-line-strong) !important;border-radius:var(--iv-radius) !important;
background:var(--iv-surface-2) !important;
}
.tn-create-account__head{ display:flex;flex-direction:column;gap:2px;margin-bottom:14px; }
.tn-create-account__title{ font-family:var(--iv-display);font-weight:800;color:var(--iv-ink); }
.tn-create-account__title em{ font-style:normal;color:var(--iv-ink-faint);font-weight:500; }
.tn-create-account__hint{ font-size:.85rem;color:var(--iv-ink-soft); }
/* campo contraseña con más presencia — genérico, cualquier password del sitio */
.field-password-policy .form-control,
.tn-create-account input[type="password"],
.input-group:has(input[type="password"]) .form-control,
input[type="password"].form-control{
background:var(--iv-surface) !important;border:1.5px solid var(--iv-line-strong) !important;
border-radius:999px 0 0 999px !important;padding-left:18px !important;
}
input[type="password"].form-control:not(.input-group *){ border-radius:999px !important; }
.field-password-policy .input-group-append,
.tn-create-account .input-group-append,
.input-group:has(input[type="password"]) .input-group-append{
background:transparent !important;
}
.field-password-policy .input-group-append .btn,
.tn-create-account .input-group-append .btn,
.input-group:has(input[type="password"]) .input-group-append .btn{
background:var(--iv-surface) !important;border:1.5px solid var(--iv-line-strong) !important;
border-left:0 !important;border-radius:0 999px 999px 0 !important;
color:var(--iv-accent) !important;box-shadow:none !important;
}
.field-password-policy .input-group-append .btn i,
.input-group:has(input[type="password"]) .input-group-append .btn i,
.field-password-policy .input-group-append .btn svg,
.input-group:has(input[type="password"]) .input-group-append .btn svg{
color:var(--iv-accent) !important;fill:var(--iv-accent) !important;
}
.field-password-policy .input-group-append .btn:hover,
.input-group:has(input[type="password"]) .input-group-append .btn:hover{ color:var(--iv-primary) !important; }
.password-policy-hint,.password-strength{ font-family:var(--iv-mono);font-size:.72rem;color:var(--iv-ink-faint); }
/* checkbox de consentimiento de Política de Privacidad (registro / checkout invitado) */
.tn-privacy-consent{
display:flex !important;align-items:flex-start;gap:10px;margin:4px 0 16px;cursor:pointer;
font-size:.82rem;line-height:1.45;color:var(--iv-ink-soft);
}
.tn-privacy-consent input[type="checkbox"]{
flex:none;margin-top:3px;width:16px;height:16px;accent-color:var(--iv-primary);cursor:pointer;
}
.tn-privacy-consent a{ color:var(--iv-blue) !important;text-decoration:underline;text-underline-offset:2px; }
.tn-privacy-consent a:hover{ color:var(--iv-accent) !important; }
/* "¿Olvidaste tu contraseña?" como botón, en el login del front */
.forgot-password{
display:inline-flex !important;align-items:center;justify-content:center;
width:100%;margin:10px 0 4px;padding:9px 16px !important;
border:1.5px solid var(--iv-line-strong) !important;border-radius:999px !important;
color:var(--iv-ink-soft) !important;font-size:.82rem;font-weight:600;text-decoration:none !important;
transition:border-color .15s,color .15s,background .15s;
}
.forgot-password:hover{
border-color:var(--iv-accent) !important;color:#fff !important;
background:color-mix(in srgb, var(--iv-accent) 22%, transparent) !important;
}
/* variante independiente del social-login (fuera del checkout) */
.tn-social-login--standalone{
flex-direction:column;padding:18px 0 0;align-items:stretch;text-align:center;
}
.tn-social-login--standalone .tn-social-login__or{
display:block;margin:0 auto 14px;color:var(--iv-ink-faint);font-family:var(--iv-mono);font-size:.72rem;
text-transform:uppercase;letter-spacing:.1em;position:relative;
}
.tn-social-login--standalone .tn-google-btn{ width:100%;justify-content:center;cursor:not-allowed; }
/* ---- pasos del checkout ---- */
.checkout-step,section.checkout-step{
background:var(--iv-surface) !important;border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;margin-bottom:14px !important;overflow:visible;
}
/* columnas del checkout: mismo fondo oscuro */
.checkout_left_column,.checkout_right_column,
.checkout-left-column,.checkout-right-column,
#checkout .col-left,#checkout .col-right{
background:transparent !important;
}
.checkout_left_column .card,.checkout_right_column .card{
background:var(--iv-surface) !important;
}
.checkout-step .step-title,.checkout-step .step-number,
.checkout-step h1,.checkout-step h2,.step-title{
color:var(--iv-ink) !important;font-family:var(--iv-display) !important;font-weight:800 !important;
}
.checkout-step .step-title{ display:flex;align-items:center;gap:12px;padding:20px 22px !important;font-size:1.05rem !important; }
.checkout-step .step-number{
width:28px;height:28px;border-radius:50%;display:grid;place-items:center;flex:none;
background:var(--iv-raise-2);border:1px solid var(--iv-line-strong);
font-family:var(--iv-mono) !important;font-size:.85rem !important;color:var(--iv-ink-soft) !important;
}
.checkout-step.-current .step-number,.checkout-step.-current .step-title .step-number{
background:var(--iv-primary) !important;border-color:var(--iv-primary) !important;color:var(--iv-on-primary) !important;
box-shadow:var(--n-glow-green);
}
.checkout-step.-current{ border-color:var(--iv-line-strong) !important; }
.checkout-step.-current::before{
content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--iv-spectrum);
}
.checkout-step{ position:relative; }
.checkout-step.-complete .step-number,.checkout-step.-reachable .step-number{
background:color-mix(in srgb,var(--iv-primary) 20%,transparent) !important;color:var(--iv-primary) !important;border-color:transparent !important;
}
.checkout-step .step-edit{ color:var(--iv-accent) !important;font-family:var(--iv-mono);font-size:.75rem; }
.checkout-step .content{ padding:0 22px 22px !important; }
/* tabs invitado / login */
#checkout-personal-information-step .nav-tabs,.checkout .nav-tabs{
border-bottom:1px solid var(--iv-line) !important;gap:4px;
}
.checkout .nav-tabs .nav-link,#checkout-personal-information-step .nav-link{
color:var(--iv-ink-soft) !important;font-family:var(--iv-display) !important;font-weight:700 !important;
border:0 !important;border-bottom:2px solid transparent !important;background:transparent !important;padding:12px 16px !important;
}
.checkout .nav-tabs .nav-link.active,#checkout-personal-information-step .nav-link.active{
color:var(--iv-ink) !important;border-bottom:2px solid transparent !important;
border-image:var(--iv-spectrum) 1 !important;
}
/* iconos de validación rojos "..." → discretos */
.form-control-comment,.input-group .form-control-comment{ color:var(--iv-ink-faint) !important; }
.js-invalid-feedback-browser,.help-block{ color:#ff8aa0 !important;font-size:.78rem; }
.input-group-append .form-control-feedback,.has-danger .form-control-feedback{ display:none !important; }
/* método de envío / pago */
.delivery-option,.payment-option,.payment-options label{
background:var(--iv-surface-2) !important;border:1px solid var(--iv-line) !important;border-radius:var(--iv-radius-sm) !important;
}
.delivery-option.-current,.payment-option.-current{ border-color:var(--iv-primary) !important; }
#order-summary-content,.order-confirmation-table{ background:transparent !important; }
/* recuadros blancos residuales de Bootstrap dentro del checkout (las
"puntas blancas" / franjas claras entre pasos) */
.checkout-step .select-field div,.checkout-step .select-field,
.card,.card-header,.card-footer,.card-body,
.dropdown-menu,.custom-select,.custom-file-control,
.checkout .active,.checkout .page-link,.input-group-addon,
.js-address-form,.address-item,.js-payment,.condition-label{
background-color:var(--iv-surface-2) !important;color:var(--iv-ink) !important;
border-color:var(--iv-line) !important;
}
.checkout-step select.form-control,.checkout-step .custom-select{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23B9A6C1' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") !important;
}
.checkout-step hr,.checkout-step .separator{ border-color:var(--iv-line) !important;opacity:1; }
/* ---- ventana modal (términos y condiciones, etc.) ---- */
.modal{ position:fixed !important;inset:0 !important;z-index:2147483000 !important;overflow-y:auto !important; }
.modal-backdrop{ position:fixed !important;inset:0 !important;background:rgba(6,4,12,.7) !important;z-index:2147482999 !important; }
.modal-dialog{
width:min(680px,92vw) !important;max-width:none !important;margin:40px auto !important;
position:relative;
}
.modal-content{
background:var(--iv-surface) !important;color:var(--iv-ink) !important;
border:1px solid var(--iv-line) !important;border-radius:var(--iv-radius) !important;
box-shadow:var(--iv-shadow-2) !important;max-height:82vh;display:flex;flex-direction:column;
}
.modal-content .js-modal-content{
padding:28px 30px !important;overflow-y:auto;color:var(--iv-ink-soft) !important;line-height:1.6;
}
.modal-content .js-modal-content h1,.modal-content .js-modal-content h2,.modal-content .js-modal-content h3{
color:var(--iv-ink) !important;font-family:var(--iv-display) !important;
}
.modal-content .js-modal-content a{ color:var(--iv-accent) !important; }
.st_modal_close{
position:absolute;top:14px;right:14px;z-index:2;
width:38px;height:38px;border-radius:10px;display:grid;place-items:center;
background:var(--iv-raise-2) !important;border:1px solid var(--iv-line) !important;
color:var(--iv-ink) !important;opacity:1 !important;font-size:1.1rem;
}
.st_modal_close:hover{ color:var(--iv-accent) !important;border-color:var(--iv-accent) !important; }
/* ---------------- FOOTER ---------------- */
.page-footer,#footer,.footer-container,
#footer.footer-container,#footer-secondary-container,#footer-tertiary-container{
background:var(--iv-surface) !important;
color:var(--iv-ink-soft);
border-top:1px solid var(--iv-line);
position:relative;
}
#footer::before{ content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--iv-spectrum); }
.footer_first_level_row{ border-color:var(--iv-line) !important; }
.footer_block .title_block,.footer_block h3,
#footer .footer_block .st_block_title,#footer h3,#footer h4{
font-family:var(--iv-display) !important; color:var(--iv-ink) !important;
font-weight:700; font-size:.95rem; letter-spacing:-.01em; text-transform:none;
}
.footer_block,.footer_block.block{ border:0 !important; background:transparent !important; }
.footer_block_content,.footer_block .style_content,.footer_block_content.base_list_line{
color:var(--iv-ink-soft) !important; font-size:.88rem; line-height:1.6;
}
#footer .footer_block a,#footer .footer_block_content a,#footer .dropdown_list_item,
.footer_block .custom_links_list a,.stlinkgroups_links_footer a,.stlinkgroups_links_footer .dropdown_list_item{
color:var(--iv-ink-soft) !important; text-decoration:none !important; transition:color .15s var(--iv-ease);
font-size:.88rem !important;padding:0 !important;background:transparent !important;
}
#footer .footer_block a:hover,.footer_block .custom_links_list a:hover,
.stlinkgroups_links_footer a:hover,.stlinkgroups_links_footer .dropdown_list_item:hover{ color:var(--iv-primary) !important; }
/* columnas del footer: un poco más de aire y separador sutil entre ellas */
.footer_first_level_row{ padding-top:36px !important;padding-bottom:8px !important; }
.stlinkgroups_links_footer,#footer .footer_block{
padding:0 24px !important;border-left:1px solid var(--iv-line);
}
.stlinkgroups_links_footer:first-child,#footer .footer_block:first-child{ border-left:0; }
.stlinkgroups_links_footer ul,.dropdown_list_ul{ display:grid;gap:9px;list-style:none;margin:0 !important;padding:0 !important; }
#footer .newsletter_text,.stlinkgroups_links_footer p{ color:var(--iv-ink-soft) !important;font-size:.86rem;line-height:1.55; }
.footer_block_content.bullet li::before,.custom_links_list.bullet li::before{ color:var(--iv-accent) !important; }
.footer_block_content .line_free li,.base_list_line li{ border-color:var(--iv-line) !important; }
#st_news_letter_1 .form-control,#footer input[type="email"],#footer input[type="text"]{
background:var(--iv-surface-2) !important; border:1px solid var(--iv-line-strong) !important;
color:var(--iv-ink) !important; border-radius:999px !important;
}
#st_news_letter_1 .btn,#footer .newsletter-input-group .btn,#footer button[type="submit"]{
background:var(--iv-primary) !important; border-color:var(--iv-primary) !important;
color:var(--iv-on-primary) !important; border-radius:999px !important;
font-family:var(--iv-font); font-weight:700; box-shadow:var(--n-glow-green);
}
/* quita la línea decorativa (punteada/discontinua) que el tema pone antes de
los títulos de sección ("Novedades", categorías, etc.) — venía de
.title_block .flex_child con border-bottom sólido/discontinuo según el
estilo de título elegido en el tema */
.title_block .flex_child,
.title_style_1 .flex_child,.title_style_2 .flex_child,
.title_style_3 .flex_child,.title_style_4 .flex_child{
display:none !important;
}
/* checkbox de consentimiento (boletín / contacto / reseñas) */
.gdpr_consent{ margin:2px 0 12px; }
.gdpr_consent .custom-checkbox{ display:block; }
.gdpr_consent label.psgdpr_consent_message{
display:flex !important;align-items:flex-start;gap:9px;cursor:pointer;margin:0;
font-size:.8rem;line-height:1.5;color:var(--iv-ink-soft) !important;
}
.gdpr_consent input[type="checkbox"]{
flex:none;margin-top:3px;width:16px;height:16px;accent-color:var(--iv-primary);cursor:pointer;
}
.gdpr_consent .psgdpr_consent_icon{ display:none; } /* icon-font redundante: usamos el checkbox nativo */
/* boletín (footer): input + botón como una sola cápsula, sin el recuadro
rojo suelto que dejaba el icon-font sin cargar entre ambos */
.st_news_letter_form_inner .input-group{
display:flex !important;align-items:stretch;flex-wrap:nowrap;
background:var(--iv-surface-2) !important;border:1px solid var(--iv-line-strong) !important;
border-radius:999px !important;overflow:hidden;padding:0 !important;
}
.st_news_letter_form_inner .st_news_letter_input.form-control{
flex:1 1 auto;min-width:0;background:transparent !important;border:0 !important;
border-radius:0 !important;color:var(--iv-ink) !important;padding:11px 16px !important;
box-shadow:none !important;
}
.st_news_letter_form_inner .input-group-btn{
display:flex !important;flex:none;background:transparent !important;width:auto !important;
position:static !important;
}
.st_news_letter_form_inner .st_news_letter_submit.btn{
flex:none;width:42px;height:42px;margin:3px 3px 3px 0 !important;padding:0 !important;
display:flex !important;align-items:center;justify-content:center;
background:var(--iv-primary) !important;border:0 !important;border-radius:50% !important;
color:var(--iv-on-primary) !important;box-shadow:none !important;
}
.st_news_letter_form_inner .st_news_letter_submit.btn:hover{ filter:brightness(1.08); }
/* ícono de sobre dibujado en SVG (no depende del icon-font, que a veces no carga) */
.st_news_letter_form_inner .st_news_letter_submit i{ font-size:0;line-height:0; }
.st_news_letter_form_inner .st_news_letter_submit i::before{
content:"";display:block;width:17px;height:17px;
background-color:var(--iv-on-primary);
-webkit-mask:url('data:image/svg+xml;utf8,') center/contain no-repeat;
mask:url('data:image/svg+xml;utf8,') center/contain no-repeat;
}
#footer .stsocial a,.footer_block .social-links a,#footer .social a{
color:var(--iv-ink-soft) !important; border:1px solid var(--iv-line) !important;
border-radius:999px !important; background:var(--iv-surface-2) !important;
transition:color .15s var(--iv-ease), border-color .15s, box-shadow .2s;
}
#footer .stsocial a:hover,.footer_block .social-links a:hover{
color:var(--iv-primary) !important; border-color:var(--iv-primary) !important; box-shadow:var(--n-glow-green);
}
#footer-bottom,#footer-bottom-container,.footer-bottom{
background:var(--iv-ground) !important; color:var(--iv-ink-faint) !important;
border-top:1px solid var(--iv-line) !important; font-size:.82rem; font-family:var(--iv-mono);
}
#footer-bottom a{ color:var(--iv-ink-soft) !important; }
#footer-bottom a:hover{ color:var(--iv-primary) !important; }
#footer-bottom img.st_payment_icon{ display:none !important; } /* tarjetas genéricas: no aplican, se usan medios reales */
/* medios de pago reales de Tricomar */
.tn-pay-list{ display:flex;gap:8px;flex-wrap:wrap;align-items:center; }
.tn-pay{
display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;
font-family:var(--iv-mono);font-size:.72rem;font-weight:600;letter-spacing:.02em;
border:1px solid var(--iv-line-strong);background:var(--iv-surface-2);color:var(--iv-ink-soft);
}
.tn-pay svg{ width:14px;height:14px;flex:none; }
.tn-pay--webpay{ color:#ff3d3d;border-color:rgba(255,61,61,.4); }
.tn-pay--mp{ color:#00b1ea;border-color:rgba(0,177,234,.4); }
.tn-pay--transfer{ color:var(--iv-primary);border-color:rgba(47,227,138,.4); }
/* volver arriba */
#back_to_top,.back-to-top,#st_scroll_top{
background:var(--iv-spectrum) !important; color:#fff !important; border:0 !important;
border-radius:999px !important; box-shadow:var(--iv-spectrum-glow) !important;
}
/* ---------------- TOGGLE DÍA/NOCHE (inyectado por theme-mode.js) ---------------- */
#tricomar-mode{
position:fixed; right:14px; bottom:14px; z-index:9990;
display:flex; gap:2px; padding:4px;
background:var(--iv-surface); border:1px solid var(--iv-line);
border-radius:999px; box-shadow:var(--iv-shadow-2); font-family:var(--iv-font);
}
#tricomar-mode button{
border:0; background:transparent; cursor:pointer; width:34px; height:34px;
border-radius:999px; display:grid; place-items:center; color:var(--iv-ink-soft);
transition:background .15s var(--iv-ease), color .15s, box-shadow .2s;
}
#tricomar-mode button:hover{ color:var(--iv-ink); }
#tricomar-mode button[aria-pressed="true"]{ background:var(--iv-raise-2); color:var(--iv-primary); box-shadow:var(--n-glow-green); }
#tricomar-mode svg{ width:17px; height:17px; }
@media (max-width:575px){ #tricomar-mode{ right:10px; bottom:70px; } }
@media (prefers-reduced-motion:reduce){ *{ transition:none !important; animation:none !important; } }
/* ==========================================================================
HERO del home + tarjeta "Visítanos" · neón nocturno
========================================================================== */
.ti-btn{
display:inline-flex;align-items:center;gap:8px;
font-family:var(--iv-font);font-weight:700;font-size:.95rem;
padding:13px 22px;border-radius:999px;
border:1.5px solid transparent;text-decoration:none;cursor:pointer;
transition:transform .15s var(--iv-ease),box-shadow .2s,border-color .15s,color .15s,filter .15s;
}
.ti-btn--primary{ background:var(--iv-primary);color:var(--iv-on-primary);box-shadow:var(--n-glow-green); }
.ti-btn--primary:hover{ filter:brightness(1.07);transform:translateY(-2px);box-shadow:0 0 30px -4px rgba(47,227,138,.7); }
.ti-btn--ghost{ background:transparent;color:var(--iv-ink);border-color:var(--iv-line-strong); }
.ti-btn--ghost:hover{ border-color:var(--iv-accent);color:var(--iv-accent);transform:translateY(-2px);box-shadow:var(--n-glow-violet); }
.ti-hero{ position:relative; background:var(--iv-surface); border-bottom:1px solid var(--iv-line); overflow:hidden; }
.ti-hero::before{
content:"";position:absolute;left:-10%;top:-40%;width:66%;height:170%;z-index:0;
filter:blur(60px);opacity:.6;pointer-events:none;
background:
radial-gradient(42% 46% at 28% 38%, #9B4DFF, transparent 66%),
radial-gradient(40% 44% at 68% 30%, #3B82F6, transparent 62%),
radial-gradient(36% 42% at 52% 88%, #2FE38A, transparent 64%);
}
:root[data-tricomar-mode="dia"] .ti-hero::before{ opacity:.28; }
.ti-hero__wrap{
position:relative;z-index:1;max-width:1200px;margin:0 auto;
display:grid;grid-template-columns:1.06fr .94fr;align-items:stretch;
}
.ti-hero__body{ padding:clamp(34px,5vw,68px) clamp(20px,4vw,56px); align-self:center; }
.ti-hero__eyebrow{
display:inline-flex;align-items:center;gap:8px;
font-family:var(--iv-mono);font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
color:var(--iv-ink);
background:color-mix(in srgb,var(--iv-raise-2) 82%,transparent);
border:1px solid var(--iv-line);border-radius:999px;padding:7px 14px;margin-bottom:18px;
-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.ti-hero__eyebrow::before{ content:"";width:8px;height:8px;border-radius:50%;background:var(--iv-primary);box-shadow:var(--n-glow-green); }
.ti-hero__title{
font-family:var(--iv-display)!important;font-weight:800;
font-size:clamp(2.1rem,1.4rem+3vw,3.6rem);line-height:1.02;letter-spacing:-.02em;
color:var(--iv-ink)!important;margin:0 0 16px;max-width:16ch;text-wrap:balance;
}
.ti-hero__title em{
font-style:normal;
background:var(--iv-spectrum);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.ti-hero__text{
font-size:clamp(1rem,.95rem+.4vw,1.16rem);color:var(--iv-ink-soft);
line-height:1.55;margin:0 0 26px;max-width:46ch;
}
.ti-hero__actions{ display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px; }
.ti-hero__trust{
display:flex;align-items:center;flex-wrap:wrap;gap:10px;
font-size:.85rem;color:var(--iv-ink-soft);
background:var(--iv-raise-2);border:1px solid var(--iv-line);border-radius:var(--iv-radius);
padding:11px 15px;max-width:max-content;
}
.ti-hero__trust-badge{
font-family:var(--iv-display);font-weight:800;font-size:.8rem;
color:var(--iv-ink);white-space:nowrap;padding-right:10px;border-right:1px solid var(--iv-line);
}
/* Panel de "luz de cultivo": lámpara arriba + cono de luz espectral que cae.
Todo contenido, sin manchas gigantes. */
.ti-hero__art{
position:relative;z-index:1;overflow:hidden;
background-size:cover;background-position:center;
min-height:380px;border-left:1px solid var(--iv-line);
background-color:#0C0916;
}
/* lado derecho del hero cuando hay un módulo de Product Slider enganchado
al hook displayHeroProductSlider (si no, se usa el panel de luz de arriba) */
.ti-hero__slider{
position:relative;z-index:1;min-height:380px;border-left:1px solid var(--iv-line);
background:var(--iv-surface);display:flex;align-items:center;padding:clamp(16px,2.4vw,28px);
overflow:hidden;
}
.ti-hero__slider > *{ width:100%; }
.ti-hero__art.has-photo{ background-image:none; }
/* lámpara */
.ti-hero__art::before{
content:"";position:absolute;left:22%;right:22%;top:16%;height:34px;border-radius:9px;
background:linear-gradient(180deg,#ffffff,#cfd6df);
box-shadow:0 0 60px 6px rgba(155,77,255,.45), 0 18px 50px rgba(0,0,0,.5);
z-index:2;
}
/* cono de luz espectral */
.ti-hero__art::after{
content:"";position:absolute;left:50%;top:calc(16% + 34px);
width:150%;height:120%;transform:translateX(-50%);
background:
conic-gradient(from 180deg at 50% 0%,
transparent 62deg,
rgba(155,77,255,.28) 74deg,
rgba(91,155,255,.24) 90deg,
rgba(47,227,138,.26) 106deg,
transparent 118deg);
filter:blur(6px);
z-index:1;
}
.ti-hero__art.has-photo::before,
.ti-hero__art.has-photo::after{ display:none; }
:root[data-tricomar-mode="dia"] .ti-hero__art{ background-color:#ECE7F7; }
:root[data-tricomar-mode="dia"] .ti-hero__art::after{
background:
conic-gradient(from 180deg at 50% 0%,
transparent 62deg,
rgba(122,31,158,.16) 74deg,
rgba(30,111,224,.14) 90deg,
rgba(18,168,103,.16) 106deg,
transparent 118deg);
}
/* ---------- riel de categorías (inyectado por el módulo) ---------- */
.ti-rail{
display:grid;grid-template-columns:repeat(7,1fr);gap:1px;
background:var(--iv-line);border-block:1px solid var(--iv-line);
}
.ti-rail a{
background:var(--iv-surface);padding:20px 10px 20px 17px;display:grid;gap:9px;justify-items:center;
text-align:center;color:var(--iv-ink-soft);text-decoration:none;
border-left:3px solid var(--iv-accent);
transition:background .16s var(--iv-ease),color .16s,border-color .16s;
}
.ti-rail a:hover{ background:var(--iv-raise-2);color:var(--iv-ink);border-left-color:var(--iv-primary); }
.ti-rail svg{ width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.6;color:var(--iv-accent); }
.ti-rail span{ font-family:var(--iv-font);font-size:.76rem;font-weight:600;line-height:1.2; }
.ti-rail small{ font-family:var(--iv-mono);font-size:.62rem;color:var(--iv-ink-faint); }
@media (max-width:920px){ .ti-rail{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:560px){ .ti-rail{ grid-template-columns:repeat(3,1fr); } .ti-rail a{ padding:14px 8px; } }
/* ==========================================================================
Bloques st* del home (featured / new / brands) — encaje al sistema
========================================================================== */
#index .products_section,
.page-home .products_section,
.page-home .block.products_container{
background:transparent !important;border:0 !important;
max-width:1200px;margin:0 auto !important;padding:34px 20px 10px !important;
}
/* ==========================================================================
TÍTULOS DE SECCIÓN — mismo diseño en toda la web, con degradado de espectro
========================================================================== */
.products_section > .title_block,
.products_section > .container > .title_block,
.products_container > .title_block{
border:0 !important;background:transparent !important;padding:0 0 22px !important;margin:0 !important;
}
/* título de bloque del home + h1 de categoría/CMS/páginas + encabezados de listado */
.products_section > .title_block .s_title_block,
.products_section > .title_block > a,
.products_section > .container > .title_block .s_title_block,
.products_container > .title_block .s_title_block,
#js-product-list-header,
.page-header h1,.category-header .h1,#category h1.h1,
.page-heading,h1.page-heading,
.cms-page-title,.page-cms h1,
.block-title.h1,.title_block.h1,
.contact-title,.page-content > h1:first-child{
font-family:var(--iv-display) !important;font-weight:800 !important;
font-size:clamp(1.6rem,1.2rem+1.6vw,2.4rem) !important;line-height:1.05 !important;
letter-spacing:-.02em !important;text-transform:none !important;
position:relative;display:inline-block;padding-bottom:14px !important;margin:0 0 4px !important;
background:var(--iv-spectrum);-webkit-background-clip:text;background-clip:text;
color:transparent !important;-webkit-text-fill-color:transparent;
}
.products_section > .title_block .s_title_block::after,
.products_section > .container > .title_block .s_title_block::after,
.products_container > .title_block .s_title_block::after,
#js-product-list-header::after,
.page-header h1::after,.page-heading::after,.page-cms h1::after,.cms-page-title::after{
content:"";position:absolute;left:0;bottom:0;width:54px;height:3px;border-radius:3px;
background:var(--iv-spectrum);-webkit-text-fill-color:initial;
}
/* fallback si el navegador no clipea el degradado en texto */
@supports not (background-clip:text){
.products_section .s_title_block,.page-header h1,.page-heading{ color:var(--iv-ink) !important;-webkit-text-fill-color:currentColor; }
}
/* ocultar bloques demo / vacíos del home */
[id^="category_blogs_container"],.category_blogs_container,.stblog_home,#stblog_home_block,
[id^="brands_slider_container"],.brands_slider_container,
.brands_slider_container:has(.block_content:empty),
.products_section:has(> * .no_items),
.st_no_result_home{ display:none !important; }
/* ---- cajas de producto del tema (swiper grid + list) ---- */
.pro_outer_box,.pro_simple_box{
background:var(--iv-surface) !important;border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;overflow:hidden;
display:flex !important;flex-direction:column;height:100%;
transition:transform .18s var(--iv-ease),box-shadow .18s,border-color .18s;
}
.pro_simple_box{ flex-direction:row; }
.pro_outer_box:hover,.pro_simple_box:hover{
transform:translateY(-4px);box-shadow:var(--n-glow-green),var(--iv-shadow-1);border-color:var(--iv-line-strong) !important;
}
.pro_first_box,.itemlist_left,.pro_outer_box .img_box{
background:#FFFFFF !important;border-radius:0 !important;padding:12px !important;flex:none;
border:0 !important;border-bottom:0 !important;box-shadow:none !important;
}
.pro_simple_box .itemlist_left{ width:96px; }
.pro_first_box img,.itemlist_left img,
.pro_first_box .front-image,.pro_first_box picture{
border-radius:7px;width:100%;height:auto;border:0 !important;box-shadow:none !important;
}
.pro_first_box a.product_img_link{ border:0 !important;display:block; }
/* franjita oscura que quedaba entre la imagen y el cuerpo de la tarjeta */
.pro_first_box::after,.pro_first_box .hover_fly{ border:0 !important;box-shadow:none !important; }
/* catálogo en MODO LISTA: el tema usa float, pero forzamos flex column arriba
(para el grid) y eso separaba la imagen del texto dejando un hueco enorme.
En modo lista usamos flex-direction:row y anulamos los márgenes de float. */
.product_list.list .pro_outer_box{
flex-direction:row !important;align-items:flex-start !important;max-width:none !important;
}
.product_list.list .pro_first_box{
float:none !important;width:190px !important;max-width:190px !important;flex:none !important;
}
.product_list.list .pro_second_box{
margin-left:0 !important;padding-top:14px !important;justify-content:center;
}
@media (max-width:575.98px){
.product_list.list .pro_outer_box{ flex-direction:column !important; }
.product_list.list .pro_first_box{ width:100% !important;max-width:none !important; }
}
/* barra promo Tricomar Pets — lo más arriba de la página */
.tn-pets-bar{
background:linear-gradient(90deg,#FFC93C 0%,#FFB020 100%);position:relative;z-index:401;
}
.tn-pets-bar__in{
max-width:1320px;margin:0 auto;padding:7px 20px;
display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
}
.tn-pets-bar__txt{
font-family:var(--iv-display);font-weight:800;font-size:.82rem;color:#3A2200;
letter-spacing:.01em;
}
.tn-pets-bar__btn{
display:inline-flex;align-items:center;justify-content:center;line-height:0;
background:#fff;border-radius:999px;padding:4px 14px;box-shadow:0 2px 8px rgba(0,0,0,.18);
transition:transform .15s var(--iv-ease),box-shadow .15s;
}
.tn-pets-bar__btn:hover{ transform:translateY(-1px) scale(1.03);box-shadow:0 6px 16px rgba(0,0,0,.24); }
.tn-pets-bar__btn img{ display:block;height:24px;width:auto; }
@media (max-width:560px){
.tn-pets-bar__txt{ font-size:.72rem;text-align:center;width:100%; }
.tn-pets-bar__in{ padding:6px 14px;gap:6px; }
}
/* escudo/emblema de marca junto al nombre — juntos y centrados */
.tn-brand-row{ display:flex !important;align-items:center;justify-content:center;gap:7px;text-align:center; }
.tn-brand-name{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:none;max-width:calc(100% - 27px); }
.tn-brand-emblem{
width:20px;height:20px;object-fit:contain;border-radius:5px;background:#fff;
border:1px solid var(--iv-line);flex:none;padding:2px;
}
.pro_second_box,.itemlist_right{
padding:14px !important;background:var(--iv-surface) !important;
display:flex;flex-direction:column;gap:7px;flex:1;min-width:0;
}
/* título del producto: 2 líneas máx, sin recorte raro, SIN subrayado */
.pro_second_box .s_title_block,.itemlist_right .s_title_block,.pro_simple_box .s_title_block{
margin:0 !important;padding:0 !important;
}
.pro_second_box .s_title_block a,.itemlist_right .s_title_block a,
.pro_outer_box .s_title_block a,.pro_simple_box .s_title_block a{
font-family:var(--iv-display) !important;font-weight:700 !important;color:var(--iv-ink) !important;
font-size:.92rem !important;line-height:1.25 !important;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.pro_second_box .s_title_block a::after,.pro_outer_box .s_title_block a::after{ display:none !important; content:none !important; }
.pro_second_box .s_title_block a:hover,.itemlist_right .s_title_block a:hover{ color:var(--iv-accent) !important; }
.pro_list_manufacturer,.pro_mini_cate_name{
font-family:var(--iv-mono) !important;font-size:.62rem !important;letter-spacing:.1em;
text-transform:uppercase;color:var(--iv-accent) !important;margin:0 !important;
}
.pro_outer_box .price,.pro_simple_box .price,.product_price .price,.pro_price .price,
.pro_kuan_box .price,.itemlist_right .price{
font-family:var(--iv-mono) !important;color:var(--iv-primary) !important;font-weight:600;font-size:.98rem;
}
.old_price,.pro_price .old_price,.product-discount .regular-price{
font-family:var(--iv-mono);color:var(--iv-ink-faint) !important;text-decoration:line-through;font-size:.78rem;
}
.pro_kuan_box{ margin-top:auto; }
.act_box_cart .btn,.act_box_cart .btn-default{
width:100% !important;justify-content:center;border-radius:999px !important;
background:var(--iv-primary) !important;border-color:var(--iv-primary) !important;color:var(--iv-on-primary) !important;
font-family:var(--iv-font) !important;font-weight:700 !important;box-shadow:var(--n-glow-green);
}
.act_box_inner{ display:none !important; } /* fila de iconos flotantes: fuera, ruido */
/* stickers/flags del tema */
.st_sticker_1,.st_sticker_2,.st_sticker_type_1,.st_sticker_type_2,.st_sticker_block{
top:6px !important;left:6px !important;right:auto !important;
}
.st_sticker_1,.st_sticker_type_1{ background:var(--iv-primary) !important;color:var(--iv-on-primary) !important;
border-radius:999px !important;font-family:var(--iv-mono) !important;font-weight:600 !important;
box-shadow:var(--n-glow-green);border:0 !important;padding:3px 9px !important;height:auto !important;line-height:1.4 !important; }
.st_sticker_2,.st_sticker_type_2{ background:var(--iv-accent) !important;color:#fff !important;
border-radius:999px !important;font-family:var(--iv-mono) !important;font-weight:600 !important;border:0 !important;
padding:3px 9px !important;height:auto !important;line-height:1.4 !important; }
.st_sticker_1:before,.st_sticker_2:before,.st_sticker:before{ display:none !important; }
/* "Fuera de stock / Sold out" (texto doble del tema) → pill discreta, sin el "Sold out" */
.availability_statut,.product-availability,.pro_availability,.out_of_stock_label,
.st_sticker_5,.st_sticker_type_5{
font-size:0 !important;color:transparent !important;
background:var(--iv-raise-2) !important;border:1px solid var(--iv-line) !important;border-radius:999px !important;
padding:3px 9px !important;display:inline-block;box-shadow:none !important;line-height:1.5 !important;
}
.availability_statut::before,.st_sticker_5::before,.st_sticker_type_5::before,
.out_of_stock_label::before{
content:attr(title);
font-family:var(--iv-mono);font-size:.64rem;color:var(--iv-ink-faint);letter-spacing:.02em;
}
.availability_statut:not([title])::before{ content:"Sin stock"; }
/* ==========================================================================
MENÚ PRINCIPAL (tn-menu) — se arma desde el árbol de categorías
========================================================================== */
/* ocultar el menú viejo del tema (stmegamenu "CUSTOM BLOCK") */
#top_extra,#easymenu_container{ display:none !important; }
/* nada del tema debe recortar el desplegable */
#body_wrapper,#page_wrapper,.header-container,#st_header,#header,
#header_primary,#header_primary_container,#header_primary_row,#header_center,
.header_sticky_option_3,.wide_container_box{ overflow:visible !important; }
.header-container{ position:relative !important; z-index:120 !important; }
/* el menú vive dentro de la fila del header: transparente, inline */
.tn-menu{ background:transparent;border:0;position:static; }
.tn-menu__bar{ max-width:none;margin:0;padding:0;overflow:visible;display:flex;align-items:center;gap:18px; }
.tn-menu__list{
list-style:none;margin:0;padding:0;display:flex;flex-wrap:nowrap;align-items:center;gap:0;
}
/* socio (420Xpress) al final del menú: logo + nombre */
.tn-menu__partner{ margin-left:14px;padding-left:14px;border-left:1px solid var(--iv-line); }
.tn-menu__partner a{
display:flex;align-items:center;gap:8px;padding:0;opacity:.9;
transition:opacity .16s var(--iv-ease),transform .16s var(--iv-ease);
}
.tn-menu__partner a:hover{ opacity:1;transform:translateY(-1px); }
.tn-menu__partner img{ display:block;width:30px;height:30px;border-radius:7px;flex:none; }
.tn-menu__partner span{
font-family:var(--iv-font);font-weight:700;font-size:.78rem;text-transform:uppercase;
letter-spacing:.03em;color:var(--iv-ink-soft) !important;white-space:nowrap;
}
.tn-menu__partner a:hover span{ color:var(--iv-ink) !important; }
.tn-menu__item{ position:relative;display:block; }
.tn-menu__link{
display:block;padding:24px 12px;white-space:nowrap;
font-family:var(--iv-font);font-weight:700;font-size:.78rem;
text-transform:uppercase;letter-spacing:.03em;
color:var(--iv-ink-soft) !important;text-decoration:none;
transition:color .16s var(--iv-ease);
}
.tn-menu__link::after{
content:"";position:absolute;left:12px;right:12px;bottom:16px;height:2px;border-radius:2px;
background:var(--iv-spectrum);transform:scaleX(0);transform-origin:50%;
transition:transform .26s var(--iv-ease);
}
.tn-menu__item:hover > .tn-menu__link,
.tn-menu__item:focus-within > .tn-menu__link{ color:var(--iv-ink) !important; }
.tn-menu__item:hover > .tn-menu__link::after,
.tn-menu__item:focus-within > .tn-menu__link::after{ transform:scaleX(1); }
.tn-menu__panel{
position:absolute;top:100%;left:0;min-width:260px;z-index:310;
background:var(--iv-surface);border:1px solid var(--iv-line);
border-top:3px solid transparent;border-image:var(--iv-spectrum) 1;
box-shadow:var(--iv-shadow-2);border-radius:0 0 var(--iv-radius) var(--iv-radius);
padding:16px;opacity:0;visibility:hidden;transform:translateY(-8px);
transition:opacity .2s var(--iv-ease),transform .2s var(--iv-ease),visibility .2s;
}
.tn-menu__item.has-panel:hover > .tn-menu__panel,
.tn-menu__item.has-panel:focus-within > .tn-menu__panel{ opacity:1;visibility:visible;transform:translateY(0); }
.tn-menu__col{ list-style:none;margin:0 0 10px;padding:0;display:grid;gap:2px; }
.tn-menu__col a{
display:block;padding:7px 10px;margin-inline:-10px;border-radius:7px;
font-family:var(--iv-font);font-size:.86rem;color:var(--iv-ink-soft) !important;text-decoration:none;
transition:color .15s,background .15s,padding-left .15s;
}
.tn-menu__col a:hover{ color:var(--iv-primary) !important;background:color-mix(in srgb,var(--iv-primary) 12%,transparent);padding-left:14px !important; }
.tn-menu__all{
display:inline-block;font-family:var(--iv-mono);font-size:.72rem;letter-spacing:.04em;
color:var(--iv-accent) !important;text-decoration:none;
}
/* ==========================================================================
MOBILE-FIRST — tablet y teléfono
========================================================================== */
/* mantener la cabecera propia hasta el teléfono; el #mobile_bar del tema solo <768 */
@media (min-width:768px){
#header_primary{ display:block !important; }
#mobile_bar{ display:none !important; }
.tn-menu{ display:block !important; }
}
/* zona intermedia (~1181–1400px, laptops/desktops chicos): el menú sigue en
la misma fila que el logo y los íconos, pero se comprime para que la
marca 420Xpress no choque con el ícono de Mi cuenta / Carrito. */
@media (max-width:1400px) and (min-width:1181px){
.tn-headrow{ gap:10px; }
.tn-menu__bar{ gap:8px; }
.tn-menu__link{ padding:22px 8px; font-size:.72rem; }
.tn-menu__partner{ margin-left:8px;padding-left:8px; }
.tn-menu__partner span{ display:none; } /* solo el ícono, sin el texto "420XPRESS" */
.tn-menu__partner img{ width:24px;height:24px; }
}
/* tablet: el menú va en su propia fila, con scroll horizontal si hace falta */
@media (max-width:1180px) and (min-width:768px){
.tn-headrow{ flex-wrap:wrap;row-gap:6px; }
#header_left{ order:1; }
#header_right{ order:2;margin-left:auto; }
.tn-navwrap{ order:3;flex-basis:100%; }
.tn-menu__bar{ gap:12px; }
.tn-menu__list{ overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch; }
.tn-menu__list::-webkit-scrollbar{ display:none; }
.tn-menu__link{ padding:14px 12px; }
.tn-menu__link::after{ bottom:8px; }
/* en tablet los paneles ocupan el ancho, apilados */
.tn-menu__panel{ position:static;opacity:1;visibility:visible;transform:none;display:none;
box-shadow:none;border:0;border-radius:0;padding:6px 12px 12px; }
.tn-menu__item.has-panel.tn-open > .tn-menu__panel{ display:block; }
}
/* teléfono: cabecera propia oculta, manda el #mobile_bar del tema */
@media (max-width:767px){
#header_primary,.tn-menu{ display:none !important; }
#mobile_bar{ display:block !important; }
}
/* LOGO — nunca gigante */
.shop_logo img.logo{ height:38px !important;width:auto !important;max-width:180px !important; }
#mobile_bar .logo,#mobile_bar img.logo,.mobile_logo img,.mobile_logo .logo{
height:30px !important;width:auto !important;max-width:150px !important;
}
@media (max-width:1180px){ .shop_logo img.logo{ height:34px !important; } }
@media (max-width:480px){ #mobile_bar .logo,.mobile_logo img{ height:26px !important; } }
/* barra móvil del tema al estilo neón */
#mobile_bar{ background:var(--iv-surface) !important;border-bottom:1px solid var(--iv-line); }
#mobile_bar .mobile_bar_tri,#mobile_bar i,#mobile_bar .mobile_bar_tri_text{ color:var(--iv-ink) !important; }
#mobile_bar .mobile_bar_tri:hover i,#mobile_bar .mobile_bar_tri:hover .mobile_bar_tri_text{ color:var(--iv-primary) !important; }
/* --- menú del drawer móvil (nuestro, reemplaza el demo del tema) --- */
#side_stmobilemenu .st-menu-title{ font-size:0 !important; }
#side_stmobilemenu .st-menu-title::after{ content:"Menú";font-size:1.15rem;font-family:var(--iv-display);font-weight:800;color:var(--iv-ink); }
#st_mobile_menu{ padding:8px 0 !important; }
.tn-mob{ display:block; }
.tn-mob .tn-mob__cat{ border-bottom:1px solid var(--iv-line); }
.tn-mob summary,
.tn-mob__cat--flat{
display:flex;align-items:center;justify-content:space-between;
padding:15px 20px;cursor:pointer;list-style:none;
font-family:var(--iv-font);font-weight:700;font-size:.9rem;
text-transform:uppercase;letter-spacing:.04em;color:var(--iv-ink) !important;text-decoration:none;
}
.tn-mob summary::-webkit-details-marker{ display:none; }
/* enlace de socio (420Xpress) al final del menú móvil */
.tn-mob__partner{ justify-content:flex-start !important;gap:10px; }
.tn-mob__partner img{ display:block;border-radius:7px;flex:none; }
.tn-mob__partner span{
font-family:var(--iv-font);font-weight:700;font-size:.82rem;text-transform:uppercase;
letter-spacing:.03em;background:var(--iv-spectrum);-webkit-background-clip:text;
background-clip:text;color:transparent;
}
/* bloque TricomarPets al pie del drawer movil */
.tn-mob__pets{
margin-top:8px;padding:18px 20px 22px;border-top:1px solid var(--iv-line);
background:var(--iv-raise-2);text-align:center;
}
.tn-mob__pets p{
margin:0 0 10px;font-family:var(--iv-display);font-weight:700;font-size:.95rem;color:var(--iv-ink);
}
.tn-mob__pets-btn{
display:flex;align-items:center;justify-content:center;gap:8px;
padding:11px 18px;border-radius:999px;text-decoration:none !important;
background:#F5A623;color:#231705 !important;font-family:var(--iv-font);font-weight:700;
font-size:.85rem;box-shadow:0 6px 18px -6px rgba(245,166,35,.55);
}
.tn-mob__pets-btn img{ display:block;border-radius:6px;flex:none; }
.tn-mob summary i{
width:11px;height:11px;flex:none;position:relative;transition:transform .25s var(--iv-ease);
}
.tn-mob summary i::before,.tn-mob summary i::after{
content:"";position:absolute;background:var(--iv-accent);border-radius:2px;
}
.tn-mob summary i::before{ left:0;right:0;top:4px;height:2px; }
.tn-mob summary i::after{ top:0;bottom:0;left:4px;width:2px;transition:opacity .2s; }
.tn-mob details[open] summary i::after{ opacity:0; }
.tn-mob details[open] summary{ color:var(--iv-primary) !important; }
.tn-mob__sub{ padding:2px 20px 12px; display:flex;flex-direction:column; }
.tn-mob__sub a{
padding:9px 10px;margin-inline:-10px;border-radius:8px;
font-family:var(--iv-font);font-size:.85rem;color:var(--iv-ink-soft) !important;text-decoration:none;
}
.tn-mob__sub a:hover{ background:var(--iv-raise-2);color:var(--iv-primary) !important; }
/* drawer "Ajustes" del móvil: Buscar / Mi cuenta / Carrito */
.tn-mnav{ list-style:none;margin:0;padding:8px 0; }
.tn-mnav__link{
display:flex !important;align-items:center;gap:12px;padding:14px 20px;
color:var(--iv-ink) !important;text-decoration:none !important;
font-family:var(--iv-font);font-weight:700;font-size:.92rem;
border-bottom:1px solid var(--iv-line);
}
.tn-mnav__link svg{
width:20px;height:20px;flex:none;fill:none;stroke:var(--iv-accent);stroke-width:1.7;
stroke-linecap:round;stroke-linejoin:round;
}
.tn-mnav__link:hover{ background:var(--iv-raise-2); color:var(--iv-primary) !important; }
.tn-mob__all{
font-family:var(--iv-mono) !important;font-size:.72rem !important;letter-spacing:.04em;
color:var(--iv-accent) !important;text-transform:uppercase;margin-bottom:4px;
}
/* riel de categorías: móvil-first */
.ti-rail{ grid-template-columns:repeat(7,1fr); }
@media (max-width:1024px){ .ti-rail{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:560px){
.ti-rail{ display:flex;overflow-x:auto;scrollbar-width:none; }
.ti-rail::-webkit-scrollbar{ display:none; }
.ti-rail a{ flex:0 0 30%;padding:14px 8px; }
}
/* ==========================================================================
RESEÑAS DE GOOGLE — arriba del mapa
========================================================================== */
.tn-rev{ background:var(--iv-ground); padding:clamp(32px,5vw,56px) 20px 8px; }
.tn-rev__wrap{ max-width:1080px; margin:0 auto; }
.tn-rev__head{
display:flex;align-items:center;gap:16px 22px;flex-wrap:wrap;margin-bottom:22px;
}
.tn-rev__badge{
display:inline-flex;align-items:center;gap:9px;
font-family:var(--iv-display);font-weight:800;font-size:1rem;color:var(--iv-ink);
}
.tn-rev__badge svg{ width:22px;height:22px;color:var(--iv-blue); }
.tn-rev__score{ display:flex;align-items:center;gap:10px; }
.tn-rev__score strong{ font-family:var(--iv-mono);font-size:1.6rem;font-weight:600;color:var(--iv-primary); }
.tn-rev__stars{ color:#E8B34D;letter-spacing:1px; }
.tn-rev__stars--big{ font-size:1.05rem; }
.tn-rev__count{ font-family:var(--iv-mono);font-size:.8rem;color:var(--iv-ink-faint); }
.tn-rev__head .ti-btn{ margin-left:auto;padding:9px 16px;font-size:.85rem; }
.tn-rev__grid{
display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;
}
.tn-rev__card{
background:var(--iv-surface);border:1px solid var(--iv-line);border-radius:var(--iv-radius);
padding:16px;display:flex;flex-direction:column;gap:10px;
}
.tn-rev__card header{ display:flex;align-items:center;gap:10px; }
.tn-rev__av{
width:38px;height:38px;border-radius:50%;overflow:hidden;flex:none;
display:grid;place-items:center;background:var(--iv-raise-2);
font-family:var(--iv-display);font-weight:700;color:var(--iv-accent);
}
.tn-rev__av img{ width:100%;height:100%;object-fit:cover; }
.tn-rev__who{ display:flex;flex-direction:column;gap:2px;min-width:0; }
.tn-rev__who b{ font-family:var(--iv-font);font-weight:700;font-size:.88rem;color:var(--iv-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.tn-rev__who .tn-rev__stars{ font-size:.8rem; }
.tn-rev__card p{
margin:0;font-size:.86rem;line-height:1.5;color:var(--iv-ink-soft);
display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;
}
.tn-rev__when{ font-family:var(--iv-mono);font-size:.7rem;color:var(--iv-ink-faint);margin-top:auto; }
/* tarjeta "Dejanos tu Opinión" -> abre el formulario de reseña de Google */
.tn-rev__add{
align-items:center;justify-content:center;text-align:center;gap:12px;
border:1.5px dashed var(--iv-line-strong) !important;text-decoration:none !important;
transition:border-color .18s var(--iv-ease),transform .18s var(--iv-ease),background .18s;
}
.tn-rev__add:hover{
border-color:var(--iv-primary) !important;transform:translateY(-3px);
background:color-mix(in srgb, var(--iv-primary) 8%, var(--iv-surface));
}
.tn-rev__add-icon{
width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
font-size:1.6rem;font-weight:700;line-height:1;color:var(--iv-primary);
background:color-mix(in srgb, var(--iv-primary) 16%, transparent);
}
.tn-rev__add-txt{
font-family:var(--iv-display);font-weight:700;font-size:.92rem;color:var(--iv-ink);line-height:1.35;
}
@media (max-width:560px){
.tn-rev__grid{ grid-template-columns:1fr; }
.tn-rev__head .ti-btn{ margin-left:0;flex-basis:100%; }
}
/* "Quiénes somos" — página Nuestra Tienda */
.tn-about{ padding:clamp(22px,4vw,40px) 0 clamp(28px,4vw,44px); }
.tn-about__wrap{
max-width:900px;margin:0 auto;position:relative;background:var(--iv-surface);
border:1px solid var(--iv-line);border-radius:var(--iv-radius-lg);
padding:clamp(22px,4vw,36px) clamp(20px,4vw,40px);overflow:hidden;
}
.tn-about__wrap::before{ content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--iv-spectrum); }
.tn-about__eyebrow{
display:inline-flex;align-items:center;gap:8px;font-family:var(--iv-mono);
font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--iv-accent);margin:0 0 8px;
}
.tn-about__eyebrow::before{ content:"";width:16px;height:2px;border-radius:2px;background:var(--iv-spectrum); }
.tn-about__title{
font-family:var(--iv-display);font-weight:800;font-size:clamp(1.3rem,2.6vw,1.7rem);
color:var(--iv-ink);margin:0 0 16px;
}
.tn-about__grid{ display:grid;gap:12px; }
.tn-about__grid p{ margin:0;font-size:.92rem;line-height:1.75;color:var(--iv-ink-soft); }
.tn-about__grid strong{ color:var(--iv-primary); }
.ti-visit{ background:var(--iv-surface-2); padding:clamp(28px,4vw,52px) 20px clamp(36px,5vw,64px); }
.ti-visit__wrap{
max-width:1080px;margin:0 auto;position:relative;
display:grid;grid-template-columns:1.2fr 1fr;
background:var(--iv-surface);border:1px solid var(--iv-line);border-radius:var(--iv-radius-lg);
box-shadow:var(--iv-shadow-2);overflow:hidden;
}
.ti-visit__wrap::before{ content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--iv-spectrum);z-index:2; }
.ti-visit__map{ position:relative;min-height:290px;background:var(--iv-raise-2); }
.ti-visit__map iframe{ position:absolute;inset:0;width:100%;height:100%;border:0; }
:root:not([data-tricomar-mode="dia"]) .ti-visit__map iframe{ filter:invert(.92) hue-rotate(180deg) saturate(.8) brightness(.95); }
@media (prefers-color-scheme:light){ :root[data-tricomar-mode="auto"] .ti-visit__map iframe{ filter:none; } }
.ti-visit__info{ padding:clamp(24px,3vw,36px);border-left:1px solid var(--iv-line);align-self:center; }
.ti-visit__eyebrow{
font-family:var(--iv-mono);font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.16em;
color:var(--iv-accent);
}
.ti-visit__name{
font-family:var(--iv-display)!important;font-weight:800;font-size:1.5rem;
color:var(--iv-ink)!important;margin:6px 0 16px;letter-spacing:-.01em;
}
.ti-visit__list{ list-style:none;margin:0 0 20px;padding:0;display:grid;gap:10px; }
.ti-visit__list li{ display:flex;align-items:flex-start;gap:10px;font-size:.9rem;color:var(--iv-ink-soft);line-height:1.45; }
.ti-visit__list svg{ width:16px;height:16px;color:var(--iv-primary);flex:none;margin-top:2px; }
.ti-visit__list a{ color:inherit;text-decoration:none; }
.ti-visit__list a:hover{ color:var(--iv-primary); }
.ti-visit__actions{ display:flex;flex-wrap:wrap;gap:10px; }
.ti-visit__actions .ti-btn{ padding:10px 16px;font-size:.88rem; }
@media (max-width:760px){
.ti-visit__wrap{ grid-template-columns:1fr; }
.ti-visit__info{ border-left:0;border-top:1px solid var(--iv-line); }
}
/* ==========================================================================
PÁGINAS LEGALES (CMS) — Términos, Privacidad, Despacho, Reembolso, Aviso Legal
========================================================================== */
#cms #content,#cms .page-content,#cms .cms-page{ background:transparent !important; }
#cms #content{ max-width:900px !important;margin:0 auto !important;padding:38px 20px 70px !important; }
#cms .breadcrumb,#cms .breadcrumb_spacing{
background:transparent !important;border:0 !important;box-shadow:none !important;padding-left:0 !important;
}
.tn-legal{ color:var(--iv-ink); }
.tn-legal__eyebrow{
display:inline-flex;align-items:center;gap:8px;font-family:var(--iv-mono);
font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--iv-accent);margin:0 0 10px;
}
.tn-legal__eyebrow::before{ content:"";width:16px;height:2px;border-radius:2px;background:var(--iv-spectrum); }
.tn-legal h1.tn-legal__title{
font-family:var(--iv-display);font-weight:800;font-size:clamp(1.6rem,3.6vw,2.5rem);line-height:1.12;
margin:0 0 14px;color:var(--iv-ink);
}
.tn-legal__updated{
display:inline-flex;align-items:center;gap:7px;font-family:var(--iv-mono);font-size:.7rem;
color:var(--iv-ink-faint);background:var(--iv-surface);border:1px solid var(--iv-line);
border-radius:999px;padding:5px 12px;margin-bottom:28px;
}
.tn-legal__updated::before{ content:"";width:6px;height:6px;border-radius:50%;background:var(--iv-primary);box-shadow:0 0 8px var(--iv-primary); }
/* ficha de datos de la empresa */
.tn-legal__entity{
position:relative;overflow:hidden;background:var(--iv-surface);border:1px solid var(--iv-line);
border-radius:var(--iv-radius);padding:20px 22px 18px;margin:36px 0 24px;
display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:12px 28px;
}
.tn-legal__entity::before{ content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--iv-spectrum); }
.tn-legal__entity dt{
font-family:var(--iv-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
color:var(--iv-ink-faint);margin:0 0 3px;
}
.tn-legal__entity dd{ margin:0;font-weight:600;color:var(--iv-ink);font-size:.9rem; }
@media (max-width:560px){ .tn-legal__entity{ grid-template-columns:1fr; } }
/* navegación rápida de secciones (chips) */
.tn-legal__toc{ display:flex;flex-wrap:wrap;gap:8px;margin:0 0 34px; }
.tn-legal__toc a{
font-family:var(--iv-font);font-size:.76rem;font-weight:600;color:var(--iv-ink-soft) !important;
text-decoration:none !important;background:var(--iv-raise-2);border:1px solid var(--iv-line);
border-radius:999px;padding:7px 14px;transition:color .15s,border-color .15s,background .15s;
}
.tn-legal__toc a:hover{
color:var(--iv-ink) !important;border-color:var(--iv-accent);
background:color-mix(in srgb, var(--iv-accent) 16%, transparent);
}
.tn-legal section{ margin:0 0 30px;scroll-margin-top:24px; }
.tn-legal h2{
display:flex;align-items:center;gap:10px;font-family:var(--iv-display);font-weight:700;
font-size:1.18rem;color:var(--iv-ink);margin:0 0 12px;padding-bottom:10px;
border-bottom:1px solid var(--iv-line);
}
.tn-legal h2 .tn-legal__num{
flex:none;width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
font-family:var(--iv-mono);font-size:.72rem;font-weight:600;color:var(--iv-on-primary);
background:var(--iv-spectrum);
}
.tn-legal h3{ font-family:var(--iv-display);font-weight:700;font-size:1rem;color:var(--iv-accent);margin:20px 0 8px; }
.tn-legal p{ font-size:.92rem;line-height:1.75;color:var(--iv-ink-soft);margin:0 0 14px; }
.tn-legal strong{ color:var(--iv-ink); }
.tn-legal a:not(.tn-legal__toc a){ color:var(--iv-blue) !important;text-decoration:underline;text-underline-offset:2px; }
.tn-legal ul,.tn-legal ol{ margin:0 0 16px;padding:0;list-style:none; }
.tn-legal ul li,.tn-legal ol li{
position:relative;padding-left:22px;margin-bottom:8px;font-size:.92rem;line-height:1.65;color:var(--iv-ink-soft);
}
.tn-legal ul li::before{
content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--iv-primary);
box-shadow:0 0 6px rgba(47,227,138,.6);
}
.tn-legal ol{ counter-reset:tnlegal; }
.tn-legal ol li{ counter-increment:tnlegal; }
.tn-legal ol li::before{
content:counter(tnlegal);position:absolute;left:0;top:0;width:16px;height:16px;border-radius:5px;
background:var(--iv-raise-2);border:1px solid var(--iv-line-strong);color:var(--iv-accent);
font-family:var(--iv-mono);font-size:.6rem;font-weight:700;display:flex;align-items:center;justify-content:center;
box-shadow:none;
}
/* recuadro de advertencia / aviso importante (18+, responsabilidad, etc.) */
.tn-legal__notice{
position:relative;background:var(--iv-raise-2);border:1px solid var(--iv-line-strong);
border-left:3px solid var(--iv-accent);border-radius:var(--iv-radius-sm);padding:16px 18px;margin:0 0 20px;
}
.tn-legal__notice p{ margin:0;color:var(--iv-ink);font-size:.9rem; }
.tn-legal__notice p:not(:last-child){ margin-bottom:10px; }
/* tabla (p.ej. bancos de semillas / cookies) */
.tn-legal table{ width:100%;border-collapse:collapse;margin:0 0 22px;font-size:.86rem; }
.tn-legal table th,.tn-legal table td{ padding:10px 12px;border-bottom:1px solid var(--iv-line);text-align:left; }
.tn-legal table th{
font-family:var(--iv-mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;
color:var(--iv-ink-faint);font-weight:600;
}
.tn-legal table td{ color:var(--iv-ink-soft); }
/* pie de contacto */
.tn-legal__contact{
margin-top:38px;padding-top:22px;border-top:1px solid var(--iv-line);
display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;
}
.tn-legal__contact a{
display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:.86rem;
color:var(--iv-ink) !important;text-decoration:none !important;
}
.tn-legal__contact a:hover{ color:var(--iv-primary) !important; }
/* ==========================================================================
MI CUENTA — cuadro de mando + tarjetas del panel
========================================================================== */
#my-account #content,#history #content,#identity #content,#address #content,
#addresses #content,#order-slip #content,#discount #content,#order-follow #content{
background:transparent !important;
}
.page-content.account,#my-account .page-content{ background:transparent !important; }
#my-account h6.page_heading,.page_heading{
font-family:var(--iv-display) !important;font-weight:800 !important;color:var(--iv-ink) !important;
font-size:1.3rem;margin:0 0 22px !important;text-transform:none !important;
}
/* --- cuadro principal de indicadores --- */
.tn-dash{
position:relative;overflow:hidden;background:var(--iv-surface);border:1px solid var(--iv-line);
border-radius:var(--iv-radius-lg);padding:26px 24px 22px;margin:0 0 28px;
}
.tn-dash::before{ content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--iv-spectrum); }
.tn-dash__grid{
display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px 24px;
}
.tn-dash__stat{ display:flex;align-items:flex-start;gap:12px; }
.tn-dash__ic{
flex:none;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;
background:var(--iv-raise-2);border:1px solid var(--iv-line-strong);color:var(--iv-primary);
}
.tn-dash__ic svg{ width:22px;height:22px; }
.tn-dash__ic--green{ color:var(--iv-primary);background:color-mix(in srgb,var(--iv-primary) 14%,var(--iv-raise-2)); }
.tn-dash__ic--violet{ color:var(--iv-accent);background:color-mix(in srgb,var(--iv-accent) 14%,var(--iv-raise-2)); }
.tn-dash__ic--blue{ color:var(--iv-blue);background:color-mix(in srgb,var(--iv-blue) 14%,var(--iv-raise-2)); }
.tn-dash__ic--magenta{ color:#E85DC0;background:color-mix(in srgb,#E85DC0 14%,var(--iv-raise-2)); }
.tn-dash__ic--gold{ color:#E8B34D;background:color-mix(in srgb,#E8B34D 14%,var(--iv-raise-2)); }
.tn-dash__lbl{
display:block;font-family:var(--iv-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;
color:var(--iv-ink-faint);margin-bottom:3px;
}
.tn-dash__val{
display:block;font-family:var(--iv-display);font-weight:800;font-size:1.28rem;color:var(--iv-ink);
line-height:1.2;
}
.tn-dash__sub{ display:block;font-size:.78rem;color:var(--iv-ink-soft);margin-top:2px; }
.tn-dash__freq{
display:flex;align-items:flex-start;gap:12px;margin-top:22px;padding-top:20px;
border-top:1px solid var(--iv-line);
}
.tn-dash__freq-body{ flex:1;min-width:0; }
.tn-dash__chips{ display:flex;flex-wrap:wrap;gap:8px;margin-top:8px; }
.tn-dash__chip{
display:inline-flex;align-items:center;gap:5px;background:var(--iv-raise-2);
border:1px solid var(--iv-line-strong);border-radius:999px;padding:6px 12px;
font-size:.8rem;color:var(--iv-ink-soft);
}
.tn-dash__chip b{ color:var(--iv-primary);font-family:var(--iv-mono);font-weight:700; }
/* --- grilla de accesos (Información, Direcciones, Pedidos, etc.) --- */
.myacount_dashbord_list{
display:grid !important;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;
margin:0 !important;
}
.myacount_dashbord_list .list-group-item{
padding:0 !important;background:transparent !important;border:0 !important;
}
.myacount_dashbord_list .list-group-item > a{
position:relative;display:flex !important;align-items:center;gap:14px;
padding:15px 18px !important;background:var(--iv-surface) !important;
border:1px solid var(--iv-line) !important;
border-radius:var(--iv-radius) !important;color:var(--iv-ink) !important;
font-family:var(--iv-font) !important;font-weight:700 !important;font-size:.88rem !important;
text-decoration:none !important;transition:transform .16s var(--iv-ease),border-color .16s,box-shadow .16s;
}
.myacount_dashbord_list .list-group-item > a:hover{
transform:translateY(-3px);box-shadow:var(--iv-shadow-1);border-color:var(--iv-line-strong) !important;
}
.myacount_dashbord_list .list-group-item > a i{
flex:none;width:38px;height:38px;font-size:0 !important;line-height:0;border-radius:11px;
display:grid;place-items:center;background:var(--iv-raise-2);
}
.myacount_dashbord_list .list-group-item > a i::before{
content:"";display:block;width:19px;height:19px;background-color:var(--tn-item-color,var(--iv-primary));
-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;
mask-position:center;mask-repeat:no-repeat;mask-size:contain;
-webkit-mask-image:var(--tn-item-mask);mask-image:var(--tn-item-mask);
}
.identity-link i{ --tn-item-color:var(--iv-primary); }
.addresses-link i,.address-link i{ --tn-item-color:var(--iv-accent); }
.history-link i{ --tn-item-color:var(--iv-blue); }
.order-slips-link i{ --tn-item-color:#E8B34D; }
.discounts-link i{ --tn-item-color:#E85DC0; }
.returns-link i{ --tn-item-color:var(--iv-primary); }
.landing-link i{ --tn-item-color:var(--iv-accent); }
.sign-out-link i{ --tn-item-color:var(--iv-ink-faint); }
.identity-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
.addresses-link i,.address-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
.history-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
.order-slips-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
.discounts-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
.returns-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
.sign-out-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
.landing-link i{ --tn-item-mask:url('data:image/svg+xml;utf8,'); }
@media (max-width:560px){
.tn-dash{ padding:20px 16px 18px; }
.tn-dash__grid{ grid-template-columns:1fr; gap:16px; }
}
/* datos de transferencia bancaria (pedido completado) no se adaptaban al modo
oscuro: el tema base fija background gris claro fijo (#ebebeb/#f6f6f6) sin
variables, y el texto queda claro-sobre-claro. */
.definition-list dl dd,
.definition-list dl dt{
background:var(--iv-raise-2) !important;
color:var(--iv-ink) !important;
}
.definition-list dl dd:nth-of-type(even),
.definition-list dl dt:nth-of-type(even){
background:var(--iv-surface-2,var(--iv-raise-2)) !important;
}
.definition-list dl dd a{ color:var(--iv-blue) !important; }
.js-cart-line-product-quantity,
.input-group.bootstrap-touchspin,
.product-quantity .qty,
.cart-line-product-quantity .input-group{
display:inline-table;
}
.st_news_letter_form_inner .input-group{
align-items:center;
}