/**
 * Voltio — Dark Premium
 * Estilos de la tienda (portada y WooCommerce).
 *
 * Carga después de style.css, que define la escala tipográfica y los tokens
 * base; aquí se redefinen los colores a la paleta oscura y se maquetan todos
 * los componentes: header, hero, trustbar, categorías, tarjetas de producto,
 * banner, why, testimonios, FAQ, newsletter, footer y páginas de WooCommerce.
 */

/* ==========================================================================
   1. Tokens de Tema: Claro (por defecto) y Oscuro Premium
   ========================================================================== */

/* 1.1. Tema Claro Premium (por defecto en :root) */
:root {
  --bg: #F4F6FA;
  --bg-2: #FFFFFF;
  --surface: #FFFFFF;
  --surface-2: #F1F5F9;
  --line: rgba(15, 23, 42, .08);
  --line-fuerte: rgba(15, 23, 42, .14);
  --text: #0F172A;
  --muted: #5B6B84;
  --accent: #EA580C;
  --accent-2: #F97316;
  --accent-oscuro: #C2410C;
  --green: #16A34A;
  --danger: #DC2626;

  /* Compatibilidad con style.css */
  --voltio-azul-950: #0F172A;
  --voltio-azul-900: #1E293B;
  --voltio-azul-800: #334155;
  --voltio-azul-700: #475569;
  --voltio-azul-100: #E2E8F0;
  --voltio-azul-50: #F8FAFC;
  --voltio-fondo: #F4F6FA;
  --voltio-fondo-alt: #FFFFFF;
  --voltio-texto: #0F172A;
  --voltio-texto-suave: #5B6B84;
  --voltio-texto-invertido: #FFFFFF;
  --voltio-borde: rgba(15, 23, 42, .08);
  --voltio-naranja: #EA580C;
  --voltio-naranja-oscuro: #C2410C;
  --voltio-naranja-claro: rgba(234, 88, 12, .1);
  --voltio-verde: #16A34A;
  --voltio-verde-claro: rgba(22, 163, 74, .1);
  --voltio-rojo: #DC2626;
  --voltio-sombra-sm: 0 1px 3px rgba(15, 23, 42, .06);
  --voltio-sombra: 0 10px 28px rgba(15, 23, 42, .08);
  --voltio-sombra-lg: 0 20px 40px rgba(15, 23, 42, .12);
  --voltio-anillo: 0 0 0 3px rgba(234, 88, 12, .25);

  /* Tokens de componentes adaptativos */
  --header-bg: rgba(255, 255, 255, .88);
  --footer-bg: #EAEFF6;
  --cat-overlay: linear-gradient(180deg, rgba(244, 246, 250, .2) 0%, rgba(244, 246, 250, .85) 65%, #FFFFFF 100%);
  --cat-icon-bg: #FFFFFF;
  --hero-grad: radial-gradient(900px 500px at 80% -10%, rgba(249, 115, 22, .12), transparent 60%), linear-gradient(160deg, #FFFFFF, #F4F6FA 65%);
  --banner-grad: radial-gradient(600px 300px at 85% 20%, rgba(249, 115, 22, .15), transparent 65%), linear-gradient(135deg, #FFFFFF, #F1F5F9);
  --newsletter-grad: radial-gradient(500px 260px at 90% 0%, rgba(249, 115, 22, .15), transparent 65%), linear-gradient(135deg, #FFFFFF, #F1F5F9);
  --flash-grad: radial-gradient(ellipse at 85% 20%, rgba(249, 115, 22, .18) 0%, transparent 60%), linear-gradient(135deg, #FFFFFF 0%, #F1F5F9 100%);
  --chip-bg: rgba(15, 23, 42, .05);
  --chip-border: rgba(15, 23, 42, .1);
  --chip-text: #334155;
  --media-bg: #F8FAFC;
  --card-border: rgba(15, 23, 42, .08);
  --card-hover-border: rgba(234, 88, 12, .45);
  --input-bg: #FFFFFF;
  --logo-src: url('../img/voltio-logo-dark.svg');

  --voltio-fuente: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --voltio-fuente-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  --voltio-radio-lg: 18px;
}

/* 1.2. Detección automática: Tema Oscuro Premium cuando el sistema lo prefiere */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg: #070b14;
    --bg-2: #0b1120;
    --surface: #101828;
    --surface-2: #16213a;
    --line: rgba(255, 255, 255, .08);
    --line-fuerte: rgba(255, 255, 255, .14);
    --text: #e8edf5;
    --muted: #94a3b8;
    --accent: #f97316;
    --accent-2: #fb923c;
    --accent-oscuro: #ea580c;
    --green: #22c55e;
    --danger: #ef4444;

    --voltio-azul-950: #070b14;
    --voltio-azul-900: #0b1120;
    --voltio-azul-800: #16213a;
    --voltio-azul-700: #1e2a44;
    --voltio-azul-100: rgba(255, 255, 255, .12);
    --voltio-azul-50: #0b1120;
    --voltio-fondo: #070b14;
    --voltio-fondo-alt: #0b1120;
    --voltio-texto: #e8edf5;
    --voltio-texto-suave: #94a3b8;
    --voltio-texto-invertido: #070b14;
    --voltio-borde: rgba(255, 255, 255, .08);
    --voltio-naranja: #f97316;
    --voltio-naranja-oscuro: #ea580c;
    --voltio-naranja-claro: rgba(249, 115, 22, .12);
    --voltio-verde: #22c55e;
    --voltio-verde-claro: rgba(34, 197, 94, .12);
    --voltio-rojo: #ef4444;
    --voltio-sombra-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --voltio-sombra: 0 18px 40px rgba(0, 0, 0, .45);
    --voltio-sombra-lg: 0 28px 60px rgba(0, 0, 0, .55);
    --voltio-anillo: 0 0 0 3px rgba(249, 115, 22, .35);

    --header-bg: rgba(7, 11, 20, .86);
    --footer-bg: #05080f;
    --cat-overlay: linear-gradient(180deg, rgba(7, 11, 20, .35) 0%, rgba(7, 11, 20, .88) 65%, #0b1120 100%);
    --cat-icon-bg: rgba(7, 11, 20, .7);
    --hero-grad: radial-gradient(900px 500px at 80% -10%, rgba(249, 115, 22, .18), transparent 60%), linear-gradient(160deg, #0b1120, #070b14 65%);
    --banner-grad: radial-gradient(600px 300px at 85% 20%, rgba(249, 115, 22, .22), transparent 65%), linear-gradient(135deg, #101828, #0b1120);
    --newsletter-grad: radial-gradient(500px 260px at 90% 0%, rgba(249, 115, 22, .22), transparent 65%), linear-gradient(135deg, #101828, #0b1120);
    --flash-grad: radial-gradient(ellipse at 85% 20%, rgba(249, 115, 22, .24) 0%, transparent 60%), linear-gradient(135deg, #101828 0%, #070b14 100%);
    --chip-bg: rgba(255, 255, 255, .05);
    --chip-border: rgba(255, 255, 255, .1);
    --chip-text: #e2e8f0;
    --media-bg: #0b1120;
    --card-border: var(--line);
    --card-hover-border: rgba(249, 115, 22, .6);
    --input-bg: #0b1120;
    --logo-src: url('../img/voltio-logo.svg');
  }
}

/* 1.3. Forzado explícito: [data-theme='dark'] */
[data-theme='dark'] {
  --bg: #070b14;
  --bg-2: #0b1120;
  --surface: #101828;
  --surface-2: #16213a;
  --line: rgba(255, 255, 255, .08);
  --line-fuerte: rgba(255, 255, 255, .14);
  --text: #e8edf5;
  --muted: #94a3b8;
  --accent: #f97316;
  --accent-2: #fb923c;
  --accent-oscuro: #ea580c;
  --green: #22c55e;
  --danger: #ef4444;

  --voltio-azul-950: #070b14;
  --voltio-azul-900: #0b1120;
  --voltio-azul-800: #16213a;
  --voltio-azul-700: #1e2a44;
  --voltio-azul-100: rgba(255, 255, 255, .12);
  --voltio-azul-50: #0b1120;
  --voltio-fondo: #070b14;
  --voltio-fondo-alt: #0b1120;
  --voltio-texto: #e8edf5;
  --voltio-texto-suave: #94a3b8;
  --voltio-texto-invertido: #070b14;
  --voltio-borde: rgba(255, 255, 255, .08);
  --voltio-naranja: #f97316;
  --voltio-naranja-oscuro: #ea580c;
  --voltio-naranja-claro: rgba(249, 115, 22, .12);
  --voltio-verde: #22c55e;
  --voltio-verde-claro: rgba(34, 197, 94, .12);
  --voltio-rojo: #ef4444;
  --voltio-sombra-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --voltio-sombra: 0 18px 40px rgba(0, 0, 0, .45);
  --voltio-sombra-lg: 0 28px 60px rgba(0, 0, 0, .55);
  --voltio-anillo: 0 0 0 3px rgba(249, 115, 22, .35);

  --header-bg: rgba(7, 11, 20, .86);
  --footer-bg: #05080f;
  --cat-overlay: linear-gradient(180deg, rgba(7, 11, 20, .35) 0%, rgba(7, 11, 20, .88) 65%, #0b1120 100%);
  --cat-icon-bg: rgba(7, 11, 20, .7);
  --hero-grad: radial-gradient(900px 500px at 80% -10%, rgba(249, 115, 22, .18), transparent 60%), linear-gradient(160deg, #0b1120, #070b14 65%);
  --banner-grad: radial-gradient(600px 300px at 85% 20%, rgba(249, 115, 22, .22), transparent 65%), linear-gradient(135deg, #101828, #0b1120);
  --newsletter-grad: radial-gradient(500px 260px at 90% 0%, rgba(249, 115, 22, .22), transparent 65%), linear-gradient(135deg, #101828, #0b1120);
  --flash-grad: radial-gradient(ellipse at 85% 20%, rgba(249, 115, 22, .24) 0%, transparent 60%), linear-gradient(135deg, #101828 0%, #070b14 100%);
  --chip-bg: rgba(255, 255, 255, .05);
  --chip-border: rgba(255, 255, 255, .1);
  --chip-text: #e2e8f0;
  --media-bg: #0b1120;
  --card-border: var(--line);
  --card-hover-border: rgba(249, 115, 22, .6);
  --input-bg: #0b1120;
  --logo-src: url('../img/voltio-logo.svg');
}

/* 1.4. Forzado explícito: [data-theme='light'] */
[data-theme='light'] {
  --bg: #F4F6FA;
  --bg-2: #FFFFFF;
  --surface: #FFFFFF;
  --surface-2: #F1F5F9;
  --line: rgba(15, 23, 42, .08);
  --line-fuerte: rgba(15, 23, 42, .14);
  --text: #0F172A;
  --muted: #5B6B84;
  --accent: #EA580C;
  --accent-2: #F97316;
  --accent-oscuro: #C2410C;
  --green: #16A34A;
  --danger: #DC2626;

  --voltio-azul-950: #0F172A;
  --voltio-azul-900: #1E293B;
  --voltio-azul-800: #334155;
  --voltio-azul-700: #475569;
  --voltio-azul-100: #E2E8F0;
  --voltio-azul-50: #F8FAFC;
  --voltio-fondo: #F4F6FA;
  --voltio-fondo-alt: #FFFFFF;
  --voltio-texto: #0F172A;
  --voltio-texto-suave: #5B6B84;
  --voltio-texto-invertido: #FFFFFF;
  --voltio-borde: rgba(15, 23, 42, .08);
  --voltio-naranja: #EA580C;
  --voltio-naranja-oscuro: #C2410C;
  --voltio-naranja-claro: rgba(234, 88, 12, .1);
  --voltio-verde: #16A34A;
  --voltio-verde-claro: rgba(22, 163, 74, .1);
  --voltio-rojo: #DC2626;
  --voltio-sombra-sm: 0 1px 3px rgba(15, 23, 42, .06);
  --voltio-sombra: 0 10px 28px rgba(15, 23, 42, .08);
  --voltio-sombra-lg: 0 20px 40px rgba(15, 23, 42, .12);
  --voltio-anillo: 0 0 0 3px rgba(234, 88, 12, .25);

  --header-bg: rgba(255, 255, 255, .88);
  --footer-bg: #EAEFF6;
  --cat-overlay: linear-gradient(180deg, rgba(244, 246, 250, .2) 0%, rgba(244, 246, 250, .85) 65%, #FFFFFF 100%);
  --cat-icon-bg: #FFFFFF;
  --hero-grad: radial-gradient(900px 500px at 80% -10%, rgba(249, 115, 22, .12), transparent 60%), linear-gradient(160deg, #FFFFFF, #F4F6FA 65%);
  --banner-grad: radial-gradient(600px 300px at 85% 20%, rgba(249, 115, 22, .15), transparent 65%), linear-gradient(135deg, #FFFFFF, #F1F5F9);
  --newsletter-grad: radial-gradient(500px 260px at 90% 0%, rgba(249, 115, 22, .15), transparent 65%), linear-gradient(135deg, #FFFFFF, #F1F5F9);
  --flash-grad: radial-gradient(ellipse at 85% 20%, rgba(249, 115, 22, .18) 0%, transparent 60%), linear-gradient(135deg, #FFFFFF 0%, #F1F5F9 100%);
  --chip-bg: rgba(15, 23, 42, .05);
  --chip-border: rgba(15, 23, 42, .1);
  --chip-text: #334155;
  --media-bg: #F8FAFC;
  --card-border: rgba(15, 23, 42, .08);
  --card-hover-border: rgba(234, 88, 12, .45);
  --input-bg: #FFFFFF;
  --logo-src: url('../img/voltio-logo-dark.svg');
}

/* ==========================================================================
   2. Base
   ========================================================================== */
html { background: var(--bg); }

body,
body.ast-separate-container,
body.ast-plain-container {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: var(--voltio-fuente);
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title,
.woocommerce-loop-product__title,
.product_title {
  font-family: var(--voltio-fuente-display) !important;
  color: var(--text);
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(36px, 5vw, 58px); line-height: 1.05; }
h2 { font-size: clamp(26px, 3.4vw, 36px); line-height: 1.15; }
h3 { font-size: clamp(19px, 2vw, 24px); }

p, li, td, th, .woocommerce-result-count, .woocommerce-breadcrumb {
  color: var(--muted);
}

a { color: var(--text); text-decoration-color: rgba(249, 115, 22, .5); }
a:hover, a:focus-visible { color: var(--accent); }

strong { color: var(--text); }

::selection { background: var(--accent); color: #0b1120; }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 6px;
}

img { color-scheme: dark; }

/* Superficies de Astra que traen fondo blanco por defecto */
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.ast-separate-container .comments-area,
.ast-separate-container .ast-comment-list li,
.ast-separate-container .site-content,
.site-content,
.content-area,
#content,
.ast-container {
  background: transparent !important;
}

.ast-separate-container { background: var(--bg) !important; }

/* ==========================================================================
   3. Contenedor y secciones
   ========================================================================== */
.voltio-contenedor {
  width: 100%;
  max-width: 1240px;
  margin-inline: auto;
  padding-inline: 24px;
}

.voltio-seccion { padding-block: clamp(48px, 7vw, 92px); }
.voltio-seccion--alt { background: var(--bg-2); }
.voltio-seccion__cabecera { max-width: 720px; margin-bottom: 40px; }
.voltio-seccion__cabecera--centrada { margin-inline: auto; text-align: center; }

.voltio-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--voltio-fuente-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
  background: rgba(249, 115, 22, .1);
  border: 1px solid rgba(249, 115, 22, .28);
  border-radius: 999px;
  padding: 6px 14px;
  margin-bottom: 16px;
}

.voltio-titulo-seccion { margin: 0 0 12px; }
.voltio-subtitulo-seccion { margin: 0; color: var(--muted); font-size: 17px; line-height: 1.6; }

/* ==========================================================================
   4. Header (Astra) y navegación
   ========================================================================== */
.site-header,
.ast-primary-header-bar,
.ast-masthead-custom-menu-items {
  background: var(--header-bg) !important;
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid var(--line) !important;
}

.site-header { position: sticky; top: 0; z-index: 999; }

.voltio-brand-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  padding: 4px 0;
}

.site-header .voltio-header-logo,
.ast-mobile-header-wrap .voltio-header-logo,
.voltio-header-logo {
  height: 38px !important;
  width: auto !important;
  max-width: 180px !important;
  flex-shrink: 0;
  object-fit: contain;
}
/* Tema claro por defecto: logo de texto oscuro */
.voltio-header-logo--dark { display: none !important; }
.voltio-header-logo--light { display: block !important; }
/* Tema oscuro automático (sigue al sistema) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) .voltio-header-logo--dark { display: block !important; }
  :root:not([data-theme='light']) .voltio-header-logo--light { display: none !important; }
}
/* Tema oscuro forzado */
[data-theme='dark'] .voltio-header-logo--dark { display: block !important; }
[data-theme='dark'] .voltio-header-logo--light { display: none !important; }

.site-branding .site-title,
.ast-mobile-header-wrap .site-title {
  display: none !important;
}

.site-title a,
.site-title a:visited {
  color: var(--text) !important;
  font-family: var(--voltio-fuente-display) !important;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.site-title a::before {
  display: none !important;
}

.main-header-menu > .menu-item > .menu-link,
.ast-builder-menu .menu-link {
  color: var(--text) !important;
  font-weight: 500;
  font-size: 15px;
}

.main-header-menu > .menu-item > .menu-link:hover,
.main-header-menu > .menu-item.current-menu-item > .menu-link {
  color: var(--accent) !important;
}

.main-header-menu .sub-menu,
.ast-header-break-point .main-header-menu {
  background: var(--surface) !important;
  border: 1px solid var(--line);
  border-radius: 12px;
}

.main-header-menu .sub-menu .menu-link { color: var(--text) !important; }
.main-header-menu .sub-menu .menu-link:hover { color: var(--accent) !important; }

/* Cabecera móvil y menú desplegable (Off-Canvas Drawer) con contraste alto */
.ast-header-break-point .main-header-bar,
.ast-mobile-header-wrap,
.ast-mobile-header-wrap .ast-primary-header-bar {
  background: var(--header-bg) !important;
}

[data-section="section-header-mobile-trigger"] .ast-button-wrap .ast-mobile-menu-trigger-minimal,
[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg,
.ast-mobile-menu-buttons .menu-toggle,
.ast-button-wrap .menu-toggle {
  color: var(--text) !important;
  fill: var(--text) !important;
  border-color: var(--line) !important;
}

#ast-mobile-popup,
.ast-mobile-popup-drawer,
.ast-mobile-popup-drawer.active,
.ast-mobile-popup-inner,
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner,
.ast-mobile-popup-content,
.ast-mobile-popup-header,
.ast-mobile-header-wrap .ast-mobile-header-content,
.ast-desktop-header-content {
  background-color: var(--surface) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
}

.ast-mobile-popup-drawer .ast-mobile-popup-header {
  border-bottom: 1px solid var(--line) !important;
  padding: 16px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.ast-mobile-popup-drawer.active .menu-toggle-close,
.ast-mobile-popup-drawer .menu-toggle-close {
  color: var(--text) !important;
  background: var(--surface-2) !important;
  border: 1px solid var(--line-fuerte) !important;
  border-radius: 8px !important;
  width: 36px !important;
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.ast-mobile-popup-drawer.active .menu-toggle-close:hover,
.ast-mobile-popup-drawer .menu-toggle-close:hover {
  color: var(--accent) !important;
  border-color: var(--accent) !important;
  transform: rotate(90deg);
}

.ast-mobile-popup-drawer .ast-mobile-popup-content {
  padding: 12px 16px 32px 16px !important;
}

.ast-builder-menu-mobile .main-navigation,
.ast-builder-menu-mobile .main-navigation .main-header-menu,
.ast-mobile-popup-drawer .main-navigation,
.ast-mobile-popup-drawer .main-navigation ul,
.ast-mobile-popup-drawer .main-navigation ul.main-header-menu {
  background-color: transparent !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

.ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item,
.ast-mobile-popup-drawer .main-navigation .menu-item,
.ast-mobile-popup-drawer .main-navigation ul li {
  background-color: transparent !important;
  background: transparent !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative !important;
  margin: 0 !important;
}

.ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item > .menu-link,
.ast-builder-menu-mobile .main-navigation .menu-link,
.ast-mobile-popup-drawer .main-navigation .menu-link,
.ast-mobile-popup-drawer .main-navigation a,
.ast-mobile-popup-drawer .ast-mobile-popup-content a {
  background-color: transparent !important;
  background: transparent !important;
  color: var(--text) !important;
  font-family: var(--voltio-fuente) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  padding: 14px 12px !important;
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item:hover > .menu-link,
.ast-builder-menu-mobile .main-navigation .menu-link:hover,
.ast-mobile-popup-drawer .main-navigation .menu-link:hover,
.ast-mobile-popup-drawer .main-navigation a:hover {
  color: var(--accent) !important;
  background-color: rgba(249, 115, 22, 0.08) !important;
  background: rgba(249, 115, 22, 0.08) !important;
  padding-left: 18px !important;
}

.ast-builder-menu-mobile .main-navigation .menu-item.current-menu-item > .menu-link,
.ast-builder-menu-mobile .main-navigation .menu-item.current_page_item > .menu-link,
.ast-builder-menu-mobile .main-navigation .menu-item.current-menu-ancestor > .menu-link,
.ast-mobile-popup-drawer .main-navigation .current-menu-item > a,
.ast-mobile-popup-drawer .main-navigation .current_page_item > a {
  color: var(--accent) !important;
  background-color: rgba(249, 115, 22, 0.12) !important;
  background: rgba(249, 115, 22, 0.12) !important;
  font-weight: 700 !important;
  border-left: 3px solid var(--accent) !important;
}

.ast-builder-menu-mobile .main-navigation .ast-menu-toggle,
.ast-mobile-popup-drawer .ast-menu-toggle,
.ast-mobile-popup-drawer .dropdown-menu-toggle {
  color: var(--muted) !important;
  background: transparent !important;
  border: none !important;
  font-size: 16px !important;
  padding: 8px 12px !important;
}

.ast-builder-menu-mobile .main-navigation .ast-menu-toggle:hover,
.ast-mobile-popup-drawer .ast-menu-toggle:hover,
.ast-mobile-popup-drawer .dropdown-menu-toggle:hover {
  color: var(--accent) !important;
}

.ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu,
.ast-mobile-popup-drawer .main-navigation .sub-menu {
  background-color: var(--surface-2) !important;
  background: var(--surface-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  margin: 6px 0 10px 12px !important;
  padding: 6px 0 !important;
  list-style: none !important;
}

.ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu .menu-item > .menu-link,
.ast-mobile-popup-drawer .main-navigation .sub-menu .menu-link {
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--muted) !important;
  padding: 10px 14px !important;
  min-height: 40px !important;
  border-bottom: none !important;
}

.ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu .menu-item > .menu-link:hover,
.ast-mobile-popup-drawer .main-navigation .sub-menu .menu-link:hover {
  color: var(--accent) !important;
  background-color: rgba(249, 115, 22, 0.08) !important;
}

/* Conmutador de tema Claro / Oscuro / Auto */
.voltio-menu-item-theme {
  display: inline-flex !important;
  align-items: center !important;
  margin-left: 8px;
}

.voltio-theme-switch-wrap {
  display: inline-flex;
  align-items: center;
}

.voltio-theme-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--surface-2);
  border: 1px solid var(--line-fuerte);
  color: var(--text);
  font-family: var(--voltio-fuente);
  font-size: 12.5px;
  font-weight: 600;
  padding: 6px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  user-select: none;
  box-shadow: var(--voltio-sombra-sm);
  line-height: 1;
}

.voltio-theme-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(234, 88, 12, 0.15);
}

.voltio-theme-icon {
  display: none;
  line-height: 0;
  flex-shrink: 0;
}

.voltio-theme-btn[data-state="auto"] .voltio-theme-icon--auto {
  display: inline-flex;
  color: var(--accent);
}

.voltio-theme-btn[data-state="light"] .voltio-theme-icon--light {
  display: inline-flex;
  color: #f59e0b;
}

.voltio-theme-btn[data-state="dark"] .voltio-theme-icon--dark {
  display: inline-flex;
  color: #38bdf8;
}

.voltio-theme-text {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
}

/* Conmutador en cabecera móvil */
#ast-mobile-header .voltio-theme-switch-wrap {
  margin-right: 8px;
  display: inline-flex;
  align-items: center;
}

#ast-mobile-header .voltio-theme-btn {
  padding: 7px 10px;
}

@media (max-width: 640px) {
  #ast-mobile-header .voltio-theme-text {
    display: none;
  }
  #ast-mobile-header .voltio-theme-btn {
    padding: 7px;
    border-radius: 50%;
  }
}

/* ==========================================================================
   5. Botones
   ========================================================================== */
.voltio-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
button.single_add_to_cart_button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.wc-block-components-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 12px 24px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: var(--surface);
  color: var(--text) !important;
  font-family: var(--voltio-fuente);
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.voltio-btn:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
button.single_add_to_cart_button:hover {
  transform: translateY(-1px);
  background: var(--surface-2);
  color: var(--text) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
}

.voltio-btn--primario,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
button.single_add_to_cart_button,
.woocommerce a.button.checkout-button {
  background: linear-gradient(135deg, var(--accent), var(--accent-oscuro)) !important;
  color: #fff !important;
  border-color: transparent;
  box-shadow: 0 10px 28px rgba(249, 115, 22, .28);
}

.voltio-btn--primario:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
button.single_add_to_cart_button:hover {
  background: linear-gradient(135deg, var(--accent-2), var(--accent)) !important;
  box-shadow: 0 14px 34px rgba(249, 115, 22, .38);
}

.voltio-btn--claro {
  background: transparent;
  border-color: var(--line-fuerte);
  color: var(--text) !important;
}

.voltio-btn--claro:hover { background: var(--surface); }

.voltio-btn--fantasma {
  background: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .18);
  color: var(--text) !important;
}

.voltio-btn--fantasma:hover { background: rgba(255, 255, 255, .09); }

.voltio-btn--bloque { width: 100%; }

/* ==========================================================================
   6. Hero
   ========================================================================== */
.voltio-hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(48px, 7vw, 96px);
  background: var(--hero-grad);
  border-bottom: 1px solid var(--line);
}

.voltio-hero::after {
  content: "";
  position: absolute;
  inset: auto -20% -60% 40%;
  height: 420px;
  background: radial-gradient(closest-side, rgba(249, 115, 22, .16), transparent);
  pointer-events: none;
}

.voltio-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}

@media (min-width: 980px) {
  .voltio-hero__grid { grid-template-columns: 1.05fr .95fr; }
}

.voltio-hero__grid > * { min-width: 0; }

.voltio-hero h1 {
  color: var(--text);
  margin: 0 0 18px;
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.03em;
}

.voltio-hero h1 em {
  font-style: normal;
  background: linear-gradient(90deg, #f97316, #fb923c);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.voltio-hero__texto {
  color: var(--muted);
  font-size: clamp(16px, 1.2vw, 18px);
  line-height: 1.7;
  max-width: 52ch;
  margin: 0 0 28px;
}

.voltio-hero__acciones { display: flex; flex-wrap: wrap; gap: 12px; }

.voltio-hero__mini-datos {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
  margin-top: 36px;
  padding-top: 26px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 14px;
}

.voltio-hero__mini-datos > span {
  padding-right: 28px;
  border-right: 1px solid var(--line);
}

.voltio-hero__mini-datos > span:last-child { border-right: 0; padding-right: 0; }

.voltio-hero__mini-datos strong {
  display: block;
  font-family: var(--voltio-fuente-display);
  font-size: 22px;
  color: var(--text);
  margin-bottom: 2px;
}

.voltio-hero__tarjeta {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, var(--surface), var(--bg-2));
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 28px;
  box-shadow: 0 40px 80px rgba(0, 0, 0, .55);
}

.voltio-hero__etiqueta {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 2;
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 999px;
  letter-spacing: .03em;
}

.voltio-hero__producto { display: grid; gap: 8px; text-decoration: none; color: inherit; }

.voltio-hero__producto img {
  width: 100%;
  max-width: min(360px, 100%);
  margin: 0 auto 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .03);
}

.voltio-hero__nombre {
  display: block;
  color: var(--text);
  font-weight: 600;
  text-align: center;
  font-size: 16px;
}

.voltio-hero__precio {
  display: block;
  text-align: center;
  color: var(--accent);
  font-family: var(--voltio-fuente-display);
  font-weight: 700;
  font-size: 22px;
}

.voltio-hero__precio del { color: var(--muted); font-weight: 400; font-size: 15px; }
.voltio-hero__precio ins { text-decoration: none; }

/* ==========================================================================
   7. Trustbar
   ========================================================================== */
.voltio-garantias {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  padding-block: 28px;
}

.voltio-garantia {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  transition: border-color .18s ease, transform .18s ease;
}

.voltio-garantia:hover { border-color: rgba(249, 115, 22, .35); transform: translateY(-2px); }

.voltio-garantia__icono {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: rgba(249, 115, 22, .12);
  color: var(--accent);
}

.voltio-garantia__icono svg { width: 22px; height: 22px; }
.voltio-garantia strong { display: block; font-size: 14px; color: var(--text); margin-bottom: 2px; }
.voltio-garantia span span { color: var(--muted); font-size: 13px; }

/* ==========================================================================
   8. Categorías
   ========================================================================== */
.voltio-categorias {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.voltio-categoria {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 180px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none;
  color: var(--text);
  background:
    radial-gradient(300px 160px at 80% 0%, rgba(249, 115, 22, .16), transparent 70%),
    var(--surface);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.voltio-categoria:hover {
  transform: translateY(-4px);
  border-color: rgba(249, 115, 22, .5);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .5);
  color: var(--text);
}

.voltio-categoria__imagen {
  position: absolute;
  inset: 0;
  opacity: .16;
  filter: saturate(1.1);
  background-size: cover;
  background-position: center;
  transition: opacity .25s ease, transform .4s ease;
}

.voltio-categoria::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--cat-overlay);
  pointer-events: none;
}

.voltio-categoria:hover .voltio-categoria__imagen { opacity: .26; transform: scale(1.05); }

.voltio-categoria__icono {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--cat-icon-bg);
  border: 1px solid var(--line-fuerte);
  color: var(--accent);
  margin-bottom: auto;
}

.voltio-categoria__icono svg { width: 22px; height: 22px; }
.voltio-categoria__nombre { position: relative; z-index: 1; font-weight: 600; font-size: 15px; color: var(--text); margin-top: 14px; }
.voltio-categoria__cuenta { position: relative; z-index: 1; font-size: 12px; color: var(--muted); }

/* ==========================================================================
   9. Tarjetas de producto (propias)
   ========================================================================== */
.voltio-grid-productos {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

@media (max-width: 1280px) {
  .voltio-grid-productos { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 991px) {
  .voltio-grid-productos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
}

@media (max-width: 640px) {
  .voltio-grid-productos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}

.voltio-tarjeta {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.voltio-tarjeta:hover {
  transform: translateY(-3px);
  border-color: rgba(249, 115, 22, .6);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .55);
}

.voltio-tarjeta__badges {
  position: absolute;
  top: 8px;
  left: 8px;
  right: 8px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  pointer-events: none;
  z-index: 4;
}

.voltio-badge-dto {
  background: var(--accent);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  padding: 3px 7px;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(249, 115, 22, .45);
}

.voltio-badge-tag {
  background: var(--chip-bg);
  border: 1px solid var(--chip-border);
  color: var(--chip-text);
  font-size: 10px;
  font-weight: 700;
  padding: 3px 6px;
  border-radius: 5px;
  letter-spacing: .04em;
}

.voltio-tarjeta__media {
  position: relative;
  display: block;
  background: var(--media-bg);
  padding: 0;
  border-bottom: 1px solid var(--line);
}

.voltio-tarjeta__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  padding: 8px;
  box-sizing: border-box;
  margin: 0;
  transition: transform .3s ease;
}

.voltio-tarjeta:hover .voltio-tarjeta__media img { transform: scale(1.04); }

.voltio-tarjeta__cuerpo {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 12px 14px 14px;
  flex: 1;
}

.voltio-tarjeta__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.voltio-tarjeta__marca {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #94a3b8;
}

.voltio-tarjeta__rating {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  line-height: 1;
}

.voltio-tarjeta__estrella { color: #fbbf24; font-size: 11px; }
.voltio-tarjeta__rating-score { font-weight: 700; color: #e2e8f0; }
.voltio-tarjeta__rating-opiniones { color: #64748b; font-size: 10px; }

.voltio-tarjeta__titulo {
  font-family: var(--voltio-fuente-display);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.35;
  margin: 2px 0 0;
  color: var(--text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 36px;
}

.voltio-tarjeta__titulo a { color: inherit; text-decoration: none; }
.voltio-tarjeta__titulo a:hover { color: var(--accent); }

/* Bloque comercial de precios PcComponentes */
.voltio-tarjeta__precio-bloque {
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.voltio-tarjeta__fila-precio {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.voltio-tarjeta__precio-actual {
  font-family: var(--voltio-fuente-display);
  font-weight: 800;
  font-size: 21px;
  color: var(--accent);
  line-height: 1.1;
}

.voltio-tarjeta__precio-anterior {
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 400;
  text-decoration: line-through;
}

.voltio-tarjeta__info-fiscal {
  display: flex;
  align-items: center;
  gap: 6px;
}

.voltio-tarjeta__ahorro-badge {
  font-size: 10px;
  font-weight: 700;
  color: #22c55e;
  background: rgba(34, 197, 94, .12);
  padding: 1px 5px;
  border-radius: 4px;
}

.voltio-tarjeta__iva-nota {
  font-size: 10.5px;
  color: #64748b;
}

/* Indicador de entrega / stock */
.voltio-tarjeta__entrega {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  margin-top: 4px;
}

.voltio-tarjeta__entrega-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}

.voltio-tarjeta__entrega--ok { color: #22c55e; }
.voltio-tarjeta__entrega--ok .voltio-tarjeta__entrega-dot { background: #22c55e; box-shadow: 0 0 6px rgba(34, 197, 94, .6); }

.voltio-tarjeta__entrega--bajo { color: var(--accent); }
.voltio-tarjeta__entrega--bajo .voltio-tarjeta__entrega-dot { background: var(--accent); box-shadow: 0 0 6px rgba(249, 115, 22, .6); }

.voltio-tarjeta__entrega--agotado { color: var(--danger); }
.voltio-tarjeta__entrega--agotado .voltio-tarjeta__entrega-dot { background: var(--danger); }

.voltio-tarjeta__acciones {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
  margin-top: 10px;
}

.voltio-tarjeta__cta {
  min-height: 38px;
  padding: 6px 12px;
  font-size: 13px;
  gap: 6px;
}

.voltio-tarjeta__ver {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid var(--line-fuerte);
  color: var(--muted);
  text-decoration: none;
  transition: color .18s ease, border-color .18s ease, background .18s ease;
}

.voltio-tarjeta__ver:hover { color: var(--accent); border-color: var(--accent); background: rgba(249, 115, 22, .08); }
.voltio-tarjeta__ver svg { width: 16px; height: 16px; }

.voltio-tarjeta__sinimagen {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  color: var(--muted);
}

.voltio-ver-todo { margin-top: 36px; text-align: center; }

/* Badges antiguos que puedan quedar en otras plantillas */
.voltio-badges {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  pointer-events: none;
}

.voltio-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 3px 7px;
  border-radius: 6px;
  color: #fff;
  background: var(--surface-2);
}

.voltio-badge--oferta { background: var(--accent); }
.voltio-badge--nuevo { background: var(--green); }
.voltio-badge--best { background: #334155; }
.voltio-badge--outlet { background: var(--danger); }

/* El globo de oferta nativo (WooCommerce / Astra) duplica la información */
.woocommerce span.onsale,
.woocommerce ul.products li.product span.onsale,
.ast-onsale-card,
.ast-on-card-button.ast-onsale-card {
  display: none !important;
}

/* Etiquetas de categoría bajo el producto */
.woocommerce ul.products li.product .ast-woo-product-category,
.woocommerce ul.products li.product .posted_in,
.woocommerce ul.products li.product .voltio-tarjeta-producto__resumen {
  color: var(--muted) !important;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* ==========================================================================
   10. Banner intermedio
   ========================================================================== */
.voltio-banner {
  display: grid;
  gap: 28px;
  align-items: center;
  padding: clamp(28px, 4vw, 48px);
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--banner-grad);
  overflow: hidden;
}

@media (min-width: 900px) {
  .voltio-banner { grid-template-columns: 1.1fr .9fr; }
}

.voltio-banner h2 { margin: 0 0 10px; }
.voltio-banner p { margin: 0 0 20px; max-width: 46ch; }
.voltio-banner img {
  width: 100%;
  max-width: 320px;
  margin-inline: auto;
  border-radius: 18px;
  filter: drop-shadow(0 30px 60px rgba(0, 0, 0, .6));
}

/* ==========================================================================
   11. Por qué comprar / testimonios / FAQ
   ========================================================================== */
.voltio-motivos {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.voltio-motivo {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 26px;
  transition: border-color .18s ease, transform .18s ease;
}

.voltio-motivo:hover { border-color: rgba(249, 115, 22, .35); transform: translateY(-3px); }

.voltio-motivo__icono {
  display: inline-grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 12px;
  background: rgba(249, 115, 22, .12);
  color: var(--accent);
  margin-bottom: 16px;
}

.voltio-motivo__icono svg { width: 24px; height: 24px; }
.voltio-motivo h3 { font-size: 18px; margin: 0 0 8px; }
.voltio-motivo p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }

.voltio-testimonios {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.voltio-testimonio {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 26px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  margin: 0;
}

.voltio-testimonio__estrellas { display: flex; gap: 3px; color: var(--accent); }
.voltio-testimonio__estrellas svg { width: 16px; height: 16px; }
.voltio-testimonio blockquote { margin: 0; color: var(--text); font-size: 15px; line-height: 1.65; }
.voltio-testimonio__autor { font-size: 13px; color: var(--muted); margin-top: auto; }
.voltio-testimonio__autor strong { color: var(--text); }

.voltio-faq { display: grid; gap: 12px; }

.voltio-faq details {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  padding: 18px 20px;
}

.voltio-faq summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-weight: 600;
  color: var(--text);
  font-family: var(--voltio-fuente-display);
}

.voltio-faq summary::-webkit-details-marker { display: none; }
.voltio-faq summary::after { content: "+"; color: var(--accent); font-size: 20px; line-height: 1; }
.voltio-faq details[open] summary::after { content: "−"; }
.voltio-faq details[open] summary { margin-bottom: 10px; }
.voltio-faq p { margin: 0; color: var(--muted); }

/* ==========================================================================
   12. Newsletter
   ========================================================================== */
.voltio-newsletter {
  display: grid;
  gap: 24px;
  padding: clamp(28px, 4vw, 44px);
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--newsletter-grad);
}

@media (min-width: 820px) {
  .voltio-newsletter { grid-template-columns: 1.05fr .95fr; align-items: center; }
}

.voltio-newsletter h2 { margin: 0 0 8px; color: var(--text); }
.voltio-newsletter p { margin: 0; color: var(--muted); }

.voltio-newsletter form { display: flex; flex-wrap: wrap; gap: 10px; }

.voltio-newsletter input[type="email"] {
  flex: 1 1 220px;
  min-height: 48px;
  padding-inline: 16px;
  border-radius: 12px;
  border: 1px solid var(--line-fuerte);
  background: var(--surface-2);
  color: var(--text);
  font: inherit;
}

.voltio-newsletter input[type="email"]::placeholder { color: #64748b; }

/* ==========================================================================
   13. Formularios y avisos
   ========================================================================== */
.voltio-formulario input[type="text"],
.voltio-formulario input[type="email"],
.voltio-formulario input[type="tel"],
.voltio-formulario select,
.voltio-formulario textarea,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single {
  background: var(--surface-2) !important;
  border: 1px solid var(--line-fuerte) !important;
  color: var(--text) !important;
  border-radius: 10px;
}

.voltio-formulario input::placeholder,
.woocommerce form .form-row input::placeholder { color: #64748b; }

.woocommerce form .form-row label,
.woocommerce form .form-row .required { color: var(--muted); }
.woocommerce form .form-row .required { color: var(--accent); }

.voltio-formulario__consentimiento { color: var(--muted); font-size: 12px; }

.voltio-aviso { border-radius: 10px; padding: 12px 16px; font-size: 14px; border: 1px solid transparent; }
.voltio-aviso--ok { background: rgba(34, 197, 94, .12); border-color: rgba(34, 197, 94, .3); color: #86efac; }
.voltio-aviso--error { background: rgba(239, 68, 68, .12); border-color: rgba(239, 68, 68, .35); color: #fca5a5; }

.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-radius: 12px;
  border-top-width: 3px;
  border-top-color: var(--accent);
  box-shadow: none;
}

.woocommerce-info::before, .woocommerce-message::before { color: var(--accent); }
.woocommerce-error { border-top-color: var(--danger); }
.woocommerce-error li { color: #fca5a5; }

/* ==========================================================================
   14. WooCommerce: listados
   ========================================================================== */
.woocommerce .woocommerce-breadcrumb {
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 18px;
}

.woocommerce .woocommerce-breadcrumb a { color: var(--muted); }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--accent); }

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering select {
  color: var(--muted);
}

.woocommerce .woocommerce-ordering select {
  background: var(--surface);
  border: 1px solid var(--line-fuerte);
  border-radius: 10px;
  padding: 8px 12px;
}

.woocommerce ul.products {
  display: grid !important;
  gap: 14px;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  margin: 0 !important;
  padding: 0;
}

@media (max-width: 1280px) {
  .woocommerce ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}

@media (max-width: 991px) {
  .woocommerce ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 12px; }
}

@media (max-width: 640px) {
  .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; }
}

.woocommerce ul.products::before,
.woocommerce ul.products::after { display: none; }

.woocommerce ul.products li.product {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-3px);
  border-color: rgba(249, 115, 22, .6);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .55);
}

.woocommerce ul.products li.product a img {
  aspect-ratio: 4 / 3;
  object-fit: contain;
  padding: 8px;
  box-sizing: border-box;
  margin: 0 !important;
  background: var(--media-bg);
  border-bottom: 1px solid var(--line);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--voltio-fuente-display) !important;
  font-size: 13.5px !important;
  font-weight: 600;
  padding: 0 !important;
  margin: 2px 0 0 !important;
  color: var(--text);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 36px;
}

.woocommerce ul.products li.product .button {
  margin: 0 !important;
  width: 100% !important;
  font-size: 13px;
  min-height: 38px;
  padding: 6px 12px;
}

.woocommerce .star-rating span::before,
.woocommerce .star-rating::before { color: var(--accent); }

.woocommerce nav.woocommerce-pagination ul { border: 0; display: flex; gap: 6px; justify-content: center; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  color: var(--muted);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  min-width: 40px;
  min-height: 40px;
  display: grid;
  place-items: center;
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
  color: #fff;
  background: var(--accent);
  border-color: var(--accent);
}

/* ==========================================================================
   15. WooCommerce: ficha de producto
   ========================================================================== */
.woocommerce div.product div.images img {
  border-radius: 18px;
  background: var(--media-bg);
  border: 1px solid var(--line);
}

.woocommerce div.product .product_title { color: var(--text); margin-bottom: 8px; }

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--text);
  font-family: var(--voltio-fuente-display);
  font-weight: 700;
  font-size: 30px;
}

.woocommerce div.product p.price del { color: var(--muted); font-size: 18px; font-weight: 400; }
.woocommerce div.product p.price ins { text-decoration: none; color: var(--accent); }

.woocommerce div.product .woocommerce-product-details__short-description { color: var(--muted); }

.woocommerce div.product form.cart .quantity input.qty {
  background: var(--surface-2);
  border: 1px solid var(--line-fuerte);
  color: var(--text);
  border-radius: 10px;
  min-height: 48px;
}

.voltio-stock-ok { color: var(--green); font-weight: 600; }
.voltio-stock-bajo { color: var(--accent); font-weight: 600; }
.voltio-stock-agotado { color: var(--danger); font-weight: 600; }

.voltio-envio-estimado {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  background: rgba(34, 197, 94, .08);
  border: 1px solid rgba(34, 197, 94, .25);
  border-radius: 12px;
  font-size: 14px;
  color: var(--muted);
  margin-block: 16px;
}

.voltio-envio-estimado strong { color: var(--text); }

.voltio-pagos-aceptados {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  color: var(--muted);
}

.voltio-pagos-aceptados__marca {
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  border: 1px solid var(--line-fuerte);
  border-radius: 6px;
  font-weight: 600;
  font-size: 11px;
  color: var(--muted);
  background: var(--surface);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before { border-color: var(--line); }

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 12px 12px 0 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: var(--surface);
  border-color: var(--line);
  border-bottom-color: var(--surface);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--muted); font-weight: 600; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--text); }

/* El panel de pestañas hereda fondos claros de Astra: forzar dark. */
body .woocommerce div.product .woocommerce-tabs ul.tabs li,
body .woocommerce div.product .woocommerce-tabs ul.tabs li.active,
body .woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
body .woocommerce div.product .woocommerce-tabs ul.tabs li a:focus {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}

body .woocommerce div.product .woocommerce-tabs ul.tabs li:not(.active),
body .woocommerce div.product .woocommerce-tabs ul.tabs li:not(.active) a {
  background: transparent !important;
  color: var(--muted) !important;
}

/* Astra dibuja un fondo claro con pseudo-elementos en la pestaña activa. */
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li a::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li a::after {
  display: none !important;
  content: none !important;
  background: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--text); }

.woocommerce div.product .woocommerce-tabs .panel,
.woocommerce div.product .woocommerce-tabs .panel p,
.woocommerce div.product .woocommerce-tabs .panel li {
  color: var(--muted) !important;
}

.woocommerce div.product .woocommerce-tabs .panel h2,
.woocommerce div.product .woocommerce-tabs .panel h3,
.woocommerce div.product .woocommerce-tabs .panel h4,
.woocommerce div.product .woocommerce-tabs .panel strong {
  color: var(--text) !important;
}

.woocommerce div.product .woocommerce-tabs .panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 16px 16px;
  padding: 24px;
  color: var(--muted);
}

.woocommerce div.product .woocommerce-tabs .panel h2 { color: var(--text); }

.woocommerce table.shop_attributes th { color: var(--muted); background: transparent; border-bottom: 1px solid var(--line); }
.woocommerce table.shop_attributes td { color: var(--text); border-bottom: 1px solid var(--line); }

.woocommerce #reviews #comments ol.commentlist li .comment-text {
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 12px;
}

.woocommerce #reviews #comments ol.commentlist li .meta { color: var(--muted); }
.woocommerce #review_form #respond p.stars a { color: var(--accent); }

.woocommerce div.product .related.products > h2,
.woocommerce div.product .upsells.products > h2 {
  font-family: var(--voltio-fuente-display);
  color: var(--text);
}

/* ==========================================================================
   16. WooCommerce: carrito y checkout
   ========================================================================== */
.woocommerce table.shop_table {
  border: 1px solid var(--line);
  border-radius: 14px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  background: var(--surface);
}

.woocommerce table.shop_table th {
  background: var(--surface-2);
  color: var(--text);
  font-weight: 600;
}

.woocommerce table.shop_table td { border-top: 1px solid var(--line); color: var(--muted); }
.woocommerce table.shop_table td.product-name a { color: var(--text); }
.woocommerce table.shop_table td.product-name a:hover { color: var(--accent); }

.woocommerce a.remove {
  color: var(--danger) !important;
  background: rgba(239, 68, 68, .1);
  border-radius: 50%;
}

.woocommerce a.remove:hover { background: var(--danger); color: #fff !important; }

.woocommerce .cart_totals table.shop_table { background: transparent; }
.woocommerce .cart_totals h2 { font-family: var(--voltio-fuente-display); color: var(--text); }

.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review,
.woocommerce-checkout #payment {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 22px;
}

.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--line); }
.woocommerce-checkout #payment div.payment_box { background: var(--surface-2); color: var(--muted); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--surface-2); }
.woocommerce-checkout #payment { background: var(--surface); }

.woocommerce-checkout h3, .woocommerce-checkout #order_review_heading {
  font-family: var(--voltio-fuente-display);
  color: var(--text);
}

.voltio-checkout-confianza {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding: 16px;
  border: 1px dashed var(--line-fuerte);
  border-radius: 12px;
  background: var(--bg-2);
  font-size: 13px;
  color: var(--muted);
}

.voltio-checkout-confianza strong { color: var(--text); }

.woocommerce .woocommerce-customer-details address {
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--muted);
  border-radius: 12px;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a { color: var(--muted); }
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover { color: var(--accent); }

.woocommerce .woocommerce-MyAccount-content { color: var(--muted); }

/* ==========================================================================
   17. Footer
   ========================================================================== */
.site-footer,
.ast-small-footer,
.ast-footer-copyright {
  background: #05070d !important;
  color: var(--muted) !important;
  border-top: 1px solid var(--line);
}

.site-footer a, .ast-footer-copyright a { color: #cbd5e1; }
.site-footer a:hover { color: var(--accent); }

.site-footer h2, .site-footer h3 {
  color: var(--text);
  font-family: var(--voltio-fuente-display);
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ast-footer-copyright { font-size: 13px; padding-block: 16px; }

/* ==========================================================================
   17.1. Cabeceras con enlace y flecha
   ========================================================================== */
.voltio-seccion__cabecera--con-link {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 16px;
}

.voltio-link-flecha {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--accent);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: gap .18s ease, color .18s ease;
}

.voltio-link-flecha:hover {
  color: #fb923c;
  gap: 10px;
}

/* ==========================================================================
   17.2. Franja de marcas oficiales
   ========================================================================== */
.voltio-marcas-seccion {
  padding: 24px 0;
  background: #05080f;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.voltio-marcas__cabecera {
  text-align: center;
  margin-bottom: 14px;
}

.voltio-marcas__etiqueta {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #64748b;
}

.voltio-marcas__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px 18px;
}

.voltio-marca-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  background: rgba(16, 24, 40, .6);
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 8px;
  text-decoration: none;
  transition: all .2s ease;
}

.voltio-marca-item:hover {
  border-color: rgba(249, 115, 22, .45);
  background: rgba(249, 115, 22, .08);
  transform: translateY(-2px);
}

.voltio-marca-logo {
  font-family: var(--voltio-fuente-display);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .12em;
  color: #64748b;
  transition: color .2s ease;
}

.voltio-marca-item:hover .voltio-marca-logo {
  color: #f8fafc;
}

/* ==========================================================================
   17.3. Banner Promocional: Ofertas Flash con cuenta atrás
   ========================================================================== */
.voltio-promo-flash {
  padding: 24px 0;
}

.voltio-flash-banner {
  position: relative;
  background: var(--flash-grad);
  border: 1px solid rgba(249, 115, 22, .35);
  border-radius: 20px;
  padding: 34px 40px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .45);
  overflow: hidden;
}

.voltio-flash-banner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #f97316, transparent);
}

.voltio-flash-banner__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}

.voltio-badge-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(239, 68, 68, .18);
  border: 1px solid rgba(239, 68, 68, .4);
  color: #ef4444;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  padding: 4px 10px;
  border-radius: 999px;
}

.voltio-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 8px #ef4444;
  animation: voltioPulse 1.6s infinite;
}

@keyframes voltioPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .4; transform: scale(.8); }
}

.voltio-countdown-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(249, 115, 22, .15);
  border: 1px solid rgba(249, 115, 22, .3);
  color: #fb923c;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 999px;
}

.voltio-countdown-pill strong {
  color: var(--text);
  font-family: monospace;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .05em;
}

.voltio-flash-banner__titulo {
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
  color: var(--text);
  margin: 0 0 10px;
  letter-spacing: -0.02em;
}

.voltio-flash-banner__desc {
  font-size: 15px;
  color: var(--muted);
  max-width: 680px;
  margin: 0 0 18px;
  line-height: 1.5;
}

.voltio-flash-banner__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 22px;
}

.voltio-chip {
  background: var(--chip-bg);
  border: 1px solid var(--chip-border);
  color: var(--chip-text);
  font-size: 12px;
  font-weight: 600;
  padding: 5px 12px;
  border-radius: 8px;
}

.voltio-flash-banner__cta-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
}

.voltio-flash-banner__nota {
  font-size: 12.5px;
  color: var(--muted);
}

/* ==========================================================================
   17.4. Banners dobles temáticos (Gaming y Audio)
   ========================================================================== */
.voltio-dual-banners {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
}

.voltio-promo-card {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  align-items: center;
  gap: 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 26px;
  overflow: hidden;
  position: relative;
  transition: transform .2s ease, border-color .2s ease;
}

.voltio-promo-card:hover {
  transform: translateY(-3px);
}

.voltio-promo-card--gaming {
  border-color: rgba(34, 197, 94, .25);
  background:
    radial-gradient(circle at 100% 100%, rgba(34, 197, 94, .14), transparent 60%),
    var(--surface);
}

.voltio-promo-card--gaming:hover {
  border-color: rgba(34, 197, 94, .5);
}

.voltio-promo-card--audio {
  border-color: rgba(56, 189, 248, .25);
  background:
    radial-gradient(circle at 100% 100%, rgba(56, 189, 248, .14), transparent 60%),
    var(--surface);
}

.voltio-promo-card--audio:hover {
  border-color: rgba(56, 189, 248, .5);
}

.voltio-eyebrow--verde { color: #22c55e !important; }
.voltio-eyebrow--azul { color: #38bdf8 !important; }

.voltio-promo-card h3 {
  font-size: 19px;
  font-weight: 700;
  color: var(--text);
  margin: 6px 0 8px;
  line-height: 1.3;
}

.voltio-promo-card p {
  font-size: 13.5px;
  color: var(--muted);
  margin: 0 0 16px;
  line-height: 1.45;
}

.voltio-promo-card__media img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 12px;
  background: var(--media-bg);
}

/* ==========================================================================
   17.5. Footer de comercio electrónico completo
   ========================================================================== */
.voltio-footer {
  background: var(--footer-bg);
  border-top: 1px solid var(--line);
  padding: 48px 0 24px;
  color: var(--muted);
  font-size: 13.5px;
}

.voltio-footer__confianza {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  padding-bottom: 36px;
  margin-bottom: 36px;
  border-bottom: 1px solid var(--line);
}

.voltio-footer__confianza-item {
  display: flex;
  align-items: center;
  gap: 14px;
}

.voltio-footer__confianza-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: rgba(249, 115, 22, .12);
  color: var(--accent);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.voltio-footer__confianza-icon svg { width: 22px; height: 22px; }
.voltio-footer__confianza-item strong { display: block; font-size: 14px; color: var(--text); margin-bottom: 2px; }
.voltio-footer__confianza-item span { font-size: 12.5px; color: #64748b; }

.voltio-footer__grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap: 32px;
  padding-bottom: 36px;
  border-bottom: 1px solid var(--line);
}

@media (max-width: 991px) {
  .voltio-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .voltio-footer__grid { grid-template-columns: 1fr; }
}

.voltio-footer__logo-enlace {
  display: inline-block;
  margin-bottom: 14px;
}

.site-footer .voltio-footer__logo,
.voltio-footer__logo {
  height: 36px !important;
  width: auto !important;
  max-width: 175px !important;
  flex-shrink: 0;
}
/* Tema claro por defecto: logo de texto oscuro */
.voltio-footer__logo--dark { display: none !important; }
.voltio-footer__logo--light { display: block !important; }
/* Tema oscuro automático (sigue al sistema) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) .voltio-footer__logo--dark { display: block !important; }
  :root:not([data-theme='light']) .voltio-footer__logo--light { display: none !important; }
}
/* Tema oscuro forzado */
[data-theme='dark'] .voltio-footer__logo--dark { display: block !important; }
[data-theme='dark'] .voltio-footer__logo--light { display: none !important; }

.voltio-footer__descripcion {
  font-size: 13px;
  line-height: 1.6;
  color: var(--muted);
  margin: 0 0 16px;
}

.voltio-footer__atencion {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 12.5px;
}

.voltio-footer__atencion-etiqueta {
  color: var(--muted);
  font-weight: 600;
}

.voltio-footer__telefono {
  font-size: 18px;
  font-weight: 800;
  color: var(--accent);
  text-decoration: none;
  font-family: var(--voltio-fuente-display);
}

.voltio-footer__horario {
  color: var(--muted);
}

.voltio-footer__email {
  color: var(--accent);
  text-decoration: none;
}

.voltio-footer__titulo {
  font-family: var(--voltio-fuente-display);
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text);
  margin: 0 0 16px;
}

.voltio-footer__menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.voltio-footer__menu a {
  color: var(--muted);
  text-decoration: none;
  font-size: 13.5px;
  transition: color .15s ease;
}

.voltio-footer__menu a:hover {
  color: var(--accent);
}

.voltio-footer__enlace-destacado {
  color: var(--accent-2) !important;
  font-weight: 600;
}

.voltio-footer__pagos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
}

.voltio-footer__pagos-titulo {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
}

.voltio-footer__pagos-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.voltio-badge-pago {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.voltio-badge-pago:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
  border-color: rgba(255, 107, 0, 0.4);
}

.voltio-badge-pago svg {
  display: block;
  width: 44px;
  height: 28px;
  border-radius: 4px;
}

.voltio-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 22px;
  font-size: 12px;
  color: var(--muted);
}

.voltio-footer__copy strong {
  color: var(--text);
}

/* ==========================================================================
   18. Banner de cookies (fallback)
   ========================================================================== */
.voltio-cookies {
  position: fixed;
  inset-inline: 16px;
  bottom: 16px;
  z-index: 99999;
  max-width: 640px;
  margin-inline: auto;
  background: var(--surface);
  border: 1px solid var(--line-fuerte);
  border-radius: 18px;
  box-shadow: 0 30px 60px rgba(0, 0, 0, .6);
  padding: 20px;
  font-size: 14px;
  color: var(--muted);
  display: none;
}

.voltio-cookies[data-visible="1"] { display: block; }
.voltio-cookies h2 { color: var(--text); font-size: 16px; }
.voltio-cookies__acciones { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }

/* ==========================================================================
   19. Utilidades y responsive
   ========================================================================== */
.voltio-solo-lectores {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
  padding: 0;
  margin: -1px;
}

.voltio-front { overflow-x: clip; }
.voltio-hero__grid > * { min-width: 0; }

@media (max-width: 921px) {
  .site-header { position: relative; }
}

@media (max-width: 767px) {
  .voltio-grid-productos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .voltio-tarjeta__cuerpo { padding: 12px; }
  .voltio-tarjeta__titulo { font-size: 13px; }
  .voltio-tarjeta__precio { font-size: 16px; }
  .voltio-tarjeta__cta { min-height: 38px; font-size: 12px; padding: 6px 10px; }
  .voltio-tarjeta__ver { width: 38px; height: 38px; }
  .voltio-tarjeta__descuento { font-size: 11px; padding: 3px 7px; }

  .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 13px !important; }

  .voltio-categorias { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voltio-categoria { min-height: 150px; padding: 14px; }

  .voltio-hero__mini-datos { gap: 16px; font-size: 12px; }
  .voltio-hero__mini-datos > span { padding-right: 16px; }
  .voltio-hero__mini-datos strong { font-size: 18px; }
  .voltio-hero__tarjeta { padding: 18px; }

  .voltio-banner, .voltio-newsletter { border-radius: 18px; }
  .voltio-contenedor { padding-inline: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}


/* ===== 20. Ficha de moda: selector visual, guia de tallas y confianza ===== */
.voltio-vv{display:grid;gap:.9rem;margin:.6rem 0 1rem}
.voltio-vv__grupo{display:block}
.voltio-vv__titulo{font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.75;margin:0 0 .4rem}
.voltio-vv__valor{font-weight:400;text-transform:none;letter-spacing:0;opacity:1}
.voltio-vv__opciones{display:flex;flex-wrap:wrap;gap:.5rem}
.voltio-vv__pill{position:relative;min-width:2.8rem;min-height:2.6rem;padding:.45rem .8rem;border:1.5px solid rgba(127,127,127,.45);border-radius:.6rem;background:transparent;color:inherit;font:inherit;font-weight:600;cursor:pointer;transition:.15s}
.voltio-vv__pill:hover{border-color:#F97316}
.voltio-vv__pill[aria-pressed="true"]{background:#F97316;border-color:#F97316;color:#fff}
.voltio-vv__pill[disabled]{opacity:.38;cursor:not-allowed;text-decoration:line-through}
.voltio-vv__pill--color{width:2.6rem;height:2.6rem;min-width:2.6rem;padding:0;border-radius:50%;background-color:#ccc;border:2px solid rgba(127,127,127,.45)}
.voltio-vv__pill--color[aria-pressed="true"]{box-shadow:0 0 0 3px #fff,0 0 0 5px #F97316}
.voltio-vv__swatch-nombre{position:absolute;bottom:calc(100% + .35rem);left:50%;transform:translateX(-50%);white-space:nowrap;background:#111827;color:#fff;font-size:.72rem;padding:.2rem .45rem;border-radius:.3rem;opacity:0;pointer-events:none;transition:.15s;z-index:5}
.voltio-vv__pill--color:hover .voltio-vv__swatch-nombre,.voltio-vv__pill--color:focus-visible .voltio-vv__swatch-nombre{opacity:1}
.voltio-vv__boton-tallas{align-self:start;display:inline-flex;align-items:center;gap:.4rem;background:none;border:0;padding:0;color:#F97316;font:inherit;font-weight:600;text-decoration:underline;cursor:pointer}
.voltio-guia-tallas__fondo{position:fixed;inset:0;background:rgba(3,7,18,.65);display:none;align-items:center;justify-content:center;padding:1rem;z-index:99999}
.voltio-guia-tallas__fondo.esta-abierto{display:flex}
.voltio-guia-tallas__caja{background:#fff;color:#111827;max-width:34rem;width:100%;max-height:88vh;overflow:auto;border-radius:1rem;padding:1.25rem;box-shadow:0 24px 64px rgba(0,0,0,.35)}
.voltio-guia-tallas__caja h3{margin:0 0 .4rem;font-size:1.1rem}
.voltio-guia-tallas__caja p{font-size:.82rem;opacity:.75;margin:0 0 .8rem}
.voltio-guia-tallas__tabla{width:100%;border-collapse:collapse;font-size:.9rem}
.voltio-guia-tallas__tabla th,.voltio-guia-tallas__tabla td{border-bottom:1px solid #e5e7eb;padding:.5rem .4rem;text-align:center}
.voltio-guia-tallas__tabla th{background:#f97316;color:#fff}
.voltio-guia-tallas__cerrar{margin-top:.9rem;background:#111827;color:#fff;border:0;border-radius:.5rem;padding:.55rem 1rem;font:inherit;cursor:pointer}
html.dark .voltio-guia-tallas__caja{background:#111827;color:#f9fafb}
html.dark .voltio-guia-tallas__tabla td{border-bottom-color:#374151}
.voltio-confianza-moda{display:grid;gap:.45rem;margin:1rem 0;padding:.9rem 1rem;border:1px solid rgba(127,127,127,.3);border-radius:.8rem;font-size:.88rem}
.voltio-confianza-moda li{display:flex;gap:.5rem;align-items:flex-start;margin:0;list-style:none}
.voltio-material__caja{display:grid;gap:.35rem;font-size:.92rem;line-height:1.55}
.voltio-material__tabla{width:100%;border-collapse:collapse;font-size:.9rem;margin:.4rem 0}
.voltio-material__tabla td{padding:.35rem .5rem;border-bottom:1px solid rgba(127,127,127,.25)}

/* === VIVAKO BLOG & AUTH GOOGLE CSS === */
.voltio-lectura-progreso{position:fixed;inset:0 0 auto 0;height:3px;background:transparent;z-index:9999;pointer-events:none}
.voltio-lectura-progreso span{display:block;height:100%;width:0;background:#F97316;transition:width .1s linear}
.voltio-blog-archivo .ast-container,.single-post .ast-container{max-width:1240px}
.voltio-blog-archivo #primary{width:100%;margin:0;padding:0}
.voltio-blog-hero{position:relative;padding:clamp(44px,6vw,72px) 0 clamp(32px,4.5vw,48px);background:radial-gradient(circle at 82% 20%,rgba(249,115,22,.16),transparent 46%),radial-gradient(circle at 18% 80%,rgba(99,102,241,.14),transparent 50%),var(--hero-grad,linear-gradient(135deg,rgba(15,23,42,.04),rgba(249,115,22,.06)));border-bottom:1px solid var(--line,rgba(148,163,184,.22));border-radius:20px;margin-top:18px;overflow:hidden}
.voltio-blog-hero__inner{max-width:780px}
.voltio-blog-hero__eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#F97316;background:rgba(249,115,22,.12);border:1px solid rgba(249,115,22,.28);padding:5px 12px;border-radius:999px}
.voltio-blog-hero__titulo{margin:16px 0 12px;font-size:clamp(28px,4.2vw,46px);font-weight:800;line-height:1.15;color:var(--text,#0f172a)}
.voltio-blog-hero__subtitulo{margin:0 0 24px;max-width:640px;font-size:clamp(15.5px,1.8vw,18px);line-height:1.6;color:var(--muted,#64748b)}
.voltio-blog-filtros{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.voltio-blog-filtro{display:inline-flex;align-items:center;justify-content:center;padding:8px 16px;border-radius:999px;font-size:13.5px;font-weight:600;color:var(--text,#0f172a);background:var(--surface,#fff);border:1px solid var(--line-fuerte,rgba(148,163,184,.35));text-decoration:none;transition:all .22s ease;cursor:pointer}
.voltio-blog-filtro:hover{border-color:#F97316;color:#F97316;transform:translateY(-1px)}
.voltio-blog-filtro.is-active{background:#F97316;border-color:#F97316;color:#fff!important;box-shadow:0 6px 18px rgba(249,115,22,.28)}
.voltio-blog-listado{padding-block:clamp(32px,5vw,56px) clamp(48px,7vw,88px)}
.voltio-blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:stretch}
@media (max-width:1024px){.voltio-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}}
@media (max-width:680px){.voltio-blog-grid{grid-template-columns:1fr;gap:20px}}
.voltio-blog-tarjeta{background:var(--surface,#fff);border:1px solid var(--card-border,rgba(148,163,184,.22));border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease}
.voltio-blog-tarjeta:hover{border-color:#F97316;transform:translateY(-4px);box-shadow:0 18px 38px -12px rgba(15,23,42,.18)}
.voltio-blog-tarjeta__enlace{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.voltio-blog-tarjeta__media{position:relative;aspect-ratio:16/9;background:#0f172a;border-radius:14px 14px 0 0;overflow:hidden}
.voltio-blog-tarjeta__img{width:100%;height:100%;aspect-ratio:16/9;object-fit:cover;display:block;border-radius:14px 14px 0 0;transition:transform .3s ease}
.voltio-blog-tarjeta:hover .voltio-blog-tarjeta__img{transform:scale(1.04)}
.voltio-blog-tarjeta__badge{position:absolute;top:14px;left:14px;z-index:2;background:#F97316;color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:5px 12px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.28)}
.voltio-blog-tarjeta__cuerpo{display:flex;flex-direction:column;gap:12px;padding:22px;flex:1}
.voltio-blog-tarjeta__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--muted,#64748b)}
.voltio-blog-tarjeta__meta-item{display:inline-flex;align-items:center;gap:5px}
.voltio-blog-tarjeta__meta-item svg{color:#F97316;flex-shrink:0}
.voltio-blog-tarjeta__titulo{font-size:1.25rem;font-weight:700;line-height:1.4;margin:0;color:var(--text,#0f172a);transition:color .2s ease}
.voltio-blog-tarjeta:hover .voltio-blog-tarjeta__titulo{color:#F97316}
.voltio-blog-tarjeta__extracto{font-size:14.5px;line-height:1.55;color:var(--muted,#64748b);margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.voltio-blog-tarjeta__cta{margin-top:auto;padding-top:12px;border-top:1px solid var(--line,rgba(148,163,184,.18));display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:#F97316}
.voltio-blog-tarjeta__flecha{display:inline-block;transition:transform .22s ease}
.voltio-blog-tarjeta:hover .voltio-blog-tarjeta__flecha{transform:translateX(4px)}
.single-post .content-area{padding-inline:24px}
.voltio-articulo__cabecera{max-width:820px;margin:0 auto;padding-block:clamp(28px,4vw,48px) clamp(18px,3vw,28px)}
.voltio-miga{display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--muted);margin-bottom:18px}
.voltio-miga a{color:var(--muted);text-decoration:none;font-weight:500}
.voltio-miga a:hover{color:#F97316}
.voltio-articulo__categoria{text-decoration:none}
.voltio-articulo__titulo{font-size:clamp(28px,4vw,44px);line-height:1.15;margin:14px 0 16px}
.voltio-articulo__entradilla{font-size:18px;line-height:1.6;color:var(--text)!important;opacity:.88;margin-bottom:24px}
.voltio-articulo__meta{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--line)}
.voltio-articulo__avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0}
.voltio-articulo__avatar--inicial{display:grid;place-items:center;background:#F97316;color:#fff;font-weight:700}
.voltio-articulo__meta-texto{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13.5px;color:var(--muted)}
.voltio-articulo__autor{font-weight:700;color:var(--text)}
.voltio-articulo__cuerpo{max-width:780px;margin:0 auto}
.voltio-articulo__portada{margin:0 0 32px}
.voltio-articulo__portada-img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:14px;display:block}
.voltio-articulo__texto{font-size:17px;line-height:1.75}
.voltio-articulo__texto>*+*{margin-top:1.05em}
.voltio-articulo__texto h2{font-size:clamp(22px,2.6vw,30px);margin-top:1.9em}
.voltio-articulo__texto blockquote{margin:1.5em 0;padding:16px 22px;border-left:3px solid #F97316;background:var(--surface-2);border-radius:0 12px 12px 0}
.voltio-articulo__texto table{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;margin-block:1.6em;background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.voltio-articulo__texto th,.voltio-articulo__texto td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left}
.voltio-articulo__texto thead th{background:var(--surface-2);font-weight:700}
.voltio-articulo__autor-caja{display:flex;gap:16px;align-items:center;max-width:780px;margin:40px auto 0;padding:22px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.voltio-contenedor--articulo{max-width:1240px;padding-inline:24px}
.voltio-articulo__cta{display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between;margin-top:52px;padding:clamp(24px,3vw,36px);border-radius:14px;background:var(--banner-grad);border:1px solid var(--line)}
.voltio-articulo__cta-botones{display:flex;flex-wrap:wrap;gap:10px}
.voltio-articulo__relacionados{margin-top:52px;margin-bottom:64px}
.voltio-articulo__relacionados-titulo{font-size:clamp(22px,2.6vw,30px);margin-bottom:22px}
.single-post .ast-article-single>.entry-header,.single-post .ast-post-format>.entry-header,.single-post.ast-separate-container .ast-article-single .entry-header{display:none!important}
.single-post .entry-content a{color:#F97316!important}
.voltio-auth-wrap{max-width:1100px;margin:12px auto 36px}
.voltio-auth-header{text-align:center;margin-bottom:28px}
.voltio-auth-header__titulo{margin:10px 0 8px;font-size:clamp(26px,3.6vw,38px);font-weight:800;color:var(--text,#0f172a)}
.voltio-auth-header__sub{margin:0 auto;max-width:560px;font-size:15.5px;color:var(--muted,#64748b)}

/* ==========================================================================
   VIVAKO - AUTENTICACIÓN / MI CUENTA (INVITADOS Y REGISTRO)
   ========================================================================== */

/* 1. Ocultar título h1 nativo de Astra en /mi-cuenta/ */
.woocommerce-account .entry-header {
  display: none !important;
}

/* 2. Contenedor centrado y márgenes limpios */
.woocommerce-account .site-content .ast-container {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: clamp(20px, 3.5vw, 44px) 16px !important;
}
.woocommerce-account #primary {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

/* 3. Cabecera de autenticación */
.voltio-auth-wrap {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}
.voltio-auth-header {
  text-align: center;
  margin-bottom: 28px;
}
.voltio-auth-header .voltio-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}
.voltio-auth-header__titulo {
  font-size: clamp(24px, 3.5vw, 36px);
  font-weight: 800;
  margin: 4px 0 8px;
  color: var(--text, #0f172a);
}
.voltio-auth-header__sub {
  font-size: 14.5px;
  color: var(--muted, #64748b);
  max-width: 580px;
  margin: 0 auto;
  line-height: 1.5;
}

/* Selector de pestañas móvil */
.voltio-auth-tabs {
  display: none;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
}
.voltio-auth-tab {
  padding: 9px 20px;
  border-radius: 999px;
  border: 1px solid var(--line-fuerte, rgba(148, 163, 184, 0.35));
  background: var(--surface, #ffffff);
  color: var(--text, #0f172a);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}
.voltio-auth-tab.is-active {
  background: #F97316 !important;
  border-color: #F97316 !important;
  color: #ffffff !important;
}

/* 4. Columnas Iniciar Sesión y Registro */
.woocommerce #customer_login.u-columns.col2-set {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 28px !important;
  width: 100% !important;
  max-width: 1100px !important;
  margin: 0 auto 48px !important;
  align-items: stretch !important;
  float: none !important;
}
.woocommerce #customer_login.u-columns.col2-set::before,
.woocommerce #customer_login.u-columns.col2-set::after {
  display: none !important;
}
.woocommerce #customer_login.u-columns.col2-set .u-column1,
.woocommerce #customer_login.u-columns.col2-set .u-column2 {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: clamp(22px, 3vw, 36px) !important;
  background: var(--surface, #ffffff) !important;
  border: 1px solid var(--card-border, rgba(148, 163, 184, 0.28)) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 30px -10px rgba(15, 23, 42, 0.08) !important;
  display: flex !important;
  flex-direction: column !important;
}
.woocommerce #customer_login h2 {
  margin: 0 0 8px !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  color: var(--text, #0f172a) !important;
}
.woocommerce #customer_login form.login,
.woocommerce #customer_login form.register {
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}
.voltio-auth-col-sub {
  margin: 0 0 14px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--muted, #64748b);
}
.voltio-auth-beneficios {
  list-style: none;
  margin: 0 0 16px;
  padding: 12px 14px;
  background: rgba(249, 115, 22, 0.07);
  border: 1px solid rgba(249, 115, 22, 0.22);
  border-radius: 12px;
  display: grid;
  gap: 8px;
}
.voltio-auth-beneficios li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--text, #0f172a);
  margin: 0;
}
.voltio-auth-beneficios__ico {
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #F97316;
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
  flex-shrink: 0;
  margin-top: 2px;
}

/* Botón Google Sign-In */
.voltio-social-login {
  margin: 2px 0 16px;
}
.voltio-google-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  min-height: 46px;
  padding: 10px 18px;
  border-radius: 10px;
  border: 1px solid #dadce0;
  background: #ffffff;
  color: #1f1f1f;
  font-family: inherit;
  font-size: 14.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.voltio-google-btn:hover {
  background: #f8fafc;
  border-color: #F97316;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1);
  transform: translateY(-1px);
}
html.dark .voltio-google-btn,
[data-theme="dark"] .voltio-google-btn {
  background: #131314;
  border-color: #8e918f;
  color: #e3e3e3;
}
.voltio-google-btn__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.voltio-social-sep {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 14px 0 6px;
  color: var(--muted, #64748b);
  font-size: 11.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.voltio-social-sep::before,
.voltio-social-sep::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line, rgba(148, 163, 184, 0.25));
}

/* Inputs y botones */
.woocommerce #customer_login .form-row {
  margin: 0 0 14px !important;
  padding: 0 !important;
  width: 100% !important;
}
.woocommerce #customer_login .form-row label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-bottom: 5px !important;
  color: var(--text, #0f172a) !important;
}
.woocommerce #customer_login input.input-text {
  width: 100% !important;
  min-height: 44px !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  border: 1px solid var(--line-fuerte, rgba(148, 163, 184, 0.38)) !important;
  background: var(--surface-2, #f8fafc) !important;
  color: var(--text, #0f172a) !important;
  font-size: 14.5px !important;
  box-sizing: border-box !important;
}
.woocommerce #customer_login input.input-text:focus {
  outline: none !important;
  border-color: #F97316 !important;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.16) !important;
}
.woocommerce #customer_login .woocommerce-form-login__rememberme {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  color: var(--muted, #475569) !important;
  cursor: pointer !important;
  margin-bottom: 12px !important;
}
.woocommerce #customer_login button.woocommerce-button {
  width: 100% !important;
  min-height: 46px !important;
  border-radius: 10px !important;
  background: #F97316 !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border: 0 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
  margin-top: 6px !important;
}
.woocommerce #customer_login button.woocommerce-button:hover {
  background: #ea580c !important;
  transform: translateY(-1px) !important;
}
.woocommerce #customer_login .lost_password {
  text-align: center !important;
  margin-top: 12px !important;
  margin-bottom: 0 !important;
  font-size: 12.5px !important;
}
.woocommerce #customer_login .lost_password a {
  color: #F97316 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}
.woocommerce-privacy-policy-text p {
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted, #64748b);
  margin-bottom: 12px !important;
}

/* Modal Google GIS */
.voltio-google-modal {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.65);
  backdrop-filter: blur(4px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  z-index: 99999;
}
.voltio-google-modal.is-open { display: flex; }
.voltio-google-modal__box {
  position: relative;
  width: 100%;
  max-width: 440px;
  background: var(--surface, #ffffff);
  color: var(--text, #0f172a);
  border: 1px solid var(--card-border, rgba(148, 163, 184, 0.28));
  border-radius: 16px;
  padding: 28px 24px 24px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}
.voltio-google-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--line, rgba(148, 163, 184, 0.3));
  background: transparent;
  color: inherit;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.voltio-google-modal__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--muted, #64748b);
  margin-bottom: 10px;
}
.voltio-google-modal__box h3 { margin: 0 0 8px; font-size: 20px; }
.voltio-google-modal__desc { margin: 0 0 16px; font-size: 14px; line-height: 1.5; color: var(--muted, #64748b); }
.voltio-google-modal__form { display: grid; gap: 10px; }
.voltio-google-modal__form label { font-size: 13px; font-weight: 600; }
.voltio-google-modal__form input {
  width: 100%;
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid var(--line-fuerte, rgba(148, 163, 184, 0.4));
  background: var(--surface-2, #f8fafc);
  color: var(--text, #0f172a);
}

/* ==========================================================================
   5. COMPORTAMIENTO MÓVIL ESTRICTO (PANTALLAS <= 860px)
   ========================================================================== */
@media (max-width: 860px) {
  /* Mostrar las pestañas centradas */
  .voltio-auth-tabs {
    display: flex !important;
  }

  /* Columna única en móvil */
  .woocommerce #customer_login.u-columns.col2-set {
    display: block !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    margin: 0 auto 36px !important;
    padding: 0 !important;
  }

  /* Control de visibilidad por pestaña activa (Acceso por defecto) */
  .woocommerce #customer_login.u-columns.col2-set .u-column1,
  .woocommerce #customer_login.u-columns.col2-set .u-column2 {
    width: 100% !important;
    margin: 0 !important;
  }

  /* Estado por defecto o cuando data-active-tab="login": ocultar registro */
  .woocommerce #customer_login.u-columns.col2-set .u-column2,
  .woocommerce #customer_login.u-columns.col2-set[data-active-tab="login"] .u-column2 {
    display: none !important;
  }
  .woocommerce #customer_login.u-columns.col2-set .u-column1,
  .woocommerce #customer_login.u-columns.col2-set[data-active-tab="login"] .u-column1 {
    display: flex !important;
  }

  /* Cuando data-active-tab="register": ocultar login y mostrar registro */
  .woocommerce #customer_login.u-columns.col2-set[data-active-tab="register"] .u-column1 {
    display: none !important;
  }
  .woocommerce #customer_login.u-columns.col2-set[data-active-tab="register"] .u-column2 {
    display: flex !important;
  }
}


/* ==========================================================================
   VIVAKO - PANEL DE CLIENTE / MI CUENTA (USUARIOS LOGUEADOS Y DASHBOARD)
   ========================================================================== */

/* 1. Reset de contenedor de Astra para /mi-cuenta/ */
.woocommerce-account .site-content .ast-container {
  max-width: 1220px !important;
  margin: 0 auto !important;
  padding: clamp(20px, 3.5vw, 44px) 20px !important;
}
.woocommerce-account #primary {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
.woocommerce-account .entry-header {
  display: none !important;
}

/* 2. Grid principal cuando el usuario esta logueado */
.woocommerce-account.logged-in .woocommerce {
  display: grid !important;
  grid-template-columns: 280px minmax(0, 1fr) !important;
  gap: 32px !important;
  align-items: start !important;
}
.woocommerce-account.logged-in .woocommerce::before,
.woocommerce-account.logged-in .woocommerce::after {
  display: none !important;
}

/* 3. Hero / Cabecera de bienvenida del cliente */
.voltio-cuenta-panel-hero {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  padding: clamp(20px, 2.5vw, 28px);
  background: var(--surface, #ffffff);
  border: 1px solid var(--card-border, rgba(148, 163, 184, 0.25));
  border-radius: 18px;
  margin-bottom: 8px;
  box-shadow: 0 10px 30px -10px rgba(15, 23, 42, 0.08);
}
.voltio-cuenta-panel-hero__avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  background: linear-gradient(135deg, #F97316, #ea580c);
  color: #ffffff;
  display: inline-grid;
  place-items: center;
  font-size: 24px;
  font-weight: 800;
  flex-shrink: 0;
  border: 3px solid rgba(249, 115, 22, 0.3);
}
.voltio-cuenta-panel-hero__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.voltio-cuenta-panel-hero__detalles {
  flex: 1 1 300px;
}
.voltio-cuenta-panel-hero__nombre {
  margin: 4px 0 6px !important;
  font-size: clamp(22px, 3vw, 30px) !important;
  font-weight: 800 !important;
  color: var(--text, #0f172a) !important;
  line-height: 1.2 !important;
}
.voltio-cuenta-panel-hero__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 !important;
  font-size: 13.5px;
  color: var(--muted, #64748b);
}
.voltio-cuenta-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  background: var(--surface-2, #f1f5f9);
  color: var(--text, #0f172a);
  border: 1px solid var(--line, rgba(148, 163, 184, 0.25));
}
.voltio-cuenta-badge--verificado {
  background: rgba(34, 197, 94, 0.12);
  color: #16a34a;
  border-color: rgba(34, 197, 94, 0.25);
}

/* 4. Barra lateral de navegacion (.woocommerce-MyAccount-navigation) */
.woocommerce-account .woocommerce-MyAccount-navigation {
  float: none !important;
  width: 100% !important;
  background: var(--surface, #ffffff) !important;
  border: 1px solid var(--card-border, rgba(148, 163, 184, 0.25)) !important;
  border-radius: 18px !important;
  padding: 12px !important;
  box-shadow: 0 10px 30px -10px rgba(15, 23, 42, 0.08) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 18px !important;
  border-radius: 12px !important;
  color: var(--text, #0f172a) !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
  text-decoration: none !important;
  background: transparent !important; /* MATA EL FONDO BLANCO EN DARK MODE */
  border-left: 3px solid transparent !important;
  transition: all 0.2s ease !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--surface-2, #f8fafc) !important;
  color: #F97316 !important;
  transform: translateX(4px);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  background: rgba(249, 115, 22, 0.12) !important;
  color: #F97316 !important;
  font-weight: 700 !important;
  border-left: 3px solid #F97316 !important;
}

/* 5. Area de contenido principal (.woocommerce-MyAccount-content) */
.woocommerce-account .woocommerce-MyAccount-content {
  float: none !important;
  width: 100% !important;
  background: var(--surface, #ffffff) !important;
  border: 1px solid var(--card-border, rgba(148, 163, 184, 0.25)) !important;
  border-radius: 18px !important;
  padding: clamp(24px, 3.5vw, 40px) !important;
  box-shadow: 0 10px 30px -10px rgba(15, 23, 42, 0.08) !important;
  color: var(--text, #0f172a) !important;
}
.woocommerce-account .woocommerce-MyAccount-content p {
  color: var(--text, #0f172a) !important;
  line-height: 1.6 !important;
}
.woocommerce-account .woocommerce-MyAccount-content a {
  color: #F97316 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.woocommerce-account .woocommerce-MyAccount-content a:hover {
  text-decoration: underline !important;
}

/* 6. Grid de 4 tarjetas de acceso rapido en el escritorio */
.voltio-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 24px;
}
.voltio-dashboard-card {
  display: flex;
  flex-direction: column;
  padding: 22px;
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--line, rgba(148, 163, 184, 0.25));
  border-radius: 14px;
  text-decoration: none !important;
  color: inherit !important;
  transition: all 0.22s ease;
}
.voltio-dashboard-card:hover {
  border-color: #F97316;
  box-shadow: 0 10px 25px -8px rgba(249, 115, 22, 0.2);
  transform: translateY(-2px);
}
.voltio-dashboard-card__icono {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: rgba(249, 115, 22, 0.12);
  color: #F97316;
  display: inline-grid;
  place-items: center;
  margin-bottom: 14px;
}
.voltio-dashboard-card__contenido h3 {
  margin: 0 0 6px !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--text, #0f172a) !important;
}
.voltio-dashboard-card__contenido p {
  margin: 0 0 12px !important;
  font-size: 13.5px !important;
  color: var(--muted, #64748b) !important;
  line-height: 1.45 !important;
}
.voltio-dashboard-card__link {
  font-size: 13.5px;
  font-weight: 700;
  color: #F97316;
}

/* 7. Tablas y formularios de WooCommerce dentro de la cuenta */
.woocommerce-account table.shop_table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid var(--line, rgba(148, 163, 184, 0.25)) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  margin-bottom: 24px !important;
}
.woocommerce-account table.shop_table th {
  background: var(--surface-2, #f8fafc) !important;
  color: var(--text, #0f172a) !important;
  padding: 12px 16px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  border-bottom: 1px solid var(--line, rgba(148, 163, 184, 0.25)) !important;
}
.woocommerce-account table.shop_table td {
  padding: 14px 16px !important;
  border-bottom: 1px solid var(--line, rgba(148, 163, 184, 0.15)) !important;
  font-size: 14px !important;
  color: var(--text, #0f172a) !important;
}
.woocommerce-account address {
  background: var(--surface-2, #f8fafc) !important;
  border: 1px solid var(--line, rgba(148, 163, 184, 0.25)) !important;
  border-radius: 12px !important;
  padding: 20px !important;
  font-style: normal !important;
  line-height: 1.6 !important;
  color: var(--text, #0f172a) !important;
}

/* 8. Responsividad movil */
@media (max-width: 860px) {
  .woocommerce-account.logged-in .woocommerce {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    padding: 8px 14px !important;
    font-size: 13.5px !important;
  }
  .voltio-dashboard-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================================
 * COMPONENTE: MAPA INTERACTIVO DE CONTACTO (VIVAKO)
 * ========================================================================== */
.voltio-mapa-container {
	margin: 28px 0 40px 0;
	border-radius: 18px;
	background: var(--surface, #ffffff);
	border: 1px solid var(--border, #e2e8f0);
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}
.voltio-mapa-frame-wrap {
	position: relative;
	width: 100%;
	height: 420px;
	background: #e2e8f0;
}
.voltio-mapa-iframe {
	width: 100% !important;
	height: 100% !important;
	border: 0 !important;
	display: block;
}
.voltio-mapa-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 22px;
	background: var(--surface-alt, #f8fafc);
	border-top: 1px solid var(--border, #e2e8f0);
	flex-wrap: wrap;
}
.voltio-mapa-direccion {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14.5px;
	color: var(--text, #0f172a);
}
.voltio-mapa-direccion svg {
	color: #f97316;
	flex-shrink: 0;
}
.voltio-mapa-acciones {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.voltio-btn-mapa {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13.5px;
	font-weight: 600;
	padding: 8px 16px;
	border-radius: 8px;
	text-decoration: none !important;
	transition: all 0.2s ease;
}
.voltio-btn-mapa--google {
	background: #0f172a;
	color: #ffffff !important;
}
.voltio-btn-mapa--google:hover {
	background: #1e293b;
	color: #ffffff !important;
	transform: translateY(-1px);
}
.voltio-btn-mapa--osm {
	background: #ffffff;
	color: #334155 !important;
	border: 1px solid #cbd5e1;
}
.voltio-btn-mapa--osm:hover {
	background: #f1f5f9;
	color: #0f172a !important;
}
@media (max-width: 680px) {
	.voltio-mapa-frame-wrap {
		height: 320px;
	}
	.voltio-mapa-toolbar {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
		padding: 14px 16px;
	}
	.voltio-mapa-acciones {
		width: 100%;
	}
	.voltio-btn-mapa {
		flex: 1;
		justify-content: center;
		text-align: center;
	}
}

/* ==========================================================================
   VIVAKO - AJUSTES DE MARGEN Y CONTENEDOR EN PÁGINA DE COMPRA Y CARRITO
   ========================================================================== */

/* 1. Margen y holgura en el contenedor principal de compra y carrito */
.woocommerce-checkout .site-content .ast-container,
.woocommerce-cart .site-content .ast-container {
	max-width: 1240px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: clamp(20px, 3.5vw, 40px) !important;
	padding-right: clamp(20px, 3.5vw, 40px) !important;
	box-sizing: border-box !important;
}

/* 2. Evitar que bloques alignwide se peguen a los bordes de la ventana */
.woocommerce-checkout .entry-content[data-ast-blocks-layout] > .alignwide,
.woocommerce-cart .entry-content[data-ast-blocks-layout] > .alignwide,
.woocommerce-checkout .wp-block-woocommerce-checkout,
.woocommerce-cart .wp-block-woocommerce-cart {
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: clamp(16px, 2.5vw, 32px) !important;
	padding-right: clamp(16px, 2.5vw, 32px) !important;
	box-sizing: border-box !important;
}

/* 3. Ajuste para checkout clásico (shortcode) */
.woocommerce-checkout form.woocommerce-checkout {
	padding-left: 8px;
	padding-right: 8px;
	box-sizing: border-box;
}

/* 4. Título de página con sangría limpia */
.woocommerce-checkout .entry-header,
.woocommerce-cart .entry-header {
	padding-left: clamp(16px, 2.5vw, 32px) !important;
	padding-right: clamp(16px, 2.5vw, 32px) !important;
	margin-bottom: 24px !important;
}

/* ==========================================================================
   VIVAKO - CARRITO EN EL HEADER (ESCRITORIO Y MÓVIL)
   ========================================================================== */
.voltio-menu-item-cart {
	display: inline-flex !important;
	align-items: center;
}

.voltio-cart-header-wrap {
	display: inline-flex;
	align-items: center;
	position: relative;
	margin-right: 8px;
}

.voltio-cart-header-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--surface-2);
	border: 1px solid var(--line-fuerte);
	color: var(--text) !important;
	transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
	box-shadow: var(--voltio-sombra-sm);
	text-decoration: none !important;
}

.voltio-cart-header-btn:hover {
	background: var(--surface);
	border-color: var(--accent);
	color: var(--accent) !important;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(234, 88, 12, 0.18);
}

.voltio-cart-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

.voltio-cart-badge {
	position: absolute;
	top: -4px;
	right: -4px;
	min-width: 19px;
	height: 19px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--line-fuerte);
	color: var(--muted);
	font-family: var(--voltio-fuente);
	font-size: 11px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	transition: all 0.2s ease;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.voltio-cart-badge.has-items {
	background: var(--accent);
	color: #ffffff;
}

/* Carrito en cabecera móvil */
#ast-mobile-header .voltio-cart-header-wrap {
	margin-right: 6px;
	display: inline-flex;
	align-items: center;
}

#ast-mobile-header .voltio-cart-header-btn {
	width: 36px;
	height: 36px;
}
