.store-demo-shell {
  --store-accent: #10b981;
  --store-ink: #202124;
  --store-muted: #6f7480;
  --store-line: #e8eaee;
  --store-surface: #ffffff;
  --store-soft: #f7f9fb;
}

html.brandmark-store-builder-html,
body.brandmark-store-builder-body {
  min-height: 100%;
  margin: 0;
  background: #f5f7fa;
}

body:has(.store-demo-shell) #magic-cursor,
body:has(.store-demo-shell) .cursor,
body:has(.store-demo-shell) .dot {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

body:has(.store-demo-shell) > #preloader,
body:has(.store-demo-shell) > .preloader,
body:has(.store-demo-shell) #preloader,
body:has(.store-demo-shell) .preloader {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

body:has(.store-demo-shell) {
  cursor: auto;
}

body:has(.store-demo-shell) a,
body:has(.store-demo-shell) button {
  cursor: pointer;
}

.store-demo-shell *,
.store-demo-shell *::before,
.store-demo-shell *::after {
  box-sizing: border-box;
}

.store-demo-shell a {
  color: inherit;
  text-decoration: none;
}

.store-demo-shell .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 12px 22px;
  color: var(--store-ink);
  border: 1px solid var(--store-line);
  border-radius: 12px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.store-demo-shell .btn-text,
.store-demo-shell .btn-icon-animation {
  position: relative;
  z-index: 1;
}

.store-demo-card {
  background: var(--store-surface);
  border: 1px solid var(--store-line);
  border-radius: 16px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.04);
}

.store-demo-workspace {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  width: 100vw;
  min-height: 100vh;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #f5f7fa;
}

.store-demo-sidebar {
  min-height: 100vh;
  background: #ffffff;
  border-right: 1px solid var(--store-line);
}

.store-demo-sidebar-panel {
  position: sticky;
  top: 0;
  padding: 32px 26px;
}

.store-demo-main {
  min-width: 0;
  padding: 32px;
}

.store-demo-main-panel {
  width: 100%;
  min-height: calc(100vh - 64px);
}

.store-demo-page-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  margin-bottom: 32px;
}

.store-demo-page-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex-wrap: wrap;
}

.store-demo-page-head h2 {
  font-size: clamp(32px, 4vw, 56px);
  line-height: 1.05;
  letter-spacing: 0;
}

.store-demo-store-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 22px;
}

.store-demo-store-card {
  min-height: 230px;
  padding: 24px;
  background: #ffffff;
  border: 1px solid var(--store-line);
  border-radius: 14px;
}

.store-demo-danger-button {
  color: #b42318;
  background: #ffffff;
  border: 1px solid #ffd7d3;
}

.store-demo-danger-button:hover {
  color: #ffffff;
  background: #d92d20;
  border-color: #d92d20;
}

.store-demo-danger-button:disabled {
  opacity: 0.55;
  pointer-events: none;
}

.store-demo-nav-link {
  color: #566071;
  background: #ffffff;
  border: 1px solid transparent;
}

.store-demo-nav-link.is-active {
  color: #ffffff;
  background: #202124;
}

.store-demo-nav-link:hover {
  color: #202124;
  background: #f3f5f7;
}

.store-demo-stat {
  min-height: 148px;
}

.store-demo-empty {
  display: grid;
  min-height: 260px;
  place-items: center;
  text-align: center;
}

.store-demo-empty--wide {
  min-height: calc(100vh - 260px);
  padding: 48px;
  background: #ffffff;
  border: 1px solid var(--store-line);
  border-radius: 14px;
}

.store-demo-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.store-demo-form-grid .grid-column-full {
  grid-column: 1 / -1;
}

.store-demo-color-input {
  display: block;
  width: 72px;
  height: 44px;
  padding: 4px;
  background: #ffffff;
}

.store-demo-color-input::-webkit-color-swatch-wrapper {
  padding: 0;
}

.store-demo-color-input::-webkit-color-swatch {
  border: 0;
  border-radius: 6px;
}

.store-demo-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.store-demo-status {
  min-height: 24px;
  color: var(--store-muted);
}

.store-demo-editor-page {
  width: 100vw;
  min-height: 100vh;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #f5f7fa;
}

.store-demo-editor-topbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 84px;
  padding: 16px 28px;
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid var(--store-line);
  backdrop-filter: blur(10px);
}

.store-demo-editor-title {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 14px;
}

.store-demo-editor-title h1 {
  margin: 0;
  font-size: 24px;
  line-height: 1.15;
  letter-spacing: 0;
}

.store-demo-editor-kicker {
  display: block;
  margin-bottom: 3px;
  color: var(--store-accent);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.store-demo-editor-back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: var(--store-ink);
  background: #ffffff;
  border: 1px solid var(--store-line);
  border-radius: 999px;
  flex: 0 0 auto;
}

.store-demo-editor-back:hover {
  color: #ffffff;
  background: var(--store-ink);
}

.store-demo-editor-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.store-demo-editor-actions .btn.bg-main-600,
.store-demo-actions .btn.bg-main-600 {
  color: #ffffff !important;
  background: linear-gradient(90deg, #08245c 0%, #12c4cc 100%) !important;
  border: 0 !important;
}

.store-demo-editor-actions .btn.bg-main-600 .btn-text,
.store-demo-editor-actions .btn.bg-main-600 i,
.store-demo-actions .btn.bg-main-600 .btn-text,
.store-demo-actions .btn.bg-main-600 i {
  color: #ffffff !important;
}

.store-demo-editor-actions .btn.bg-white,
.store-demo-actions .btn.bg-white {
  color: var(--store-ink) !important;
}

.store-demo-editor-shell {
  width: 100%;
  min-height: calc(100vh - 84px);
  background: #ffffff;
}

.store-demo-editor-mount {
  min-height: calc(100vh - 84px);
}

.store-demo-editor-page #puck-canvas-root,
.store-demo-editor-page #puck-preview {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.store-demo-editor-page #puck-canvas-root::-webkit-scrollbar,
.store-demo-editor-page #puck-preview::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.store-demo-preview-mount {
  background: #ffffff;
  border: 1px solid var(--store-line);
  border-radius: 16px;
  overflow: hidden;
}

.store-demo-preview-page {
  width: 100vw;
  min-height: 100vh;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #ffffff;
}

.store-demo-preview-topbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 84px;
  padding: 16px 28px;
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid var(--store-line);
  backdrop-filter: blur(10px);
}

.store-demo-preview-title {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 14px;
}

.store-demo-preview-title h1 {
  margin: 0;
  font-size: 24px;
  line-height: 1.15;
  letter-spacing: 0;
}

.store-demo-preview-error {
  padding: 32px;
  background: #f5f7fa;
}

.store-demo-preview-mount--full {
  min-height: calc(100vh - 84px);
  border: 0;
  border-radius: 0;
}

.store-demo-preview-mount .printx-store-theme a {
  text-decoration: none;
}

.printx-encabezado,
.printx-encabezado > .tp-header__area {
  background-color: var(--tp-common-white);
}

.printx-servicios {
  padding: clamp(56px, 5.2vw, 100px) 0;
  color: #242424;
  background: #f7f6f2;
  background-image: radial-gradient(rgba(85, 73, 53, .035) .5px, transparent .5px);
  background-size: 3px 3px;
}

.printx-servicios__contenedor {
  width: min(calc(100% - clamp(40px, 10vw, 200px)), 1600px);
  margin: 0 auto;
}

.printx-servicios__titulo {
  margin: 0 0 48px;
  color: inherit;
  text-align: center;
}

.printx-servicios__lista {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(32px, 3.3vw, 64px);
}

.printx-servicios__elemento {
  position: relative;
  display: grid;
  grid-template-columns: clamp(76px, 5.6vw, 108px) minmax(0, 1fr);
  align-items: start;
  gap: clamp(20px, 1.7vw, 32px);
}

.printx-servicios__elemento + .printx-servicios__elemento::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(clamp(32px, 3.3vw, 64px) / -2);
  border-left: 2px dashed #dcdad5;
  content: "";
}

.printx-servicios__icono {
  position: relative;
  display: grid;
  aspect-ratio: 1;
  place-items: center;
  color: #242424;
  background: rgba(255, 255, 255, .55);
  border-radius: 50%;
}

.printx-servicios__aro {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  stroke: #b91f28;
  stroke-width: 3.5;
  stroke-dasharray: 89 9 48 8 60 9 82 9;
  transform: rotate(-21deg);
}

.printx-servicios__simbolo,
.printx-servicios__icono img {
  width: 56%;
  height: 56%;
  object-fit: contain;
}

.printx-servicios__detalle {
  stroke: #b91f28;
}

.printx-servicios__contenido h4 {
  margin: 2px 0 12px;
  color: inherit;
  font-size: clamp(21px, 1.5vw, 28px);
  font-weight: 700;
  line-height: 1.3;
  text-transform: none;
}

.printx-servicios__contenido p {
  margin: 0;
  color: #4a4a48;
  font-size: clamp(16px, 1.15vw, 21px);
  font-weight: 400;
  line-height: 1.6;
}

@media (max-width: 1000px) {
  .printx-servicios__contenedor {
    max-width: 640px;
  }

  .printx-servicios__lista {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .printx-servicios__elemento {
    grid-template-columns: 84px minmax(0, 1fr);
    gap: 24px;
  }

  .printx-servicios__elemento + .printx-servicios__elemento {
    padding-top: 32px;
  }

  .printx-servicios__elemento + .printx-servicios__elemento::before {
    right: 0;
    bottom: auto;
    left: 0;
    border-top: 2px dashed #dcdad5;
    border-left: 0;
  }
}

@media (max-width: 400px) {
  .printx-servicios__elemento {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 18px;
  }
}

.store-demo-preview-mount .printx-store-theme .tp-header__transparent,
.store-demo-preview-mount .printx-store-theme .tp-header__area {
  position: static;
}

.store-demo-preview-mount .printx-store-theme .tp-product__filter select {
  display: block;
  width: 100%;
  height: 64px;
  padding: 0 25px;
  background: #ffffff;
  border: 0;
}

.store-demo-preview-mount .printx-store-theme .tp-shop-details__quantity button {
  background: transparent;
  border: 0;
}

@media (max-width: 991px) {
  .store-demo-workspace {
    grid-template-columns: 1fr;
  }

  .store-demo-sidebar {
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--store-line);
  }

  .store-demo-sidebar-panel {
    position: static;
  }

  .store-demo-main {
    padding: 24px;
  }

  .store-demo-page-head {
    flex-direction: column;
  }

  .store-demo-form-grid {
    grid-template-columns: 1fr;
  }

  .store-demo-editor-topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .store-demo-preview-topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .store-demo-editor-actions {
    justify-content: flex-start;
    width: 100%;
  }

}

@media (max-width: 575px) {
  .store-demo-card {
    border-radius: 12px;
  }
}
.tp-shop-details__variation-list {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-left: 17px;
  vertical-align: middle;
}

.tp-shop-details__variation-list .tp-color-variation-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  padding: 3px;
  line-height: 0;
  transform: none;
  background-color: #ffffff;
  border: 1px solid #e8e8e8;
  border-radius: 4px;
}

.tp-shop-details__variation-list .tp-color-variation-btn span {
  display: block;
  width: 20px;
  height: 20px;
  margin: 0;
  border-radius: 2px;
}

.tp-shop-details__variation-list .tp-color-variation-btn.is-active span {
  outline: 2px solid var(--tp-common-black);
  outline-offset: 3px;
}

.tp-shop-widget-checkbox-circle-list > ul {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
  padding: 0;
}

.tp-shop-widget-checkbox-circle-list > ul > li,
.tp-shop-widget-checkbox-circle-list > ul > li:not(:last-child) {
  display: block;
  margin: 0;
  line-height: 0;
}

.tp-shop-widget-checkbox-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background-color: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
}

.tp-shop-widget-checkbox-circle > input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  opacity: 0;
  pointer-events: none;
}

.tp-shop-widget-checkbox-circle > .tp-shop-widget-checkbox-circle-self {
  position: static;
  display: block;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 2px;
  cursor: pointer;
}

.tp-shop-widget-checkbox-circle > .tp-shop-widget-checkbox-circle-self::after {
  content: none;
}

.tp-shop-widget-checkbox-circle > input:checked + .tp-shop-widget-checkbox-circle-self {
  outline: 2px solid var(--tp-common-black);
  outline-offset: 3px;
}

.tp-fea-product__textures {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  gap: 8px;
  margin-top: 14px;
  padding: 2px;
  overflow-x: visible;
}

.tp-fea-product__texture {
  display: block;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  padding: 3px;
  overflow: hidden;
  background-color: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 50%;
}

.tp-fea-product__texture img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.tp-fea-product__texture-color {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

.tp-shop-details__tab-btn-box .tp-bm-producto-miniatura {
  display: block;
  width: 84px;
  height: 104px;
  object-fit: contain;
}

.tp-shop-details__size > button {
  display: inline-block;
  padding: 4px 13px;
  margin-right: 7px;
  color: var(--tp-common-black);
  background-color: transparent;
  border: 1px solid #e8e8e8;
  font-size: 12px;
  line-height: 20px;
  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.tp-shop-details__size > button:hover:not(:disabled),
.tp-shop-details__size > button.active:not(:disabled) {
  color: var(--tp-common-white);
  background-color: var(--tp-common-purple-2);
  border-color: var(--tp-common-purple-2);
}

.tp-shop-details__size > button:disabled {
  color: var(--tp-grey-1);
  cursor: not-allowed;
  opacity: 0.55;
  text-decoration: line-through;
}

.tp-shop-details__quantity .tp-cart-minus,
.tp-shop-details__quantity .tp-cart-plus {
  padding: 0;
  background: transparent;
  border: 0;
}

.tp-shop-details__quantity .tp-cart-minus:disabled,
.tp-shop-details__quantity .tp-cart-plus:disabled,
.tp-shop-details__btn .tp-btn-square:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.tp-shop-details__btn .tp-btn-square:disabled:hover {
  color: var(--tp-common-white);
  background-color: var(--tp-common-purple-2);
}

.tp-breadcrumb-height {
  padding-top: 45px;
  padding-bottom: 45px;
}

/* El encabezado amplio es una eleccion explicita desde el bloque de Puck. */
.tp-breadcrumb--amplio.tp-breadcrumb-height {
  padding-top: 130px;
  padding-bottom: 145px;
}

@media (max-width: 991px) {
  .tp-breadcrumb--amplio.tp-breadcrumb-height {
    padding: 120px 0;
  }
}

.tp-breadcrumb--compacto.tp-breadcrumb--producto.tp-breadcrumb-height {
  padding-top: 45px;
  padding-bottom: 45px;
}

/* El carrito conserva un encabezado compacto en todos los puntos de quiebre. */
.tp-breadcrumb--carrito.tp-breadcrumb-height {
  padding-top: 45px;
  padding-bottom: 45px;
}

/* Los datos de contacto pueden contener correos, telefonos o direcciones largas. */
.tp-contact-4__item,
.tp-contact-4__text {
  min-width: 0;
}

.tp-contact-4__text a,
.tp-contact-4__text span {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Conserva el balance del encabezado original cuando el contacto se desactiva. */
@media (min-width: 1400px) {
  .tp-header__right-box--sin-chat {
    padding-right: 200px;
  }
}

@media (max-width: 767px) {
  .tp-contact-4__location iframe {
    height: 360px;
  }

  .tp-shop-details__tab-btn-box .tp-bm-producto-miniatura {
    width: 64px;
    height: 80px;
  }
}

/* Si un script no llega a ejecutarse, la capa tampoco puede bloquear la tienda. */
#preloader {
  animation: bm-finalizar-precarga 0s 4s forwards;
}
@keyframes bm-finalizar-precarga {
  to {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
}