/* Paleta de Open Desk (la misma del escritorio) sobre el tema de la tienda.
   Claro: primario #009EF7, texto #181C32, fondo #F5F8FA.
   Oscuro: fondo #151521, superficies #1E1E2D. */

html.tienda-claro {
  color-scheme: light;
  --primary: #009EF7;
  --main: #181C32;
  --secondary: #5E6278;
  --secondary-2: #A1A5B7;
  --white: #FFFFFF;
  --surface: #F5F8FA;
  --line: #E4E6EF;
  --critical: #F1416C;
  --success: #50CD89;
  --yellow: #FFC700;
  --blue: #009EF7;
  --rgba-primary: rgba(0, 158, 247, 0.12);
  --gradient: linear-gradient(180deg, #F5F8FA 0%, #FFFFFF 100%);
  --shadow1: 0 8px 24px rgba(24, 28, 50, 0.06);
  --shadow2: 0 4px 16px rgba(24, 28, 50, 0.08);
  --backdrop: rgba(24, 28, 50, 0.35);
  --tienda-pagina: #F5F8FA;
  --tienda-elevado: #FFFFFF;
  --tienda-hover: #F5F8FA;
  --tienda-aviso: #009EF7;
}

html.tienda-oscuro {
  color-scheme: dark;
  --primary: #009EF7;
  --main: #F5F8FA;
  --secondary: #A1A5B7;
  --secondary-2: #7E8299;
  --white: #1E1E2D;
  --surface: #151521;
  --line: #2B2B40;
  --critical: #F1416C;
  --success: #50CD89;
  --yellow: #FFC700;
  --blue: #009EF7;
  --rgba-primary: rgba(0, 158, 247, 0.18);
  --gradient: linear-gradient(180deg, #151521 0%, #1E1E2D 100%);
  --shadow1: 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow2: 0 4px 16px rgba(0, 0, 0, 0.4);
  --backdrop: rgba(0, 0, 0, 0.55);
  --bg-scrollbar-track: #1E1E2D;
  --bg-scrollbar-thumb: #3F4254;
  --tienda-pagina: #151521;
  --tienda-elevado: #1E1E2D;
  --tienda-hover: #2B2B40;
  --tienda-aviso: #009EF7;
}

body {
  font-family: Poppins, sans-serif;
  font-size: 14px;
  line-height: 22px;
  background-color: var(--tienda-pagina);
  color: var(--main);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Poppins, sans-serif;
}

h1 { font-size: 36px; line-height: 44px; }
h2 { font-size: 28px; line-height: 36px; }
h3 { font-size: 24px; line-height: 32px; }
h4 { font-size: 20px; line-height: 28px; }
h5 { font-size: 18px; line-height: 26px; }
h6 { font-size: 16px; line-height: 24px; }

.body-text-1 {
  font-size: 15px;
  line-height: 24px;
}

.body-text,
.text-title,
.text-button,
.tf-btn {
  font-size: 14px;
  line-height: 22px;
}

.text-caption-1 {
  font-size: 13px;
  line-height: 20px;
}

#header.tienda-header .box-nav-ul .item-link,
#header.tienda-header .nav-icon .nav-icon-item .text,
.tienda-topbar,
.tienda-topbar .text-caption-1 {
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
}

.form-search-select .tf-dropdown-sort,
.form-search-select .tf-dropdown-sort .btn-select,
.form-search-select input {
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
}

.form-search-select .tf-btn {
  padding: 6px 16px;
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
}

.tf-table-page-cart th {
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  color: var(--secondary);
}

.page-mi-cuenta h4 {
  font-size: 16px;
  line-height: 22px;
  font-weight: 500;
}

.page-mi-cuenta h5,
.page-mi-cuenta h6 {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}

.page-mi-cuenta .text-button,
.page-mi-cuenta .tf-table-page-cart td {
  font-weight: 400;
}

html.tienda-claro .tf-product-media-main .item,
html.tienda-claro .tf-product-media-thumbs .swiper-slide .item {
  background-color: #FFFFFF;
}

.card-product:not(.style-list, .list-st-2, .list-st-3) .product-img,
.busqueda-shop .busqueda-productos-grid .card-product .product-img {
  --tienda-img-pad: 0;
  padding: 0;
}

.card-product:not(.style-list, .list-st-2, .list-st-3) {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--tienda-elevado);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: none;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.card-product:not(.style-list, .list-st-2, .list-st-3):hover {
  box-shadow: var(--shadow2);
}

.card-product:not(.style-list, .list-st-2, .list-st-3) .card-product-wrapper,
.card-product:not(.style-list, .list-st-2, .list-st-3) .product-img,
.card-product:not(.style-list, .list-st-2, .list-st-3) .product-img > img {
  background-color: var(--tienda-pagina);
}

.card-product:not(.style-list, .list-st-2, .list-st-3) .card-product-wrapper {
  border-radius: 0;
  width: 100%;
  margin: 0;
  aspect-ratio: 1 / 1;
}

.card-product .card-product-wrapper .tienda-card-cart-qty,
.producto-ficha-col-panel .producto-ficha-titulo .tienda-ficha-cart-qty {
  min-width: 22px;
  min-height: 22px;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 400;
  color: #FFFFFF !important;
}

.card-product .tienda-img-vacia {
  opacity: 0;
}

.card-product:not(.style-list, .list-st-2, .list-st-3) .card-product-info {
  flex: 1;
  align-content: start;
  padding: 12px 14px 14px;
}

.busqueda-shop .busqueda-productos-grid .card-product .card-product-info {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  container-type: inline-size;
  container-name: tienda-card;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-compra {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  padding-top: 10px;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-qty,
.producto-ficha-page .tienda-card-qty {
  display: inline-flex;
  align-items: stretch;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--tienda-pagina);
  overflow: hidden;
  flex: 0 1 auto;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-qty {
  flex: 0 0 auto;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-qty__btn,
.producto-ficha-page .tienda-card-qty__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--main);
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  box-shadow: none;
  cursor: pointer;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-qty__btn:hover,
.busqueda-shop .busqueda-productos-grid .tienda-card-qty__btn:focus,
.producto-ficha-page .tienda-card-qty__btn:hover,
.producto-ficha-page .tienda-card-qty__btn:focus {
  background: var(--tienda-hover);
  color: var(--main);
}

.busqueda-shop .busqueda-productos-grid .tienda-card-qty__btn:disabled,
.producto-ficha-page .tienda-card-qty__btn:disabled {
  opacity: 0.4;
  cursor: default;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-qty__input,
.producto-ficha-page .tienda-card-qty__input {
  width: 36px;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--main);
  font-size: 13px;
  font-weight: 500;
  line-height: 36px;
  text-align: center;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-qty__input:focus,
.producto-ficha-page .tienda-card-qty__input:focus {
  outline: none;
  background: transparent;
  box-shadow: none;
}

.producto-ficha-page .tf-product-info-cart-row.tienda-card-compra {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: 0;
  padding-top: 0;
}

.producto-ficha-existencias-fila .producto-ficha-btn-existencias.tienda-existencias {
  flex: 0 0 auto;
  width: auto;
  min-height: 0;
  padding: 4px 8px;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-agregar,
.producto-ficha-page .tienda-card-agregar.btn-agregar-carrito {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto;
  margin-left: auto;
  padding: 8px 16px;
  border: 1px solid #009EF7;
  border-radius: 6px;
  background-color: #009EF7;
  color: #FFFFFF;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none;
  box-shadow: none;
  white-space: nowrap;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-agregar svg,
.producto-ficha-page .tienda-card-agregar svg {
  display: block;
  flex-shrink: 0;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-agregar:hover,
.busqueda-shop .busqueda-productos-grid .tienda-card-agregar:focus,
.producto-ficha-page .tienda-card-agregar:hover,
.producto-ficha-page .tienda-card-agregar:focus {
  background-color: #0095e8;
  border-color: #0095e8;
  color: #FFFFFF;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-agregar.btn-agregar-carrito-disabled,
.producto-ficha-page .tienda-card-agregar.btn-agregar-carrito-disabled {
  opacity: 0.6;
  pointer-events: none;
}

.busqueda-shop .busqueda-productos-grid .tienda-card-compra--sin-stock .tienda-card-agregar,
.producto-ficha-page .tienda-card-compra--sin-stock .tienda-card-agregar {
  width: 100%;
  margin-left: 0;
}

/* El texto cabe si el ancho interior alcanza para el stepper completo y el botón. */
@container tienda-card (max-width: 212px) {
  .tienda-card-compra:not(.tienda-card-compra--sin-stock) .tienda-card-agregar {
    padding-left: 10px;
    padding-right: 10px;
  }
}

@container tienda-card (max-width: 188px) {
  .tienda-card-compra:not(.tienda-card-compra--sin-stock) {
    gap: 6px;
  }

  .tienda-card-compra:not(.tienda-card-compra--sin-stock) .tienda-card-agregar {
    flex: 0 0 auto;
    gap: 0;
    height: 38px;
    padding: 0 9px;
    position: relative;
  }

  .tienda-card-compra:not(.tienda-card-compra--sin-stock) .tienda-card-agregar span {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }
}

.tienda-existencias {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  justify-content: center;
  gap: 6px;
  width: auto;
  margin: 0;
  padding: 4px 8px;
  border: 0;
  border-radius: 6px;
  background: var(--rgba-primary);
  color: var(--primary);
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: 0;
  text-transform: none;
  box-shadow: none;
  cursor: pointer;
}

.tienda-existencias:hover,
.tienda-existencias:focus {
  background: rgba(0, 158, 247, 0.22);
  color: var(--primary);
}

.tienda-existencias__icono {
  display: block;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox='0%200%201024%201024'%3E%3Cg%20transform='translate%280%2C960%29%20scale%281%2C-1%29'%3E%3Cpath%20fill='black'%20d='M945%20585Q943%20598%20939.5%20610Q936%20622%20932%20633H934L918%20662Q917%20663%20916.5%20664Q916%20665%20915%20666L901%20690Q894%20699%20886%20707Q878%20715%20869%20722L866%20725Q860%20729%20854.5%20733Q849%20737%20843%20740L619%20872Q595%20885%20568%20892.5Q541%20900%20513%20900Q485%20900%20458%20892.5Q431%20885%20407%20872L183%20740L160%20725L155%20720Q140%20708%20127%20693.5Q114%20679%20104%20663L88%20635H90Q83%20616%2079.5%20597Q76%20578%2076%20559V296Q76%20269%2083%20242Q90%20215%20104%20191Q118%20167%20137.5%20147.5Q157%20128%20181%20114L405%20-18Q424%20-28%20444%20-34.5Q464%20-41%20484%20-44V-46H549L568%20-42L577%20-39Q581%20-39%20585%20-37Q589%20-35%20593%20-34Q599%20-31%20605%20-28Q611%20-25%20617%20-22L841%20109Q866%20123%20886%20143Q906%20163%20920%20188Q935%20213%20942%20240.5Q949%20268%20948%20296V559Q948%20566%20947%20572.5Q946%20579%20945%20585ZM438%20813Q455%20823%20473.5%20827.5Q492%20832%20511%20832Q530%20832%20548.5%20827.5Q567%20823%20584%20813L808%20682L825%20670L830%20666L840%20657L642%20541L511%20466L181%20657Q183%20659%20185.5%20661.5Q188%20664%20191%20666L196%20671L213%20682L438%20813ZM438%2043%20214%20174Q198%20184%20184.5%20197Q171%20210%20162%20226Q152%20242%20147%20260Q142%20278%20142%20296V559Q141%20570%20143%20581Q145%20592%20148%20603L479%20412L484%2030Q472%2032%20460.5%2035Q449%2038%20438%2043ZM881%20296Q881%20277%20876%20258.5Q871%20240%20861%20224Q852%20207%20838.5%20193.5Q825%20180%20808%20171L584%2039Q576%2034%20567%2030.5Q558%2027%20549%2025L544%20405L874%20600Q875%20596%20876%20592Q877%20588%20878%20584Q878%20583%20878%20582Q878%20581%20878%20579Q878%20574%20878%20569Q878%20564%20878%20559L881%20296Z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox='0%200%201024%201024'%3E%3Cg%20transform='translate%280%2C960%29%20scale%281%2C-1%29'%3E%3Cpath%20fill='black'%20d='M945%20585Q943%20598%20939.5%20610Q936%20622%20932%20633H934L918%20662Q917%20663%20916.5%20664Q916%20665%20915%20666L901%20690Q894%20699%20886%20707Q878%20715%20869%20722L866%20725Q860%20729%20854.5%20733Q849%20737%20843%20740L619%20872Q595%20885%20568%20892.5Q541%20900%20513%20900Q485%20900%20458%20892.5Q431%20885%20407%20872L183%20740L160%20725L155%20720Q140%20708%20127%20693.5Q114%20679%20104%20663L88%20635H90Q83%20616%2079.5%20597Q76%20578%2076%20559V296Q76%20269%2083%20242Q90%20215%20104%20191Q118%20167%20137.5%20147.5Q157%20128%20181%20114L405%20-18Q424%20-28%20444%20-34.5Q464%20-41%20484%20-44V-46H549L568%20-42L577%20-39Q581%20-39%20585%20-37Q589%20-35%20593%20-34Q599%20-31%20605%20-28Q611%20-25%20617%20-22L841%20109Q866%20123%20886%20143Q906%20163%20920%20188Q935%20213%20942%20240.5Q949%20268%20948%20296V559Q948%20566%20947%20572.5Q946%20579%20945%20585ZM438%20813Q455%20823%20473.5%20827.5Q492%20832%20511%20832Q530%20832%20548.5%20827.5Q567%20823%20584%20813L808%20682L825%20670L830%20666L840%20657L642%20541L511%20466L181%20657Q183%20659%20185.5%20661.5Q188%20664%20191%20666L196%20671L213%20682L438%20813ZM438%2043%20214%20174Q198%20184%20184.5%20197Q171%20210%20162%20226Q152%20242%20147%20260Q142%20278%20142%20296V559Q141%20570%20143%20581Q145%20592%20148%20603L479%20412L484%2030Q472%2032%20460.5%2035Q449%2038%20438%2043ZM881%20296Q881%20277%20876%20258.5Q871%20240%20861%20224Q852%20207%20838.5%20193.5Q825%20180%20808%20171L584%2039Q576%2034%20567%2030.5Q558%2027%20549%2025L544%20405L874%20600Q875%20596%20876%20592Q877%20588%20878%20584Q878%20583%20878%20582Q878%20581%20878%20579Q878%20574%20878%20569Q878%20564%20878%20559L881%20296Z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.tienda-existencias__icono--cargando {
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3ccircle opacity='0.5' cx='12' cy='12' r='8' fill='none' stroke='black' stroke-width='2.4'/%3e%3cpath fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' d='M12 4A8 8 0 0 1 18.93 16'/%3e%3c/svg%3e");
  mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3ccircle opacity='0.5' cx='12' cy='12' r='8' fill='none' stroke='black' stroke-width='2.4'/%3e%3cpath fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' d='M12 4A8 8 0 0 1 18.93 16'/%3e%3c/svg%3e");
  animation: tienda-existencias-spin .8s linear infinite;
}

@keyframes tienda-existencias-spin {
  to {
    transform: rotate(360deg);
  }
}

.card-product .card-product-info .tienda-card-marca {
  display: block;
  min-width: 0;
  margin-bottom: 2px;
  font-size: 11px;
  line-height: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--secondary-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
}

.card-product .card-product-info .title {
  font-size: 13px;
  line-height: 18px;
}

.card-product .card-product-info .price {
  font-size: 14px;
  line-height: 22px;
}

.producto-ficha-col-panel .producto-ficha-titulo .tf-product-info-name .name {
  font-size: clamp(1.125rem, 1.6vw, 1.375rem);
}

.producto-ficha-page .producto-ficha-col-compra .tf-product-info-price .price-on-sale {
  font-size: clamp(1.25rem, 1.8vw, 1.5rem);
}

html.tienda-claro .tienda-logo-oscuro,
html.tienda-oscuro .tienda-logo-claro {
  display: none;
}

#header.tienda-header .logo-header {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

#header.tienda-header .logo-header img {
  width: 148px;
  height: 24px;
  max-width: 148px;
  max-height: 24px;
  object-fit: contain;
  object-position: left center;
}

.bg-primary {
  background-color: var(--primary) !important;
}

#progress-front {
  background-color: var(--primary) !important;
}

/* Aviso, barra superior y encabezado: superficie plana, sin el azul del tema */
.tienda-aviso {
  background-color: var(--tienda-aviso);
}

.tienda-aviso p {
  color: #FFFFFF !important;
}

.tienda-topbar {
  background-color: var(--tienda-elevado);
  border-bottom: 1px solid var(--line);
}

.tienda-topbar a,
.tienda-topbar .text-caption-1 {
  color: var(--secondary);
}

.tienda-topbar a:hover {
  color: var(--primary);
}

#header.tienda-header .main-header,
#header.tienda-header .header-bottom {
  background-color: var(--tienda-elevado);
}

#header.tienda-header .header-bottom {
  border-top: 1px solid var(--line);
}

#header.tienda-header .box-nav-ul .item-link,
#header.tienda-header .mobile-menu .icon {
  color: var(--main);
}

#header.tienda-header .nav-icon svg path,
#header.tienda-header .header-search-mobile svg path {
  stroke: var(--main);
}

#header.tienda-header .tienda-header-top {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 8px 0;
}

#header.tienda-header .tienda-header-top .nav-icon {
  margin-left: auto;
  gap: 16px;
  flex: 0 0 auto;
}

#header.tienda-header .tienda-header-buscar {
  flex: 0 1 520px;
  width: 520px;
  max-width: 100%;
  min-width: 0;
  margin-left: 24px;
}

#header.tienda-header .tienda-ayuda {
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  margin-left: auto;
  color: var(--main);
  text-decoration: none;
}

#header.tienda-header .tienda-ayuda .icon {
  font-size: 22px;
}

#header.tienda-header .tienda-ayuda .text-title,
#header.tienda-header .tienda-ayuda .text-caption-2 {
  display: block;
}

#header.tienda-header .tienda-ayuda .text-title {
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  color: var(--main);
}

#header.tienda-header .tienda-ayuda .text-caption-2 {
  font-size: 11px;
  line-height: 14px;
  color: var(--secondary);
}

#header.tienda-header .tienda-ayuda:hover .text-title {
  color: var(--primary);
}

#header.tienda-header .tienda-header-search {
  display: flex;
  align-items: stretch;
  width: 100%;
  padding: 0;
  gap: 0;
  background: transparent;
  border: 0;
  border-radius: 4px;
}

#header.tienda-header .tienda-header-search:focus-within {
  box-shadow: 0 0 0 3px var(--rgba-primary);
  border-radius: 4px;
}

#header.tienda-header .tienda-header-search-btn {
  flex: 0 0 auto;
  align-self: stretch;
  height: auto;
  margin: 0;
  padding: 0 16px;
  border: 0;
  border-radius: 0 4px 4px 0;
  background: var(--primary);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
  text-transform: none;
}

#header.tienda-header .tienda-header-search-btn:hover {
  background: var(--primary);
  color: #fff;
  filter: brightness(0.94);
}

#header.tienda-header .tienda-header-search input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  height: auto;
  border: 1px solid var(--line);
  border-right: 0;
  background: var(--white);
  box-shadow: none;
  padding: 6px 14px;
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  border-radius: 4px 0 0 4px;
  color: var(--main);
}

#header.tienda-header .tienda-header-search input:hover,
#header.tienda-header .tienda-header-search input:focus {
  border-color: var(--line);
  border-right-color: transparent;
}

#header.tienda-header .tienda-header-search:focus-within input {
  border-color: var(--primary);
  border-right-color: transparent;
}

html.tienda-oscuro #header.tienda-header .tienda-header-search {
  background: transparent;
}

html.tienda-oscuro #header.tienda-header .tienda-header-search input {
  color: #181C32;
  background: #F5F8FA;
  border-color: #F5F8FA;
}

html.tienda-oscuro #header.tienda-header .tienda-header-search input::placeholder {
  color: #7E8299;
}

html.tienda-oscuro #header.tienda-header .tienda-header-search-btn,
html.tienda-oscuro #header.tienda-header .tienda-header-search-btn:hover {
  background: var(--primary);
  color: #fff;
}

#header.tienda-header .header-search-mobile .form-search input {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--main);
}

html.tienda-oscuro #header.tienda-header .header-search-mobile .form-search input {
  background: #F5F8FA;
  border-color: transparent;
  color: #181C32;
}

html.tienda-oscuro #header.tienda-header .header-search-mobile .form-search input::placeholder {
  color: #7E8299;
}

html.tienda-oscuro #header.tienda-header .header-search-mobile .form-search button svg path {
  stroke: #5E6278;
}

@media (max-width: 1199.98px) {
  #header.tienda-header .tienda-header-top {
    min-height: 52px;
    padding-bottom: 4px;
  }

  #header.tienda-header .tienda-header-top .logo-header {
    flex: 0 1 auto;
    min-width: 0;
    justify-content: flex-start;
  }

  #header.tienda-header .tienda-header-top .logo-header img {
    width: auto;
    max-width: min(148px, 100%);
  }

  #header.tienda-header .nav-icon .nav-wishlist,
  #header.tienda-header .nav-tema {
    display: inline-flex;
  }

  #header.tienda-header .nav-tema .tienda-tema-btn {
    width: 24px;
    height: 24px;
  }

  #header.tienda-header .tienda-header-top .nav-icon {
    gap: 12px;
  }

  #header.tienda-header .header-search-mobile {
    grid-template-rows: 1fr;
    padding-bottom: 8px;
  }
}

@media (min-width: 1200px) {
  #header.tienda-header .tienda-header-top {
    min-height: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  #header.tienda-header .tienda-ayuda + .nav-icon {
    margin-left: 16px;
  }
}

.tienda-cuenta-menu__icon svg {
  display: block;
}

#accountMenuDesktop .tienda-cuenta-menu__icon,
#mobileAccount .tienda-cuenta-menu__icon,
.tienda-cuenta-menu__item--logout .tienda-cuenta-menu__text,
.tienda-cuenta-menu__item--logout .tienda-cuenta-menu__icon--logout,
.tienda-cuenta-menu__item--logout .tienda-cuenta-menu__icon--logout i,
#accountMenuDesktop .tienda-cuenta-menu__item--logout .tienda-cuenta-menu__icon--logout,
#accountMenuDesktop .tienda-cuenta-menu__item--logout .tienda-cuenta-menu__icon--logout i,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item--logout .tienda-cuenta-menu__icon--logout,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item--logout .tienda-cuenta-menu__icon--logout i,
#accountMenuDesktop .tienda-cuenta-menu__item--logout:hover .tienda-cuenta-menu__text,
#accountMenuDesktop .tienda-cuenta-menu__item--logout:hover .tienda-cuenta-menu__icon--logout {
  color: var(--main);
}

.canvas-mb.offcanvas,
.modal-shopping-cart .modal-content {
  background-color: var(--tienda-elevado);
  box-shadow: var(--shadow1);
}

.icon-close-popup::before {
  content: "\e923";
  font-family: icomoon !important;
  font-size: 14px;
  line-height: 1;
}

.canvas-mb .tienda-cat-nav-panel-header,
#mobileAccount.canvas-mb .tienda-cuenta-mb-header,
.busqueda-shop .sidebar-filter .tienda-drawer-header,
.modal-shopping-cart .header {
  background-color: var(--tienda-elevado);
  border-bottom: 1px solid var(--line);
  min-height: 56px;
  margin: 0;
  padding: 12px 48px 12px 16px;
  align-items: center;
}

.canvas-mb .tienda-cat-nav-heading,
.busqueda-shop .sidebar-filter .tienda-drawer-header h5,
.modal-shopping-cart .header .title {
  color: var(--main);
  font-size: 15px;
  font-weight: 600;
  line-height: 22px;
}

.modal-shopping-cart .header {
  position: relative;
}

.modal-shopping-cart .header .btn-close {
  position: absolute;
  top: 12px;
  right: 10px;
  margin: 0;
  width: 32px;
  height: 32px;
  padding: 0;
  background-size: 12px;
  opacity: 0.65;
  z-index: 2;
}

.modal-shopping-cart .header .btn-close:hover {
  opacity: 1;
}

#mobileMenu.canvas-mb .tienda-cat-nav-back--header,
#mobileMenu.canvas-mb .tienda-cat-nav-back--header .icon,
.canvas-mb .tienda-cat-nav-ver-todo {
  color: var(--main);
}

.canvas-mb .tienda-cat-nav-ver-todo:hover,
#mobileMenu .tienda-cat-nav-link:hover,
#mobileMenu .tienda-cat-nav-link:active,
#mobileMenu .tienda-cat-nav-link:hover .icon,
#mobileMenu .tienda-cat-nav-link:active .icon {
  color: var(--primary);
}

#mobileMenu.canvas-mb .tienda-drawer-close,
#mobileAccount.canvas-mb .icon-close-popup,
.busqueda-shop .sidebar-filter .tienda-drawer-header .icon-close-popup {
  position: absolute;
  top: 12px;
  right: 10px;
  left: auto;
  width: 32px;
  height: 32px;
  color: var(--secondary);
  background: transparent;
  border-radius: 6px;
}

#mobileMenu.canvas-mb .tienda-drawer-close:hover,
#mobileAccount.canvas-mb .icon-close-popup:hover,
.busqueda-shop .sidebar-filter .tienda-drawer-header .icon-close-popup:hover {
  color: var(--primary);
  background-color: var(--rgba-primary);
  transform: none;
}

.busqueda-shop .sidebar-filter .tienda-drawer-header .icon-close-popup {
  margin: 0;
  padding: 0;
  gap: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  box-shadow: none;
  appearance: none;
  font-weight: 400;
  line-height: 1;
  text-transform: none;
  cursor: pointer;
}

.busqueda-shop .sidebar-filter .tienda-drawer-header .icon-close-popup::before {
  display: block;
  line-height: 1;
}

.busqueda-shop .sidebar-filter .tienda-drawer-header {
  position: relative;
  display: flex;
}

.busqueda-shop .sidebar-filter .tienda-drawer-header h5 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}

.busqueda-shop .widget-facet.facet-fieldset .facet-title {
  margin-bottom: 10px;
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  color: var(--secondary);
}

.busqueda-shop .widget-facet.facet-fieldset .fieldset-item label,
.busqueda-shop .busqueda-sidebar-sort .btn-select,
.busqueda-shop .busqueda-sidebar-sort .select-item,
.busqueda-shop .busqueda-filtro-facet-input {
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
}

#mobileMenu.canvas-mb .tienda-cat-nav-list {
  padding: 8px;
}

#mobileMenu.canvas-mb .tienda-cat-nav-list > li {
  border-bottom: 0;
}

#mobileMenu .tienda-cat-nav-link {
  border-radius: 8px;
  padding: 10px 12px;
  font-weight: 500;
}

#mobileMenu .tienda-cat-nav-link:hover,
#mobileMenu .tienda-cat-nav-link:active {
  background-color: var(--rgba-primary);
}

#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item:not(.tienda-cuenta-menu__item--logout):active,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item:not(.tienda-cuenta-menu__item--logout):hover,
#accountMenuDesktop .tienda-cuenta-menu__item:not(.tienda-cuenta-menu__item--logout):hover,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item--logout:active,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item--logout:hover,
#accountMenuDesktop .tienda-cuenta-menu__item--logout:hover {
  background-color: var(--tienda-hover);
  color: var(--main);
}

#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__icon,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item:not(.tienda-cuenta-menu__item--logout):hover .tienda-cuenta-menu__icon,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item:not(.tienda-cuenta-menu__item--logout):active .tienda-cuenta-menu__icon,
#accountMenuDesktop .tienda-cuenta-menu__item:not(.tienda-cuenta-menu__item--logout):hover .tienda-cuenta-menu__icon {
  color: var(--main);
}

#accountMenuDesktop .tienda-cuenta-menu__item--logout,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item--logout {
  margin-top: 6px;
  border-top: 0;
  border-radius: 6px;
}

#accountMenuDesktop .tienda-cuenta-menu__item--logout {
  padding: 7px 10px;
}

#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item--logout {
  padding: 10px;
}

#accountMenuDesktop .tienda-cuenta-menu__item--logout::before,
#mobileAccount.canvas-mb .tienda-cuenta-mb-menu .tienda-cuenta-menu__item--logout::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 10px;
  right: 10px;
  border-top: 1px solid var(--line);
}

.tienda-cuenta-menu__item--logout {
  position: relative;
}

.tienda-cuenta-menu__logout-btn {
  justify-content: flex-start;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 400;
  text-transform: none;
  border-radius: 0;
}

@media (max-width: 1199.98px) {
  .busqueda-shop .busqueda-sidebar .sidebar-filter.left {
    background-color: var(--tienda-elevado);
    box-shadow: var(--shadow1);
  }
}

@media (min-width: 1200px) {
  .busqueda-shop .busqueda-sidebar .sidebar-filter,
  .busqueda-shop .busqueda-sidebar .canvas-wrapper,
  .busqueda-shop .busqueda-sidebar .canvas-body {
    background-color: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .busqueda-shop .busqueda-sidebar .canvas-body {
    padding: 0 8px 0 0;
  }
}

#header.tienda-header .box-nav-ul .menu-item:hover .item-link,
#header.tienda-header .box-nav-ul .menu-item.active .item-link {
  color: var(--primary);
}

.form-search-select {
  border: 1px solid var(--line);
  background-color: var(--surface);
  border-radius: 8px;
}

.form-search-select input,
.header-search-mobile-inner input {
  background-color: transparent;
  color: var(--main);
}

.form-search-select .tf-btn {
  background-color: var(--primary);
  border-color: var(--primary);
  color: #FFFFFF;
  border-radius: 0;
}

.tf-btn:not(.btn-reset):not(.btn-white) {
  background-color: var(--primary);
  border-color: var(--primary);
  color: #FFFFFF;
  text-transform: none;
}

.tf-btn:not(.btn-reset)::after {
  content: none;
}

.tf-btn:not(.btn-reset):not(.btn-white):hover {
  background-color: #0095e8;
  border-color: #0095e8;
  color: #FFFFFF;
}

.btn-agregar-carrito:not(.btn-agregar-carrito-disabled) {
  background-color: var(--primary);
  border-color: var(--primary);
  color: #FFFFFF;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}

.btn-agregar-carrito:not(.btn-agregar-carrito-disabled):hover {
  background-color: #0095e8;
  border-color: #0095e8;
  color: #FFFFFF;
}

.btn-agregar-carrito.is-loading {
  position: relative;
  pointer-events: none;
  color: transparent !important;
}

.btn-agregar-carrito.is-loading svg {
  visibility: hidden;
}

.btn-agregar-carrito.is-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #FFFFFF;
  border-radius: 50%;
  animation: tienda-spin 0.6s linear infinite;
}

@keyframes tienda-spin {
  to {
    transform: rotate(360deg);
  }
}

.btn-agregar-whislist.is-loading {
  position: relative;
  pointer-events: none;
}

.btn-agregar-whislist.is-loading .icon {
  visibility: hidden;
}

.btn-agregar-whislist.is-loading .tooltip {
  display: none !important;
}

.btn-agregar-whislist.is-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: tienda-spin 0.6s linear infinite;
}

.tf-btn.btn-white,
.tf-btn.btn-reset:not(.btn-carrito-vaciar) {
  background-color: transparent;
  border: 1px solid var(--line);
  color: var(--main);
  text-transform: none;
}

.tf-btn.btn-white:hover,
.tf-btn.btn-reset:not(.btn-carrito-vaciar):hover {
  background-color: var(--rgba-primary);
  border-color: var(--primary);
  color: var(--primary);
}

.tf-btn.btn-reset.btn-carrito-vaciar {
  background-color: #F1416C !important;
  border-color: #F1416C !important;
  color: #FFFFFF !important;
}

.tf-btn.btn-reset.btn-carrito-vaciar:hover {
  background-color: #D9214E !important;
  border-color: #D9214E !important;
  color: #FFFFFF !important;
}

.page-mi-cuenta .tienda-mi-cuenta-nav__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  opacity: 1;
}

.page-mi-cuenta .tienda-mi-cuenta-nav__icon svg {
  display: block;
}

.page-mi-cuenta .tienda-mi-cuenta-sidebar {
  padding: 0;
}

.page-mi-cuenta .tienda-mi-cuenta-nav {
  gap: 2px;
}

.page-mi-cuenta .tienda-mi-cuenta-nav__item {
  gap: 10px;
  padding: 7px 10px;
  border-radius: 6px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}

.page-mi-cuenta .tienda-mi-cuenta-nav__item:hover,
.page-mi-cuenta .tienda-mi-cuenta-nav__item--active,
.page-mi-cuenta .tienda-mi-cuenta-nav__item--active:hover {
  background: var(--rgba-primary);
  color: var(--primary);
}

.page-mi-cuenta .tienda-mi-cuenta-nav__item--active {
  font-weight: 500;
}

.page-mi-cuenta .mi-cuenta-estrella {
  color: #FFC700;
  font-size: 14px;
  margin-left: 6px;
}

.page-mi-cuenta .mi-cuenta-acciones {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: nowrap;
  gap: 2px;
}

.page-mi-cuenta .mi-cuenta-acciones button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--secondary);
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
  text-transform: none;
}

.page-mi-cuenta .mi-cuenta-acciones button:hover {
  background: var(--tienda-hover);
  color: var(--main);
}

.page-mi-cuenta .mi-cuenta-accion--eliminar {
  color: #F1416C;
}

.page-mi-cuenta .mi-cuenta-accion--eliminar:hover {
  background: rgba(241, 65, 108, 0.12);
  color: #F1416C;
}

.tienda-footer .footer-wrap {
  background-color: var(--tienda-elevado);
  border-top: 1px solid var(--line);
}

.tienda-footer .footer-heading,
.tienda-footer .footer-info li i,
.tienda-footer .footer-menu .footer-menu_item,
.tienda-footer p {
  color: var(--secondary);
}

.tienda-footer .footer-menu .footer-menu_item:hover {
  color: var(--primary);
}

.tienda-footer .footer-heading-mobile::after,
.tienda-footer .footer-heading-mobile::before {
  background-color: var(--secondary);
}

.tienda-tema-btn {
  border: 0;
  background: transparent;
  padding: 0;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--main);
  cursor: pointer;
}

.tienda-tema-btn svg {
  display: block;
}

html.tienda-claro .tienda-tema-ico-claro,
html.tienda-oscuro .tienda-tema-ico-oscuro {
  display: none;
}

html.tienda-oscuro,
html.tienda-oscuro body,
html.tienda-oscuro #wrapper {
  background-color: var(--tienda-pagina);
  color: var(--main);
}

html.tienda-oscuro .offcanvas,
html.tienda-oscuro .modal-content,
html.tienda-oscuro .dropdown-menu,
html.tienda-oscuro .canvas-filter,
html.tienda-oscuro .tf-mini-cart-bottom,
html.tienda-oscuro .modal-shopping-cart .modal-content,
html.tienda-oscuro .bg-surface,
html.tienda-oscuro .box-order,
html.tienda-oscuro .tf-product-media-main .item,
html.tienda-oscuro .tf-product-media-thumbs .swiper-slide .item {
  background-color: var(--tienda-elevado);
  color: var(--main);
}

html.tienda-oscuro .tf-product-media-main .item,
html.tienda-oscuro .tf-product-media-thumbs .swiper-slide .item {
  background-color: #FFFFFF;
}

html.tienda-oscuro .bg-surface {
  background-color: var(--tienda-elevado) !important;
}

html.tienda-claro .bg-surface,
html.tienda-claro .box-order {
  background-color: var(--tienda-elevado) !important;
  border: 1px solid var(--line);
}

html.tienda-oscuro .offcanvas,
html.tienda-oscuro .modal-content,
html.tienda-oscuro .dropdown-menu {
  border-color: var(--line);
}

html.tienda-oscuro .btn-close {
  filter: invert(1);
}

#scroll-top {
  background-color: var(--tienda-elevado);
  border: 1px solid var(--line);
  box-shadow: 0 4px 14px rgba(24, 28, 50, 0.12);
}

#scroll-top svg path {
  stroke: var(--main);
}

#scroll-top:hover {
  background-color: var(--primary);
  border-color: var(--primary);
}

#scroll-top:hover svg path {
  stroke: #FFFFFF;
}

.tienda-whatsapp-float {
  background-color: var(--tienda-elevado);
  border: 1px solid var(--line);
  color: var(--main);
  box-shadow: 0 4px 14px rgba(24, 28, 50, 0.12);
}

.tienda-whatsapp-float .icon {
  color: inherit;
}

.tienda-whatsapp-float:hover {
  background-color: var(--primary);
  border-color: var(--primary);
  color: #FFFFFF;
  box-shadow: 0 4px 14px rgba(24, 28, 50, 0.12);
}

.tienda-moneda__btn {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--main);
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  text-transform: none;
  box-shadow: none;
}

.tienda-moneda__btn:hover,
.tienda-moneda__btn:focus,
.tienda-moneda__btn.show {
  background: transparent;
  color: var(--main);
  border-color: transparent;
  box-shadow: none;
}

.tienda-moneda__btn img,
.tienda-moneda__opcion img {
  display: block;
  width: 18px;
  height: 12px;
  object-fit: cover;
  border-radius: 2px;
}

.tienda-moneda__btn .icon {
  font-size: 10px;
  color: var(--secondary);
}

.tienda-moneda__menu {
  width: max-content;
  min-width: 0;
  margin-top: 8px;
  padding: 10px 12px;
  background: var(--tienda-elevado);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow1);
}

.tienda-moneda__tasa {
  margin: 0 0 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
  color: var(--main);
  font-size: 13px;
  line-height: 18px;
}

.tienda-moneda__titulo {
  margin: 8px 0 2px;
  color: var(--secondary);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
}

.tienda-moneda__tasa + .tienda-moneda__titulo {
  margin-top: 8px;
}

.tienda-moneda__opcion {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 5px 0;
  color: var(--main);
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  cursor: pointer;
}

.tienda-moneda__radio {
  appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  border: 2px solid #A1A5B7;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  flex-shrink: 0;
}

.tienda-moneda__radio:checked {
  border: 5px solid var(--primary);
  background: var(--tienda-elevado);
}

.tienda-moneda--menu {
  margin: 0 8px 8px;
  padding: 4px 10px 8px;
  border-bottom: 1px solid var(--line);
}

.tienda-cuenta-menu__switch .form-check-input {
  width: 2.5rem;
  height: 1.5rem;
  margin: 0;
  border: 0;
  border-radius: 3.25rem;
  background-color: #EFF2F5;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
  box-shadow: none;
}

.tienda-cuenta-menu__switch .form-check-input:focus,
.tienda-cuenta-menu__switch .form-check-input:active {
  border: 0;
  box-shadow: none;
  background-color: #EFF2F5;
}

.tienda-cuenta-menu__switch .form-check-input:checked,
.tienda-cuenta-menu__switch .form-check-input:checked:focus {
  background-color: var(--primary);
  border-color: var(--primary);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
  box-shadow: none;
}

html.tienda-oscuro .tienda-cuenta-menu__switch .form-check-input,
html.tienda-oscuro .tienda-cuenta-menu__switch .form-check-input:focus,
html.tienda-oscuro .tienda-cuenta-menu__switch .form-check-input:active {
  background-color: #2B2B40;
}

html.tienda-oscuro .tienda-cuenta-menu__switch .form-check-input:checked,
html.tienda-oscuro .tienda-cuenta-menu__switch .form-check-input:checked:focus {
  background-color: var(--primary);
}

html.tienda-oscuro .form-control,
html.tienda-oscuro .form-control:hover,
html.tienda-oscuro .form-control:focus,
html.tienda-oscuro select.form-control {
  background-color: var(--tienda-pagina);
  color: var(--main);
  border-color: var(--line);
  box-shadow: none;
}

html.tienda-oscuro .form-control:focus {
  border-color: var(--primary);
}

html.tienda-oscuro .form-control::placeholder {
  color: var(--secondary-2);
}

html.tienda-oscuro .form-control:-webkit-autofill,
html.tienda-oscuro .form-control:-webkit-autofill:hover,
html.tienda-oscuro .form-control:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--main);
  caret-color: var(--main);
  box-shadow: 0 0 0 1000px var(--tienda-pagina) inset;
}

.select2-container {
  width: 100% !important;
}

.select2-container--default .select2-selection--single {
  height: 46px;
  border: 2px solid var(--line);
  border-radius: 8px;
  background-color: var(--white);
  display: flex;
  align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--main);
  line-height: 26px;
  padding-left: 14px;
  padding-right: 32px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 44px;
  right: 8px;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--primary);
}

.select2-dropdown {
  background-color: var(--tienda-elevado);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  color: var(--main);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid var(--line);
  border-radius: 6px;
  background-color: var(--tienda-pagina);
  color: var(--main);
}

.select2-container--default .select2-results__option {
  color: var(--main);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--tienda-hover);
  color: var(--main);
}

.select2-container--default .select2-results__option[aria-selected=true] {
  background-color: var(--rgba-primary);
  color: var(--primary);
}

html.tienda-oscuro .select2-container--default .select2-selection--single,
html.tienda-oscuro .select2-dropdown,
html.tienda-oscuro .select2-container--default .select2-search--dropdown .select2-search__field {
  background-color: var(--tienda-pagina);
  color: var(--main);
  border-color: var(--line);
}

html.tienda-oscuro .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--main);
}

html.tienda-oscuro .card-product .card-product-info .title,
html.tienda-oscuro .card-product .price {
  color: var(--main);
}

html.tienda-oscuro .page-pagar-carrito .pagar-carrito-guia__item,
html.tienda-oscuro .page-pagar-carrito .pagar-stripe-card-wrap,
html.tienda-oscuro .page-pagar-carrito .pagar-cuenta-bancaria,
html.tienda-oscuro .page-pagar-carrito .pagar-domicilio-collapse-toggle,
html.tienda-oscuro .page-pagar-carrito .pagar-confirmacion-resumen {
  background: var(--tienda-pagina);
  color: var(--main);
}

html.tienda-oscuro .page-pagar-carrito .pagar-domicilio-collapse-toggle:hover,
html.tienda-oscuro .page-pagar-carrito .pagar-domicilio-collapse-toggle:focus,
html.tienda-oscuro .page-pagar-carrito .pagar-domicilio-collapse-toggle:focus-visible,
html.tienda-oscuro .page-pagar-carrito .pagar-domicilio-collapse-toggle:active,
html.tienda-oscuro .page-pagar-carrito .pagar-domicilio-collapse-toggle[aria-expanded="true"] {
  background: var(--tienda-hover);
  color: var(--main);
  border-color: var(--line);
}

html.tienda-oscuro .page-pagar-carrito .pagar-carrito-opcion:has(input:checked) {
  background: var(--rgba-primary);
  border-color: var(--primary);
}

html.tienda-oscuro .page-pagar-carrito .pagar-carrito-opcion input {
  accent-color: var(--primary);
}

html.tienda-oscuro .page-pagar-carrito .pagar-carrito-guia__thumb,
html.tienda-oscuro .page-carrito .tf-cart-item .img-box,
html.tienda-oscuro .modal-shopping-cart .tf-mini-cart-image {
  background: #FFFFFF;
}

html.tienda-oscuro .page-carrito .wg-quantity,
html.tienda-oscuro .modal-shopping-cart .wg-quantity {
  background: var(--tienda-pagina);
  border-color: var(--line);
}

/* Compras y cotizaciones: lista con miniaturas */
.tienda-docs {
  background: var(--tienda-elevado);
  border: 1px solid var(--line);
  border-radius: 12px;
}

.tienda-docs__vacio {
  margin: 0;
  padding: 48px 16px;
  text-align: center;
  color: var(--secondary);
  font-size: 14px;
}

@media (min-width: 768px) {
  .tienda-docs:has(.tienda-docs__row) {
    display: grid;
    grid-template-columns: max-content minmax(160px, 1fr) max-content minmax(220px, 0.6fr);
    column-gap: 24px;
  }

  .tienda-docs__head,
  .tienda-docs__row {
    grid-column: 1 / -1;
    grid-template-columns: subgrid;
  }

  .tienda-docs__head > :first-child,
  .tienda-docs__doc {
    padding-left: 20px;
  }

  .tienda-docs__head > :last-child,
  .tienda-docs__monto {
    padding-right: 20px;
  }

  .tienda-docs__head > span {
    text-align: left;
  }

  .tienda-docs__head > :last-child {
    text-align: right;
    padding-right: 100px;
  }
}

.tienda-docs__head,
.tienda-docs__row {
  display: grid;
  align-items: center;
  padding: 14px 0;
}

.tienda-docs__head {
  color: var(--secondary-2);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--line);
}

.tienda-docs__row + .tienda-docs__row {
  border-top: 1px solid var(--line);
}

.tienda-docs__folio {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.tienda-docs__folio-num {
  color: var(--primary);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tienda-docs__tipo {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 16px;
  padding: 1px 6px;
  border-radius: 4px;
}

.tienda-docs__tipo--factura {
  color: #50CD89;
  background: rgba(80, 205, 137, 0.14);
}

.tienda-docs__tipo--compra {
  color: var(--primary);
  background: var(--rgba-primary);
}

.tienda-docs__tipo--cotizacion,
.tienda-docs__tipo--pago {
  color: var(--secondary);
  background: var(--surface);
}

.tienda-docs__fecha,
.tienda-docs__venta,
.tienda-docs__sin-foto,
.tienda-docs__metodo {
  display: block;
  margin-top: 2px;
  color: var(--secondary-2);
  font-size: 12px;
  line-height: 18px;
}

.tienda-docs__venta:hover {
  color: var(--primary);
}

.tienda-docs__thumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 6px;
}

.tienda-docs__thumb {
  position: relative;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  flex-shrink: 0;
}

a.tienda-docs__thumb {
  display: block;
  color: inherit;
  text-decoration: none;
}

a.tienda-docs__thumb:hover {
  border-color: var(--primary);
}

.tienda-docs--skeleton .skeleton {
  display: block;
  flex-shrink: 0;
  margin: 0;
  opacity: 1;
  background-color: var(--line);
}

html.tienda-oscuro .tienda-docs--skeleton .skeleton {
  background-color: #3F4254;
}

.tienda-docs--skeleton .tienda-docs__skeleton-folio {
  width: 112px;
  height: 16px;
}

.tienda-docs--skeleton .tienda-docs__skeleton-tipo {
  width: 62px;
  height: 16px;
  border-radius: 4px;
}

.tienda-docs--skeleton .tienda-docs__skeleton-fecha {
  width: 148px;
  height: 12px;
  margin-top: 8px;
}

.tienda-docs--skeleton .tienda-docs__skeleton-metodo {
  width: 140px;
  height: 14px;
}

.tienda-docs--skeleton .tienda-docs__skeleton-estado {
  width: 108px;
  height: 14px;
}

.tienda-docs--skeleton .tienda-docs__skeleton-total {
  width: 92px;
  height: 16px;
  margin-right: 8px;
}

.tienda-docs--skeleton .tienda-docs__skeleton-accion {
  width: 32px;
  height: 32px;
  border-radius: 8px;
}

.tienda-docs--skeleton .tienda-docs__skeleton-thumb {
  width: 48px;
  height: 48px;
  border-radius: 10px;
}

.tienda-docs--skeleton .tienda-docs__row:nth-child(2n) .tienda-docs__skeleton-folio {
  width: 88px;
}

.tienda-docs--skeleton .tienda-docs__row:nth-child(3n) .tienda-docs__skeleton-fecha {
  width: 120px;
}

.tienda-docs--skeleton .tienda-docs__row:nth-child(2n) .tienda-docs__skeleton-estado {
  width: 84px;
}

.tienda-docs--skeleton .tienda-docs__row:nth-child(3n) .tienda-docs__skeleton-total {
  width: 72px;
}

@media (max-width: 767px) {
  .tienda-docs--skeleton .tienda-docs__doc,
  .tienda-docs--skeleton .tienda-docs__monto {
    min-width: 0;
  }

  .tienda-docs--skeleton .tienda-docs__skeleton-folio {
    width: 88px;
  }

  .tienda-docs--skeleton .tienda-docs__skeleton-fecha {
    width: 112px;
  }

  .tienda-docs--skeleton .tienda-docs__skeleton-total {
    width: 56px;
    margin-right: 0;
  }
}

.tienda-docs__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  border-radius: 9px;
}


.tienda-docs__cant {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  border-radius: 999px;
  background: #181C32;
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 600;
  line-height: 22px;
  text-align: center;
  z-index: 1;
}

.tienda-docs__popover {
  display: none;
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%);
  width: max-content;
  max-width: 220px;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--tienda-elevado);
  border: 1px solid var(--line);
  box-shadow: var(--shadow2);
  z-index: 4;
  pointer-events: none;
}

.tienda-docs__thumb:hover .tienda-docs__popover,
.tienda-docs__thumb:focus .tienda-docs__popover {
  display: block;
}

.tienda-docs__popover-nombre,
.tienda-docs__popover-sku {
  display: block;
}

.tienda-docs__popover-nombre {
  color: var(--main);
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
}

.tienda-docs__popover-sku {
  margin-top: 2px;
  color: var(--secondary);
  font-size: 12px;
  line-height: 16px;
}

.tienda-docs__estado-nombre {
  display: block;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  color: var(--main);
}

.tienda-docs__estado-nombre--activo {
  color: var(--primary);
}

.tienda-docs__estado-nombre--ok {
  color: var(--success);
}

.tienda-docs__estado-nombre--aviso {
  color: #E8A317;
}

.tienda-docs__estado-nombre--critico {
  color: #F1416C;
}

.tienda-docs__pasos {
  display: flex;
  align-items: center;
  margin-top: 8px;
}

.tienda-docs__paso {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--line);
  flex-shrink: 0;
}

.tienda-docs__paso-linea {
  width: 22px;
  height: 2px;
  background: var(--line);
  flex-shrink: 0;
}

.tienda-docs__pasos--activo .is-hecho,
.tienda-docs__pasos--activo .is-actual {
  background: var(--primary);
}

.tienda-docs__pasos--ok .is-hecho,
.tienda-docs__pasos--ok .is-actual {
  background: var(--success);
}

.tienda-docs__pasos--aviso .is-hecho,
.tienda-docs__pasos--aviso .is-actual {
  background: #E8A317;
}

.tienda-docs__monto {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

.tienda-docs__total {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: var(--main);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  margin-right: 8px;
}

.tienda-docs__clave {
  font-weight: 500;
  color: var(--secondary);
}

.tienda-docs__accion {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: var(--secondary);
  font-size: 13px;
}

.tienda-docs__accion:hover {
  color: var(--primary);
  background: var(--rgba-primary);
}

@media (max-width: 767px) {
  .tienda-docs__head {
    display: none;
  }

  .tienda-docs__row {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "doc monto"
      "productos productos"
      "estado estado";
    gap: 12px 16px;
    padding: 16px;
  }

  .tienda-docs__doc { grid-area: doc; }
  .tienda-docs__monto { grid-area: monto; }
  .tienda-docs__productos { grid-area: productos; }
  .tienda-docs__estado { grid-area: estado; }
}

.wg-pagination .pagination-item {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--secondary);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}

.wg-pagination li:hover .pagination-item {
  background: var(--rgba-primary);
  border-color: transparent;
  color: var(--primary);
}

.wg-pagination li.active .pagination-item,
.wg-pagination li.active:hover .pagination-item {
  background: var(--primary);
  border-color: transparent;
  color: #FFFFFF;
}

.wg-pagination .pagination-item--fijo,
.wg-pagination li:hover .pagination-item--fijo {
  background: transparent;
  color: var(--secondary-2);
  cursor: default;
  opacity: 0.55;
}

.font-main,
.font-2,
.font-3,
.text-btn-uppercase2 {
  font-family: Poppins, sans-serif !important;
}

.tienda-icono {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  flex-shrink: 0;
}

.tienda-fila-sale {
  animation: tienda-fila-sale 0.18s ease forwards;
}

.tf-mini-cart-item.tienda-mini-sale {
  animation: tienda-mini-sale 0.18s ease forwards;
}

@keyframes tienda-mini-sale {
  to {
    opacity: 0;
    transform: translateX(16px);
  }
}

@keyframes tienda-fila-sale {
  to {
    opacity: 0;
  }
}

.tienda-doc__barra {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}

.tienda-doc__volver {
  color: var(--secondary);
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
}

.tienda-doc__volver:hover {
  color: var(--primary);
}

.tienda-doc__acciones {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.tienda-doc__pdf.tf-btn {
  padding: 4px 10px;
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  gap: 0;
  text-transform: none;
}

.tienda-doc {
  display: grid;
  gap: 16px;
  align-items: start;
}

@media (min-width: 992px) {
  .tienda-doc {
    grid-template-columns: minmax(0, 1fr) 320px;
  }
}

.tienda-doc__panel {
  background: var(--tienda-elevado);
  border: 1px solid var(--line);
  border-radius: 12px;
  min-width: 0;
}

.tienda-doc__cabecera {
  padding: 20px;
  border-bottom: 1px solid var(--line);
}

.tienda-doc__folio {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.tienda-doc__folio-num {
  margin: 0;
  color: var(--main);
  font-size: 22px;
  font-weight: 600;
  line-height: 28px;
}

.tienda-doc__fecha,
.tienda-doc__comentario,
.tienda-doc__dato,
.tienda-doc__nota,
.tienda-doc__vacio {
  margin: 8px 0 0;
  color: var(--secondary);
  font-size: 13px;
  line-height: 20px;
}

.tienda-doc__estado {
  margin-top: 12px;
}

.tienda-doc__vacio {
  padding: 28px 20px;
  text-align: center;
}

.tienda-doc__partida {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding: 16px 20px;
}

.tienda-doc__partida--pago {
  grid-template-columns: minmax(0, 1fr) auto;
}

.tienda-doc__partida + .tienda-doc__partida {
  border-top: 1px solid var(--line);
}

.tienda-doc__foto {
  width: 64px;
  height: 64px;
  border-radius: 10px;
  background: #FFFFFF;
  border: 1px solid var(--line);
  overflow: hidden;
}

a.tienda-doc__foto {
  display: block;
  text-decoration: none;
}

a.tienda-doc__foto:hover {
  border-color: var(--primary);
}

.tienda-doc__foto img,
.tienda-doc__vistas img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}


.tienda-doc__nombre {
  color: var(--main);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}

a.tienda-doc__nombre:hover {
  color: var(--primary);
}

.tienda-doc__meta,
.tienda-doc__desc {
  margin: 2px 0 0;
  color: var(--secondary-2);
  font-size: 12px;
  line-height: 18px;
}

.tienda-doc__desc--plano {
  white-space: pre-line;
}

.tienda-doc__sku::before {
  content: " · ";
}

.tienda-doc__importe {
  color: var(--main);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.tienda-doc__vistas {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.tienda-doc__vistas img {
  width: auto;
  height: 64px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #FFFFFF;
}

.tienda-doc__lado {
  padding: 20px;
}

.tienda-doc__titulo {
  margin: 0 0 12px;
  color: var(--main);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}

.tienda-doc__fila {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  color: var(--secondary);
  font-size: 13px;
  line-height: 20px;
}

.tienda-doc__fila + .tienda-doc__fila {
  margin-top: 8px;
}

.tienda-doc__fila span:last-child {
  color: var(--main);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.tienda-doc__fila--total {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--main);
  font-size: 16px;
  font-weight: 600;
}

.tienda-doc__fila--principal {
  color: var(--main);
  font-size: 16px;
  font-weight: 600;
}

.tienda-doc__fila--saldo span:last-child {
  color: #F1416C;
  font-weight: 600;
}

.tienda-doc__bloque {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.tienda-doc__dato strong {
  color: var(--main);
  font-weight: 600;
}

.tienda-doc__cfdi + .tienda-doc__cfdi {
  margin-top: 12px;
}

.tienda-doc__cfdi-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 4px 0 0;
  font-size: 13px;
}

.tienda-doc__cfdi-links a {
  color: var(--primary);
  font-weight: 500;
}

.tienda-doc__nota {
  margin-top: 16px;
}

/* El tema muestra el mega menú solo con :hover. En claro, al salir el cursor
   el panel (fondo blanco) y la opción se pierden. Abierto por clic, se queda. */
#header.tienda-header .tienda-desktop-nav-click .menu-item.is-open > .sub-menu {
  pointer-events: all;
  opacity: 1;
  visibility: visible;
  transform: none;
  background-color: var(--tienda-elevado);
  color: var(--main);
}

#header.tienda-header .tienda-desktop-nav-click .menu-item.is-open > .item-link,
#header.tienda-header .tienda-desktop-nav-click .menu-item:hover > .item-link {
  color: var(--primary);
}

#header.tienda-header .mega-menu .menu-heading {
  color: var(--main);
}

#header.tienda-header .mega-menu .menu-link-text {
  color: var(--secondary);
}

.box-nav-ul .mega-menu .row {
  align-items: flex-start;
}
.box-nav-ul .mega-menu .sub-menu-contenedor {
  margin-bottom: 16px;
}
.box-nav-ul .mega-menu .sub-menu-contenedor .menu-heading {
  display: block;
  margin-top: 0;
  margin-bottom: 4px;
}
.box-nav-ul .mega-menu .menu-list {
  margin: 0;
  padding: 0;
}

@media (max-width: 575px) {
  .tienda-doc__partida {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .tienda-doc__partida--pago {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .tienda-doc__importe {
    grid-column: 2;
  }
}