/* Unclick — sistema visual oscuro global.
 * La compra conserva una capa neutra propia para maximizar legibilidad.
 */
:root {
  color-scheme: dark;
  --unclick-bg: var(--loq-bg);
  --unclick-navy: var(--loq-bg);
  --unclick-surface: var(--loq-surface);
  --unclick-surface-2: var(--loq-surface-alt);
  --unclick-blue: var(--loq-secondary);
  --unclick-violet: var(--loq-primary);
  --unclick-pink: var(--loq-accent);
  --unclick-orange: var(--loq-warm);
  --unclick-text: var(--loq-text);
  --unclick-muted: var(--loq-muted);
  --unclick-border: var(--loq-border);
  --unclick-gradient: var(--loq-brand-gradient);
  --unclick-gradient-soft: linear-gradient(135deg, rgb(37 99 255 / .18), rgb(124 58 237 / .12) 48%, rgb(236 72 153 / .09));
  --loq-font-family: var(--loq-font);
  --loq-color-label: var(--unclick-text);
  --loq-color-label-secondary: var(--unclick-muted);
  --loq-color-label-tertiary: #777b99;
  --loq-color-separator: rgb(167 169 192 / .22);
  --loq-color-fill: rgb(124 58 237 / .14);
  --loq-color-fill-secondary: rgb(255 255 255 / .06);
  --loq-font-family: var(--loq-font);
  --loq-color-label: var(--unclick-text);
  --loq-color-label-secondary: var(--unclick-muted);
  --loq-color-label-tertiary: #777b99;
  --loq-color-separator: rgb(167 169 192 / .22);
  --loq-color-fill: rgb(124 58 237 / .14);
  --loq-color-fill-secondary: rgb(255 255 255 / .06);
  --loq-premium-bg: var(--unclick-surface);
  --loq-premium-surface: var(--unclick-surface-2);
  --loq-premium-text: var(--unclick-text);
  --loq-premium-muted: var(--unclick-muted);
  --loq-premium-border: var(--unclick-border);
}

html,
body {
  background: var(--unclick-bg);
  color: var(--unclick-text);
}

body:not(.woocommerce-checkout):not(.loq-checkout-mode) :is(.site, .site-main, #page, #primary, .content-area) {
  background: transparent;
}

body:not(.woocommerce-checkout):not(.loq-checkout-mode) :is(h1, h2, h3, h4, h5, h6, .entry-title, .page-title, .woocommerce-products-header__title) {
  color: var(--unclick-text);
}

body:not(.woocommerce-checkout):not(.loq-checkout-mode) :is(p, .description, .subtitle) {
  color: var(--unclick-muted);
}

body:not(.woocommerce-checkout):not(.loq-checkout-mode) a {
  text-underline-offset: .18em;
}

::selection {
  background: rgb(236 72 153 / .32);
  color: #fff;
}

/* El degradado es una firma de marca: acciones primarias y acentos, no fondos masivos. */
.button,
button.button,
input.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.wc-block-components-button:not(.is-link),
.loq-cards__header-cta {
  background: var(--unclick-gradient) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 12px 30px rgb(124 58 237 / .24), inset 0 1px rgb(255 255 255 / .2) !important;
}

/* Cabecera y buscador: oscuro, limpio, alineado con el brand board. */
.loq-header--v3,
.loq-header-wrap.is-scrolled .loq-header--v3,
.loq-trust-bar {
  background:
    radial-gradient(circle at 74% 0, rgb(236 72 153 / .08), transparent 25rem),
    linear-gradient(110deg, #070819, #0b0d21 65%, #150b1c) !important;
}

.loq-header--v3 .loq-searchbar__inner,
.loq-header--v3 .loq-searchbar--inline .loq-searchbar__inner {
  background: rgb(13 16 40 / .92) !important;
  border-color: rgb(124 58 237 / .34) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .05) !important;
}

.loq-header--v3 .loq-searchbar__input,
.loq-header--v3 .loq-searchbar__input::placeholder {
  color: var(--unclick-muted) !important;
}

.loq-header--v3 .loq-searchbar__submit {
  color: #a78bfa !important;
}

/* Bloques de portada. */
.loq-cards__title,
.loq-block--title-secondary h2,
.loq-auto-submenu__title {
  color: var(--unclick-text) !important;
}

.loq-auto-submenu__head > span {
  color: var(--unclick-text) !important;
}

.loq-cards__subtitle,
.loq-auto-submenu__subtitle,
.loq-auto-submenu__desc,
.loq-auto-submenu__subcats-text {
  color: var(--unclick-muted) !important;
}

.loq-cards__label-row,
.loq-auto-submenu__eyebrow {
  color: var(--loq-accent) !important;
}

/* Grilla simple: identidad configurada, sin paleta local. */
.loq-block--simple-grid .loq-cards__title {
  color: var(--loq-text) !important;
}

.loq-block--simple-grid .loq-cards__subtitle {
  color: var(--loq-muted) !important;
}

.loq-block--simple-grid .loq-cards__label-row {
  gap: 4px !important;
  margin-bottom: 8px !important;
  padding: 3px 7px !important;
  border: 1px solid color-mix(in srgb, var(--loq-accent) 34%, transparent) !important;
  border-radius: var(--loq-radius-pill, 999px) !important;
  background: color-mix(in srgb, var(--loq-accent) 10%, transparent) !important;
  color: rgb(255 255 255 / .78) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .05) !important;
}

.loq-block--simple-grid .loq-cards__spark {
  width: 10px !important;
  height: 10px !important;
}

.loq-block--simple-grid .loq-cards__label-text {
  color: inherit !important;
  font-size: 9px !important;
  line-height: 1 !important;
  letter-spacing: .025em !important;
}

.loq-block--simple-grid .loq-cards__header-cta {
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: color-mix(in srgb, var(--loq-accent) 58%, #fff) !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.loq-block--simple-grid .loq-cards__header-cta svg {
  width: 11px !important;
  height: 11px !important;
}

.loq-block--simple-grid .offer-card--simple {
  background:
    radial-gradient(circle at 50% 36%, color-mix(in srgb, var(--loq-primary) 13%, transparent), transparent 54%),
    linear-gradient(155deg, rgb(18 21 47 / .98), rgb(8 10 29 / .98)) !important;
  border-color: var(--unclick-border) !important;
  box-shadow: 0 16px 44px rgb(0 0 0 / .22), inset 0 1px rgb(255 255 255 / .04) !important;
}

.loq-block--simple-grid .offer-card__discount-badge,
.lq-badge-sale {
  background: var(--loq-primary) !important;
  color: var(--loq-on-primary, #fff) !important;
  border-color: transparent !important;
  box-shadow: 0 5px 14px color-mix(in srgb, var(--loq-primary) 28%, transparent) !important;
}

.loq-block--simple-grid .offer-card__title-link {
  color: var(--loq-text) !important;
}

.loq-block--simple-grid .offer-card__price-now {
  color: var(--loq-text, #fff) !important;
}

.loq-block--simple-grid .offer-card__price-old {
  color: var(--loq-muted) !important;
}

.loq-infobar-s {
  --loq-infobar-comfortable-bg: var(--unclick-surface-2) !important;
  --loq-infobar-text: var(--unclick-text) !important;
  --loq-infobar-muted: var(--unclick-muted) !important;
  --loq-infobar-icon: var(--unclick-violet) !important;
}

.loq-infobar-s__card,
.loq-advisor,
.loq-auto-submenu__item {
  background: linear-gradient(145deg, rgb(18 21 47 / .96), rgb(9 11 31 / .96)) !important;
  border: 1px solid var(--unclick-border) !important;
  color: var(--unclick-text) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .04), 0 14px 32px rgb(0 0 0 / .16) !important;
}

.loq-infobar-s__title,
.loq-advisor__text,
.loq-auto-submenu__text {
  color: var(--unclick-text) !important;
}

.loq-infobar-s__subtitle {
  color: var(--unclick-muted) !important;
}

/* Infobar Unclick: beneficios como tarjetas de producto/servicio. */
.loq-infobar-s--comfortable {
  padding-block: clamp(12px, 1.5vw, 20px);
  padding-inline: var(--loq-gutter, 16px);
}

.loq-infobar-s--comfortable .loq-infobar-s__grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  overflow: visible;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.loq-infobar-s--comfortable .loq-infobar-s__card {
  position: relative;
  isolation: isolate;
  min-height: 116px;
  padding: 18px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  overflow: hidden;
  border: 1px solid var(--unclick-border) !important;
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgb(18 21 47 / .96), rgb(8 10 29 / .98)) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .05), 0 14px 34px rgb(0 0 0 / .2) !important;
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.loq-infobar-s--comfortable .loq-infobar-s__card::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 120px;
  height: 120px;
  right: -54px;
  bottom: -70px;
  border-radius: 50%;
  background: var(--unclick-card-glow, rgb(124 58 237 / .16));
  filter: blur(4px);
}

.loq-infobar-s--comfortable .loq-infobar-s__card::after {
  display: none !important;
}

.loq-infobar-s--comfortable .loq-infobar-s__card:hover {
  transform: translateY(-3px);
  border-color: rgb(124 58 237 / .62) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .07), 0 20px 42px rgb(0 0 0 / .3), 0 0 24px rgb(124 58 237 / .08) !important;
}

.loq-infobar-s--comfortable .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-1 .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-2 .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-3 .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-4 .loq-infobar-s__icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 14px;
  background: rgb(124 58 237 / .1);
  color: #9b6cff !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .08), 0 8px 20px rgb(0 0 0 / .18);
}

.loq-infobar-s--comfortable .loq-infobar-s__card--color-2 {
  --unclick-card-glow: rgb(37 99 255 / .16);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-2 .loq-infobar-s__icon {
  color: #4f8cff !important;
  background: rgb(37 99 255 / .1);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-3 {
  --unclick-card-glow: rgb(236 72 153 / .15);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-3 .loq-infobar-s__icon {
  color: #f062ad !important;
  background: rgb(236 72 153 / .1);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-4 {
  --unclick-card-glow: rgb(245 158 11 / .15);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-4 .loq-infobar-s__icon {
  color: #fbb32d !important;
  background: rgb(245 158 11 / .1);
}

.loq-infobar-s--comfortable .loq-infobar-s__icon svg {
  width: 24px;
  height: 24px;
  stroke-width: 1.8;
}

.loq-infobar-s--comfortable .loq-infobar-s__copy {
  gap: 6px;
}

.loq-infobar-s--comfortable .loq-infobar-s__title {
  color: var(--unclick-text) !important;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.02em;
}

.loq-infobar-s--comfortable .loq-infobar-s__subtitle {
  color: var(--unclick-muted) !important;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
}

@media (max-width: 767px) {
  .loq-infobar-s--comfortable {
    padding-inline: var(--loq-gutter, 16px);
  }

  .loq-infobar-s--comfortable .loq-infobar-s__grid {
    display: flex;
    width: 100%;
    gap: 8px;
    margin-inline: 0;
    padding: 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    scrollbar-width: none;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__grid::-webkit-scrollbar {
    display: none;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__card {
    flex: 0 0 calc((100% - 16px) / 3);
    min-width: 0;
    min-height: 122px;
    padding: 12px 8px 11px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    scroll-snap-align: start;
    border-radius: 14px;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-1 .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-2 .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-3 .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-4 .loq-infobar-s__icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__icon svg {
    width: 30px;
    height: 30px;
    stroke-width: 1.8;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__copy {
    width: 100%;
    gap: 5px;
    align-items: center;
    text-align: center;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__title {
    width: 100%;
    min-height: 2.35em;
    font-size: 11px;
    line-height: 1.18;
    -webkit-line-clamp: 2;
    text-align: center;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__subtitle {
    width: 100%;
    font-size: 9px;
    line-height: 1.22;
    -webkit-line-clamp: 2;
    text-align: center;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__card::before {
    width: 82px;
    height: 82px;
    right: -42px;
    bottom: -48px;
  }
}

@media (min-width: 768px) {
  .loq-infobar-s--comfortable {
    padding-inline: var(--loq-gutter-desktop, 24px);
  }
}

/* Infobar Unclick: beneficios como tarjetas de producto/servicio. */
.loq-infobar-s--comfortable {
  padding-block: clamp(12px, 1.5vw, 20px);
  padding-inline: var(--loq-gutter, 16px);
}

.loq-infobar-s--comfortable .loq-infobar-s__grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  overflow: visible;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.loq-infobar-s--comfortable .loq-infobar-s__card {
  position: relative;
  isolation: isolate;
  min-height: 116px;
  padding: 18px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  overflow: hidden;
  border: 1px solid var(--unclick-border) !important;
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgb(18 21 47 / .96), rgb(8 10 29 / .98)) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .05), 0 14px 34px rgb(0 0 0 / .2) !important;
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.loq-infobar-s--comfortable .loq-infobar-s__card::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 120px;
  height: 120px;
  right: -54px;
  bottom: -70px;
  border-radius: 50%;
  background: var(--unclick-card-glow, rgb(124 58 237 / .16));
  filter: blur(4px);
}

.loq-infobar-s--comfortable .loq-infobar-s__card::after {
  display: none !important;
}

.loq-infobar-s--comfortable .loq-infobar-s__card:hover {
  transform: translateY(-3px);
  border-color: rgb(124 58 237 / .62) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .07), 0 20px 42px rgb(0 0 0 / .3), 0 0 24px rgb(124 58 237 / .08) !important;
}

.loq-infobar-s--comfortable .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-1 .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-2 .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-3 .loq-infobar-s__icon,
.loq-infobar-s--comfortable .loq-infobar-s__card--color-4 .loq-infobar-s__icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 14px;
  background: rgb(124 58 237 / .1);
  color: #9b6cff !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .08), 0 8px 20px rgb(0 0 0 / .18);
}

.loq-infobar-s--comfortable .loq-infobar-s__card--color-2 {
  --unclick-card-glow: rgb(37 99 255 / .16);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-2 .loq-infobar-s__icon {
  color: #4f8cff !important;
  background: rgb(37 99 255 / .1);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-3 {
  --unclick-card-glow: rgb(236 72 153 / .15);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-3 .loq-infobar-s__icon {
  color: #f062ad !important;
  background: rgb(236 72 153 / .1);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-4 {
  --unclick-card-glow: rgb(245 158 11 / .15);
}
.loq-infobar-s--comfortable .loq-infobar-s__card--color-4 .loq-infobar-s__icon {
  color: #fbb32d !important;
  background: rgb(245 158 11 / .1);
}

.loq-infobar-s--comfortable .loq-infobar-s__icon svg {
  width: 24px;
  height: 24px;
  stroke-width: 1.8;
}

.loq-infobar-s--comfortable .loq-infobar-s__copy {
  gap: 6px;
}

.loq-infobar-s--comfortable .loq-infobar-s__title {
  color: var(--unclick-text) !important;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.02em;
}

.loq-infobar-s--comfortable .loq-infobar-s__subtitle {
  color: var(--unclick-muted) !important;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
}

@media (max-width: 767px) {
  .loq-infobar-s--comfortable {
    padding-inline: var(--loq-gutter, 16px);
  }

  .loq-infobar-s--comfortable .loq-infobar-s__grid {
    display: flex;
    width: 100%;
    gap: 8px;
    margin-inline: 0;
    padding: 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    scrollbar-width: none;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__grid::-webkit-scrollbar {
    display: none;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__card {
    flex: 0 0 calc((100% - 16px) / 3);
    min-width: 0;
    min-height: 122px;
    padding: 12px 8px 11px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    scroll-snap-align: start;
    border-radius: 14px;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-1 .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-2 .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-3 .loq-infobar-s__icon,
  .loq-infobar-s--comfortable .loq-infobar-s__card--color-4 .loq-infobar-s__icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__icon svg {
    width: 30px;
    height: 30px;
    stroke-width: 1.8;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__copy {
    width: 100%;
    gap: 5px;
    align-items: center;
    text-align: center;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__title {
    width: 100%;
    min-height: 2.35em;
    font-size: 11px;
    line-height: 1.18;
    -webkit-line-clamp: 2;
    text-align: center;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__subtitle {
    width: 100%;
    font-size: 9px;
    line-height: 1.22;
    -webkit-line-clamp: 2;
    text-align: center;
  }

  .loq-infobar-s--comfortable .loq-infobar-s__card::before {
    width: 82px;
    height: 82px;
    right: -42px;
    bottom: -48px;
  }
}

@media (min-width: 768px) {
  .loq-infobar-s--comfortable {
    padding-inline: var(--loq-gutter-desktop, 24px);
  }
}

.loq-auto-submenu {
  --loq-compact-bg: var(--unclick-surface-2) !important;
}

.loq-auto-submenu__item:is(:hover, :focus-visible, .is-active) {
  border-color: rgb(124 58 237 / .75) !important;
  background: linear-gradient(145deg, rgb(37 99 255 / .16), rgb(124 58 237 / .16)) !important;
  box-shadow: 0 14px 34px rgb(37 99 255 / .13) !important;
}

.loq-auto-submenu__icon-box,
.loq-auto-submenu__media {
  background: #f4f5fa !important;
}

/* Menú de categorías propio de Unclick: producto limpio + nombre. */
.loq-auto-submenu--unclick-showcase {
  width: min(100%, var(--loq-container, 1376px));
  margin-inline: auto;
  padding-inline: var(--loq-gutter, 16px);
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__head {
  margin-bottom: 18px;
  padding-inline: 0;
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__head > span {
  color: var(--unclick-text) !important;
  font-size: clamp(24px, 2.4vw, 36px);
  font-weight: 700;
  letter-spacing: -.04em;
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__rail {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  overflow: visible;
  padding-inline: 0;
  scroll-padding-inline: 0;
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__item {
  min-width: 0;
  min-height: 218px;
  padding: 14px 12px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  overflow: hidden;
  border: 1px solid rgb(124 58 237 / .2) !important;
  border-radius: 18px;
  background: linear-gradient(160deg, rgb(14 17 42 / .74), rgb(7 9 27 / .9)) !important;
  box-shadow: inset 0 1px rgb(255 255 255 / .035) !important;
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__item:hover {
  transform: translateY(-3px);
  border-color: rgb(124 58 237 / .58) !important;
  background: linear-gradient(160deg, rgb(23 27 61 / .9), rgb(9 11 31 / .96)) !important;
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__media {
  order: -1;
  position: relative;
  width: 100%;
  height: 158px;
  display: grid;
  place-items: end center;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: radial-gradient(circle at 50% 72%, rgb(124 58 237 / .2), transparent 52%) !important;
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__media img {
  width: 88%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 16px 18px rgb(0 0 0 / .42));
  transition: transform .28s ease;
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__item:hover .loq-auto-submenu__media img {
  transform: scale(1.04);
}

.loq-auto-submenu--unclick-showcase .loq-auto-submenu__text {
  color: var(--unclick-text) !important;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

.loq-auto-submenu--unclick-showcase :is(.loq-auto-submenu__desc, .loq-auto-submenu__arrow) {
  display: none !important;
}

@media (max-width: 767px) {
  .loq-auto-submenu--unclick-showcase {
    padding-inline: var(--loq-gutter, 16px);
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__head {
    margin-bottom: 12px;
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__head > span {
    font-size: 24px;
    line-height: 1.08;
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__rail {
    display: flex;
    width: 100%;
    gap: 8px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__rail::-webkit-scrollbar {
    display: none;
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__item {
    flex: 0 0 calc((100% - 16px) / 3);
    min-height: 138px;
    padding: 8px 6px 11px;
    gap: 7px;
    border-radius: 14px;
    scroll-snap-align: start;
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__media {
    height: 98px;
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__media img {
    width: 96%;
  }

  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__text {
    font-size: 11px;
  }
}

@media (min-width: 768px) {
  .loq-auto-submenu--unclick-showcase {
    padding-inline: var(--loq-gutter-desktop, 24px);
  }
}

/* Tipografía del menú vinculada al sistema global de encabezados. */
@media (min-width: 1024px) {
  .loq-auto-submenu--unclick-showcase .loq-auto-submenu__head > span {
    color: var(--unclick-text, #f8fafc) !important;
    font-family: var(--loq-font);
    font-size: var(--loq-section-heading-size);
    font-weight: var(--loq-section-heading-weight);
    line-height: var(--loq-section-heading-line-height);
    letter-spacing: var(--loq-section-heading-letter-spacing);
  }

}

/* Catálogo: tarjeta oscura con pozo neutro para respetar fotos de producto. */
.offer-card,
.loq-product-card,
.products .product,
.wc-block-grid__product {
  background:
    radial-gradient(circle at 50% 36%, color-mix(in srgb, var(--loq-primary) 13%, transparent), transparent 54%),
    linear-gradient(155deg, rgb(18 21 47 / .98), rgb(8 10 29 / .98)) !important;
  border-color: var(--unclick-border) !important;
  color: var(--unclick-text) !important;
  box-shadow: 0 16px 44px rgb(0 0 0 / .22), inset 0 1px rgb(255 255 255 / .04) !important;
}

.offer-card:hover,
.loq-product-card:hover,
.products .product:hover {
  border-color: rgb(124 58 237 / .62) !important;
  box-shadow: 0 22px 54px rgb(0 0 0 / .34), 0 0 28px rgb(124 58 237 / .1) !important;
}

.offer-card__media,
.loq-product-card__media,
.woocommerce-loop-product__link > img {
  background: transparent !important;
}

.offer-card__title,
.offer-card__title-link,
.loq-product-card__title,
.woocommerce-loop-product__title {
  color: var(--unclick-text) !important;
}

.offer-card__price-now,
.loq-product-card__price,
.woocommerce ul.products li.product .price {
  color: var(--loq-text, #fff) !important;
}

/* Acciones de card: una sola jerarquía cromática basada en el primary global. */
.offer-card .offer-card__title-link:hover,
.loq-product-card a:hover {
  color: var(--loq-primary) !important;
}

.offer-card .lq-card-overlay__inner > a.add_to_cart_button,
.offer-card .offer-card__buy,
.loq-product-card .button {
  border-color: color-mix(in srgb, var(--loq-primary) 72%, #fff) !important;
  background: var(--loq-primary) !important;
  color: var(--loq-on-primary, #fff) !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--loq-primary) 26%, transparent) !important;
}

.offer-card .lq-card-overlay__view {
  border-color: color-mix(in srgb, var(--loq-primary) 48%, #fff) !important;
  background: color-mix(in srgb, var(--loq-primary) 22%, transparent) !important;
  color: color-mix(in srgb, var(--loq-primary) 34%, #fff) !important;
}

.offer-card__price-old,
.loq-product-card__meta {
  color: var(--unclick-muted) !important;
}

.loq-cards__toggle,
.loq-cards__toggle.bg-white {
  background: var(--unclick-surface-2) !important;
  color: var(--unclick-text) !important;
  border-color: var(--unclick-border) !important;
}

/* Beneficios y footer. La sección WCU conserva transparente su wrapper;
   únicamente la tarjeta interior pinta la superficie de marca. */
.loq-wcu {
  background: transparent !important;
  background-color: transparent !important;
  border: 0;
  box-shadow: none;
}

.loq-footer-shell,
.site-footer {
  background-color: #060718 !important;
}

.loq-wcu__card,
.loq-wcu__whatsapp-inner {
  background: linear-gradient(145deg, rgb(18 21 47 / .9), rgb(9 11 31 / .92)) !important;
  border-color: var(--unclick-border) !important;
}

.loq-wcu :is(.loq-wcu__title, .loq-wcu__card-title, .loq-wcu__whatsapp-title) {
  color: var(--unclick-text) !important;
}

.loq-wcu :is(.loq-wcu__subtitle, .loq-wcu__card-desc, .loq-wcu__whatsapp-subtitle) {
  color: var(--unclick-muted) !important;
}

/* WooCommerce general y ficha de producto. Checkout queda excluido. */
body:not(.woocommerce-checkout):not(.loq-checkout-mode) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
  background: var(--unclick-surface-2) !important;
  border-color: var(--unclick-border) !important;
  color: var(--unclick-text) !important;
}

body.single-product :is(.product, .product-summary, .summary, .loq-pdp-shell, .loq-pdp-panel, .loq-product-description, .loq-product-addons) {
  color: var(--unclick-text);
}

body.single-product :is(.summary, .loq-pdp-panel, .loq-product-info-bar, .loq-product-description, .loq-product-addons) {
  background: var(--unclick-surface) !important;
  border-color: var(--unclick-border) !important;
}

body.single-product :is(.product_title, .loq-pdp-title, .loq-product-description h2, .loq-product-addons h2) {
  color: var(--unclick-text) !important;
}

body.single-product :is(.woocommerce-product-details__short-description, .product_meta, .loq-pdp-subtitle, .loq-product-description p) {
  color: var(--unclick-muted) !important;
}

body.single-product :is(.loq-pdp-gallery, .woocommerce-product-gallery) {
  background: radial-gradient(circle at 50% 42%, #171a3e, #070819 68%) !important;
  border-color: var(--unclick-border) !important;
}

body.single-product :is(select, input:not([type="submit"]):not([type="button"]), textarea, .select2-selection, .variable-item, .loq-option-card) {
  background-color: var(--unclick-surface-2) !important;
  color: var(--unclick-text) !important;
  border-color: var(--unclick-border) !important;
}

/* PDP Unclick: el lienzo pertenece al AmbientBackground global; los módulos
   sólo aportan superficies locales translúcidas y tokens de marca. */
body.single-product.loq-ambient-background {
  color-scheme: dark;
  color: var(--unclick-text);
}

body.single-product.loq-ambient-background :is(.lq-sp, .lq-sp--edit, .lqsp-desktop, .lqsp-grid, .lqsp-buyflow, .lqsp-desc) {
  background: transparent !important;
}

/* La cabecera comercial y el lienzo de la galeria no deben crear una segunda
   placa oscura sobre el AmbientBackground de Unclick. Las superficies de
   controles (colores, botones y cards informativas) conservan su material. */
body.single-product.loq-ambient-background :is(
  .lqsp-titleflow,
  .lqsp-gallery,
  .woocommerce-product-gallery,
  .woocommerce-product-gallery__wrapper,
  .woocommerce-product-gallery__image,
  .woocommerce-product-gallery__image > a,
  .woocommerce-product-gallery .flex-viewport
) {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

body.single-product.loq-ambient-background .lqsp-gallery :is(img, .wp-post-image) {
  background: transparent !important;
  background-color: transparent !important;
}

body.single-product .lqsp-titleflow .product_title,
body.single-product #lqColorStrip .lq-color-strip__title,
body.single-product :is(.lq-price-main, .lq-shipping-main strong, .lq-shipping-main b, .lq-shipping-agent strong) {
  color: var(--unclick-text) !important;
}

body.single-product :is(.lqsp-titleflow .lq-card-condition, .lqsp-price-usd, .lq-price-aclaracion, .lq-shipping-main, .lq-shipping-sub, .lq-shipping-agent) {
  color: var(--unclick-muted) !important;
}

body.single-product :is(.lq-shipping-icon, .lq-shipping-dynamic, .lq-shipping-dynamic__main, .loq-valstack-icon) {
  color: var(--loq-primary) !important;
}

body.single-product .lq-shipping-dynamic__icon {
  stroke: var(--loq-primary) !important;
}

body.single-product :is(.lq-accessory-info-card, .lq-shipping-threshold-card, .lqsp-desc-wrap, .lq-trust-modal__container) {
  background:
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--loq-primary) 11%, transparent), transparent 42%),
    linear-gradient(155deg, rgb(18 21 47 / .94), rgb(8 10 29 / .96)) !important;
  border: 1px solid var(--unclick-border) !important;
  color: var(--unclick-text) !important;
  box-shadow: 0 18px 46px rgb(0 0 0 / .2), inset 0 1px rgb(255 255 255 / .04) !important;
}

body.single-product .lq-shipping-threshold-card::before {
  background: #11142f !important;
  border-color: var(--unclick-border) !important;
}

body.single-product :is(.lq-accessory-info-badge, .lq-trust-modal__icon-wrap, .lq-trust-modal__close) {
  background: color-mix(in srgb, var(--loq-primary) 14%, transparent) !important;
  color: color-mix(in srgb, var(--loq-primary) 52%, #fff) !important;
}

body.single-product :is(.lq-accessory-info-title, .lq-shipping-threshold-title, .loq-valstack-title, .lqsp-desc-title, .lqsp-desc-content, .lqsp-desc-content p, .lqsp-desc-content h3, .lqsp-desc-content summary, .lq-trust-modal__title, .lq-trust-modal__text strong) {
  color: var(--unclick-text) !important;
}

body.single-product :is(.lq-accessory-info-desc, .lq-shipping-threshold-desc, .loq-valstack-items, .lqsp-desc-content li, .lq-trust-modal__text) {
  color: var(--unclick-muted) !important;
}

body.single-product .lq-color-card {
  background: linear-gradient(155deg, rgb(18 21 47 / .92), rgb(8 10 29 / .96)) !important;
  border-color: var(--unclick-border) !important;
  color: var(--unclick-text) !important;
}

body.single-product .lq-color-card__label {
  color: var(--unclick-text) !important;
}

body.single-product #lqColorStrip .lq-color-card__img-wrap,
body.single-product #lqColorStrip .lq-color-card__img {
  background: transparent !important;
  background-color: transparent !important;
}

body.single-product #lqColorStrip .lq-color-card__img {
  object-fit: contain !important;
}

body.single-product :is(.lq-color-card.is-selected, .lq-color-card.is-active, .lq-color-card.selected) {
  background: color-mix(in srgb, var(--loq-primary) 12%, var(--unclick-surface-2)) !important;
  border-color: var(--loq-primary) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--loq-primary) 20%, transparent), 0 12px 30px rgb(0 0 0 / .24) !important;
}

body.single-product .lqsp-desc-head {
  border-color: var(--unclick-border) !important;
}

body.single-product .lqsp-desc-content details,
body.single-product .lqsp-desc-content details[open] {
  background: rgb(8 10 29 / .72) !important;
  border-color: var(--unclick-border) !important;
}

body.single-product .lqsp-buyflow .lq-btn-buy-now {
  background: var(--loq-brand-gradient) !important;
  color: var(--loq-on-primary, #fff) !important;
  box-shadow: 0 12px 30px color-mix(in srgb, var(--loq-primary) 28%, transparent) !important;
}

body.single-product .lqsp-buyflow .lq-btn-add-cart {
  color: color-mix(in srgb, var(--loq-primary) 42%, #fff) !important;
}

body.single-product .lq-badge-sale.lq-badge-sale--inline {
  background: var(--loq-primary) !important;
}

/* Navegación móvil tipo app. */
@media (max-width: 1023px) {
  .loq-mobile-bottom-nav {
    background: rgb(8 10 29 / .94) !important;
    border-color: rgb(124 58 237 / .28) !important;
    box-shadow: 0 -10px 34px rgb(0 0 0 / .38), inset 0 1px rgb(255 255 255 / .06) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }

  .loq-mobile-bottom-nav__item {
    color: var(--unclick-muted) !important;
  }

  .loq-mobile-bottom-nav__item.is-active {
    color: #fff !important;
    background: rgb(124 58 237 / .16) !important;
  }
}

/* El checkout hereda ahora el lienzo oscuro de marca. Sus superficies
   funcionales viven en unclick-checkout.css, cargado solo en esa pantalla. */
body.woocommerce-checkout,
body.loq-checkout-mode {
  color-scheme: dark;
  background: transparent;
  color: var(--loq-text, #f8fafc);
}

@media (prefers-reduced-motion: reduce) {
  .button,
  button,
  a {
    transition-duration: .01ms !important;
  }
}
/* Header Unclick: el PNG horizontal incluye aire transparente vertical.
   La ventana recorta ese aire para dar presencia al logo sin deformarlo. */
@media (min-width: 1024px) {
  .loq-header--v3 .loq-header__logo {
    width: 240px;
    height: 56px;
    max-height: 56px;
    overflow: hidden;
  }

  .loq-header--v3 .loq-header__logo .loq-header__logo-img {
    width: 240px !important;
    height: 56px !important;
    max-width: 240px !important;
    max-height: 56px !important;
    object-fit: cover !important;
    object-position: center !important;
  }
}

@media (max-width: 1023.98px) {
  .loq-header--v3 .loq-header__mobile-logo {
    width: min(190px, 46vw);
    height: 52px;
    max-height: 52px;
    overflow: hidden;
  }

  .loq-header--v3 .loq-header__mobile-logo .loq-header__logo-img {
    width: 100% !important;
    height: 52px !important;
    max-width: 190px !important;
    max-height: 52px !important;
    object-fit: cover !important;
    object-position: center !important;
  }
}
