.header-top .icon-square {
      padding: 7px !important;
    }

    .nav-icons svg {
      fill: #333;
      max-width: 24px;
    }

    /* Móvil: los SVG de contacto/usuario no traen width/height y salían
       pequeños. Se fuerzan dimensiones explícitas y homogéneas.
       (Va en header.tpl porque su hook_extra sí se emite; el de
       header-mobile.tpl queda descartado por colisión de block name.) */
    @media (max-width: 991px) {
      .header-top .nav-icons .icon-square {
        padding: 2px !important;
      }
      .header-top .nav-icons svg {
        width: 26px !important;
        height: 26px !important;
        max-width: none !important;
      }
    }

    .nav-icons div:hover > svg {
      fill: #ffdd00 !important;
    }
    #account-button-logged > a > svg {
      fill: #ffdd00 !important;
    }
    .user-dropdown-menu li::before {
      content: '' !important;
      display: none !important;
    }
    .user-dropdown-menu li svg {
      fill: #333;
      margin-right: 4px;
      max-width: 1.2rem !important;
    }
     .user-dropdown-menu li:hover > svg {
      fill: #ffdd00 !important;
    }
    svg.hasfavs {
      display:none;
      fill:red !important;
    }
    .user-dropdown-menu li.fav > svg.nofavs {
      display: none !important;
    }
    .user-dropdown-menu li.fav > svg.hasfavs {
      display: inline-block !important;
    }
    #search_input {
      position:absolute;
      inset: 0;
      z-index:2;
      border:none;
      background:white;
      + svg {
        z-index:3;

      }
    }

    /* ============================================================
       Modernización cabecera 2026 — compacta + glassmorphism.
       Solo CSS; no se cambian ids/clases (menús/modales intactos).
       #header ya es sticky (top:0; z-index:99) en el tema.
       ============================================================ */
    #header .header-top {
      padding: 8px 15px !important;                 /* compacto: 8px block / 15px inline (gana a la regla del tema) */
      background: rgba(255, 255, 255, 0.72) !important;
      -webkit-backdrop-filter: blur(16px) saturate(150%);
      backdrop-filter: blur(16px) saturate(150%);
      border-bottom: 1px solid rgba(16, 18, 21, 0.06);
      box-shadow: 0 6px 22px -14px rgba(16, 18, 21, 0.45);
    }

    /* Logo compacto (160-180px) — solo desktop, no toca la versión móvil */
    @media (min-width: 992px) {
      #header #_desktop_logo {
        width: 170px !important;
        flex: 0 0 170px !important;      /* el logo es flex item con flex-basis:200px; hay que forzarlo aquí */
        max-width: 170px !important;
      }
      #header #_desktop_logo .imglogo {
        width: 100% !important;
        height: auto !important;
        display: block;
      }
    }

    /* Botones de navegación más limpios y modernos */
    .nav-icons .icon-square {
      border: 1px solid rgba(16, 18, 21, 0.12) !important;
      border-radius: 10px;
      transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
    }
    .nav-icons .icon-square:hover {
      border-color: rgba(16, 18, 21, 0.28) !important;
      background-color: rgba(16, 18, 21, 0.035);
    }

    /* Contador del carrito: badge con color de marca */
    #cart-on .products_in_cart {
      background: #ffdd00 !important;
      color: #101215 !important;
      font-weight: 700;
      box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9);
    }