/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */

/* === Desplegable de Ingeniería: compacto, 4 columnas x 3 filas (alineado con el de Antivirus) === */
#cbp-hrmenu-tab-14 .cbp-hrsub .cbp-hrsub-inner { padding: 1.1rem 1.1rem 1rem !important; }
#cbp-hrmenu-tab-14 .cbp-categories-row > [class*="col-"] { flex: 0 0 25%; max-width: 25%; padding-left: 8px; padding-right: 8px; }
#cbp-hrmenu-tab-14 .cbp-category-title.cbp-column-title {
  display: block; box-sizing: content-box; font-size: .68rem; line-height: 1.2; letter-spacing: 0; min-height: 2.4em;
  padding-bottom: .35rem; margin-bottom: .5rem; overflow-wrap: normal; word-break: normal; hyphens: none;
}
#cbp-hrmenu-tab-14 .cbp-category-thumb { display: block; }
#cbp-hrmenu-tab-14 .cbp-category-thumb img { width: 72px; height: 72px; object-fit: cover; border-radius: 6px; }
/* === fin Ingeniería === */

/* === titulos-unificados 2026-10-06 INICIO === */
/* Titulo unico para Compralo con (absfrequentlyboughttogether) y PACKS EN OFERTA (productbundlespro): 18px (15px <=575px, 13px <=359px), 700, interletraje 0, MAYUSCULAS, barra 40px, aire 24px. */
/* 1) Titulo (misma barra en los dos bloques) */
html body #abs_usually_bought_together:not(.abs-small-fqb-container):not(.for-abs-fqb-on-modal) #form-abs-freq-bought-together h3.abs_usually_bought_together,
html body .product-footer.pbp-widget > .title {
  box-sizing: border-box;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: #fff !important;
  background-color: #2563eb !important;
  padding: 10px 0 !important;
  margin: 0 !important;
  border-radius: 16px 16px 0 0 !important;
}
@media (max-width: 575.98px) {
  html body #abs_usually_bought_together:not(.abs-small-fqb-container):not(.for-abs-fqb-on-modal) #form-abs-freq-bought-together h3.abs_usually_bought_together,
  html body .product-footer.pbp-widget > .title { font-size: 15px !important; }
}

/* 2) Espacio alrededor del bloque: mismo aire arriba y abajo (el que antes ponia el titulo de Compralo con en su margin-top) */
html body #abs_usually_bought_together:not(.abs-small-fqb-container):not(.for-abs-fqb-on-modal) { padding: 0 !important; margin-top: 24px !important; }
html body #abs_usually_bought_together:not(.abs-small-fqb-container):not(.for-abs-fqb-on-modal) .block_abs_usually_bought { margin-bottom: 24px !important; }
html body .product-footer.pbp-widget { margin-top: 24px !important; margin-bottom: 24px !important; }

/* 3) Espacio del titulo al contenido: 24 px hasta la primera imagen en los dos */
html body #abs_usually_bought_together:not(.abs-small-fqb-container):not(.for-abs-fqb-on-modal) .block_abs_usually_bought { padding-top: 24px !important; }
html body .product-footer.pbp-widget .tab-content-wrapper .bundle-inner { padding-top: 13px !important; }
@media (max-width: 359.98px) { /* moviles muy estrechos (320 px): COMPRADOS JUNTOS HABITUALMENTE no cabe a 15 px */
  html body #abs_usually_bought_together:not(.abs-small-fqb-container):not(.for-abs-fqb-on-modal) #form-abs-freq-bought-together h3.abs_usually_bought_together,
  html body .product-footer.pbp-widget > .title { font-size: 13px !important; }
}
/* === FIN === */

/* === ocultar-bloque-categorias 2026-10-06 INICIO === */
#left-column .block.block-categories { display: none !important; }
/* === FIN === */

/* === geo-popup-contraste 2026-10-07 INICIO === */
/* ets_geolocation: boton «¡Si, por favor haz eso!» legible. Texto blanco sobre el azul de la marca (contraste 5,17:1; antes #444 sobre #2fb5d2 = 4,0:1). Solo cambia colores. */
html body .ets_geo_popup .ets_geo_popup_group_button a.yes_ok {
  background-color: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}
html body .ets_geo_popup .ets_geo_popup_group_button a.yes_ok:hover,
html body .ets_geo_popup .ets_geo_popup_group_button a.yes_ok:focus {
  background-color: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
  color: #ffffff !important;
}
/* === FIN === */

/* === descuento-ficha 2026-10-08 INICIO === */
/* Ficha de producto con descuento: precio actual, precio tachado e insignia en UNA fila (flex, centrada, gap .6rem, con salto de linea). El precio sigue oscuro (sin rojo); el tachado en #4B5563 (7,56:1 sobre blanco); la insignia es blanco sobre #B91C1C (6,47:1, AA). Especificidad baja a proposito: los estilos de ficha de EstilosCMC (body.pp-*) que definan su propia fila o paleta (por ejemplo los oscuros p43, p50, p53) siguen mandando. */
html body .product-prices .has-discount > div { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
html body .product-prices .product-discount { margin-left: 0; align-items: center; }
html body .product-prices .product-discount .regular-price { color: #4B5563; padding: 0; }
html body .product-prices .badge-discount { margin-left: 0; vertical-align: middle; background: #B91C1C; color: #FFFFFF; border-color: transparent; font-size: 13px; font-weight: 700; line-height: 1.3; }
/* Barra fija "Comprar" del movil: precio tachado mas oscuro (sin rojo). */
html body .tl-sticky-atc__was { color: #4B5563; }
/* === FIN === */
/* T 2026-10-10 a11y/CLS: logo movil respeta la proporcion (la regla de iqitthemeeditor fija width:110px) */
html body #mobile-header-sticky .col-mobile-logo>a>img.logo{height:42px;width:auto;max-width:100%}
/* T2 2026-10-10 a11y: carruseles sin inicializar (home). Las diapositivas fuera de la 1.a fila miden 0 de alto pero su enlace desborda sobre
   el titulo de la seccion siguiente y axe lo cuenta como "Ver todo" tapado (target-size). Ocultas a AT/foco hasta que Swiper arranca. */
@media (max-width:767.98px){.tl-section .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper>.swiper-slide:nth-child(n+3){visibility:hidden}}
@media (min-width:768px) and (max-width:991.98px){.tl-section .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper>.swiper-slide:nth-child(n+4){visibility:hidden}}
@media (min-width:992px) and (max-width:1199.98px){.tl-section .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper>.swiper-slide:nth-child(n+5){visibility:hidden}}
@media (min-width:1200px){.tl-section .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper>.swiper-slide:nth-child(n+6){visibility:hidden}}
/* T2 2026-10-10 a11y: objetivos tactiles >= 24px (WCAG 2.5.8) sin cambiar el tamano visual: flechas producto anterior/siguiente y puntos de Splide */
#wrapper .breadcrumb #iqitproductsnav a{display:inline-block;min-width:24px;min-height:24px;text-align:center;vertical-align:top;margin-top:-1px;margin-bottom:-1px}
.pbp-widget .splide__pagination{bottom:0}
.pbp-widget .splide__pagination .splide__pagination__page{position:relative;width:24px;height:24px;margin:0;background:transparent !important;opacity:1;transform:none}
.pbp-widget .splide__pagination .splide__pagination__page::before{content:"";position:absolute;top:50%;left:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#ccc;opacity:.7;transition:transform .2s linear}
.pbp-widget .splide__pagination .splide__pagination__page.is-active::before{background:#2563eb}
.pbp-widget .splide__pagination .splide__pagination__page:hover::before{opacity:.9}
/* T4 2026-10-10 a11y V01: campo de correo del pie (newsletter, solo .com). El texto escrito heredaba #777 sobre blanco = 4.48:1 (minimo AA 4.5:1);
   #6b7280 = 4.83:1, el mismo gris del placeholder (ya #6b7280 por html body input::placeholder). El campo vacio se ve igual. */
#footer .ps-emailsubscription-block .newsletter-input-group .input-subscription,#checkout-footer .ps-emailsubscription-block .newsletter-input-group .input-subscription{color:#6b7280}
/* T4 2026-10-10 a11y/BP V05 (image-aspect-ratio): la imagen de medios de pago del pie (lgpng.png 148x26) se dibujaba 124x14 (width:148px;height:26px
   de ._footer-copyrights-1 del editor del tema + padding 6px 12px con border-box). content-box devuelve la proporcion 148x26 (se conservan width/height fijos: sin salto de
   maquetacion al cargar); el margen vertical negativo compensa el padding para que la altura de la fila (y todo lo demas) no cambie. */
._footer-copyrights-1 .copyright-img img{box-sizing:content-box;margin-top:-6px;margin-bottom:-6px}

/* ── Carrito (panel lateral y página /carrito): stepper «− cantidad +» compacto, igual en TODAS las páginas ──
   2026-10-13: el estilo grande de la ficha (EstilosCMC, ficha-p36-botones-grandes.css) se aplicaba a todo
   .bootstrap-touchspin y agrandaba el carrito; ahora la ficha queda limitada a .product-quantity .qty y el carrito
   usa esta medida (34 px). Vive aquí (y no en el CSS de la ficha) porque ese archivo solo se carga en fichas. */
body #blockcart-content .bootstrap-touchspin,
body .cart-item .bootstrap-touchspin {
  flex-wrap: nowrap; width: 112px; max-width: 100%; height: 36px;
  border: 1px solid #D1D5DB; border-radius: 10px; overflow: hidden; background: #fff;
}
body #blockcart-content .bootstrap-touchspin .input-group-btn-vertical,
body .cart-item .bootstrap-touchspin .input-group-btn-vertical { display: contents; }
body #blockcart-content .bootstrap-touchspin .js-cart-line-product-quantity,
body .cart-item .bootstrap-touchspin .js-cart-line-product-quantity {
  order: 2; flex: 1 1 auto; width: 1%; min-width: 0; height: 34px;
  border: 0 !important; border-radius: 0; padding: 0 2px;
  text-align: center; font-size: 15px; font-weight: 700; color: #111827;
}
body #blockcart-content .bootstrap-touchspin .input-group-btn-vertical > .btn.btn-touchspin,
body .cart-item .bootstrap-touchspin .input-group-btn-vertical > .btn.btn-touchspin {
  flex: 0 0 34px; width: 34px; height: 34px; min-width: 34px !important; min-height: 34px !important;
  margin: 0; padding: 0; border: 0; border-radius: 0; background: #F3F4F6; color: #111827;
  display: flex; align-items: center; justify-content: center;
}
body #blockcart-content .bootstrap-touchspin .input-group-btn-vertical > .bootstrap-touchspin-down,
body .cart-item .bootstrap-touchspin .input-group-btn-vertical > .bootstrap-touchspin-down { order: 1; border-right: 1px solid #E5E7EB; }
body #blockcart-content .bootstrap-touchspin .input-group-btn-vertical > .bootstrap-touchspin-up,
body .cart-item .bootstrap-touchspin .input-group-btn-vertical > .bootstrap-touchspin-up { order: 3; border-left: 1px solid #E5E7EB; }
body #blockcart-content .bootstrap-touchspin .input-group-btn-vertical > .btn.btn-touchspin:hover,
body .cart-item .bootstrap-touchspin .input-group-btn-vertical > .btn.btn-touchspin:hover { background: #E5E7EB; color: #1D4ED8; }
body #blockcart-content .bootstrap-touchspin .input-group-btn-vertical > .btn i,
body .cart-item .bootstrap-touchspin .input-group-btn-vertical > .btn i { display: none; }
body #blockcart-content .bootstrap-touchspin .input-group-btn-vertical > .btn::before,
body .cart-item .bootstrap-touchspin .input-group-btn-vertical > .btn::before {
  content: ""; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: var(--pp36-ico) center / contain no-repeat; mask: var(--pp36-ico) center / contain no-repeat;
}
body #blockcart-content .bootstrap-touchspin .bootstrap-touchspin-down,
body .cart-item .bootstrap-touchspin .bootstrap-touchspin-down {
  --pp36-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14' stroke='%23000' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
}
body #blockcart-content .bootstrap-touchspin .bootstrap-touchspin-up,
body .cart-item .bootstrap-touchspin .bootstrap-touchspin-up {
  --pp36-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5v14M5 12h14' stroke='%23000' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* === checkout-fix 2026-10-13 INICIO === */
/* «Continuar sin cuenta» y «Ya tengo una cuenta» son excluyentes: el invitado se oculta cuando el login está abierto */
.tl-guest-panel[hidden] { display: none !important; }
section.checkout-step:has(#personal-information-step-login.show) .tl-guest-panel { display: none !important; }

/* Login social: una sola vez y solo dentro del panel «Ya tengo una cuenta» (el módulo lo inyecta también en la columna derecha y al pie del formulario de invitado) */
body#checkout .cart-grid-right .ets_solo_social_wrapper,
body#checkout #customer-form .ets_solo_social_wrapper { display: none !important; }
#personal-information-step-login .tl-login-social:empty { display: none; }
#personal-information-step-login .tl-login-social { margin-top: 1.25rem; }
#personal-information-step-login .tl-login-social .ets_solo_or { display: none; }

/* Pasarela con estilo (ck-on): el asterisco de la casilla obligatoria va junto al texto, no suelto arriba */
body#checkout.ck-on #customer-form .form-group:has(input[type="checkbox"][required]) > label.col-form-label.required { display: none !important; }
body#checkout.ck-on #customer-form .custom-checkbox input[required] ~ label::after { content: " *"; color: #2563eb; font-weight: 700; }

/* Recuadro «Información importante» (htmlboxpro, hook CheckoutAbajo): con margen lateral, no pegado al borde */
body#checkout.ck-on .aviso-importante { box-sizing: border-box; margin: 24px; max-width: calc(100% - 48px); }
/* === checkout-fix 2026-10-13 FIN === */




/* === checkout-fix-2 2026-10-13 INICIO === */
/* Columna derecha (resumen + login social + badges): baja entera con el scroll */
@media (min-width: 992px) and (min-height: 760px) {
  body#checkout.ck-s05 #main .cart-grid-right { align-self: start !important; position: sticky !important; top: 24px; }
  body#checkout.ck-s05 #js-checkout-summary { position: static !important; }
}

/* Login social: copia a la derecha (bajo el resumen) y arriba del formulario de «Continuar sin cuenta»; la copia al pie del formulario (brp) sigue oculta */
body#checkout .cart-grid-right .ets_solo_social_wrapper { display: block !important; margin-top: 24px; }
body#checkout .tl-login-social:empty { display: none; }
body#checkout .tl-login-social--guest { margin: 0 0 1.25rem; padding-bottom: 1.25rem; border-bottom: 1px solid #e5e7eb; }
body#checkout .ets_solo_social_wrapper .ets_solo_or { display: none; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_title { font-size: .95rem; font-weight: 700; margin: 0 0 .7rem; text-align: center; }
/* Botones finos con el nombre de la red: icono de marca + texto, sin bordes de otro color */
body#checkout .ets_solo_social_wrapper .ets_solo_social { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0 0 12px; padding: 0; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item { display: flex; align-items: center; width: auto; height: 40px; margin: 0; padding: 0 12px 0 0; background: #fff !important; border: 1px solid #d1d5db; border-radius: 10px; overflow: hidden; cursor: pointer; box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item:hover { border-color: #9ca3af; box-shadow: 0 2px 8px -2px rgba(15, 23, 42, .2); }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item:last-child:nth-child(odd) { grid-column: 1 / -1; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_btn { display: flex; flex: 0 0 38px; width: 38px; height: 38px; margin: 0; padding: 0; background: transparent !important; border: 0 !important; border-radius: 0; box-shadow: none !important; transform: none !important; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_btn > i { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin: 0; padding: 0; border: 0 !important; border-radius: 0; box-shadow: none; background: #64748b; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_btn svg { width: 18px; height: 18px; margin: 0; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item.facebook .ets_solo_social_btn > i { background: #1877f2; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item.windowslive .ets_solo_social_btn > i { background: #00a4ef; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item.amazon .ets_solo_social_btn > i { background: #ff9900; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item.google .ets_solo_social_btn > i { background: #fff; border-right: 1px solid #e5e7eb !important; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item.google .ets_solo_social_btn svg { width: 18px; height: 18px; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item::after { content: attr(data-auth); padding-left: 10px; font-size: .875rem; font-weight: 600; color: #111827; white-space: nowrap; }
body#checkout .ets_solo_social_wrapper .ets_solo_social_item.windowslive::after { content: "Windows Live"; }
@media (max-width: 420px) { body#checkout .ets_solo_social_wrapper .ets_solo_social { grid-template-columns: minmax(0, 1fr); } }

/* En móvil solo queda la copia de arriba (bajo el resumen), para no repetirlo */
@media (max-width: 991.98px) { body#checkout .tl-login-social--guest { display: none !important; } }

/* Fila blanca «Información importante» bajo todo el contenido */
.tl-checkout-info { background: #fff; border-top: 1px solid #e5e7eb; padding: 40px 24px 36px; }
.tl-checkout-info__inner { max-width: 1100px; margin: 0 auto; }
.tl-checkout-info__title { margin: 0 0 24px; text-align: center; font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #004b6b; }
.tl-checkout-info__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 40px; margin: 0; padding: 0; list-style: none; }
.tl-checkout-info__item { display: flex; align-items: flex-start; gap: 14px; margin: 0; padding: 0; }
.tl-checkout-info__icon { display: inline-flex; flex: 0 0 40px; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #eff6ff; color: #2563eb; }
.tl-checkout-info__icon svg { width: 20px; height: 20px; }
.tl-checkout-info__item strong { display: block; margin: 0 0 4px; font-size: .9375rem; font-weight: 700; color: #0f172a; }
.tl-checkout-info__item p { margin: 0; font-size: .875rem; line-height: 1.55; color: #475569; }
.tl-checkout-info__item a { color: #004b6b; font-weight: 600; border-bottom: 1.5px solid currentColor; text-decoration: none; }
@media (max-width: 767px) { .tl-checkout-info { padding: 28px 18px 24px; } .tl-checkout-info__list { grid-template-columns: minmax(0, 1fr); gap: 20px; } }
/* Nombre en los formularios de cliente: el tema ocultaba la 1.ª fila (el «Tratamiento», que ya no se dibuja); ahora esa fila es el Nombre y debe verse */
body:not(.ck-on) #customer-form > div:nth-child(1) > div.form-group:nth-child(1) { display: flex !important; }

/* Badges de confianza bajo el resumen del pedido */
.tl-checkout-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; margin: 22px 0 0; padding: 0; list-style: none; }
.tl-checkout-trust li { display: inline-flex; align-items: center; gap: 7px; margin: 0; font-size: .8125rem; font-weight: 600; color: #374151; }
.tl-checkout-trust svg { flex: none; width: 16px; height: 16px; color: #16a34a; }
/* === checkout-fix-2 2026-10-13 FIN === */