/* ALV 2026 redesign overrides */
/* Google Fonts loaded in header.tpl - no @import needed here */

:root {
  --brand-500: #0099cf;
  --brand-600: #0086e0;
  --brand-700: #006fbd;
  --ink-900: #0b1a2b;
  --ink-800: #132238;
  --ink-700: #1f2f46;
  --ink-500: #4a5c72;
  --ink-400: #6b7a8f;
  --bg-0: #f6f8fb;
  --bg-1: #ffffff;
  --bg-2: #f0f4f8;
  --line-1: rgba(15, 23, 42, 0.12);
  --line-2: rgba(15, 23, 42, 0.08);
  --shadow-1: 0 12px 32px rgba(15, 23, 42, 0.12);
  --shadow-2: 0 18px 48px rgba(15, 23, 42, 0.18);
  --radius-1: 10px;
  --radius-2: 16px;
  --radius-3: 22px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 56px;
  --font-body: "Sora", sans-serif;
  --font-display: "Space Grotesk", sans-serif;
}

* {
  box-sizing: border-box;
}

body {
  font-family: var(--font-body);
  color: var(--ink-900);
  background-color: var(--bg-0);
  background-image:
    radial-gradient(1200px 400px at 10% -10%, rgba(0, 153, 255, 0.08), transparent 60%),
    radial-gradient(900px 320px at 90% -10%, rgba(19, 34, 56, 0.06), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f6f8fb 45%, #f1f5f9 100%);
}

a {
  color: var(--ink-900);
  transition: color 0.2s ease;
}

a:hover,
a:focus {
  color: var(--brand-600);
}

h1, h2, h3, h4, h5, h6,
.title_block, .page-heading, #center_column h1 {
  font-family: var(--font-display);
  letter-spacing: -0.01em;
  color: var(--ink-900);
}

.page-heading {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: var(--space-5);
}

@media (min-width: 1400px) {
  .container {
    width: 1240px;
  }
}

/* Buttons */
.btn,
button,
.button,
input.button_mini,
input.button_small,
input.button,
input.button_large,
input.exclusive,
span.exclusive,
span.exclusive_large,
a.button,
a.exclusive,
.btn.btn-default {
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.2px;
  padding: 11px 18px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.btn.btn-default,
.button,
input.button,
input.button_small,
input.button_mini,
span.exclusive,
a.button {
  background: var(--bg-1);
  color: var(--ink-900);
  border: 1px solid var(--line-1);
}

.btn.btn-default:hover,
.button:hover,
input.button:hover,
span.exclusive:hover,
a.button:hover {
  box-shadow: var(--shadow-1);
  transform: translateY(-1px);
}

.btn_primary,
.btn.btn_primary,
input.exclusive,
span.exclusive_large,
#add_to_cart .btn,
.ajax_add_to_cart_button,
.btsearch_add_to_cart {
  background: linear-gradient(135deg, var(--brand-500) 0%, #00c2ff 100%);
  color: #ffffff;
  border: 0;
  box-shadow: 0 12px 24px rgba(0, 153, 255, 0.24);
}

.btn_primary:hover,
.btn.btn_primary:hover,
#add_to_cart .btn:hover,
.ajax_add_to_cart_button:hover,
.btsearch_add_to_cart:hover {
  background: linear-gradient(135deg, var(--brand-600) 0%, #00a6dd 100%);
  transform: translateY(-1px);
}

/* Form controls */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
select,
textarea,
.form-control {
  border-radius: var(--radius-1);
  border: 1px solid var(--line-1);
  background: #ffffff;
  box-shadow: none;
  padding: 10px 12px;
  font-family: var(--font-body);
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
  border-color: var(--brand-500);
  box-shadow: 0 0 0 3px rgba(0, 153, 255, 0.15);
}

/* Header */
#page_header {
  background: rgba(255, 255, 255, 0.98);
  border-bottom: 1px solid var(--line-2);
}

.top_barra {
  background: #0099cf;
  height: 27px;
  width: 100%;
}

.top_barra_texto {
  color: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  letter-spacing: 0.3px;
  padding-right: 30px;
  margin-top: 6px;
}

.top_barra_texto a {
  color: #ffffff;
}

.top_barra_texto a:hover {
  color: #ffffff;
  text-decoration: underline;
}

#top_bar {
  background: #f4f7fb;
  border-bottom: 1px solid var(--line-2);
}

#top_bar nav a {
  color: var(--ink-700);
  font-weight: 600;
}

.fijo {
  width: 100%;
  padding: 16px 0 0;
  background: #ffffff;
  border-bottom: 3px solid #0099cf;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

@media (min-width: 992px) {
  #page_header .top_barra {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    margin-bottom: 0 !important;
    z-index: 10010;
  }

  #page_header .fijo {
    position: fixed;
    top: 27px;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: 0 !important;
    z-index: 10000;
  }

  .main_content_area {
    padding-top: 155px !important;
  }

  /* Categorías con cabecera hero: padding reducido (el hero ya proporciona espacio) */
  .main_content_area.has-hero-cabecera {
    padding-top: 50px !important;
  }

}

.menu_fixed_interior {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto auto;
  align-items: center;
  row-gap: 12px;
}

.menu_fixed_interior .izquierda {
  grid-column: 1;
  grid-row: 1;
  width: auto;
  float: none;
}

.menu_fixed_interior .izquierda img {
  height: 55px;
  width: auto;
  display: block;
}

.menu_fixed_interior .derecha {
  grid-column: 2 / 4;
  grid-row: 1;
  display: flex;
  align-items: center;
  gap: 14px;
  float: none;
}

.menu_fixed_interior .centro {
  grid-column: 1 / -1;
  grid-row: 2;
  float: none;
}

#search_block_top {
  flex: 1 1 auto;
  max-width: 500px;
  order: 1;
}

#search_block_top .searchbox_inner,
#search_block_top .searchbox_inner.active {
  display: flex !important;
  align-items: stretch !important;
  gap: 0;
  background: #fff;
  border: 1px solid #dbe6f1;
  border-radius: 6px;
  padding: 0;
  height: 36px !important;
  overflow: hidden;
  position: relative;
}

#search_block_top .searchbox_inner:focus-within {
  border-color: #0099cf;
  box-shadow: 0 0 0 3px rgba(0, 153, 207, 0.15);
}

#search_block_top input.search_query,
#search_block_top .active .search_query {
  border: 0 !important;
  background: #fff !important;
  height: 36px !important;
  font-size: 13px !important;
  padding: 0 14px !important;
  flex: 1;
  color: #333;
  min-width: 0;
  border-radius: 6px 0 0 6px !important;
}

#search_block_top input.search_query::placeholder {
  color: #aaa;
  font-size: 12px;
}

#submit_searchbox {
  background: #0099cf !important;
  color: #fff;
  border-radius: 0 5px 5px 0 !important;
  width: 38px !important;
  height: 100% !important;
  border: none;
  cursor: pointer;
  transition: background 0.15s ease;
  display: flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 0 !important;
  position: static !important;
  transform: none !important;
  box-shadow: none !important;
}

#submit_searchbox:hover {
  background: #007ab3 !important;
}

#submit_searchbox i {
  color: #fff;
  font-size: 16px;
}

#submit_searchbox .icon_text {
  display: none;
}

#header_user_info {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: 12px;
}

#blockcart_top_wrap {
  display: none;
}

.menu_fixed_interior .derecha {
  flex-wrap: wrap;
  row-gap: 8px;
}

#search_block_top {
  order: 1;
}

#header_user_info {
  order: 2;
}

.carrito_pc {
  order: 3;
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

#header_user_info .header_item {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-700);
  padding: 6px 10px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid var(--line-2);
}

#header_user_info .header_item:hover {
  color: var(--brand-600);
  border-color: rgba(0, 153, 255, 0.35);
}

#shopping_cart {
  background: #ffffff;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  padding: 6px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

#shopping_cart .ajax_cart_quantity {
  background: var(--brand-500);
  color: #ffffff;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 11px;
  font-weight: 700;
}

#shopping_cart .ajax_cart_total {
  font-weight: 700;
  color: var(--ink-800);
}

.carrito_pc {
  display: flex;
  align-items: center;
}

.carrito_pc .quick-order-link,
.login_pc .login-link {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  color: #1a1a1a;
  border-radius: 0;
  box-shadow: none;
  transition: color 0.15s ease;
}

.carrito_pc .quick-order-link:hover,
.login_pc .login-link:hover {
  color: #0099cf;
  background: none;
  transform: none;
  box-shadow: none;
}

.carrito_pc .quick-order-link i,
.login_pc .login-link i {
  font-size: 22px;
  color: inherit;
}

#header {
  display: block;
}

/* Category nav */
.centro .menu-fijo {
  position: static;
  transform: none;
  width: 100%;
  max-width: none;
  margin-top: -6px;
}

.centro .menu-fijo .categorias {
  display: flex;
  gap: 14px;
  padding-top: 0;
  padding-bottom: 10px;
}

.centro .menu-fijo .categorias > div {
  flex: 1 1 140px;
  max-width: 180px;
}

.centro .menu-fijo .categorias > div {
  background-image: none !important;
  background: none !important;
  border: none !important;
  max-width: none;
}

.centro .menu-fijo .categorias .texto-categoria {
  font-size: 15px;
  font-weight: 800;
  padding: 10px 12px !important;
  color: #1a1a1a !important;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  background: none !important;
  min-height: 0 !important;
  height: auto !important;
  border-bottom: 3px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.centro .menu-fijo .categorias a:hover .texto-categoria,
.menu-fijo .categorias > div:hover .texto-categoria {
  color: #0099cf !important;
  background: none !important;
  border-bottom: 3px solid #0099cf;
  padding-bottom: 8px !important;
}

.centro .menu-fijo .categorias .menu-barras,
.centro .menu-fijo .categorias .menu-cofres,
.menu-fijo .categorias .menu-portabicicletas,
.menu-fijo .categorias .menu-portaesquis,
.menu-fijo .categorias .menu-portakayak {
  background-image: none !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}

.menu-barras .texto-categoria,
.menu-cofres .texto-categoria,
.menu-portabicicletas .texto-categoria,
.menu-portaesquis .texto-categoria,
.menu-portakayak .texto-categoria {
  background: none !important;
}

.menu-fijo .categorias .menu-barras:hover .texto-categoria,
.menu-fijo .categorias .menu-cofres:hover .texto-categoria,
.menu-fijo .categorias .menu-portabicicletas:hover .texto-categoria,
.menu-fijo .categorias .menu-portaesquis:hover .texto-categoria,
.menu-fijo .categorias .menu-portakayak:hover .texto-categoria {
  background: none !important;
}

.menu-portakayak .dropdown-content {
  border-radius: 12px;
  border: 1px solid var(--line-2);
  box-shadow: var(--shadow-1);
  padding: 8px;
}

.menu-portakayak .dropdown-content a {
  border-radius: 8px;
  font-weight: 600;
}

/* Promotional header banner */
.header-banner {
  background: linear-gradient(90deg, rgba(0, 153, 255, 0.12), rgba(0, 153, 255, 0.02));
  border: 1px solid rgba(0, 153, 255, 0.2);
  padding: 6px 16px;
}

/* Trust banner: full border + radius (global.css:12207 only has top/bottom, no radius) */
/* Mobile: global.css:12248 sets padding: 2em 0em → items flush against border */
.trustbanner {
  border: 1px solid var(--alv-border) !important;
  border-left: 3px solid var(--brand-500) !important;
  border-radius: var(--alv-radius) !important;
  margin: 0 12px !important;
  padding-left: 1.5em !important;
  padding-right: 1.5em !important;
}

/* Featured blog articles block on home */
.st_blog_featured_article_container {
  border-left: 3px solid var(--brand-500) !important;
}

/* Blockbuscador on home — blue accent left */
@media (min-width: 992px) {
  #index #nave_principal .modulo_orbital {
    border-left: 3px solid var(--brand-500) !important;
  }
}

/* Banner: aviso buscador en categorías barras/portaequipajes */
.alv-buscador-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: rgba(245, 158, 11, 0.08);
  border-left: 3px solid #d97706;
  border-radius: 0 10px 10px 0;
  padding: 14px 20px;
  margin-bottom: 20px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--ink-700);
}
.alv-buscador-banner-icon {
  font-size: 20px;
  flex-shrink: 0;
}
.alv-buscador-banner-text {
  line-height: 1.5;
}
.alv-buscador-banner-btn {
  display: inline-block;
  flex-shrink: 0;
  background: linear-gradient(135deg, var(--brand-500) 0%, #00c2ff 100%);
  color: #ffffff !important;
  padding: 8px 20px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 13px;
  text-decoration: none !important;
  white-space: nowrap;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.alv-buscador-banner-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(0, 153, 255, 0.24);
}
@media (max-width: 767px) {
  .alv-buscador-banner {
    flex-direction: column;
    text-align: center;
    gap: 10px;
    padding: 14px 16px;
  }
  #category #breadcrumb_wrapper,
  #product #breadcrumb_wrapper { display: none !important; }
}

.trustbanner-icon {
  width: 4em !important;
  height: 4em !important;
}

.trustbanner-icon img {
  max-width: 80% !important;
  max-height: 80% !important;
  object-fit: contain !important;
}

.header-banner small-custom {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-800);
}

/* Top extra menu */
#top_extra {
  background: #ffffff;
  border-bottom: 1px solid var(--line-2);
}

#st_advanced_menu_container {
  border-radius: 0 0 var(--radius-2) var(--radius-2);
}

#breadcrumb_wrapper {
  background: transparent;
  padding: 14px 0;
}

.breadcrumb {
  background: #ffffff;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  padding: 8px 16px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.breadcrumb a {
  color: var(--ink-700);
  font-weight: 600;
}

/* Cards and blocks */
.block, .section, .primary_block, .product-container {
  border-radius: var(--radius-2);
}

.block, .section {
  background: #ffffff;
  border: 1px solid var(--line-2);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
  padding: 18px;
  margin-bottom: var(--space-5);
}

.block .title_block,
.section .title_block {
  font-size: 18px;
  font-weight: 700;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-2);
  margin-bottom: 16px;
}

#home_secondary_row,
#home_tertiary_row {
  margin-top: var(--space-6);
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT CARDS — Aggressive 2026 overrides (wins over global.css)
   ═══════════════════════════════════════════════════════════════ */

.product_list {
  margin-top: 20px;
}

.product_list li.ajax_block_product {
  padding: 14px;
  margin-bottom: 8px;
}

/* --- Kill the black border from global.css:6978 + break positioning context --- */
.product_list.grid .pro_first_box,
.products_slider .pro_first_box {
  border: none !important;
  border-radius: 16px 16px 0 0 !important;
  position: static !important;
}

/* --- Card container: visible shadow, clean border, smooth hover --- */
.product-container {
  background: #ffffff !important;
  border: 1px solid var(--line-2) !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.07) !important;
  overflow: hidden !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
  height: 100%;
  position: relative !important;
  padding-bottom: 44px !important;
}

.product-container:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14) !important;
  border-color: rgba(0, 153, 255, 0.3) !important;
}

/* --- Image: zoom on hover + subtle bg --- */
.product-container .pro_first_box {
  background: #f8fafc !important;
}

.product-container .pro_first_box img {
  transition: transform 0.4s ease !important;
}

.product-container:hover .pro_first_box img {
  transform: scale(1.06) !important;
}

/* --- Hover fly bar: ALWAYS VISIBLE at BOTTOM of card --- */
.product_list.grid .product-container .hover_fly,
.products_slider .product-container .hover_fly {
  background: none !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  top: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  z-index: 5 !important;
  width: 100% !important;
}

/* Main button (Add to cart): full-width gradient blue at card bottom */
.product_list.grid .hover_fly a:first-child,
.products_slider .hover_fly a:first-child {
  background: linear-gradient(135deg, #0099cf 0%, #00c2ff 100%) !important;
  width: 100% !important;
  text-align: center !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase !important;
  float: none !important;
  display: block !important;
  height: 44px !important;
  line-height: 44px !important;
  position: static !important;
  border-radius: 0 0 16px 16px !important;
  transition: background 0.2s ease !important;
  color: #ffffff !important;
}

.product_list.grid .hover_fly a:first-child:hover,
.products_slider .hover_fly a:first-child:hover {
  background: linear-gradient(135deg, #0077cc 0%, #0099cf 100%) !important;
}

/* Hide secondary buttons (quick view, compare, wishlist) */
.hover_fly a:not(:first-child) {
  display: none !important;
}

/* --- Product info section: generous padding, left-aligned --- */
.pro_second_box {
  padding: 16px 18px 20px !important;
  text-align: left !important;
  background: transparent !important;
}

.pro_second_box .s_title_block,
.pro_second_box .price_container {
  text-align: left !important;
}

/* --- Product title: 2-line clamp, clean --- */
.product-container .s_title_block {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  margin-bottom: 10px !important;
  height: auto !important;
}

.product-container .s_title_block a.product-name {
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--ink-900) !important;
}

.product-container .s_title_block a.product-name:hover {
  color: var(--brand-500) !important;
}

/* --- Price: Space Grotesk, prominent --- */
.product-container .price_container {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

.product-container .price_container .price {
  font-family: var(--font-display) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  letter-spacing: -0.02em !important;
}

.product-container .price_container .old-price {
  color: var(--ink-400) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}

.product-container .sale_percentage {
  background: #dc2626 !important;
  color: #ffffff !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

/* --- Availability: color-coded badge --- */
.product-container .availability .available-now {
  color: #059669 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

/* --- Sale percentage sticker (circle on image) --- */
.product-container .sale_percentage_sticker {
  background: #dc2626 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  border: 2px solid #ffffff !important;
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3) !important;
}

/* --- Hover: keep pro_second_box background clean --- */
.product_list.grid .ajax_block_product:hover .pro_second_box {
  background: transparent !important;
}

/* Category filters */
#layered_block_left {
  background: #ffffff;
  border: 1px solid var(--line-2);
  border-radius: var(--radius-2);
  padding: 18px;
}

.layered_subtitle_heading {
  padding: 8px 0;
  border-bottom: 1px solid var(--line-2);
}

.layered_filter_ul li {
  padding: 6px 0;
}

.layered_filter_ul li label a {
  color: var(--ink-700);
}

/* Product detail */
.primary_block {
  background: #ffffff;
  border: 1px solid var(--line-2);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
  padding: 24px;
  margin-bottom: var(--space-6);
}

.primary_block .pb-left-column,
.primary_block .pb-center-column,
.primary_block .pb-right-column {
  padding: 0 18px;
}

#image-block {
  border-radius: var(--radius-2);
  border: 1px solid var(--line-2);
  background: var(--bg-1);
  padding: 12px;
}

#views_block {
  margin-top: 14px;
}

#short_description_block,
#product_comments_block_tab,
#more_info_block {
  background: #ffffff;
  border-radius: var(--radius-2);
  border: 1px solid var(--line-2);
  padding: 16px;
}

#add_to_cart_wrap {
  margin-top: 10px;
}

#add_to_cart .btn {
  padding: 14px 24px;
  font-size: 15px;
}

/* ═══════════════════════════════════════════════════════════════
   BOX-INFO-PRODUCT – Ficha de producto 2026
   ═══════════════════════════════════════════════════════════════ */

.box-info-product {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

/* --- Sección de precios --- */
.box-info-product .content_prices {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0 0 20px 0;
  margin-bottom: 0;
  border-bottom: 1px solid var(--line-2);
}

.box-info-product .price_box {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.box-info-product .price_box .our_price_display {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

#our_price_display {
  font-family: var(--font-display);
  font-size: 36px;
  font-weight: 800;
  color: var(--ink-900);
  letter-spacing: -0.02em;
  line-height: 1;
}

.product_tax_label {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-500);
}

#old_price {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

#old_price_display {
  color: var(--ink-400);
  text-decoration: line-through;
  font-weight: 500;
  font-size: 18px;
}

.sale_percentage {
  background: #dc2626;
  color: #ffffff;
  padding: 4px 10px;
  border-radius: 6px;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.3px;
}

/* Countdown ofertas */
.countdown_outer_box {
  background: linear-gradient(90deg, rgba(220, 38, 38, 0.08), rgba(220, 38, 38, 0.02));
  border-left: 3px solid #dc2626;
  padding: 10px 14px;
  margin-bottom: 16px;
  border-radius: 0 8px 8px 0;
}

.countdown_heading {
  font-size: 12px;
  font-weight: 700;
  color: #dc2626;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.countdown_box {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-800);
}

/* --- Sección de atributos --- */
.product_attributes {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 20px 0;
  margin-top: 0;
}

.product_attributes fieldset {
  margin-bottom: 16px;
  padding: 0;
  border: none;
}

.product_attributes fieldset:last-child {
  margin-bottom: 0;
}

.product_attributes .attribute_label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink-700);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

.product_attributes .attribute_list {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
}

.product_attributes .attribute_list select,
.product_attributes .attribute_select {
  width: 100%;
  max-width: 320px;
  padding: 12px 16px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-800);
  background: var(--bg-0);
  border: 1px solid var(--line-1);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.product_attributes .attribute_select:hover {
  border-color: var(--brand-500);
}

.product_attributes .attribute_select:focus {
  border-color: var(--brand-500);
  box-shadow: 0 0 0 3px rgba(0, 153, 255, 0.12);
  outline: none;
}

/* Radio buttons para atributos */
.product_attributes .attribute_radio_list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.product_attributes .attribute_radio_list li {
  padding: 0;
}

.product_attributes .attribute_radio_list li label,
.product_attributes .attribute_radio_list li .radio_label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  background: var(--bg-0);
  border: 1px solid var(--line-1);
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-700);
  cursor: pointer;
  transition: all 0.2s ease;
}

.product_attributes .attribute_radio_list li label:hover {
  border-color: var(--brand-500);
  background: #ffffff;
}

.product_attributes .attribute_radio:checked + .radio_label,
.product_attributes .attribute_radio_list li.selected label {
  background: var(--brand-500);
  border-color: var(--brand-500);
  color: #ffffff;
}

/* Color picker */
#color_to_pick_list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

#color_to_pick_list li {
  padding: 0;
}

#color_to_pick_list .color_pick {
  display: block;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid var(--line-1);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#color_to_pick_list .color_pick:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

#color_to_pick_list li.selected .color_pick,
#color_to_pick_list .color_pick.selected {
  border-color: var(--brand-500);
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px var(--brand-500);
}

/* Disponibilidad */
#availability_statut {
  margin-top: 16px;
}

#availability_value {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  background: rgba(16, 185, 129, 0.1);
  color: #059669;
  border: none;
}

#availability_value::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10b981;
}

#availability_value.st-label-warning {
  background: rgba(245, 158, 11, 0.1);
  color: #d97706;
}

#availability_value.st-label-warning::before {
  background: #f59e0b;
}

#availability_value.st-label-danger {
  background: rgba(239, 68, 68, 0.1);
  color: #dc2626;
}

#availability_value.st-label-danger::before {
  background: #ef4444;
}

#pQuantityAvailable {
  margin-top: 8px;
  font-size: 13px;
  color: var(--ink-500);
}

#pQuantityAvailable #quantityAvailable {
  font-weight: 700;
  color: var(--ink-700);
}

/* --- Sección añadir al carrito --- */
.box-cart-bottom {
  margin-top: 0;
  padding-top: 20px;
  border-top: 1px solid var(--line-2);
  display: block;
}

.qt_cart_box {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
}

.qt_cart_box #quantity_wanted_p {
  margin: 0;
}

.qt_cart_box .quantity_input_wrap {
  background: var(--bg-0);
  border: 1px solid var(--line-1);
  border-radius: 10px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  overflow: hidden;
}

.qt_cart_box .product_quantity_down,
.qt_cart_box .product_quantity_up {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 48px;
  color: var(--ink-700);
  font-size: 18px;
  font-weight: 700;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.qt_cart_box .product_quantity_down:hover,
.qt_cart_box .product_quantity_up:hover {
  background: var(--brand-500);
  color: #ffffff;
}

#quantity_wanted {
  width: 52px;
  height: 48px;
  text-align: center;
  border: none;
  border-left: 1px solid var(--line-1);
  border-right: 1px solid var(--line-1);
  background: #ffffff;
  font-size: 16px;
  font-weight: 700;
  color: var(--ink-900);
}

#add_to_cart_wrap {
  flex: 1;
}

/* Botón añadir al carrito - MANTENER ESTILO */
#add_to_cart .btn {
  padding: 14px 28px;
  font-size: 15px;
  width: 100%;
}

/* Cantidad mínima */
#minimal_quantity_wanted_p {
  margin-top: 12px;
  padding: 10px 14px;
  background: rgba(245, 158, 11, 0.08);
  border-left: 3px solid #f59e0b;
  border-radius: 0 8px 8px 0;
  font-size: 13px;
  color: var(--ink-700);
}

#minimal_quantity_wanted_p b {
  color: #d97706;
  font-weight: 700;
}

#more_info_tabs li a {
  border-radius: 999px;
  padding: 10px 16px;
  background: var(--bg-2);
  border: 1px solid transparent;
  font-weight: 600;
}

#more_info_tabs li a.selected,
#more_info_tabs li a:hover {
  background: #ffffff;
  border-color: var(--line-1);
  color: var(--brand-600);
}

/* ═══════════════════════════════════════════════════════════════
   BUSCADOR — Título y selects modernizados
   ═══════════════════════════════════════════════════════════════ */

.titulo_cosmico {
  font-family: 'Sora', sans-serif !important;
  font-weight: 700;
  color: #1f2f46;
}

.subtitulo_cosmico {
  font-family: 'Sora', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #4a5c72;
}

.satelite_x {
  font-family: 'Sora', sans-serif !important;
  font-size: 14px !important;
  border: 2px solid #d8e2ef !important;
  border-radius: 10px !important;
  color: #1f2f46 !important;
  padding-left: 14px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.satelite_x:focus {
  border-color: #0099ff !important;
  box-shadow: 0 0 0 3px rgba(0, 153, 255, 0.12) !important;
  outline: none;
}

/* ═══════════════════════════════════════════════════════════════
   FOOTER — Redesign 2026
   ═══════════════════════════════════════════════════════════════ */

#footer {
  background: linear-gradient(160deg, #0d1420 0%, #101a2a 45%, #0a1220 100%);
  color: #e2e8f0;
  margin-top: var(--space-8);
  position: relative;
}

#footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: #0099cf;
}

/* --- Links globales del footer --- */
#footer a {
  color: #dbe6f2;
  font-weight: 500;
  transition: color 0.2s ease;
}

#footer a:hover {
  color: #ffffff;
}

/* --- Secciones principales --- */
#footer-top,
#footer-primary,
#footer-secondary {
  padding: 40px 0 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

/* --- Bloques del footer: limpios, sin glassmorphism --- */
#footer .block {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0 12px 24px;
  margin-bottom: 16px;
  box-shadow: none;
}

/* --- Títulos de bloque --- */
#footer .title_block {
  font-family: 'Sora', sans-serif;
  font-size: 12px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: #ffffff;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* --- Contenido de bloques --- */
#footer .block_content,
#footer .block_content p {
  color: #94a3b8;
  font-size: 13px;
  line-height: 1.6;
}

#footer .block_content li,
#footer .footer_block_content li {
  color: #94a3b8;
  padding: 8px 0 !important;
  font-size: 13px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

#footer .block_content li:last-child,
#footer .footer_block_content li:last-child {
  border-bottom: none !important;
}

#footer .block_content li a,
#footer .footer_block_content li a {
  color: #ffffff;
  font-family: 'Sora', sans-serif;
  font-weight: 400;
  font-size: 13px;
  transition: color 0.2s ease, padding-left 0.2s ease;
}

#footer .block_content li a:hover,
#footer .footer_block_content li a:hover {
  color: #ffffff;
  padding-left: 4px;
}

/* --- Ocultar los » anticuados de los enlaces del footer --- */
#footer li a > span:first-child,
#footer li > a > span:first-child,
#footer li > span:first-child {
  display: none !important;
}

/* --- Métodos de pago --- */
.footer-payment-methods {
  text-align: center;
  padding: 24px 24px 0;
}

.footer-payment-title {
  display: block;
  font-family: 'Sora', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #ffffff;
  margin-bottom: 14px;
}

.footer-payment-icons {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;
  flex-wrap: wrap;
}

.footer-payment-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 70px;
}

.footer-payment-item img {
  width: 32px;
  height: 26px;
}

.footer-payment-item span {
  font-family: 'Sora', sans-serif;
  font-size: 10px;
  font-weight: 500;
  color: #ffffff;
  letter-spacing: 0.2px;
  text-align: center;
  line-height: 1.3;
}

/* --- Copyright / footer_info --- */
#footer_info {
  background: rgba(0, 0, 0, 0.25);
  padding: 20px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

#footer_info .wide_container {
  padding: 0 !important;
}

#footer_info #copyright_text {
  color: #cbd5e1;
  font-family: 'Sora', sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.3px;
}

#footer_info #footer_bottom_right {
  float: none;
  margin-bottom: 0;
}

/* --- Social block dentro del footer --- */
#footer #social_block ul li a {
  color: #64748b;
  transition: color 0.2s ease, transform 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

#footer #social_block ul li a:hover {
  color: #ffffff;
  border-color: rgba(0, 153, 255, 0.4);
  background: rgba(0, 153, 255, 0.1);
}

/* --- Footer responsive (mobile) --- */
@media (max-width: 767px) {
  #footer-top,
  #footer-primary,
  #footer-secondary {
    padding: 24px 0 16px;
  }

  #footer .block {
    padding: 0 0 16px;
  }

  #footer .title_block {
    margin-bottom: 10px;
    padding-bottom: 8px;
  }

  .footer-payment-methods {
    padding: 20px 16px 0;
  }

  .footer-payment-icons {
    gap: 16px;
  }

  #footer_info {
    padding: 16px 0;
  }

  #footer_info #copyright_text {
    font-size: 11px;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT SLIDERS (Home, related products, etc.)
   ═══════════════════════════════════════════════════════════════ */

.products_slider .pro_first_box {
  border: none !important;
}

.products_slider .product-container {
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 1px solid var(--line-2) !important;
}

/* ═══════════════════════════════════════════════════════════════
   CATEGORY PAGE — Sort bar, pagination
   ═══════════════════════════════════════════════════════════════ */

.sortPa498 .selector,
.content_sortPa498 select,
#nb_item select,
.nbrItemPage select {
  border-radius: 10px !important;
  border: 1px solid var(--line-1) !important;
  padding: 8px 12px !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
}

.pagination li > a,
.pagination li > span {
  border-radius: 10px !important;
  margin: 0 3px !important;
  font-weight: 600 !important;
  font-family: var(--font-body) !important;
}

.pagination li.active > a,
.pagination li.active > span {
  background: var(--brand-500) !important;
  border-color: var(--brand-500) !important;
  color: #ffffff !important;
}

.pagination li > a:hover {
  background: var(--bg-2) !important;
  border-color: var(--line-1) !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT PAGE — Specs table
   ═══════════════════════════════════════════════════════════════ */

.table-data-sheet,
#product .table,
.table-bordered {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid var(--line-2) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  width: 100% !important;
}

.table-data-sheet th,
.table-data-sheet td,
#product .table th,
#product .table td {
  padding: 12px 16px !important;
  font-size: 14px !important;
  border-color: var(--line-2) !important;
}

.table-data-sheet th,
#product .table th {
  background: var(--bg-2) !important;
  font-weight: 600 !important;
  color: var(--ink-700) !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
}

.table-data-sheet tr:nth-child(even) td,
#product .table tr:nth-child(even) td {
  background: rgba(246, 248, 251, 0.5) !important;
}

.table-data-sheet tr:hover td,
#product .table tr:hover td {
  background: rgba(0, 153, 255, 0.04) !important;
}

/* ═══════════════════════════════════════════════════════════════
   BLOG — 2026 Redesign (listing + article)
   ═══════════════════════════════════════════════════════════════ */

/* --- Listing: blog cards --- */
.block_blog .blog_post,
.blog_row_list .blog_item {
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 1px solid var(--line-2) !important;
  background: #ffffff !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

.block_blog .blog_post:hover,
.blog_row_list .blog_item:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12) !important;
}

/* --- Blog category listing: card container --- */
#module-stblog-category #center_column,
#module-stblog-default #center_column {
  background: #ffffff !important;
  border: 1px solid rgba(15, 23, 42, 0.15) !important;
  border-left: 3px solid var(--brand-500) !important;
  border-radius: var(--radius-2) !important;
  padding: 32px !important;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.08) !important;
}
@media (max-width: 767px) {
  #module-stblog-category #center_column,
  #module-stblog-default #center_column { padding: 20px !important; }
}

/* --- Article: card container --- */
#blog_primary_block {
  background: #ffffff !important;
  border: 1px solid rgba(15, 23, 42, 0.15) !important;
  border-left: 3px solid var(--brand-500) !important;
  border-radius: var(--radius-2) !important;
  padding: 32px !important;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.08) !important;
  margin-bottom: 32px !important;
}
#blog_related_products {
  background: #ffffff !important;
  border: 1px solid rgba(15, 23, 42, 0.15) !important;
  border-left: 3px solid var(--brand-500) !important;
  border-radius: var(--radius-2) !important;
  padding: 28px 32px !important;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.08) !important;
  margin-bottom: 32px !important;
}
#blog_secondary_block {
  background: #ffffff !important;
  border: 1px solid rgba(15, 23, 42, 0.15) !important;
  border-left: 3px solid var(--brand-500) !important;
  border-radius: var(--radius-2) !important;
  padding: 28px 32px !important;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.08) !important;
}

@media (max-width: 767px) {
  #blog_primary_block { padding: 20px !important; }
  #blog_related_products,
  #blog_secondary_block { padding: 20px !important; }
}

/* --- Listing: card image --- */
.blog_list_grid .blog_image,
.blog_list_grid .blog_gallery,
.blog_list_grid .blog_video {
  border-radius: 12px !important;
  overflow: hidden;
  margin-bottom: 16px !important;
}
.blog_list_grid .blog_image img {
  width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}
.blog_list_grid .block_blog:hover .blog_image img {
  transform: scale(1.04);
}

/* --- Listing: card title --- */
.blog_list_grid .s_title_block,
.blog_list_large .s_title_block {
  font-family: var(--font-display) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  margin-bottom: 8px !important;
}
.blog_list_grid .s_title_block a,
.blog_list_large .s_title_block a {
  color: var(--ink-900) !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}
.blog_list_grid .s_title_block a:hover,
.blog_list_large .s_title_block a:hover {
  color: var(--brand-500) !important;
}

/* --- Listing: excerpt --- */
.blok_blog_short_content {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  color: var(--ink-500) !important;
  line-height: 1.6 !important;
  margin-bottom: 12px !important;
}
.blok_blog_short_content .go {
  color: var(--brand-500) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  margin-left: 6px !important;
}
.blok_blog_short_content .go:hover {
  color: var(--brand-600) !important;
  text-decoration: underline !important;
}

/* --- Listing + Article: metadata (fecha, autor, categorías) --- */
.blog_info {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  color: var(--ink-400) !important;
  margin-top: 12px !important;
}
.blog_info a {
  display: inline !important;
  color: var(--brand-500) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.blog_info a:hover {
  color: var(--brand-600) !important;
  text-decoration: underline !important;
}
.blog_info .date-add {
  font-weight: 600 !important;
  color: var(--ink-500) !important;
}
.blog_info .posted_on,
.blog_info .posted_by {
  color: var(--ink-400) !important;
}
.blog_info .posted_author {
  font-weight: 600 !important;
  color: var(--ink-700) !important;
}
.blog_info .blog-categories a {
  background: rgba(0, 153, 207, 0.08);
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  color: var(--brand-500) !important;
  transition: background 0.2s ease;
}
.blog_info .blog-categories a:hover {
  background: rgba(0, 153, 207, 0.15);
  text-decoration: none !important;
}

/* --- Listing: card spacing --- */
.blog_list_grid .block_blog {
  padding-bottom: 32px !important;
}

/* --- Article: featured image --- */
#blog_primary_block .blog_image,
#blog_primary_block .blog_gallery,
#blog_primary_block .blog_video {
  border-radius: 16px !important;
  overflow: hidden;
  margin-bottom: 28px !important;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.07);
}
#blog_primary_block .blog_image img {
  width: 100%;
  height: auto;
  display: block;
}

/* --- Article: title h1 --- */
#blog_primary_block h1 {
  font-family: var(--font-display) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  line-height: 1.3 !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
}

/* --- Article: body content --- */
#blog_primary_block .blog_content {
  font-family: var(--font-body) !important;
  font-size: 15px !important;
  color: var(--ink-800) !important;
  line-height: 1.8 !important;
  margin-bottom: 28px !important;
}
#blog_primary_block .blog_content p {
  margin-bottom: 16px !important;
}
#blog_primary_block .blog_content h2 {
  font-family: var(--font-display) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  margin: 32px 0 16px !important;
  line-height: 1.3;
}
#blog_primary_block .blog_content h3 {
  font-family: var(--font-display) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  margin: 24px 0 12px !important;
  line-height: 1.35;
}
#blog_primary_block .blog_content img {
  border-radius: 12px;
  max-width: 100%;
  height: auto;
  margin: 16px 0;
}
#blog_primary_block .blog_content a {
  color: var(--brand-500);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease;
}
#blog_primary_block .blog_content a:hover {
  color: var(--brand-600);
  border-bottom-color: var(--brand-600);
}
#blog_primary_block .blog_content ul,
#blog_primary_block .blog_content ol {
  padding-left: 20px !important;
  margin-bottom: 16px !important;
}
#blog_primary_block .blog_content li {
  margin-bottom: 6px !important;
  line-height: 1.7;
}

/* --- Article: metadata --- */
#blog_primary_block .blog_info {
  padding-top: 20px !important;
  border-top: 2px solid var(--bg-2) !important;
  margin-bottom: 20px !important;
}

/* --- Article: tags --- */
#blog_tags {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 16px 0 20px !important;
  margin-bottom: 24px !important;
  border-bottom: 2px solid var(--bg-2) !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  color: var(--ink-400) !important;
}
#blog_tags a {
  display: inline-block !important;
  background: var(--bg-2) !important;
  color: var(--ink-700) !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}
#blog_tags a:hover {
  background: var(--brand-500) !important;
  color: #ffffff !important;
}

/* --- Article: related products --- */
#blog_related_products .title_block {
  font-family: var(--font-display) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  border-bottom: none !important;
  padding-bottom: 16px !important;
}
#blog_related_products .pro_outer_box {
  border: 1px solid var(--line-2);
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
#blog_related_products .pro_outer_box:hover {
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.10);
  transform: translateY(-3px);
}
#blog_related_products .pro_second_box {
  padding: 12px 14px !important;
}
#blog_related_products .s_title_block {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}
#blog_related_products .s_title_block a {
  color: var(--ink-900) !important;
  text-decoration: none !important;
}
#blog_related_products .s_title_block a:hover {
  color: var(--brand-500) !important;
}
#blog_related_products .price {
  font-family: var(--font-display) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
}

/* --- Article: secondary block (comments, related articles) --- */
#blog_secondary_block .title_block {
  font-family: var(--font-display) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  padding-bottom: 12px !important;
  border-bottom: 2px solid var(--bg-2) !important;
  margin-bottom: 20px !important;
}

/* --- Blog mobile --- */
@media (max-width: 767px) {
  #module-stblog-article #breadcrumb_wrapper { display: none !important; }
  #blog_primary_block h1 { font-size: 22px !important; }
  #blog_primary_block .blog_content { font-size: 14px !important; line-height: 1.7 !important; }
  #blog_primary_block .blog_content h2 { font-size: 19px !important; }
  #blog_primary_block .blog_content h3 { font-size: 16px !important; }
  #blog_primary_block .blog_image,
  #blog_primary_block .blog_gallery,
  #blog_primary_block .blog_video { border-radius: 12px !important; margin-bottom: 20px !important; }
  .blog_list_grid .s_title_block { font-size: 15px !important; }
  #blog_related_products .title_block { font-size: 18px !important; }
}

/* ═══════════════════════════════════════════════════════════════
   BTSEARCH RESULTS PAGE — 2026 Redesign
   ═══════════════════════════════════════════════════════════════ */

/* --- Neutralize legacy elements --- */
#module-btsearch-btsearch #estacion_venus { display: none; }
#module-btsearch-btsearch .aenvio-buscador { display: none !important; }
#module-btsearch-btsearch .titulo-equipacion { display: none; }
/* --- Hide category sliders from sidebar (not relevant on results page) --- */
#module-btsearch-btsearch .product_categories_slider_block_column { display: none !important; }

/* --- H1 --- */
#module-btsearch-btsearch .buscador-title {
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: 700;
  color: var(--ink-900);
  text-align: center;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  line-height: 1.3;
  margin: 0 0 36px;
  padding-bottom: 20px;
  border-bottom: 2px solid var(--bg-2);
}

/* --- Kit card (.caja-opciones) --- */
#module-btsearch-btsearch .caja-opciones {
  border: 1px solid rgba(15, 23, 42, 0.15) !important;
  border-left: 3px solid var(--brand-500) !important;
  border-radius: var(--radius-2) !important;
  padding: 24px !important;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.08) !important;
  background: #ffffff !important;
  margin-bottom: 32px;
  transition: box-shadow 0.25s ease, border-color 0.25s ease;
}
#module-btsearch-btsearch .caja-opciones:hover {
  box-shadow: 0 4px 8px rgba(15, 23, 42, 0.08), 0 16px 40px rgba(15, 23, 42, 0.12) !important;
  border-color: rgba(15, 23, 42, 0.20) !important;
  border-left-color: var(--brand-500) !important;
}

/* --- Kit header + título --- */
#module-btsearch-btsearch .bts-kit-header {
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 2px solid var(--bg-2);
}
#module-btsearch-btsearch .titulo-opciones {
  font-family: var(--font-display) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  text-align: left !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

/* --- Images --- */
#module-btsearch-btsearch .bts-kit-images {
  display: flex;
  gap: 16px;
  margin-bottom: 20px;
}
#module-btsearch-btsearch .bts-kit-images > a,
#module-btsearch-btsearch .bts-kit-images > span {
  display: block;
  text-decoration: none;
}
#module-btsearch-btsearch .bts-kit-images > a:first-child,
#module-btsearch-btsearch .bts-kit-images > span:first-child {
  flex-shrink: 0;
}
#module-btsearch-btsearch .bts-kit-images > a:last-child,
#module-btsearch-btsearch .bts-kit-images > span:last-child {
  flex: 1;
  min-width: 0;
}
#module-btsearch-btsearch .imagen_comet {
  float: none !important;
  width: 195px !important;
  min-width: 195px;
  height: 195px !important;
  border: 1px solid var(--line-2) !important;
  border-radius: 12px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  transition: border-color 0.2s ease;
}
#module-btsearch-btsearch .imagen_comet:hover {
  border-color: var(--brand-500);
}
#module-btsearch-btsearch .imagen_astronaut {
  float: none !important;
  width: 100% !important;
  height: 195px !important;
  border: 1px solid var(--line-2) !important;
  border-radius: 12px !important;
  position: relative;
  overflow: hidden;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
#module-btsearch-btsearch .bts-img-disclaimer {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: rgba(0,0,0,0.6);
  color: #fff;
  font-size: 11px;
  padding: 5px 10px;
  text-align: center;
}

/* --- Info-buscador --- */
#module-btsearch-btsearch .info-buscador {
  float: none !important;
  width: 100% !important;
  margin: 0 0 20px !important;
  padding: 10px 14px !important;
  background: rgba(0, 153, 207, 0.05) !important;
  border: 1px solid rgba(0, 153, 207, 0.15);
  border-radius: var(--radius-1) !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  color: var(--ink-400) !important;
  text-align: left !important;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* --- Components (checkboxes + names + prices) --- */
#module-btsearch-btsearch .altura_sideral {
  float: none !important;
  width: 100% !important;
  clear: both;
}
#module-btsearch-btsearch .bts-section-label {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  color: var(--ink-400);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 10px;
  padding-bottom: 0;
  border-bottom: none;
}
#module-btsearch-btsearch .bts-section-optional {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px dashed rgba(15, 23, 42, 0.12);
  color: var(--ink-400);
}
#module-btsearch-btsearch .bts-component-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line-2);
}
#module-btsearch-btsearch .bts-component-row:last-of-type {
  border-bottom: none;
}
#module-btsearch-btsearch .bts-component-row input[type="checkbox"] {
  width: 20px; height: 20px; min-width: 20px;
  accent-color: var(--brand-500);
  margin: 0; flex-shrink: 0;
  /* Reset legacy inline styles */
  display: block !important;
  float: none !important;
}
#module-btsearch-btsearch .bts-component-info { flex: 1; min-width: 0; }
#module-btsearch-btsearch .bts-component-name {
  font-weight: 600; color: var(--brand-500); font-size: 14px;
}
#module-btsearch-btsearch .bts-component-name:hover {
  color: var(--brand-600); text-decoration: underline;
}
#module-btsearch-btsearch .bts-component-ref {
  color: var(--ink-400); font-size: 11px; margin-left: 6px;
}
#module-btsearch-btsearch .bts-component-price {
  font-weight: 700; color: var(--ink-900); font-size: 15px;
  white-space: nowrap; flex-shrink: 0;
  min-width: 70px; text-align: right;
}
#module-btsearch-btsearch .bts-no-stock {
  padding: 4px 12px;
  background: rgba(220, 38, 38, 0.08);
  color: #dc2626;
  font-size: 12px; font-weight: 700;
  border-radius: 999px;
  white-space: nowrap; flex-shrink: 0;
}

/* --- Kit footer (price + shipping + CTA) --- */
#module-btsearch-btsearch .bts-kit-footer {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 2px solid var(--bg-2);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
#module-btsearch-btsearch .bts-kit-price {
  display: flex; align-items: baseline; gap: 6px;
}
#module-btsearch-btsearch .bts-price-label {
  font-family: var(--font-display);
  font-size: 13px; font-weight: 600; color: var(--ink-400);
  text-transform: uppercase; letter-spacing: 0.05em;
}
#module-btsearch-btsearch .bts-price-value {
  font-family: var(--font-display);
  font-size: 30px; font-weight: 800; color: var(--ink-900);
  letter-spacing: -0.02em;
}
#module-btsearch-btsearch .bts-price-tax {
  font-size: 12px; color: var(--ink-400);
}
#module-btsearch-btsearch .bts-kit-shipping {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: #059669; font-weight: 600;
  background: rgba(5, 150, 105, 0.06);
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgba(5, 150, 105, 0.12);
}
#module-btsearch-btsearch .bts-shipping-time {
  color: #059669; font-weight: 700;
}
#module-btsearch-btsearch .bts-shipping-icon {
  font-size: 15px;
}
#module-btsearch-btsearch .btsearch_add_to_cart {
  float: none !important;
  display: inline-block;
  width: auto;
  min-width: 260px;
  padding: 14px 36px !important;
  font-size: 16px !important;
  font-family: var(--font-body) !important;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 12px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
#module-btsearch-btsearch .btsearch_add_to_cart:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(0, 153, 255, 0.28);
}

/* --- Mobile responsive --- */
@media (max-width: 767px) {
  #module-btsearch-btsearch .buscador-title { font-size: 20px; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 2px solid var(--bg-2); }
  #module-btsearch-btsearch .caja-opciones { padding: 16px !important; border-radius: 12px !important; border-left: 3px solid var(--brand-500) !important; }
  #module-btsearch-btsearch .bts-kit-images { flex-direction: column; }
  #module-btsearch-btsearch .bts-kit-images > a:last-child,
  #module-btsearch-btsearch .bts-kit-images > span:last-child { width: 100% !important; }
  #module-btsearch-btsearch .bts-kit-images > a:first-child,
  #module-btsearch-btsearch .bts-kit-images > span:first-child { width: auto !important; align-self: center; }
  #module-btsearch-btsearch .imagen_comet { width: 195px !important; max-width: 100% !important; min-width: 0 !important; height: 195px !important; float: none !important; margin: 0 !important; }
  #module-btsearch-btsearch .imagen_astronaut { width: 100% !important; height: 160px !important; float: none !important; margin: 0 !important; }
  #module-btsearch-btsearch .bts-component-row { flex-wrap: wrap; }
  #module-btsearch-btsearch .bts-component-price,
  #module-btsearch-btsearch .bts-no-stock { margin-left: 30px; }
  #module-btsearch-btsearch .bts-kit-footer { flex-direction: column; align-items: stretch; }
  #module-btsearch-btsearch .bts-kit-price { justify-content: center; }
  #module-btsearch-btsearch .bts-kit-shipping { text-align: center; align-self: center; }
  #module-btsearch-btsearch .bts-price-value { font-size: 24px; }
  #module-btsearch-btsearch .btsearch_add_to_cart { width: 100% !important; display: block; min-width: 0; }
}

/* ═══════════════════════════════════════════════════════════════
   CATEGORY SEO FAQ ACCORDION
   ═══════════════════════════════════════════════════════════════ */

.alv-cat-seo {
  max-width: 900px;
  margin: 0 auto;
  padding: 48px 20px 32px;
  border-top: 2px solid var(--bg-2);
}
.alv-cat-seo-intro {
  margin-bottom: 32px;
}
.alv-cat-seo-intro p {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--ink-900) !important;
  line-height: 1.7 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
}
.alv-cat-seo h2 {
  font-family: var(--font-display) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  border-left: 3px solid var(--brand-500);
  padding: 0 0 0 14px !important;
  margin: 0 0 20px !important;
  line-height: 1.3;
}
.alv-cat-faq {
  background: var(--bg-1);
  border: 1px solid var(--line-1);
  border-radius: var(--radius-1);
  margin-bottom: 8px;
  overflow: hidden;
  transition: border-color 0.2s ease;
}
.alv-cat-faq[open] {
  border-left: 3px solid var(--brand-500);
}
.alv-cat-faq summary {
  font-family: var(--font-display) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--ink-900) !important;
  padding: 16px 44px 16px 20px !important;
  cursor: pointer;
  list-style: none;
  position: relative;
  transition: background 0.2s ease;
  margin: 0 !important;
}
.alv-cat-faq summary::-webkit-details-marker { display: none; }
.alv-cat-faq summary::after {
  content: "+";
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  font-weight: 400;
  color: var(--ink-400);
  transition: transform 0.2s ease;
}
.alv-cat-faq[open] summary::after {
  content: "\2212";
  color: var(--brand-500);
}
.alv-cat-faq summary:hover {
  background: var(--bg-2);
}
.alv-cat-faq .alv-cat-faq-answer {
  padding: 16px 24px 20px !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: var(--ink-700) !important;
  line-height: 1.6 !important;
}
.alv-cat-faq .alv-cat-faq-answer p {
  margin: 0 0 8px !important;
  padding: 0 !important;
}

@media (max-width: 767px) {
  .alv-cat-seo { padding: 32px 16px 24px; }
  .alv-cat-seo h2 { font-size: 19px !important; }
  .alv-cat-faq summary { font-size: 14px !important; padding: 14px 40px 14px 16px !important; }
  .alv-cat-faq .alv-cat-faq-answer { padding: 14px 20px 16px !important; font-size: 13px !important; }
}

/* ═══════════════════════════════════════════════════════════════
   BTSEARCH — Mini-buscador sidebar (desktop)
   ═══════════════════════════════════════════════════════════════ */

/* Título visual via ::before */
#module-btsearch-btsearch #left_column #nave_principal .modulo_orbital::before {
  content: "BUSCAR OTRO VEHÍCULO";
  display: block;
  font-family: var(--font-display);
  font-size: 16px; font-weight: 700; color: var(--ink-900);
  text-transform: uppercase;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line-2);
}

/* Ocultar: títulos, IA (popups de techos se mantienen visibles para JS) */
#module-btsearch-btsearch #left_column .titulo_cosmico,
#module-btsearch-btsearch #left_column .subtitulo_cosmico,
#module-btsearch-btsearch #left_column #ia-search-wrapper,
#module-btsearch-btsearch #left_column .manual-fallback,
#module-btsearch-btsearch #left_column #inline-chat-container {
  display: none !important;
}

/* Contenedores: compactos */
#module-btsearch-btsearch #left_column #nave_principal {
  width: 100% !important; margin: 0 !important; position: static !important;
}
#module-btsearch-btsearch #left_column .modulo_orbital {
  width: 100% !important; margin: 0 !important; padding: 16px !important;
  background: #fff !important; border-radius: var(--radius-1) !important;
  border: 1px solid var(--line-2) !important;
  box-shadow: none !important; backdrop-filter: none !important;
}
#module-btsearch-btsearch #left_column .ilc-card-manual {
  background: transparent !important; border: none !important;
  box-shadow: none !important; padding: 0 !important;
}

/* Selects: verticales, full-width */
#module-btsearch-btsearch #left_column .satelite_x {
  width: 100% !important; float: none !important;
  margin-bottom: 10px !important; height: 42px !important;
  font-size: 13px !important; font-family: var(--font-body) !important;
  border: 1px solid var(--line-1) !important;
  border-radius: 8px !important;
}
#module-btsearch-btsearch #left_column .orbita_null,
#module-btsearch-btsearch #left_column #orbita-carroceria {
  display: none !important;
}

/* Botón: full-width, compacto — override global.css + uniform wrapper */
#module-btsearch-btsearch #left_column .boton_nebulosa {
  width: 100% !important; padding: 10px 16px !important;
  font-size: 14px !important; font-family: var(--font-body) !important;
  font-weight: 700 !important; letter-spacing: 0.3px;
  text-transform: uppercase;
  border-radius: var(--radius-1) !important;
  background: linear-gradient(135deg, var(--brand-500) 0%, #00c2ff 100%) !important;
  color: #fff !important;
  border: 0 !important;
  cursor: pointer;
  display: block !important;
  height: auto !important;
  line-height: normal !important;
  margin: 10px 0 0 !important;
  box-sizing: border-box !important;
  box-shadow: 0 8px 20px rgba(0, 153, 255, 0.2);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  /* Override Uniform.js inline styles (opacity: 0.01, position: absolute) */
  opacity: 1 !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  text-align: center;
}
#module-btsearch-btsearch #left_column .boton_nebulosa:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(0, 153, 255, 0.3);
}
/* Style uniform.js wrapper as the button */
#module-btsearch-btsearch #left_column div.button {
  width: 100% !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  background: linear-gradient(135deg, var(--brand-500) 0%, #00c2ff 100%) !important;
  background-image: linear-gradient(135deg, var(--brand-500) 0%, #00c2ff 100%) !important;
  border: 0 !important;
  border-radius: var(--radius-1) !important;
  height: auto !important;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(0, 153, 255, 0.2);
  display: block !important;
  background-position: initial !important;
}
#module-btsearch-btsearch #left_column div.button:hover {
  box-shadow: 0 12px 24px rgba(0, 153, 255, 0.3);
}
#module-btsearch-btsearch #left_column div.button span {
  display: block !important;
  padding: 10px 16px !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  font-family: var(--font-body) !important;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  text-align: center;
  background: transparent !important;
  border: none !important;
  line-height: normal !important;
  height: auto !important;
}

/* Filtros progresivos: adaptar para ancho estrecho */
#module-btsearch-btsearch #left_column .bf-roof-grid { grid-template-columns: repeat(2, 1fr); gap: 6px; }
#module-btsearch-btsearch #left_column .bf-roof-card { padding: 8px 4px; }
#module-btsearch-btsearch #left_column .bf-roof-card img { width: 40px; height: 40px; }
#module-btsearch-btsearch #left_column .bf-roof-card span { font-size: 10px; }
#module-btsearch-btsearch #left_column .bf-year-input { width: 80px; }
#module-btsearch-btsearch #left_column .bf-final-cards--scroll { max-height: 260px; }
#module-btsearch-btsearch #left_column .bf-step-label { font-size: 13px; }
#module-btsearch-btsearch #left_column .bf-confirmed { padding: 10px 12px; font-size: 12px; }

/* ═══════════════════════════════════════════════════════════════
   BTSEARCH — Mini-buscador mobile (left_column visible via CSS)
   Transformer puts #left_column at top:-50000px on mobile.
   We override that ONLY on btsearch, showing just #nave_principal.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  /* Make .row a flex container so we can reorder columns */
  #module-btsearch-btsearch #columns > .row {
    display: flex !important;
    flex-wrap: wrap !important;
  }
  /* Bring #left_column back into normal flow, AFTER center_column */
  #module-btsearch-btsearch #left_column {
    position: static !important;
    top: auto !important;
    width: 100% !important;
    order: 2 !important;
    box-shadow: none !important;
    z-index: auto !important;
    background: transparent !important;
    padding: 0 15px !important;
    float: none !important;
  }
  #module-btsearch-btsearch #center_column {
    order: 1 !important;
  }
  /* Hide everything in left_column except the mini-buscador and popups */
  #module-btsearch-btsearch #left_column > *:not(#nave_principal):not(#myPopup):not(#imagePopup) {
    display: none !important;
  }
  /* Style the mini-buscador container */
  #module-btsearch-btsearch #left_column #nave_principal {
    margin: 30px 0 0 0 !important;
    padding: 20px !important;
    width: 100% !important;
    background: var(--bg-2) !important;
    border-radius: var(--radius-2) !important;
  }
}

/* Mobile */
@media (max-width: 991px) {
  /* Breadcrumb: ocultar en móvil en páginas /barras/ (textos muy largos) */
  #module-btsearch-btsearch #breadcrumb_wrapper,
  #module-btsearch-btsearch .separador-cabecera {
    display: none;
  }

  #owl_carousel_container_1 {
    padding: 0 !important;
  }

  #mobile_bar {
    position: sticky;
    top: 0;
    z-index: 10020;
    background: #ffffff;
    border-bottom: 1px solid var(--line-2);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
  }

  .top_barra_mobile {
    background: #0099cf;
    height: 26px;
    line-height: 24px;
  }

  .top_barra_mobile .top_barra_texto {
    font-size: 11px;
    padding-right: 12px;
  }

  #mobile_bar_container {
    padding: 10px 10px 6px;
  }

  /* Mobile search bar */
  #search_block_mobile_bar .searchbox_inner {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    background: var(--bg-2) !important;
    border: 1px solid var(--line-2) !important;
    border-radius: 8px !important;
    padding: 4px 6px 4px 4px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    text-align: left !important;
    position: relative !important;
  }

  #search_block_mobile_bar .search_query {
    flex: 1 !important;
    min-width: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 8px 12px 8px 16px !important;
    font-size: 14px !important;
    font-family: var(--font-body) !important;
    height: auto !important;
    width: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
  }

  #search_block_mobile_bar .submit_searchbox {
    background: var(--brand-500) !important;
    border-radius: 6px !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    border: none !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    line-height: 36px !important;
  }

  #search_block_mobile_bar .submit_searchbox i {
    color: #ffffff !important;
    font-size: 16px !important;
    line-height: 1 !important;
  }

  #mobile_header_logo img {
    height: 34px;
  }

  #mobile_bar .icon_wrap {
    background: var(--bg-2);
    border-radius: 12px;
    padding: 8px;
    border: 1px solid var(--line-2);
  }

  .header-banner {
    padding: 0;
    border: none;
    border-top: 1px solid rgba(0, 153, 255, 0.2);
  }

  .header-banner small-custom {
    font-weight: 400;
  }

  #search_block_top {
    max-width: 100%;
  }

  .menu_fixed_interior {
    padding: 0 14px;
  }

  .primary_block {
    padding: 16px;
  }
}

@media (min-width: 992px) {
  #mobile_bar,
  #page_header.sticky_mh #mobile_bar {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    box-shadow: none !important;
    display: none !important;
  }

  #page_header,
  #page_header #header,
  #page_header.has_sticky,
  #page_header.sticky_mh,
  #st_advanced_menu_container,
  #st_mega_menu_container,
  #page_header #header.sticky,
  #st_advanced_menu_container.sticky,
  #st_mega_menu_container.sticky,
  .menu-fijo {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    box-shadow: none !important;
    z-index: auto !important;
  }

  #header {
    display: none;
  }
}

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

  #top_extra {
    display: none;
  }

  .product_list li.ajax_block_product {
    padding: 8px;
  }

  /* Mobile cards: slightly reduced spacing */
  .pro_second_box {
    padding: 12px 14px 16px !important;
  }

  .product-container .price_container .price {
    font-size: 18px !important;
  }

  .product-container .s_title_block {
    font-size: 13px !important;
  }

  /* Mobile: hover_fly COMPLETE redesign — override ALL global.css defaults */
  .product_list .product-container .hover_fly {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    background: none !important;
    height: auto !important;
    width: 100% !important;
    z-index: 5 !important;
    border-radius: 0 !important;
  }

  .product_list .product-container .hover_fly a:first-child {
    background: linear-gradient(135deg, #0099cf 0%, #00c2ff 100%) !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    border-radius: 0 0 16px 16px !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    letter-spacing: 0.6px !important;
    text-transform: uppercase !important;
    text-align: center !important;
    float: none !important;
    position: static !important;
    text-decoration: none !important;
    border: none !important;
    padding: 0 !important;
    white-space: nowrap !important;
  }

  .product_list .product-container .hover_fly a:first-child span {
    display: inline !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.6px !important;
    vertical-align: unset !important;
    left: unset !important;
    position: static !important;
  }

  .product_list .product-container .hover_fly a:first-child i {
    display: none !important;
  }

  .product_list .product-container .hover_fly a:not(:first-child) {
    display: none !important;
  }

  .product-container {
    padding-bottom: 40px !important;
  }
}

/* ===============================================================
   CONTACT PAGE ("Contáctanos")
   =============================================================== */

/* ---- Container ---- */
#ayudaOnlineFooter {
  background: var(--bg-0);
  padding: 60px 0 80px 0;
  float: none !important;
  width: 100%;
}

/* ---- Intro section reset ---- */
.introAyuda {
  float: none !important;
  border-top: none !important;
}

/* ---- Heading (h2 with SVG background icon) ---- */
#ayudaOnlineFooter h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 36px;
  color: var(--brand-500) !important;
  letter-spacing: -0.02em;
  /* SVG icon preserved from global.css */
  background: url(/recursos/contactanos/contactanos.svg) top center / 80px no-repeat;
  padding: 100px 0 0 0;
}

/* ---- Intro text ---- */
.introAyuda p {
  font-family: var(--font-body);
  color: var(--ink-500) !important;
  font-size: 17px;
  letter-spacing: 0;
  line-height: 1.6;
}

/* ---- Business hours ---- */
.horarioAyuda p {
  font-family: var(--font-body);
  color: var(--ink-500);
  font-size: 14px;
  line-height: 1.5;
}

.horarioAyuda strong {
  font-size: 14px;
  color: var(--ink-900);
}

.horarioAyuda span {
  color: var(--brand-500);
  font-size: 12px;
  line-height: 1.4;
}

/* ---- Cards grid ---- */
.canalesContacto {
  display: flex !important;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 40px 0 0 0;
  float: none !important;
  width: 100%;
}

.canalesContacto li {
  float: none !important;
  flex: 1 1 220px;
  max-width: 280px;
  padding: 0 !important;
  list-style: none;
}

.canalesContacto li.col-md-3 {
  width: auto !important;
}

/* ---- Individual card ---- */
.canalAyuda {
  float: none !important;
  background: #ffffff !important;
  border-radius: var(--radius-2) !important;
  border: 1px solid var(--line-2) !important;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.07) !important;
  padding: 32px 24px 24px !important;
  text-align: center;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
}

.canalAyuda:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14) !important;
  border-color: rgba(0, 153, 255, 0.3) !important;
}

/* ---- Card icons ---- */
.canalesContacto img {
  width: 64px !important;
  height: 64px !important;
  background: linear-gradient(135deg, #0099ff 0%, #00c2ff 100%) !important;
  border-radius: 50% !important;
  padding: 14px !important;
  margin-bottom: 16px;
}

/* ---- Card text ---- */
.canalesContacto h3 {
  font-family: var(--font-display) !important;
  color: var(--ink-900) !important;
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 8px 0 !important;
  letter-spacing: -0.01em;
}

.canalesContacto p {
  color: var(--ink-400) !important;
  font-size: 14px;
  font-family: var(--font-body);
  line-height: 1.5;
  margin-bottom: 16px;
  flex-grow: 1;
}

/* ---- Card buttons ---- */
.contactFooter {
  margin-top: auto;
  width: 100%;
}

.canalAyuda a {
  background: linear-gradient(135deg, #0099ff 0%, #00c2ff 100%) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  padding: 10px 24px !important;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  display: inline-block !important;
  float: none !important;
  width: auto !important;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  box-shadow: 0 8px 20px rgba(0, 153, 255, 0.2);
}

.canalAyuda a:hover,
.canalesContacto li a:hover {
  background: linear-gradient(135deg, #0086e0 0%, #00a6dd 100%) !important;
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(0, 153, 255, 0.3);
}

/* ---- Responsive: Tablet ---- */
@media (max-width: 991px) {
  #ayudaOnlineFooter {
    padding: 40px 16px 60px;
  }

  #ayudaOnlineFooter h2 {
    font-size: 30px;
  }

  .canalesContacto {
    gap: 16px;
  }

  .canalesContacto li {
    flex: 1 1 200px;
    max-width: 48%;
    float: none !important;
    width: auto !important;
  }

  .canalAyuda {
    float: none !important;
  }
}

/* ---- Responsive: Mobile ---- */
@media (max-width: 767px) {
  #ayudaOnlineFooter {
    padding: 32px 16px 48px;
  }

  #ayudaOnlineFooter h2 {
    font-size: 26px;
    background-size: 60px;
  }

  .introAyuda p {
    font-size: 15px;
  }

  .canalesContacto {
    display: grid !important;
    grid-template-columns: 1fr;
    grid-auto-rows: 1fr;
    gap: 16px;
    max-width: 400px;
    margin: 40px auto 0 !important;
  }

  .canalesContacto li {
    width: 100% !important;
    max-width: 100%;
    float: none !important;
  }

  .canalAyuda {
    float: none !important;
    padding: 24px 20px 20px !important;
    height: 100%;
  }

  .canalesContacto img {
    width: 56px !important;
    height: 56px !important;
  }
}

/* ---- Responsive: Small mobile ---- */
@media (max-width: 480px) {
  #ayudaOnlineFooter {
    padding: 24px 12px 40px;
  }

  #ayudaOnlineFooter h2 {
    font-size: 22px;
    padding-top: 80px;
  }

  .canalesContacto li {
    max-width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════════
   LAYER CART (Popup "Producto añadido al carrito")
   Fix: position fixed + centrado viewport + rediseño 2026
   ═══════════════════════════════════════════════════════════════ */

/* --- Posicionamiento: centrado en viewport --- */
#layer_cart {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  margin-left: 0;
  z-index: 10020;
  width: 420px;
  border-radius: var(--radius-2);
  box-shadow: 0 22px 48px rgba(11, 18, 32, 0.16);
  border: 1px solid var(--line-2);
  overflow: hidden;
  background: #ffffff;
}

.layer_cart_overlay {
  z-index: 10015;
  opacity: 0.4;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

/* --- Padding interno --- */
#layer_cart .layer_inner_box {
  padding: 24px;
}

/* --- Imagen del producto --- */
#layer_cart .layer_product .product-image-container {
  max-width: 80px;
  border: 1px solid var(--line-1);
  border-radius: var(--radius-1);
  overflow: hidden;
}

/* --- Info del producto --- */
#layer_cart .layer_product .layer_product_info {
  margin-left: 96px;
}

#layer_cart .layer_product .layer_product_info .product-name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  color: var(--ink-900);
}

/* --- Labels (Cantidad, Total) --- */
#layer_cart .layer_cart_label {
  color: var(--ink-400);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
}

/* --- Mensaje "Producto añadido correctamente" --- */
#layer_cart #pro_added_success {
  background: rgba(16, 185, 129, 0.1);
  color: #059669;
  border-radius: 8px;
  padding: 10px 14px;
  font-weight: 600;
  font-size: 13px;
  text-align: center;
  border: none;
  margin-bottom: 15px;
}

/* --- Espacio antes del total --- */
#layer_cart #layer_cart_ajax_block_cart_total {
  margin-top: 15px;
}

/* --- Fila total: label arriba, precio abajo --- */
#layer_cart #layer_cart_ajax_block_cart_total {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

#layer_cart #layer_cart_ajax_block_cart_total .ajax_block_cart_total {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink-900);
}

/* --- Contador artículos: emoji carrito --- */
#layer_cart .layer_cart_sum .ajax_cart_product_txt_s::before,
#layer_cart .layer_cart_sum .ajax_cart_product_txt::before {
  content: "\1F6D2";
  margin-right: 6px;
}

/* --- Botones: layout en columna --- */
#layer_cart .button-container {
  display: flex;
  flex-direction: column-reverse;
  gap: 10px;
  margin-top: 16px;
}

#layer_cart .button-container .continue,
#layer_cart .button-container .btn.pull-right {
  float: none !important;
  width: 100%;
  text-align: center;
  display: block;
}

/* Botón "Seguir comprando" — secundario */
#layer_cart .button-container .continue {
  background: #ffffff;
  color: var(--ink-900);
  border: 1px solid var(--line-1);
  border-radius: 999px;
  font-weight: 700;
  padding: 11px 18px;
  font-size: 13px;
  transition: all 0.2s ease;
}

#layer_cart .button-container .continue:hover {
  box-shadow: var(--shadow-1);
  transform: translateY(-1px);
}

/* Botón "Realizar pedido" — primario CTA */
#layer_cart .button-container .btn.pull-right {
  background: linear-gradient(135deg, #0099cf 0%, #00c2ff 100%);
  color: #ffffff;
  border: 0;
  border-radius: 999px;
  font-weight: 700;
  padding: 11px 18px;
  font-size: 13px;
  box-shadow: 0 14px 28px rgba(0, 153, 255, 0.28);
  transition: all 0.2s ease;
}

#layer_cart .button-container .btn.pull-right:hover {
  background: linear-gradient(135deg, #0077cc 0%, #00a6dd 100%);
  transform: translateY(-1px);
}

/* --- Botón cerrar (X) --- */
#layer_cart .cross {
  right: 12px;
  top: 12px;
  width: 32px;
  height: 32px;
  line-height: 32px;
  font-size: 1.1em;
  background: rgba(15, 23, 42, 0.06);
  color: var(--ink-500);
  border-radius: 50%;
  transition: background 0.2s ease;
}

#layer_cart .cross:hover {
  background: rgba(15, 23, 42, 0.12);
}

/* --- Responsive móvil --- */
@media (max-width: 767px) {
  #layer_cart {
    width: calc(100vw - 32px);
    max-width: 380px;
  }

  #layer_cart .layer_inner_box {
    padding: 18px;
  }
}

/* ===============================================================
   CMS "Sobre nosotros" — foto centrada en móvil
   =============================================================== */
@media (max-width: 767px) {
  .foto-sobre {
    float: none !important;
    text-align: center;
    margin: 0 auto 16px !important;
  }

  .foto-sobre img {
    max-width: 100%;
    height: auto;
  }
}