/* ============================================================
   FOTOVOLTAICASOLAR - CSS ORGANIZADO
   Cabecera móvil con accesos visibles y limpieza conservadora de redundancias.
   Mantener copia de seguridad antes de sustituirlo.
   ============================================================ */

/* 1. IDENTIDAD VISUAL */
body { font-family: "Montserrat", Arial, sans-serif !important; color: #276b35; }
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p, .page-content, .product-title, .product-title a,
.product-description, .section-title {
  font-family: "Montserrat", Arial, sans-serif !important;
  color: #276b35 !important;
}
.product-price, .price, .current-price, .regular-price {
  font-family: "Montserrat", Arial, sans-serif !important;
  color: #276b35 !important;
  font-weight: 600;
}
a:not(.btn):not(.button) { font-family: "Montserrat", Arial, sans-serif; }
#index .featured-products > h2 { font-weight: 600 !important; }

/* 2. CABECERA Y LOGOTIPO */
#header .header-top .logo { width: 300px !important; max-width: 100% !important; height: auto !important; }
#header .header-top .container > .row {
  display: flex;
  flex-wrap: wrap;
}
#header .header-top .container > .row > div:first-child {
  flex: 0 0 100%; max-width: 100%; text-align: left; margin-bottom: 15px;
}
#header .header-top .container > .row > div:first-child .logo { display: inline-block; }

/* Restaurar la fuente de los iconos (evita mostrar texto en su lugar) */
#header .header-nav .material-icons {
  font-family: "Material Icons" !important;
  font-weight: normal !important;
  font-style: normal !important;
  font-size: 24px !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap !important;
  font-feature-settings: "liga" !important;
  -webkit-font-feature-settings: "liga" !important;
  -webkit-font-smoothing: antialiased !important;
  color: #276b35 !important;
}

/* 3. MENU Y CABECERA EN ORDENADOR */
@media (min-width: 768px) {
  #_desktop_top_menu { width: 100% !important; }
  #_desktop_top_menu .top-menu {
    display: flex !important;
    flex-wrap: wrap !important; /* Permite distribuir los elementos en varias filas si no caben */
    align-items: center;
    justify-content: center !important;
  }
  #_desktop_top_menu .top-menu > li { flex-shrink: 0; }
  #_desktop_top_menu .top-menu a[data-depth="0"] {
    font-family: "Montserrat", Arial, sans-serif !important;
    font-size: 14px !important; /* Tamaño único para todas las categorías del menú */
    font-weight: 700 !important;
    color: #276b35 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    white-space: nowrap !important;
  }
  #header .header-nav,
  #header .header-nav a,
  #header .header-nav span,
  #header .header-nav .dropdown,
  #header .header-nav .user-info,
  #header .header-nav .blockcart {
    font-family: "Montserrat", Arial, sans-serif !important;
    color: #276b35 !important;
    font-weight: 600 !important;
  }
  #header .header-nav a:hover { color: #398e49 !important; }
}

@media (min-width: 992px) {
  #header .header-top .container > .row { align-items: center; }
  #header .header-top #_desktop_logo { width: 30%; flex: 0 0 30%; }
  #header .header-top .position-static {
    width: 70%; flex: 0 0 70%; display: flex;
    flex-wrap: wrap; align-items: center;
  }
  #header #search_widget { order: -1; width: 75%; max-width: 650px; margin: 0 0 15px 0; }
  #header #search_widget form { position: relative; }
  #header #search_widget form input {
    width: 100%; border-radius: 6px;
    padding: 14px 15px 14px 45px !important;
  }
  #header #search_widget form button[type="submit"] {
    position: absolute !important; top: 50% !important;
    left: 12px !important; right: auto !important;
    transform: translateY(-50%) !important; margin: 0 !important;
  }
  #index .featured-products .products {
    display: flex !important; flex-wrap: wrap !important;
    justify-content: center !important; gap: 20px;
  }
  #index .featured-products .products > article {
    margin-left: 0 !important; margin-right: 0 !important;
  }
}

/* 4. BANNERS DE CATEGORIAS: IDs 10, 11, 12, 13, 14, 15, 16, 17 */
/* :is() agrupa categorías sin aplicar estos cambios a otras páginas. */
body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) #js-product-list-header h1,
body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) .block-category h1,
body#category:is(.category-id-13, .category-id-14, .category-id-15, .category-id-16) .block-category .h1 {
  display: none !important;
}
body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) .block-category.card.card-block,
body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) .block-category-inner,
body#category:is(.category-id-13, .category-id-14, .category-id-15, .category-id-16) #js-product-list-header {
  padding: 0 !important; margin: 0 !important;
}
body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) #category-description,
body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) #category-description p {
  padding: 0 !important; margin: 0 !important;
}
body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) #category-description img {
  display: block !important; width: 100% !important;
  max-width: 100% !important; height: auto !important;
}
body#category:is(.category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16) #js-product-list {
  margin-top: 30px !important;
}
/* Reguladores: incluye las imágenes alternativas de portada del original. */
body#category.category-id-17 .page-header h1,
body#category.category-id-17 #main > h1 { display: none !important; }
body#category.category-id-17 .block-category {
  min-height: 0 !important; margin: 0 !important; padding: 0 !important;
  border: none !important; background: transparent !important;
}
body#category.category-id-17 .category-cover img,
body#category.category-id-17 .category-description img {
  display: block !important; width: 100% !important;
  max-width: 100% !important; height: auto !important; margin: 0 auto !important;
}
/* Bombas: mantener el contenedor sin altura mínima. */
body#category.category-id-15 .block-category { min-height: 0 !important; margin: 0 !important; padding: 0 !important; }
body#category.category-id-15 #category-description img { min-width: 0 !important; margin: 0 !important; }
body#category.category-id-17 #category-description img { margin: 0 auto !important; }
body#category.category-id-16 #category-description img { min-width: 0 !important; }

/* 5. TABLET: paneles solares conservan el tamaño especial original */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  body#category.category-id-10 #category-description img {
    width: 60% !important; max-width: 60% !important;
    height: auto !important; display: block !important; margin: 0 auto !important;
  }
}

/* 6. MOVIL */
@media screen and (max-width: 767px) {
  /* Ajuste de estructura especial de Paneles Solares (ID 10). */
  body#category.category-id-10 #wrapper .container { width: 100% !important; max-width: 100% !important; }
  body#category.category-id-10 #wrapper .container > .row {
    display: block !important; margin-left: 0 !important; margin-right: 0 !important;
  }
  body#category.category-id-10 #left-column,
  body#category.category-id-10 #content-wrapper {
    float: none !important; width: 100% !important; max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  /* Imágenes de categoría completas y ajustadas a pantalla. */
  body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) #category-description {
    width: 100% !important; max-width: 100% !important; overflow: hidden !important;
  }
  body#category:is(.category-id-10, .category-id-11, .category-id-12, .category-id-13, .category-id-14, .category-id-15, .category-id-16, .category-id-17) #category-description img {
    display: block !important; width: 100% !important; max-width: 100% !important;
    min-width: 0 !important; height: auto !important; margin: 0 auto !important;
  }
  body#category:is(.category-id-15, .category-id-17) #category-description img { object-fit: contain !important; }
  body#category:is(.category-id-15, .category-id-17) .block-category {
    width: 100% !important; max-width: 100% !important; overflow: hidden !important;
  }
  body#category.category-id-17 .category-description { padding: 0 !important; margin: 0 !important; }

  /* Menú móvil verde. */
  #mobile_top_menu_wrapper .top-menu a,
  #mobile_top_menu_wrapper .top-menu .dropdown-item {
    color: #12452B !important; font-weight: 700 !important;
    font-size: 16px !important; text-transform: uppercase !important;
    letter-spacing: 0.2px;
  }
  #mobile_top_menu_wrapper .top-menu > li {
    border-bottom: 1px solid #e5eae5; padding: 5px 0;
  }
  #mobile_top_menu_wrapper .top-menu a:hover,
  #mobile_top_menu_wrapper .top-menu a:focus { color: #65A30D !important; }

  /* Dos productos por fila en portada. */
  #index #products .products,
  #index .featured-products .products {
    display: flex !important; flex-wrap: wrap !important;
  }
  #index .featured-products .products .product-miniature {
    width: 50% !important; max-width: 50% !important;
    flex: 0 0 50% !important; padding: 0 5px !important; margin: 0 0 15px !important;
  }
  #index .featured-products .products .product-miniature img {
    max-width: 100% !important; height: auto !important;
  }
  #index .featured-products .products.row > .js-product {
    flex: 0 0 50% !important; width: 50% !important; max-width: 50% !important;
    padding-left: 5px !important; padding-right: 5px !important;
  }
  #index .featured-products .js-product .product-miniature { width: 100% !important; max-width: 100% !important; }
  #index .featured-products .js-product .thumbnail-container { width: 100% !important; }
  #index .featured-products .product-flags {
    position: absolute; top: 5px; left: 5px; z-index: 2;
  }
  #index .featured-products .product-flag {
    font-size: 10px !important; padding: 4px 6px !important; margin: 0 !important;
  }

  /* Dos productos por fila en listados de categorías. */
  #products .products,
  #js-product-list .products {
    display: flex !important; flex-wrap: wrap !important; gap: 12px 2% !important;
  }
  #products .products > .product,
  #js-product-list .products > .product,
  #js-product-list .products > .js-product {
    width: 49% !important; max-width: 49% !important;
    flex: 0 0 49% !important; margin: 0 !important; padding: 0 !important;
  }
  #js-product-list .product-thumbnail img { max-width: 100% !important; height: auto !important; }
  #js-product-list .product-title { font-size: 13px !important; line-height: 1.4 !important; }
  #js-product-list .product-price-and-shipping { font-size: 15px !important; font-weight: bold !important; }
}
/* SEPARACION ENTRE BANNER Y PRODUCTOS */
/* REGULADORES SOLARES - ID 17 */

body#category.category-id-17 #js-product-list {
    margin-top: 30px !important;
}
/* Ocultar el texto Desarrollado por PrestaShop */
#footer .footer-container .row .col-md-12 p.text-sm-center {
    display: none !important;
}
/* FotovoltaicaSolar: descripcion a ancho completo */
#product .tabs {
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

#product .tabs .nav-tabs,
#product .tabs .tab-content,
#product .tabs .tab-pane {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}
/* Seis columnas en categorías, solo en pantallas grandes */
@media (min-width: 1200px) {
  body#category #js-product-list .products > .product {
    flex: 0 0 16.666667% !important;
    max-width: 16.666667% !important;
  }
}
/* 7. CABECERA MOVIL: accesos sobre el logo, en dos filas. */
@media (max-width: 767px) {
  #header .header-nav { height: auto !important; max-height: none !important; }
  #header .header-nav .fv-mobile-tools {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    clear: both;
    width: 100%;
    padding: 6px 4px;
    border-bottom: 1px solid #e5eae5;
    color: #276b35;
    font-size: 12px;
  }
  #header .fv-mobile-preferences,
  #header .fv-mobile-account {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2px 12px;
    width: 100%;
  }
  #header .fv-mobile-preferences > div,
  #header .fv-mobile-account > div {
    float: none !important;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    margin: 0 !important;
  }
  #header .fv-mobile-tools #contact-link,
  #header .fv-mobile-tools .language-selector-wrapper,
  #header .fv-mobile-tools .language-selector,
  #header .fv-mobile-tools .currency-selector,
  #header .fv-mobile-tools .user-info,
  #header .fv-mobile-tools .blockcart,
  #header .fv-mobile-tools .blockcart .header {
    float: none !important;
    display: block;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent;
    line-height: 1.5;
    text-align: center;
  }
  /* Usar solo los selectores nativos de móvil. No mostrar sus menús de escritorio. */
  #header .fv-mobile-tools .language-selector > button,
  #header .fv-mobile-tools .currency-selector > button,
  #header .fv-mobile-tools .language-selector > .dropdown-menu,
  #header .fv-mobile-tools .currency-selector > .dropdown-menu,
  #header .fv-mobile-tools #language-selector-label,
  #header .fv-mobile-tools #currency-selector-label {
    display: none !important;
  }
  #header .fv-mobile-tools select.link {
    display: inline-block !important;
    width: auto;
    max-width: 100%;
    min-height: 32px;
    border: 0;
    background-color: transparent;
    color: #276b35;
    font-family: inherit;
    font-size: 12px;
    cursor: pointer;
  }
  /* Mostrar únicamente los textos de cuenta y carrito, no toda .hidden-sm-down. */
  #header .fv-mobile-tools .user-info > a > span.hidden-sm-down,
  #header .fv-mobile-tools .blockcart .header > span.hidden-sm-down,
  #header .fv-mobile-tools .blockcart .header > a > span.hidden-sm-down {
    display: inline !important;
  }
  #header .fv-mobile-tools a,
  #header .fv-mobile-tools .cart-products-count {
    color: #276b35;
    font-size: 12px !important;
    white-space: nowrap;
  }
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .user-info > a,
  #header .fv-mobile-tools .blockcart .header {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
  }
  #header .fv-mobile-tools .material-icons {
    font-size: 18px !important;
    vertical-align: middle;
  }
  #header .header-nav .fv-mobile-main {
    display: flex !important;
    align-items: center;
    width: 100%;
    min-height: 56px;
  }
  #header .fv-mobile-main #menu-icon {
    float: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    min-height: 44px;
    margin: 0;
  }
  #header .fv-mobile-main::after { content: ""; flex: 0 0 32px; }
  #header #_mobile_logo {
    float: none !important;
    flex: 0 1 180px;
    width: 180px !important;
    max-width: calc(100% - 64px) !important;
    margin: 0 auto !important;
    text-align: center;
    line-height: normal;
  }
  #header #_mobile_logo img {
    width: 180px !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
  }
}

/* ============================================================
   8. AJUSTES DE CABECERA - BOCETO OCTUBRE 2026
   Mantiene intactos productos, categorías y pie de página.
   Nota: el posicionamiento en una sola fila del buscador móvil
   puede requerir adaptar header.tpl según la estructura real.
   ============================================================ */
@media (min-width: 992px) {
  #header .header-top .container > .row > div:first-child {
    flex: 0 0 32% !important;
    max-width: 32% !important;
    width: 32% !important;
    margin-bottom: 0 !important;
  }
  #header .header-top #_desktop_logo {
    flex: 0 0 32% !important;
    max-width: 32% !important;
    width: 32% !important;
  }
  #header .header-top .position-static {
    flex: 0 0 68% !important;
    max-width: 68% !important;
    width: 68% !important;
  }
  #header #search_widget {
    width: min(100%, 650px) !important;
    max-width: 650px !important;
    margin-left: 20px !important;
    margin-right: 0 !important;
    margin-bottom: 12px !important;
  }
  #header .header-nav .container { max-width: 1200px; }
}
@media (max-width: 767px) {
  /* Acercar menú y logo al borde izquierdo, manteniendo accesibilidad. */
  #header .fv-mobile-main {
    justify-content: flex-start !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    gap: 10px !important;
  }
  #header .fv-mobile-main #menu-icon {
    flex: 0 0 32px !important;
    margin-left: 0 !important;
  }
  #header .fv-mobile-main::after { display: none !important; }
  #header #_mobile_logo {
    margin: 0 !important;
    flex: 0 1 160px !important;
    width: 160px !important;
    max-width: 160px !important;
    text-align: left !important;
  }
  #header #_mobile_logo img { width: 160px !important; }
  /* Alineación de enlaces superiores; evita desbordes en iPhone. */
  #header .fv-mobile-preferences,
  #header .fv-mobile-account {
    justify-content: center !important;
    padding-left: 0 !important;
    padding-right: 12px !important;
  }
  /* Buscador más próximo al logo si comparte el contenedor móvil.
     Si está fuera, seguirá en su fila: no se reubica con CSS solo. */
  #header .fv-mobile-main #search_widget {
    flex: 1 1 110px !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 0 0 12px !important;
  }
  #header .fv-mobile-main #search_widget input {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* 9. Cabecera final móvil: menú + logo + buscador en una fila. */
@media (max-width: 767px) {
  #header .header-nav .fv-mobile-main {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 4px 4px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  #header .fv-mobile-main #menu-icon { flex: 0 0 30px !important; }
  #header .fv-mobile-main #_mobile_logo {
    flex: 0 0 118px !important;
    width: 118px !important;
    max-width: 118px !important;
    margin: 0 !important;
  }
  #header .fv-mobile-main #_mobile_logo img {
    width: 118px !important;
    max-width: 100% !important;
    height: auto !important;
  }
  #header .fv-mobile-search {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    margin-left: 8px !important;
  }
  #header .fv-mobile-search #search_widget {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    float: none !important;
  }
  #header .fv-mobile-search #search_widget form { width: 100% !important; position: relative; }
  #header .fv-mobile-search #search_widget input {
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    padding: 8px 30px 8px 9px !important;
    font-size: 12px !important;
    box-sizing: border-box !important;
  }
  #header .fv-mobile-search #search_widget button[type="submit"] {
    position: absolute !important;
    right: 4px !important;
    left: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
  }
  #header .fv-mobile-preferences,
  #header .fv-mobile-account { justify-content: flex-start !important; padding-left: 5px !important; }
}
@media (max-width: 360px) {
  #header .fv-mobile-main #_mobile_logo { flex-basis: 98px !important; width: 98px !important; max-width: 98px !important; }
  #header .fv-mobile-main #_mobile_logo img { width: 98px !important; }
  #header .fv-mobile-search { margin-left: 2px !important; }
}

/* 10. Ajuste final FotovoltaicaSolar: cabecera móvil compacta y legible (28-10-2026).
   Conserva el resto de estilos existentes. */
@media (max-width: 767px) {
  #header .header-nav { margin-bottom: 0 !important; padding-bottom: 0 !important; }
  #header .header-nav .container, #header .header-nav .row { margin-bottom: 0 !important; }
  #header .fv-mobile-tools { padding: 5px 6px 4px !important; }
  #header .fv-mobile-preferences, #header .fv-mobile-account {
    justify-content: flex-start !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    gap: 1px 11px !important;
  }
  #header .fv-mobile-tools a, #header .fv-mobile-tools select.link,
  #header .fv-mobile-tools .cart-products-count { font-size: 12px !important; }
  #header .header-nav .fv-mobile-main {
    min-height: 60px !important;
    padding: 5px 6px !important;
    gap: 8px !important;
  }
  #header .fv-mobile-main #menu-icon { flex: 0 0 30px !important; }
  #header .fv-mobile-main #_mobile_logo {
    flex: 0 0 138px !important;
    width: 138px !important;
    max-width: 138px !important;
  }
  #header .fv-mobile-main #_mobile_logo img { width: 138px !important; }
  #header .fv-mobile-search { flex: 1 1 0 !important; min-width: 0 !important; margin-left: 2px !important; }
  #header .fv-mobile-search #search_widget form { position: relative !important; }
  #header .fv-mobile-search #search_widget input {
    height: 42px !important;
    font-size: 13px !important;
    padding: 9px 8px 9px 32px !important;
    border-radius: 6px !important;
    text-overflow: ellipsis;
  }
  #header .fv-mobile-search #search_widget button[type="submit"] {
    left: 5px !important; right: auto !important;
    top: 50% !important; transform: translateY(-50%) !important;
    width: 26px !important; height: 32px !important;
  }
  #header .fv-mobile-search #search_widget button .material-icons { font-size: 19px !important; }
  /* No ocultar el contenedor del menú desplegable: solo eliminar su hueco cerrado. */
  #header .header-top { padding: 0 !important; margin: 0 !important; min-height: 0 !important; }
  #header .header-top > .container > .row { margin: 0 !important; min-height: 0 !important; }
  #header #mobile_top_menu_wrapper[style*="display:none"],
  #header #mobile_top_menu_wrapper[style*="display: none"] { margin: 0 !important; padding: 0 !important; }
  #header .header-top + * { margin-top: 0; }
}
@media (max-width: 390px) {
  #header .fv-mobile-main #_mobile_logo { flex-basis: 112px !important; width: 112px !important; max-width: 112px !important; }
  #header .fv-mobile-main #_mobile_logo img { width: 112px !important; }
  #header .header-nav .fv-mobile-main { gap: 5px !important; }
  #header .fv-mobile-search #search_widget input { font-size: 12px !important; }
}

/* 11. Retoques finales aprobados: logo, buscador y enlaces superiores.
   Solo móvil; no modifica banners, productos ni escritorio. */
@media (max-width: 767px) {
  #header .fv-mobile-preferences,
  #header .fv-mobile-account {
    padding-left: 14px !important;
    padding-right: 2px !important;
    gap: 2px 12px !important;
  }
  #header .fv-mobile-main #_mobile_logo {
    flex: 0 0 148px !important;
    width: 148px !important;
    max-width: 148px !important;
  }
  #header .fv-mobile-main #_mobile_logo img { width: 148px !important; }
  #header .fv-mobile-search #search_widget input { font-size: 14px !important; }
}
@media (max-width: 390px) {
  #header .fv-mobile-main #_mobile_logo {
    flex-basis: 122px !important;
    width: 122px !important;
    max-width: 122px !important;
  }
  #header .fv-mobile-main #_mobile_logo img { width: 122px !important; }
  #header .fv-mobile-search #search_widget input { font-size: 13px !important; }
}
@media (max-width: 360px) {
  #header .fv-mobile-main #_mobile_logo {
    flex-basis: 106px !important;
    width: 106px !important;
    max-width: 106px !important;
  }
  #header .fv-mobile-main #_mobile_logo img { width: 106px !important; }
}

/* 12. Cuenta y carrito a la derecha de la franja superior en móvil. */
@media (max-width: 767px) {
  #header .header-nav .fv-mobile-tools .fv-mobile-account {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    width: 100% !important;
    padding-left: 4px !important;
    padding-right: 14px !important;
    gap: 4px 14px !important;
    text-align: right !important;
  }
  #header .fv-mobile-account > div { flex: 0 0 auto !important; }
}

/* 13. CABECERA APROBADA: preferencias y cuenta en UNA sola fila.
   La cuenta puede mostrar nombres largos: se recorta visualmente el nombre,
   nunca se oculta el acceso ni se empuja el carrito fuera de la pantalla. */
@media (max-width: 767px) {
  #header .header-nav .fv-mobile-tools {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 7px 10px !important;
  }
  #header .header-nav .fv-mobile-tools .fv-mobile-preferences,
  #header .header-nav .fv-mobile-tools .fv-mobile-account {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 6px !important;
  }
  #header .header-nav .fv-mobile-tools .fv-mobile-preferences {
    flex: 0 1 auto !important;
    justify-content: flex-start !important;
  }
  #header .header-nav .fv-mobile-tools .fv-mobile-account {
    flex: 0 1 auto !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    gap: 8px !important;
    text-align: right !important;
  }
  #header .fv-mobile-tools .fv-mobile-preferences > div,
  #header .fv-mobile-tools .fv-mobile-account > div {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }
  #header .fv-mobile-tools .user-info,
  #header .fv-mobile-tools .user-info > a {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  #header .fv-mobile-tools .user-info > a > span,
  #header .fv-mobile-tools .user-info > a > span.hidden-sm-down {
    display: inline-block !important;
    max-width: clamp(42px, 13vw, 110px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
  }
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count {
    font-size: 10px !important;
    white-space: nowrap !important;
  }
  #header .fv-mobile-tools .material-icons { font-size: 15px !important; }
}
@media (max-width: 390px) {
  #header .header-nav .fv-mobile-tools { gap: 5px !important; padding-left: 5px !important; padding-right: 5px !important; }
  #header .header-nav .fv-mobile-tools .fv-mobile-preferences,
  #header .header-nav .fv-mobile-tools .fv-mobile-account { gap: 3px !important; }
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count { font-size: 9px !important; }
  #header .fv-mobile-tools .user-info > a > span,
  #header .fv-mobile-tools .user-info > a > span.hidden-sm-down { max-width: 48px !important; }
}

/* 14. Ajuste fino 28/10: legibilidad superior y logo móvil.
   Mantiene los cinco accesos en una fila; el nombre se trunca cuando no cabe. */
@media (max-width: 767px) {
  #header .header-nav .fv-mobile-tools {
    gap: 7px !important;
    padding: 8px 8px !important;
  }
  #header .header-nav .fv-mobile-tools .fv-mobile-preferences,
  #header .header-nav .fv-mobile-tools .fv-mobile-account { gap: 5px !important; }
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count { font-size: 11px !important; }
  #header .fv-mobile-tools .material-icons { font-size: 16px !important; }
  #header .fv-mobile-tools .user-info > a > span,
  #header .fv-mobile-tools .user-info > a > span.hidden-sm-down {
    max-width: clamp(34px, 12vw, 85px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  #header .fv-mobile-main #_mobile_logo {
    flex: 0 0 158px !important;
    width: 158px !important;
    max-width: 158px !important;
  }
  #header .fv-mobile-main #_mobile_logo img { width: 158px !important; }
}
@media (max-width: 390px) {
  #header .header-nav .fv-mobile-tools { gap: 4px !important; padding: 7px 5px !important; }
  #header .header-nav .fv-mobile-tools .fv-mobile-preferences,
  #header .header-nav .fv-mobile-tools .fv-mobile-account { gap: 3px !important; }
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count { font-size: 9.5px !important; }
  #header .fv-mobile-main #_mobile_logo {
    flex-basis: 130px !important;
    width: 130px !important;
    max-width: 130px !important;
  }
  #header .fv-mobile-main #_mobile_logo img { width: 130px !important; }
  #header .fv-mobile-tools .user-info > a > span,
  #header .fv-mobile-tools .user-info > a > span.hidden-sm-down { max-width: 42px !important; }
}
@media (max-width: 360px) {
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count { font-size: 9px !important; }
  #header .fv-mobile-main #_mobile_logo { flex-basis: 112px !important; width: 112px !important; max-width: 112px !important; }
  #header .fv-mobile-main #_mobile_logo img { width: 112px !important; }
}

/* 15. Legibilidad reforzada: textos un poco mayores y en negrita.
   Se conserva la distribución de una sola fila y el truncamiento del usuario. */
@media (max-width: 767px) {
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count {
    font-size: 11.5px !important;
    font-weight: 700 !important;
  }
  #header .fv-mobile-tools .material-icons { font-size: 16px !important; }
  #header .fv-mobile-main #_mobile_logo { flex-basis: 164px !important; width: 164px !important; max-width: 164px !important; }
  #header .fv-mobile-main #_mobile_logo img { width: 164px !important; }
}
@media (max-width: 390px) {
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count { font-size: 10.5px !important; font-weight: 700 !important; }
  #header .fv-mobile-main #_mobile_logo { flex-basis: 138px !important; width: 138px !important; max-width: 138px !important; }
  #header .fv-mobile-main #_mobile_logo img { width: 138px !important; }
}
@media (max-width: 360px) {
  #header .fv-mobile-tools #contact-link > a,
  #header .fv-mobile-tools .fv-mobile-preferences select.link,
  #header .fv-mobile-tools .fv-mobile-account a,
  #header .fv-mobile-tools .cart-products-count { font-size: 9.5px !important; }
  #header .fv-mobile-main #_mobile_logo { flex-basis: 116px !important; width: 116px !important; max-width: 116px !important; }
  #header .fv-mobile-main #_mobile_logo img { width: 116px !important; }
}

/* 16. Separar el nombre de usuario del carrito en móvil.
   Desplazamiento visual moderado sin alterar las otras secciones. */
@media (max-width: 767px) {
  #header .header-nav .fv-mobile-tools .fv-mobile-account {
    gap: 13px !important;
    transform: translateX(-9px);
  }
  #header .fv-mobile-tools .fv-mobile-account .blockcart {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }
  #header .fv-mobile-tools .fv-mobile-account .user-info {
    min-width: 0 !important;
  }
}
@media (max-width: 390px) {
  #header .header-nav .fv-mobile-tools .fv-mobile-account {
    gap: 9px !important;
    transform: translateX(-5px);
  }
}

/* 17. Alinear la barra superior con los extremos del contenido en móvil.
   Contacto comienza junto al breadcrumb; carrito termina en el margen derecho.
   No altera la cabecera de escritorio ni el catálogo. */
@media (max-width: 767px) {
  #header .header-nav > .container {
    width: 100% !important;
    max-width: none !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    box-sizing: border-box !important;
  }
  #header .header-nav > .container > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }
  #header .header-nav .fv-mobile-tools {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-content: space-between !important;
  }
  #header .header-nav .fv-mobile-tools .fv-mobile-preferences {
    margin-left: 0 !important;
  }
  #header .header-nav .fv-mobile-tools .fv-mobile-account {
    margin-left: auto !important;
    margin-right: 0 !important;
    transform: none !important;
  }
}
/* FotovoltaicaSolar - Recuadros de subcategorías */

#subcategories a,
#subcategories a:focus,
#subcategories a:active,
#subcategories a:hover,
#subcategories .subcategory-image,
#subcategories .subcategory-image a,
#subcategories .subcategory-image img {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Quitar el marco al pulsar con el dedo */
#subcategories a:focus:not(:focus-visible),
#subcategories a:active {
    outline: none !important;
    -webkit-tap-highlight-color: transparent;
}

/* Mantener el foco visible para teclado */
#subcategories a:focus-visible {
    outline: 2px solid #276b35 !important;
    outline-offset: 2px;
}