/* =====================================================================
   Cabecera nueva (propuesta «A3+»), 08/10/2026
   Plantillas: templates/_partials/header.tpl, modules/ps_customersignin,
   modules/ps_shoppingcart y modules/ps_searchbar (en el tema).
   Se carga desde head.tpl con ?v=N: subir N en cada cambio (Cloudflare).
   ===================================================================== */

@keyframes lcdcBorde {
	0%, 12%, 35%, 55%, 100% { border-color: #ff8c00; color: #ff8c00; }
	20%, 50%, 90% { border-color: #20b2aa; color: #20b2aa; }
}
@keyframes lcdcColor {
	0%, 12%, 35%, 55%, 100% { color: #ff8c00; }
	20%, 50%, 90% { color: #20b2aa; }
}
@keyframes lcdcFondo {
	0%, 12%, 35%, 55%, 100% { background-color: #ff8c00; }
	20%, 50%, 90% { background-color: #20b2aa; }
}

/* ---------- Buscador (también se usa en la página 404) ---------- */
.lcdc-search#search_widget { float: none; margin: 0; min-width: 0; overflow: visible; }
.lcdc-search#search_widget form { display: flex; align-items: stretch; height: 44px; border: 2px solid #ff8c00; border-radius: 999px; overflow: hidden; background: #fff; }
.lcdc-search#search_widget form input[type=text] { flex: 1; min-width: 0; width: auto; height: auto; border: 0; border-radius: 0; background: #fff; padding: 0 12px 0 18px; font-size: 14.5px; color: #232323; }
.lcdc-search#search_widget form i.clear { position: static; align-self: center; padding: 0 6px; color: #999; cursor: pointer; }
.lcdc-search .lcdc-search-btn { flex: none; width: auto; display: flex; align-items: center; gap: 6px; border: 0; margin: 0; padding: 0 18px; background: #ff8c00; color: #fff; font-family: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.lcdc-search .lcdc-search-btn:hover { background: #f07f00; }
.lcdc-search .lcdc-search-btn svg { width: 20px; height: 20px; fill: #fff; }

/* ---------- Enlaces de cuenta / contacto (comunes) ---------- */
.lcdc-user svg { width: 16px; height: 16px; fill: #ff8c00; flex: none; }
.lcdc-user .lcdc-u-wa svg { fill: #25d366; }
.lcdc-user .lcdc-u-out svg { fill: #bbb; }

/* ---------- Cuadro de asesoramiento ---------- */
#header .lcdc-adv { position: relative; margin-top: 8px; padding: 14px 14px 7px; border: 2px solid #ff8c00; border-radius: 10px; text-align: center; color: #ff8c00; animation: lcdcBorde 17s ease infinite; }
#header .lcdc-adv-lbl { position: absolute; top: 0; left: 50%; transform: translate(-50%, -55%); display: flex; align-items: center; gap: 6px; padding: 0 10px; background: #fff; color: inherit; font-size: 13.5px; font-weight: 700; letter-spacing: .04em; line-height: 1.2; white-space: nowrap; }
#header .lcdc-adv-lbl svg { width: 17px; height: 17px; fill: currentColor; }
#header .lcdc-adv p { margin: 0; font-size: 13px; line-height: 1.4; color: #444; }
#header a.lcdc-adv-tel { display: inline-flex; align-items: center; gap: 7px; margin-top: 3px; font-size: 20px; line-height: 24px; font-weight: 700; color: #232323; white-space: nowrap; }
#header a.lcdc-adv-tel > span { color: #ff8c00; animation: lcdcColor 17s ease infinite; }
#header a.lcdc-adv-tel:hover > span { filter: brightness(.9); }
#header .lcdc-adv-tel i { width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #ff8c00; animation: lcdcFondo 17s ease infinite; }
#header .lcdc-adv-tel i svg { width: 12px; height: 12px; fill: #fff; }
#header .lcdc-adv-tel small { font-size: 13px; font-weight: 500; color: #7a7a7a; }

/* ---------- Carrito (comunes) ---------- */
#header a.lcdc-cart { display: flex; align-items: center; gap: 10px; color: #232323; }
#header .lcdc-cart-ico { position: relative; width: 46px; height: 46px; border-radius: 50%; background: #20b2aa; display: flex; align-items: center; justify-content: center; }
#header .lcdc-cart-ico svg { width: 24px; height: 24px; fill: #fff; }
#header .lcdc-cart .cart-products-count { position: absolute; top: -5px; right: -7px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #ff8c00; color: #fff; font-size: 11px; font-weight: 600; line-height: 18px; text-align: center; }
#header .lcdc-cart-txt b { display: block; font-size: 14px; line-height: 1.2; font-weight: 600; }
#header .lcdc-cart-txt small { display: block; font-size: 12.5px; color: #7a7a7a; white-space: nowrap; }

/* =====================================================================
   ESCRITORIO (768 px o más)
   ===================================================================== */
@media (min-width: 768px) {
	/* Barra oscura fija */
	#header .header-nav.lcdc-tb { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 34px; max-height: none; margin: 0; z-index: 1001; background: #232323; color: #d6d6d6; }
	#header .header-top { padding-top: 34px; }
	#header .lcdc-tb-in { display: flex; justify-content: space-between; align-items: center; height: 34px; font-size: 13px; }
	#header .lcdc-tb-left { display: flex; align-items: center; gap: 6px; }
	#header .lcdc-tb-left svg { width: 16px; height: 16px; fill: #ff8c00; }
	#header .lcdc-tb-right { display: flex; align-items: center; height: 34px; }

	/* Anula el estilo de los antiguos botones naranjas */
	#header div#_desktop_user_info,
	#header #_desktop_user_info a { background: none; border-radius: 0; box-shadow: none; }
	#header #_desktop_user_info .lcdc-user { display: flex; align-items: center; gap: 22px; white-space: nowrap; }
	#header #_desktop_user_info .lcdc-user a { display: flex; align-items: center; gap: 6px; padding: 0; font-size: 13px; line-height: 34px; color: #d6d6d6 !important; }
	#header #_desktop_user_info .lcdc-user a:hover { color: #fff !important; }
	#header #_desktop_user_info .lcdc-user a:hover svg { fill: #fff; }
	#header #_desktop_user_info .lcdc-user .lcdc-u-wa:hover svg { fill: #25d366; }
	#header #_desktop_user_info .lcdc-user a.lcdc-u-tel,
	#header #_desktop_user_info .lcdc-user .lcdc-u-solo-movil { display: none !important; }
	#header #_desktop_user_info .lcdc-user a.lcdc-u-out { margin-left: -12px; padding-left: 10px; border-left: 1px solid #555; line-height: 16px; }

	/* Fila principal: logo | buscador | asesoramiento | carrito */
	#header .lcdc-hd { display: grid; grid-template-columns: minmax(220px, 330px) minmax(240px, 400px) minmax(280px, 340px) auto; grid-template-areas: "logo search adv cart"; justify-content: space-between; align-items: center; gap: 24px; padding: 14px 0 4px; }
	#header .lcdc-hd-logo { grid-area: logo; min-width: 0; }
	#header .lcdc-hd-search { grid-area: search; min-width: 0; }
	#header .lcdc-hd-adv { grid-area: adv; min-width: 0; }
	#header .lcdc-hd-cart { grid-area: cart; min-width: 46px; }
	#header .lcdc-hd-logo img { display: block; width: 100%; max-width: 330px; height: auto; }
	#header .lcdc-hd-lema { margin: -4px 0 0 64px; font-size: 13px; color: #666; white-space: nowrap; }

	/* Carrito dentro de la barra oscura al bajar por la página */
	#header .lcdc-tb-cart { display: none; height: 34px; margin-left: 18px; }
	.lcdc-cart-en-barra #header .lcdc-tb-cart { display: block; }
	#header .lcdc-tb-cart .cart-preview.active, #header .lcdc-tb-cart .cart-preview.inactive { width: auto; height: 34px; padding: 0; background: none; }
	#header .lcdc-tb-cart a.lcdc-cart { height: 34px; padding: 0 14px; gap: 8px; background: #20b2aa; color: #fff; }
	#header .lcdc-tb-cart .lcdc-cart-ico { width: auto; height: auto; background: none; border-radius: 0; gap: 6px; }
	#header .lcdc-tb-cart .lcdc-cart-ico svg { width: 20px; height: 20px; }
	#header .lcdc-tb-cart .lcdc-cart .cart-products-count { position: static; min-width: 0; height: auto; padding: 0; background: none; font-size: 14px; line-height: 34px; }
	#header .lcdc-tb-cart .lcdc-cart-txt { display: none; }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
	#header .lcdc-hd { grid-template-columns: minmax(190px, 270px) minmax(200px, 1fr) minmax(270px, 310px) auto; gap: 16px; }
	#header .lcdc-hd-lema { margin-left: 50px; font-size: 12px; }
	#header .lcdc-hd .lcdc-cart-txt { display: none; }
	#header .lcdc-search .lcdc-search-btn span { display: none; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
	#header .lcdc-hd { grid-template-columns: minmax(180px, 1fr) minmax(270px, 310px) auto; grid-template-areas: "logo adv cart" "search search search"; row-gap: 10px; }
	#header .lcdc-tb-left span { font-size: 12px; }
	#header #_desktop_user_info .lcdc-user { gap: 14px; }
}

/* =====================================================================
   MÓVIL (menos de 768 px): se mantiene la barra fija inferior
   ===================================================================== */
@media (max-width: 767.98px) {
	#header .lcdc-hd { display: block; padding: 0 10px; }
	#header .lcdc-hd-adv { margin: 16px 0 8px; }
	#header .lcdc-adv { padding: 13px 10px 6px; }
	#header .lcdc-adv-lbl { font-size: 12px; }
	#header .lcdc-adv p { font-size: 12px; }
	#header a.lcdc-adv-tel { font-size: 19px; }

	#header .fixed-menu { display: flex; align-items: center; justify-content: space-between; padding: 0 4px; border-top: 1px solid #eee; box-shadow: 0 -2px 8px rgba(0, 0, 0, .08); }
	#header .fixed-menu > div { float: none !important; height: auto; }
	#header .fixed-menu #menu-icon { order: 1; display: flex; flex-direction: column; align-items: center; margin: 0; padding: 0 6px; font-size: 10.5px; line-height: 1.1; color: #444; }
	#header .fixed-menu #menu-icon .material-icons { font-size: 24px; }
	#header .fixed-menu #_mobile_user_info { order: 2; flex: 1; }
	#header .fixed-menu #_mobile_cart { order: 3; padding-right: 4px; }

	#_mobile_user_info .lcdc-user { display: flex; justify-content: space-around; align-items: center; }
	#header #_mobile_user_info .lcdc-user a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 3px 4px; background: none; font-size: 10.5px; line-height: 1.1; color: #444; white-space: nowrap; }
	#_mobile_user_info .lcdc-user svg { width: 22px; height: 22px; }
	#_mobile_user_info .lcdc-user .lcdc-u-out svg { fill: #999; }
	#_mobile_user_info .lcdc-u-acc span { max-width: 64px; overflow: hidden; text-overflow: ellipsis; }

	#header #_mobile_cart .lcdc-cart-ico { width: 38px; height: 38px; }
	#header #_mobile_cart .lcdc-cart-ico svg { width: 21px; height: 21px; }
	#header #_mobile_cart .lcdc-cart-txt { display: none; }
}