/* ============================================================
   HEALTECH — OpenCart 4 Theme Override
   Brand: Purple #A134BC · Gold #C9A84C
   Fonts: Poppins (heading) · Cormorant Garamond (display) · Inter (body)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&family=Poppins:wght@400;500;600;700&family=Inter:wght@400;500;600&display=swap');

:root {
  --ht-primary:       #A134BC;
  --ht-primary-hover: #8B2AA0;
  --ht-gold:          #C9A84C;
  --ht-dark:          #2E294E;
  --ht-charcoal:      #1C1C2E;
  --ht-text:          #2D2D3A;
  --ht-muted:         #6B7280;
  --ht-border:        #E8E3EE;
  --ht-white:         #FFFFFF;
  --ht-pale:          #FAF3FD;
  --ht-nav-height:    72px;
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-heading:  'Poppins', sans-serif;
  --font-body:     'Inter', sans-serif;
}

/* ── Base ──────────────────────────────────────────────── */
body {
  font-family: var(--font-body);
  color: var(--ht-text);
  background: #fff;
}

h1, h2 { font-family: var(--font-display); font-weight: 600; color: var(--ht-charcoal); }
h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; color: var(--ht-charcoal); }

/* ── Override Bootstrap primary color ─────────────────── */
.btn-primary { background-color: var(--ht-primary) !important; border-color: var(--ht-primary) !important; font-family: var(--font-heading); font-weight: 600; }
.btn-primary:hover { background-color: var(--ht-primary-hover) !important; border-color: var(--ht-primary-hover) !important; }
.btn-outline-primary { color: var(--ht-primary) !important; border-color: var(--ht-primary) !important; }
.btn-outline-primary:hover { background-color: var(--ht-primary) !important; color: #fff !important; }

/* ── HealTech Nav ──────────────────────────────────────── */
.ht-nav {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--ht-white);
  border-bottom: 1px solid var(--ht-border);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  height: var(--ht-nav-height);
  display: flex;
  align-items: center;
}

.ht-nav__inner {
  max-width: 1240px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(1rem,4vw,2rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

.ht-nav__logo {
  display: flex;
  align-items: center;
  gap: .625rem;
  text-decoration: none;
  flex-shrink: 0;
}

.ht-nav__logo img { height: 40px; width: auto; }

.ht-nav__logo-text {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 1.2rem;
  color: var(--ht-primary);
  letter-spacing: -.02em;
}

.ht-nav__links {
  display: flex;
  align-items: center;
  gap: .25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ht-nav__link {
  font-family: var(--font-heading);
  font-size: .82rem;
  font-weight: 500;
  color: var(--ht-text);
  text-decoration: none;
  padding: .45rem .75rem;
  border-radius: 6px;
  transition: background .2s, color .2s;
  white-space: nowrap;
}

.ht-nav__link:hover,
.ht-nav__link.active { background: var(--ht-pale); color: var(--ht-primary); }

.ht-nav__actions {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-shrink: 0;
}

.ht-lang-btn {
  display: flex;
  background: #f4f1f9;
  border-radius: 20px;
  padding: 3px;
  gap: 2px;
}

.ht-lang-btn a {
  font-family: var(--font-heading);
  font-size: .75rem;
  font-weight: 600;
  color: var(--ht-muted);
  text-decoration: none;
  padding: .25rem .6rem;
  border-radius: 18px;
  transition: background .2s, color .2s;
}

.ht-lang-btn a.active,
.ht-lang-btn a:hover {
  background: var(--ht-primary);
  color: #fff;
}

.ht-cart-btn {
  display: flex;
  align-items: center;
  gap: .4rem;
  background: var(--ht-primary);
  color: #fff !important;
  border: none;
  border-radius: 8px;
  padding: .45rem 1rem;
  font-family: var(--font-heading);
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s, transform .15s;
}

.ht-cart-btn:hover { background: var(--ht-primary-hover); transform: translateY(-1px); }

/* ── Hide default OpenCart top bar & header ────────────── */
#top, header { display: none !important; }

/* ── Redesign category menu ───────────────────────────── */
#menu {
  background: var(--ht-dark) !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 clamp(1rem,4vw,2rem) !important;
}

#menu .navbar-nav > li > a {
  font-family: var(--font-heading);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .03em;
  color: rgba(255,255,255,.85) !important;
  text-shadow: none !important;
  padding: .65rem 1rem !important;
  border-radius: 0;
  transition: color .2s, background .2s;
}

#menu .navbar-nav > li > a:hover { color: #fff !important; background: rgba(255,255,255,.1) !important; }

#menu .dropdown-menu {
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,.15);
  border: 1px solid var(--ht-border);
  font-family: var(--font-heading);
  font-size: .84rem;
}

/* ── Hero section ──────────────────────────────────────── */
.ht-hero {
  background: linear-gradient(135deg, var(--ht-pale) 0%, #fff5fe 50%, #fff 100%);
  padding: clamp(3rem,8vw,6rem) clamp(1rem,4vw,2rem);
  text-align: center;
  border-bottom: 1px solid var(--ht-border);
  position: relative;
  overflow: hidden;
}

.ht-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 70% 30%, rgba(161,52,188,.08) 0%, transparent 60%);
  pointer-events: none;
}

.ht-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: var(--ht-pale);
  border: 1px solid rgba(161,52,188,.2);
  color: var(--ht-primary);
  font-family: var(--font-heading);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .35rem .9rem;
  border-radius: 20px;
  margin-bottom: 1.25rem;
}

.ht-hero__title {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 5vw, 3.75rem);
  font-weight: 600;
  color: var(--ht-charcoal);
  line-height: 1.1;
  margin-bottom: 1rem;
}

.ht-hero__title em { color: var(--ht-primary); font-style: italic; }

.ht-hero__sub {
  font-size: clamp(.9rem,2vw,1.05rem);
  color: var(--ht-muted);
  max-width: 580px;
  margin: 0 auto 2rem;
  line-height: 1.65;
}

.ht-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: var(--ht-primary);
  color: #fff;
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: .9rem;
  padding: .75rem 1.75rem;
  border-radius: 8px;
  text-decoration: none;
  transition: background .2s, transform .15s, box-shadow .2s;
  box-shadow: 0 4px 16px rgba(161,52,188,.3);
}

.ht-hero__cta:hover {
  background: var(--ht-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(161,52,188,.4);
  color: #fff;
}

.ht-hero__cta-sec {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: var(--ht-primary);
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: .9rem;
  padding: .75rem 1.75rem;
  border-radius: 8px;
  border: 2px solid var(--ht-primary);
  text-decoration: none;
  margin-left: .75rem;
  transition: background .2s, color .2s;
}

.ht-hero__cta-sec:hover { background: var(--ht-primary); color: #fff; }

/* ── Category cards ────────────────────────────────────── */
.ht-cats {
  padding: clamp(3rem,7vw,5rem) clamp(1rem,4vw,2rem);
  background: #fff;
}

.ht-cats__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.ht-cats__label {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ht-primary);
  margin-bottom: .6rem;
}

.ht-cats__heading {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  color: var(--ht-charcoal);
  font-weight: 600;
  margin: 0;
}

.ht-cats__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.25rem;
  max-width: 1240px;
  margin: 0 auto;
}

.ht-cat-card {
  background: #fff;
  border: 1px solid var(--ht-border);
  border-radius: 16px;
  padding: 1.75rem 1.5rem;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}

.ht-cat-card:hover {
  border-color: var(--ht-primary);
  box-shadow: 0 8px 32px rgba(161,52,188,.12);
  transform: translateY(-3px);
  color: inherit;
}

.ht-cat-card__icon {
  font-size: 2rem;
  margin-bottom: .4rem;
}

.ht-cat-card__title {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--ht-charcoal);
}

.ht-cat-card__text {
  font-size: .84rem;
  color: var(--ht-muted);
  line-height: 1.5;
}

.ht-cat-card__link {
  font-size: .78rem;
  font-weight: 600;
  color: var(--ht-primary);
  margin-top: .5rem;
}

/* ── B2B notice ────────────────────────────────────────── */
.ht-b2b-notice {
  background: var(--ht-pale);
  border-bottom: 1px solid rgba(161,52,188,.15);
  padding: .85rem clamp(1rem,4vw,2rem);
}

.ht-b2b-notice__inner {
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: .875rem;
  flex-wrap: wrap;
}

.ht-b2b-notice__icon {
  width: 34px;
  height: 34px;
  background: var(--ht-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: .85rem;
  flex-shrink: 0;
}

.ht-b2b-notice p {
  font-size: .85rem;
  color: var(--ht-text);
  margin: 0;
  flex: 1;
}

.ht-b2b-notice__btn {
  background: var(--ht-primary);
  color: #fff;
  font-family: var(--font-heading);
  font-size: .8rem;
  font-weight: 600;
  padding: .4rem 1.1rem;
  border-radius: 6px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s;
  margin-left: auto;
}

.ht-b2b-notice__btn:hover { background: var(--ht-primary-hover); color: #fff; }

/* ── Product cards ─────────────────────────────────────── */
.product-thumb {
  border: 1px solid var(--ht-border) !important;
  border-radius: 12px !important;
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}

.product-thumb:hover {
  box-shadow: 0 8px 32px rgba(0,0,0,.1) !important;
  transform: translateY(-2px);
}

.product-thumb .description h4 {
  font-family: var(--font-heading) !important;
  font-size: .9rem !important;
}

/* ── Footer override ───────────────────────────────────── */
footer {
  background: var(--ht-dark) !important;
  border: none !important;
  position: static !important;
  margin-bottom: 0 !important;
  padding: 3rem clamp(1rem,4vw,2rem) 1.5rem !important;
  color: rgba(255,255,255,.8) !important;
}

footer h5 {
  font-family: var(--font-heading) !important;
  font-size: .82rem !important;
  font-weight: 700 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ht-gold) !important;
  margin-bottom: 1rem !important;
}

footer a { color: rgba(255,255,255,.65) !important; transition: color .2s; }
footer a:hover { color: #fff !important; }

footer hr { border-color: rgba(255,255,255,.12) !important; }
footer p { color: rgba(255,255,255,.5) !important; font-size: .8rem; }

.ht-footer-brand {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
}

.ht-footer-brand img { height: 36px; width: auto; filter: brightness(0) invert(1); }

.ht-footer-brand__text {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
}

.ht-footer-social {
  display: flex;
  gap: .6rem;
  margin-top: 1rem;
}

.ht-footer-social a {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.65) !important;
  font-size: .85rem;
  transition: border-color .2s, background .2s, color .2s;
}

.ht-footer-social a:hover {
  border-color: var(--ht-primary);
  background: var(--ht-primary);
  color: #fff !important;
}

/* ── Breadcrumb ────────────────────────────────────────── */
.breadcrumb {
  background: var(--ht-pale) !important;
  border-color: rgba(161,52,188,.15) !important;
}

.breadcrumb-item.active { color: var(--ht-primary); }

/* ── Alert ─────────────────────────────────────────────── */
#alert { z-index: 9999; }

/* ── Pagination ────────────────────────────────────────── */
.pagination .page-link { color: var(--ht-primary); }
.pagination .page-item.active .page-link { background-color: var(--ht-primary); border-color: var(--ht-primary); }

/* ── Cookie banner ─────────────────────────────────────── */
#cookie { background: var(--ht-dark) !important; }

/* ── Responsive nav ────────────────────────────────────── */
@media (max-width: 992px) {
  .ht-nav__links { display: none; }
  .ht-nav__inner { gap: .75rem; }
}

@media (max-width: 576px) {
  .ht-hero__cta-sec { margin-left: 0; margin-top: .5rem; }
  .ht-b2b-notice__btn { width: 100%; text-align: center; margin-left: 0; }
}

/* ── Store nav — idéntico al sitio principal ───────────── */
.ht-store-nav {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--ht-white);
  border-bottom: 1px solid var(--ht-border);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  height: var(--ht-nav-height); /* 72px */
  display: flex;
  align-items: center;
}

/* Links centrales del nav tienda */
.ht-store-nav__links {
  display: flex;
  align-items: center;
  gap: .25rem;
}

/* "Volver al sitio" — mismo estilo que nav__link */
.ht-store-nav__back {
  display: flex !important;
  align-items: center !important;
  gap: .4rem !important;
  color: var(--ht-muted) !important;
}

/* Botón Categorías — igual que ht-nav__link pero con icono */
.ht-store-nav__cats {
  display: flex !important;
  align-items: center !important;
  gap: .4rem !important;
  font-weight: 600 !important;
  color: var(--ht-primary) !important;
}
.ht-store-nav__cats:hover,
.ht-store-nav__cats.show {
  background: var(--ht-pale) !important;
  color: var(--ht-primary) !important;
}
/* quitar flecha nativa Bootstrap del dropdown-toggle */
.ht-store-nav__cats.dropdown-toggle::after { display: none !important; }

/* Dropdown de categorías */
.ht-cats-dropdown {
  border-radius: 10px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.12) !important;
  border: 1px solid var(--ht-border) !important;
  padding: .4rem 0 !important;
  min-width: 220px !important;
}
.ht-cats-dropdown__item {
  font-family: var(--font-heading) !important;
  font-size: .82rem !important;
  font-weight: 500 !important;
  color: var(--ht-text) !important;
  padding: .45rem 1.1rem !important;
  transition: background .15s, color .15s !important;
}
.ht-cats-dropdown__item:hover,
.ht-cats-dropdown__item:focus {
  background: var(--ht-pale) !important;
  color: var(--ht-primary) !important;
}

/* Barra de búsqueda slim */
.ht-search-strip {
  background: #f8f5fc;
  border-bottom: 1px solid var(--ht-border);
  padding: .5rem clamp(1rem,4vw,2rem);
}

@media (max-width: 600px) {
  .ht-store-nav__back span { display: none; }
  .ht-store-nav__cats span { display: none; }
}

/* ── Menu: full-width, slim, centered ─────────────────────── */
nav#menu.navbar {
  padding-top: .2rem !important;
  padding-bottom: .2rem !important;
  border-radius: 0 !important;
  min-height: 0 !important;
}

/* Center the links horizontally */
nav#menu .navbar-collapse {
  justify-content: center !important;
}

nav#menu .navbar-nav {
  gap: .1rem !important;
}

nav#menu .navbar-nav .nav-link,
nav#menu .navbar-nav .dropdown-item {
  padding: .3rem .85rem !important;
  font-size: .8rem !important;
  font-family: var(--font-heading) !important;
  font-weight: 500 !important;
  letter-spacing: .01em !important;
}

nav#menu .navbar-nav .nav-link { color: rgba(255,255,255,.92) !important; }
nav#menu .navbar-nav .nav-link:hover,
nav#menu .navbar-nav .nav-link.show { color: #fff !important; background: rgba(255,255,255,.12) !important; border-radius: 4px !important; }

/* ── Search bar: misma altura que el menú ─────────────────── */
.ht-search-strip .form-control {
  height: 28px !important;
  padding: .2rem .65rem !important;
  font-size: .8rem !important;
  border-radius: 4px 0 0 4px !important;
}
.ht-search-strip .btn {
  height: 28px !important;
  padding: .2rem .65rem !important;
  font-size: .8rem !important;
  line-height: 1 !important;
  border-radius: 0 4px 4px 0 !important;
}
.ht-search-strip .input-group { flex-wrap: nowrap !important; }

/* ── Category image in feature-card ───────────────────────── */
.ht-cat-img-wrap {
  width: 100%;
  height: 110px;
  background: var(--ht-pale);
  border: 1px solid var(--ht-border);
  border-radius: var(--r-md, 10px);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.25rem;
  overflow: hidden;
  transition: background var(--t-slow, .4s);
}

.ht-cat-img-wrap img {
  max-height: 86px;
  max-width: 90%;
  object-fit: contain;
  display: block;
  transition: transform .35s ease;
}

.feature-card:hover .ht-cat-img-wrap {
  background: var(--ht-border);
}

.feature-card:hover .ht-cat-img-wrap img {
  transform: scale(1.06);
}

/* ── Hero: en el sitio principal la nav fija (80px) consume parte del padding,
   aquí la topbar es sticky así que reducimos el padding directamente ─────── */
.page-hero {
  padding-top: clamp(2.5rem, 6vw, 4rem) !important;
  padding-bottom: clamp(1.5rem, 4vw, 2.5rem) !important;
}

/* ── Breadcrumb: OpenCart stylesheet.css le agrega borde/fondo — limpiar ── */
.page-hero .breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: .5rem !important;
  justify-content: center !important;
  font-size: .875rem !important;
  color: var(--color-text-light, #9CA3AF) !important;
  margin-bottom: 1.125rem !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.page-hero .breadcrumb a {
  color: var(--color-primary, #A134BC) !important;
  text-decoration: none !important;
}

.page-hero .breadcrumb > li.breadcrumb-item:after,
.page-hero .breadcrumb > li.breadcrumb-item + li:before {
  display: none !important;
}

/* ── Global: override Bootstrap defaults with HealTech brand ── */
a                         { color: var(--ht-primary); }
a:hover                   { color: var(--ht-primary-hover); }
.text-primary             { color: var(--ht-primary) !important; }
.border-primary           { border-color: var(--ht-primary) !important; }
.bg-primary               { background-color: var(--ht-primary) !important; }
.badge.bg-primary         { background-color: var(--ht-primary) !important; }

/* Star ratings — replace Bootstrap blue with brand gold */
.fa-solid.fa-star,
.fa-regular.fa-star       { color: var(--ht-gold) !important; }

/* Product page typography */
#product-info             { font-family: var(--font-body); }
#product-info h1,
#product-info h2          { font-family: var(--font-display); color: var(--ht-charcoal); }
#product-info h3,
#product-info h4          { font-family: var(--font-heading); color: var(--ht-charcoal); }
#product-info p,
#product-info li,
#product-info label       { font-family: var(--font-body); color: var(--ht-text); }

/* Price */
.price-new                { color: var(--ht-charcoal) !important; font-family: var(--font-heading) !important; font-weight: 700 !important; }
.price-old                { color: var(--ht-muted) !important; text-decoration: line-through; }

/* Product page tabs */
#product-info .nav-tabs .nav-link         { font-family: var(--font-body) !important; font-size: .875rem !important; color: var(--ht-muted) !important; }
#product-info .nav-tabs .nav-link.active  { color: var(--ht-primary) !important; border-bottom-color: var(--ht-primary) !important; font-weight: 600 !important; }
#product-info .nav-tabs .nav-link:hover   { color: var(--ht-primary) !important; }

/* Breadcrumb */
#product-info .breadcrumb-item a          { color: var(--ht-primary) !important; }
#product-info .breadcrumb-item.active     { color: var(--ht-muted) !important; }

/* ── Overrides: main.css conflicts with OpenCart/Bootstrap ── */

/* main.css .nav{position:fixed} breaks Bootstrap nav components */
#menu ul.nav,
ul.nav.navbar-nav,
ul.nav.nav-tabs,
ul.nav.nav-pills,
.nav.nav-tabs,
.nav.nav-pills {
  position: static !important;
  height: auto !important;
  min-height: 0 !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: auto !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: wrap !important;
}

/* Restore nav-tabs border */
ul.nav.nav-tabs,
.nav.nav-tabs {
  border-bottom: 1px solid #dee2e6 !important;
  align-items: flex-end !important;
}

/* Restore navbar-nav vertical centering */
#menu ul.nav,
ul.nav.navbar-nav {
  align-items: center !important;
  border-bottom: none !important;
}

/* main.css .fade-up{opacity:0} requires JS that is not loaded in the store */
.fade-up {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* ══════════════════════════════════════════════════════════
   CATEGORY PAGE LAYOUT
══════════════════════════════════════════════════════════ */
#product-category {
  max-width: 1240px;
  margin: 0 auto;
  padding: 2rem clamp(1rem,4vw,2rem) 3rem;
}

.ht-cat-page-wrap {
  display: flex;
  gap: 2rem;
  align-items: flex-start;
}

/* Sidebar */
.ht-cat-sidebar {
  width: 220px;
  flex-shrink: 0;
}
.ht-cat-sidebar > aside { width: 100% !important; }

/* hide column-left wrapper class added by OC */
#column-left.col-3 {
  flex: none !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
}

.ht-cat-content { flex: 1; min-width: 0; }

/* Sidebar module styles */
#column-left,
.ht-cat-sidebar {
  font-family: var(--font-body) !important;
}
#column-left .list-group-item {
  font-size: .82rem !important;
  border-color: var(--ht-border) !important;
  color: var(--ht-text) !important;
  padding: .45rem .85rem !important;
  font-family: var(--font-body) !important;
}
#column-left .list-group-item.active,
#column-left .list-group-item:hover {
  background-color: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
  color: #fff !important;
}
#column-left .list-group-item a {
  color: inherit !important;
  text-decoration: none !important;
}
#column-left h5, #column-left .h5,
#column-left strong {
  font-family: var(--font-heading) !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  color: var(--ht-muted) !important;
  display: block !important;
  margin-bottom: .5rem !important;
}
#column-left .card {
  border-color: var(--ht-border) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

.ht-sidebar-cat-img img {
  width: 100%;
  display: block;
  border-radius: 8px;
  border: 1.5px solid #A134BC;
}

#column-left .card-header {
  background: #f8f5fc !important;
  border-color: var(--ht-border) !important;
  font-family: var(--font-heading) !important;
  font-size: .8rem !important;
  font-weight: 600 !important;
  color: var(--ht-primary) !important;
}

/* Category description area */
.ht-cat-intro {
  display: flex;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  align-items: flex-start;
}
.ht-cat-intro__img {
  max-width: 180px;
  border-radius: 8px;
  border: 1px solid var(--ht-border);
}
.ht-cat-intro__desc {
  font-size: .875rem;
  color: var(--ht-muted);
  line-height: 1.6;
}

/* Subcategory pills */
.ht-subcat-list {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1.5rem;
}
.ht-subcat-item {
  display: inline-block;
  padding: .3rem .85rem;
  border: 1px solid var(--ht-border);
  border-radius: 20px;
  font-size: .78rem;
  font-family: var(--font-body);
  color: var(--ht-text);
  text-decoration: none;
  transition: background .2s, color .2s, border-color .2s;
}
.ht-subcat-item:hover {
  background: var(--ht-primary);
  color: #fff;
  border-color: var(--ht-primary);
}

/* Toolbar */
.ht-cat-toolbar {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
  padding: .6rem .875rem;
  background: #f8f5fc;
  border: 1px solid var(--ht-border);
  border-radius: 8px;
}
.ht-btn-compare {
  font-size: .75rem !important;
  padding: .3rem .7rem !important;
  background: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
  color: #fff !important;
  font-family: var(--font-body) !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
}
.ht-btn-compare:hover {
  background: var(--ht-primary-hover) !important;
  border-color: var(--ht-primary-hover) !important;
}
.ht-view-btn {
  padding: .3rem .55rem;
  font-size: .78rem;
  border: 1px solid var(--ht-border);
  border-radius: 6px;
  background: #fff;
  color: var(--ht-muted);
  cursor: pointer;
  transition: background .2s, color .2s;
}
.ht-view-btn:hover { background: var(--ht-primary); color: #fff; border-color: var(--ht-primary); }
.ht-sort-group .input-group-text {
  font-family: var(--font-body) !important;
  font-size: .75rem !important;
  background: #f0edf6 !important;
  border-color: var(--ht-border) !important;
  color: var(--ht-muted) !important;
  padding: .25rem .6rem !important;
}
.ht-sort-group .form-select {
  font-family: var(--font-body) !important;
  font-size: .75rem !important;
  border-color: var(--ht-border) !important;
  padding: .25rem .6rem !important;
}

/* Product grid */
.ht-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}

/* Pagination */
.ht-cat-pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: .8rem;
  color: var(--ht-muted);
  flex-wrap: wrap;
  gap: .5rem;
}
.ht-cat-pagination .pagination .page-link {
  font-family: var(--font-body) !important;
  font-size: .78rem !important;
  color: var(--ht-primary) !important;
  border-color: var(--ht-border) !important;
}
.ht-cat-pagination .pagination .page-item.active .page-link {
  background: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
  color: #fff !important;
}

.ht-no-results {
  font-family: var(--font-body);
  color: var(--ht-muted);
  margin-bottom: 1rem;
}

/* ══════════════════════════════════════════════════════════
   PRODUCT THUMB CARD
══════════════════════════════════════════════════════════ */
.ht-thumb {
  border: 1px solid var(--ht-border);
  border-radius: 10px;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff;
  font-family: var(--font-body);
  transition: box-shadow .25s ease, transform .25s ease;
}
.ht-thumb:hover {
  box-shadow: 0 6px 24px rgba(161,52,188,.13);
  transform: translateY(-2px);
}
.ht-thumb__img-wrap {
  height: 160px;
  background: #F5F3FF;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-decoration: none;
}
.ht-thumb__img-wrap img {
  max-height: 130px;
  max-width: 88%;
  object-fit: contain;
  transition: transform .35s ease;
}
.ht-thumb:hover .ht-thumb__img-wrap img { transform: scale(1.05); }

.ht-thumb__body {
  padding: .875rem 1rem 1rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.ht-thumb__name {
  font-family: var(--font-heading);
  font-size: .88rem;
  font-weight: 600;
  color: var(--ht-charcoal);
  margin-bottom: .3rem;
  line-height: 1.35;
  flex: 1;
}
.ht-thumb__name a {
  color: inherit;
  text-decoration: none;
}
.ht-thumb__name a:hover { color: var(--ht-primary); }
.ht-thumb__desc {
  font-size: .74rem;
  color: var(--ht-muted);
  line-height: 1.5;
  margin-bottom: .5rem;
}
.ht-thumb__price {
  margin-bottom: .625rem;
}
.ht-price-new {
  font-family: var(--font-heading);
  font-size: .95rem;
  font-weight: 700;
  color: var(--ht-charcoal);
}
.ht-price-old {
  font-size: .76rem;
  color: var(--ht-muted);
  text-decoration: line-through;
  margin-left: .375rem;
}
.ht-price-tax {
  font-size: .7rem;
  color: var(--ht-muted);
  display: block;
  margin-top: .1rem;
}

/* Action buttons */
.ht-thumb__actions {
  display: flex;
  gap: .4rem;
  margin-top: auto;
  padding-top: .625rem;
}
.ht-btn-cart {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .38rem .6rem;
  font-size: .75rem;
  font-family: var(--font-body);
  font-weight: 500;
  background: var(--ht-primary);
  color: #fff;
  border: 1px solid var(--ht-primary);
  border-radius: 6px;
  cursor: pointer;
  transition: background .2s, border-color .2s;
  white-space: nowrap;
}
.ht-btn-cart:hover {
  background: var(--ht-primary-hover);
  border-color: var(--ht-primary-hover);
}
.ht-btn-icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .78rem;
  background: #f8f5fc;
  color: var(--ht-primary);
  border: 1px solid var(--ht-border);
  border-radius: 6px;
  cursor: pointer;
  flex-shrink: 0;
  transition: background .2s, color .2s, border-color .2s;
}
.ht-btn-icon:hover {
  background: var(--ht-primary);
  color: #fff;
  border-color: var(--ht-primary);
}

/* ── Responsive ────────────────────────────────────────── */
@media (max-width: 767px) {
  .ht-cat-page-wrap { flex-direction: column; }
  .ht-cat-sidebar { width: 100%; }
  .ht-product-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
}
@media (max-width: 479px) {
  .ht-product-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   CHECKOUT PAGE
══════════════════════════════════════════════════════════ */
#checkout-checkout {
  max-width: 1240px;
  margin: 0 auto;
  padding: 2rem clamp(1rem,4vw,2rem) 3rem;
}

/* Two-column layout */
.ht-checkout-wrap {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 1.75rem;
  align-items: flex-start;
}
.ht-checkout-left,
.ht-checkout-right {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

/* Card sections */
.ht-checkout-card {
  background: #fff;
  border: 1px solid var(--ht-border);
  border-radius: 10px;
  padding: 1.5rem;
}

/* ── Normalizar h1/h2/h3 dentro del checkout ──────────── */
#checkout-checkout h1 { display: none; } /* ya está en page-hero */

/* ── Fieldset / legend ────────────────────────────────── */
#checkout-checkout fieldset {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}
#checkout-checkout legend {
  font-family: var(--font-heading) !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  color: var(--ht-charcoal) !important;
  padding: 0 0 .75rem !important;
  margin-bottom: 1rem !important;
  border-bottom: 1px solid var(--ht-border) !important;
  width: 100% !important;
  float: none !important;
}

/* ── Labels ───────────────────────────────────────────── */
#checkout-checkout .form-label,
#checkout-checkout label.form-check-label {
  font-family: var(--font-body) !important;
  font-size: .82rem !important;
  font-weight: 500 !important;
  color: var(--ht-text) !important;
  margin-bottom: .2rem !important;
}

/* ── Inputs / Selects ─────────────────────────────────── */
#checkout-checkout .form-control,
#checkout-checkout .form-select {
  font-family: var(--font-body) !important;
  font-size: .85rem !important;
  padding: .42rem .75rem !important;
  border-color: var(--ht-border) !important;
  border-radius: 6px !important;
  height: auto !important;
  line-height: 1.5 !important;
}
#checkout-checkout .form-control:focus,
#checkout-checkout .form-select:focus {
  border-color: var(--ht-primary) !important;
  box-shadow: 0 0 0 .18rem rgba(161,52,188,.15) !important;
}
#checkout-checkout .input-group-text {
  font-size: .82rem !important;
  padding: .42rem .75rem !important;
  background: #f8f5fc !important;
  border-color: var(--ht-border) !important;
  color: var(--ht-muted) !important;
}
#checkout-checkout textarea.form-control {
  height: auto !important;
  min-height: 80px !important;
  resize: vertical !important;
}

/* ── Botones ──────────────────────────────────────────── */
#checkout-checkout .btn {
  font-family: var(--font-heading) !important;
  font-size: .82rem !important;
  padding: .42rem 1rem !important;
  border-radius: 6px !important;
  line-height: 1.5 !important;
}
#checkout-checkout .btn-primary {
  background: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
  color: #fff !important;
}
#checkout-checkout .btn-primary:hover {
  background: var(--ht-primary-hover) !important;
  border-color: var(--ht-primary-hover) !important;
}
#checkout-checkout .btn-light,
#checkout-checkout .btn-outline-secondary {
  border-color: var(--ht-border) !important;
  color: var(--ht-text) !important;
  background: #f8f5fc !important;
}

/* Botón confirmar — CTA principal del checkout */
#button-confirm {
  font-size: .9rem !important;
  padding: .6rem 1.75rem !important;
  width: 100% !important;
  margin-top: .5rem !important;
}

/* ── Toggle "Acepto términos" — reducir tamaño lg ─────── */
#checkout-checkout .form-switch.form-switch-lg {
  padding-left: 3.5em !important;
  margin-top: .75rem !important;
}
#checkout-checkout .form-switch.form-switch-lg .form-check-input {
  width: 2.5em !important;
  height: 1.3em !important;
  margin-top: .15em !important;
  cursor: pointer !important;
}
#checkout-checkout .form-switch.form-switch-lg .form-check-input:checked {
  background-color: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
}

/* ── Tabla resumen pedido ─────────────────────────────── */
#checkout-checkout .table {
  font-family: var(--font-body) !important;
  font-size: .84rem !important;
  margin-bottom: 1rem !important;
}
#checkout-checkout .table thead th {
  font-family: var(--font-heading) !important;
  font-size: .74rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  color: var(--ht-muted) !important;
  background: #f8f5fc !important;
  border-color: var(--ht-border) !important;
  padding: .6rem .75rem !important;
}
#checkout-checkout .table td {
  border-color: var(--ht-border) !important;
  padding: .55rem .75rem !important;
  vertical-align: middle !important;
}
#checkout-checkout .table tfoot td {
  font-weight: 600 !important;
}
#checkout-checkout .table a {
  color: var(--ht-primary) !important;
  text-decoration: none !important;
}
#checkout-checkout .table a:hover { text-decoration: underline !important; }

/* ── Alertas ──────────────────────────────────────────── */
#checkout-checkout .alert {
  font-family: var(--font-body) !important;
  font-size: .82rem !important;
  border-radius: 8px !important;
  padding: .65rem 1rem !important;
}

/* ── Texto introductorio ──────────────────────────────── */
#checkout-checkout p {
  font-family: var(--font-body) !important;
  font-size: .84rem !important;
  color: var(--ht-muted) !important;
  margin-bottom: .75rem !important;
}
#checkout-checkout p a {
  color: var(--ht-primary) !important;
}

/* ── Radio / Checkbox ─────────────────────────────────── */
#checkout-checkout .form-check-input:checked {
  background-color: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
}
#checkout-checkout .form-check-input:focus {
  box-shadow: 0 0 0 .18rem rgba(161,52,188,.2) !important;
  border-color: var(--ht-primary) !important;
}

/* ── Responsive checkout ──────────────────────────────── */
@media (max-width: 900px) {
  .ht-checkout-wrap { grid-template-columns: 1fr; }
}
@media (max-width: 479px) {
  .ht-checkout-card { padding: 1rem; }
}

/* ══════════════════════════════════════════════════════════
   CART PAGE
══════════════════════════════════════════════════════════ */
#checkout-cart {
  max-width: 1240px;
  margin: 0 auto;
  padding: 2rem clamp(1rem,4vw,2rem) 3rem;
}

/* Ocultar h1 duplicado en cart_list (ya está en page-hero) */
#checkout-cart h1 {
  display: none !important;
}

/* Título "¿Qué sigue?" */
#checkout-cart h2 {
  font-family: var(--font-heading) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--ht-charcoal) !important;
  margin: 1.5rem 0 .4rem !important;
}
#checkout-cart > #shopping-cart > p,
#checkout-cart p {
  font-family: var(--font-body) !important;
  font-size: .84rem !important;
  color: var(--ht-muted) !important;
  margin-bottom: .75rem !important;
}

/* Tabla del carrito */
#checkout-cart .table-responsive {
  border: 1px solid var(--ht-border) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  margin-bottom: 1.5rem !important;
}
#checkout-cart .table {
  font-family: var(--font-body) !important;
  font-size: .84rem !important;
  margin-bottom: 0 !important;
}
#checkout-cart .table thead th {
  font-family: var(--font-heading) !important;
  font-size: .74rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  color: var(--ht-muted) !important;
  background: #f8f5fc !important;
  border-color: var(--ht-border) !important;
  padding: .65rem .75rem !important;
  white-space: nowrap !important;
}
#checkout-cart .table td {
  border-color: var(--ht-border) !important;
  padding: .65rem .75rem !important;
  vertical-align: middle !important;
}
#checkout-cart .table tfoot td {
  font-weight: 600 !important;
  background: #faf8fd !important;
}
#checkout-cart .table a {
  color: var(--ht-primary) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
#checkout-cart .table a:hover { text-decoration: underline !important; }

/* Imagen del producto en la tabla */
#checkout-cart .img-thumbnail {
  width: 72px !important;
  height: 72px !important;
  object-fit: contain !important;
  border-color: var(--ht-border) !important;
  background: #f5f3ff !important;
  padding: .25rem !important;
  border-radius: 6px !important;
}

/* Input de cantidad + botones update/remove */
#checkout-cart .input-group {
  flex-wrap: nowrap !important;
  width: auto !important;
  min-width: 130px !important;
}
#checkout-cart .input-group .form-control {
  font-family: var(--font-body) !important;
  font-size: .84rem !important;
  padding: .35rem .5rem !important;
  text-align: center !important;
  border-color: var(--ht-border) !important;
  width: 52px !important;
  min-width: 0 !important;
}
#checkout-cart .input-group .btn {
  font-size: .78rem !important;
  padding: .35rem .6rem !important;
  border-radius: 0 !important;
  line-height: 1 !important;
}
#checkout-cart .input-group .btn-primary {
  background: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
}
#checkout-cart .input-group .btn-primary:hover {
  background: var(--ht-primary-hover) !important;
  border-color: var(--ht-primary-hover) !important;
}
#checkout-cart .input-group .btn-danger {
  background: #fff !important;
  border-color: var(--ht-border) !important;
  color: var(--ht-primary) !important;
  border-radius: 0 6px 6px 0 !important;
}
#checkout-cart .input-group .btn-danger:hover {
  background: var(--ht-pale) !important;
  border-color: var(--ht-primary) !important;
  color: var(--ht-primary) !important;
}

/* Botones inferiores (Seguir comprando / Pagar) */
#checkout-cart .row .btn {
  font-family: var(--font-heading) !important;
  font-size: .85rem !important;
  padding: .5rem 1.25rem !important;
  border-radius: 6px !important;
}
#checkout-cart .row .btn-light {
  border-color: var(--ht-border) !important;
  color: var(--ht-text) !important;
  background: #f8f5fc !important;
}
#checkout-cart .row .btn-primary {
  background: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
  font-weight: 600 !important;
}
#checkout-cart .row .btn-primary:hover {
  background: var(--ht-primary-hover) !important;
  border-color: var(--ht-primary-hover) !important;
}

/* Alertas */
#checkout-cart .alert {
  font-family: var(--font-body) !important;
  font-size: .82rem !important;
  border-radius: 8px !important;
  padding: .65rem 1rem !important;
  margin-bottom: 1rem !important;
}

/* Accordion "¿Qué deseas hacer a continuación?" */
#checkout-cart .accordion-item {
  border-color: var(--ht-border) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  margin-bottom: .5rem !important;
}
#checkout-cart .accordion-button {
  font-family: var(--font-heading) !important;
  font-size: .85rem !important;
  font-weight: 600 !important;
  padding: .75rem 1rem !important;
}
#checkout-cart .accordion-button:not(.collapsed) {
  background: var(--ht-pale) !important;
  color: var(--ht-primary) !important;
  box-shadow: none !important;
}
#checkout-cart .accordion-button::after {
  filter: none !important;
}

/* Responsive */
@media (max-width: 600px) {
  #checkout-cart .img-thumbnail { width: 52px !important; height: 52px !important; }
  #checkout-cart .input-group { min-width: 110px !important; }
}

/* ══════════════════════════════════════════════════════════
   ACCOUNT PAGES (login, register, account, etc.)
══════════════════════════════════════════════════════════ */
.ht-account-wrap {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 clamp(1rem,4vw,2rem);
}

#account-login {
  padding: 2rem 0 3rem;
}

/* Login: dos columnas */
.ht-login-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.75rem;
}

/* Card genérica de cuenta */
.ht-account-card {
  background: #fff;
  border: 1px solid var(--ht-border);
  border-radius: 10px;
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
}
.ht-account-card__title {
  font-family: var(--font-heading) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--ht-charcoal) !important;
  margin-bottom: .5rem !important;
  padding-bottom: .65rem !important;
  border-bottom: 1px solid var(--ht-border) !important;
}
.ht-account-card__lead {
  font-family: var(--font-body) !important;
  font-size: .85rem !important;
  font-weight: 600 !important;
  color: var(--ht-text) !important;
  margin-bottom: .4rem !important;
}
.ht-account-card__body {
  font-family: var(--font-body) !important;
  font-size: .84rem !important;
  color: var(--ht-muted) !important;
  line-height: 1.6 !important;
  flex: 1 !important;
  margin-bottom: 1rem !important;
}
.ht-account-card__footer {
  margin-top: auto;
  padding-top: 1rem;
  display: flex;
  justify-content: flex-end;
}

/* Inputs de formulario de cuenta */
.ht-form-label {
  font-family: var(--font-body) !important;
  font-size: .82rem !important;
  font-weight: 500 !important;
  color: var(--ht-text) !important;
  display: block !important;
  margin-bottom: .25rem !important;
}
.ht-input,
#account-login .form-control {
  font-family: var(--font-body) !important;
  font-size: .85rem !important;
  padding: .42rem .75rem !important;
  border-color: var(--ht-border) !important;
  border-radius: 6px !important;
  height: auto !important;
}
.ht-input:focus,
#account-login .form-control:focus {
  border-color: var(--ht-primary) !important;
  box-shadow: 0 0 0 .18rem rgba(161,52,188,.15) !important;
}

/* Link "olvidé contraseña" */
.ht-forgot-link {
  font-family: var(--font-body) !important;
  font-size: .78rem !important;
  color: var(--ht-primary) !important;
  text-decoration: none !important;
}
.ht-forgot-link:hover { text-decoration: underline !important; }

/* Botones en páginas de cuenta */
#account-login .btn {
  font-family: var(--font-heading) !important;
  font-size: .84rem !important;
  padding: .45rem 1.25rem !important;
  border-radius: 6px !important;
}
#account-login .btn-primary {
  background: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
}
#account-login .btn-primary:hover {
  background: var(--ht-primary-hover) !important;
  border-color: var(--ht-primary-hover) !important;
}

/* Responsive login */
@media (max-width: 640px) {
  .ht-login-grid { grid-template-columns: 1fr; }
}

/* ── Register page ────────────────────────────────────── */
#account-register {
  padding: 2rem 0 3rem;
}

.ht-register-intro {
  font-family: var(--font-body) !important;
  font-size: .84rem !important;
  color: var(--ht-muted) !important;
  margin-bottom: 1.5rem !important;
}
.ht-register-intro a { color: var(--ht-primary) !important; }

/* Grid de campos 2 columnas */
.ht-fields-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem 1.25rem;
}

.ht-field {
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.ht-field.required > .ht-form-label::after {
  content: ' *';
  color: var(--ht-primary);
  font-weight: 700;
}

/* Fieldset/legend register */
#account-register fieldset {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}
#account-register legend {
  font-family: var(--font-heading) !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  color: var(--ht-charcoal) !important;
  padding: 0 0 .75rem !important;
  margin-bottom: 1rem !important;
  border-bottom: 1px solid var(--ht-border) !important;
  width: 100% !important;
  float: none !important;
}

/* Inputs register */
#account-register .form-control,
#account-register .ht-input {
  font-family: var(--font-body) !important;
  font-size: .85rem !important;
  padding: .42rem .75rem !important;
  border-color: var(--ht-border) !important;
  border-radius: 6px !important;
  height: auto !important;
}
#account-register .form-control:focus {
  border-color: var(--ht-primary) !important;
  box-shadow: 0 0 0 .18rem rgba(161,52,188,.15) !important;
}

/* Toggle newsletter / terms */
.ht-toggle-wrap { padding-top: .25rem; }
.ht-toggle { padding-left: 2.75em !important; }
.ht-toggle .form-check-input {
  width: 2.2em !important;
  height: 1.2em !important;
  margin-top: .1em !important;
  cursor: pointer !important;
}
.ht-toggle .form-check-input:checked {
  background-color: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
}
.ht-toggle .form-check-input:focus {
  box-shadow: 0 0 0 .18rem rgba(161,52,188,.2) !important;
  border-color: var(--ht-primary) !important;
}

/* Fila final: términos + botón */
.ht-register-submit {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.5rem;
  flex-wrap: wrap;
  padding-top: .5rem;
}
.ht-agree-wrap .form-check-label { font-size: .82rem !important; }

/* Botones register */
#account-register .btn {
  font-family: var(--font-heading) !important;
  font-size: .85rem !important;
  padding: .45rem 1.5rem !important;
  border-radius: 6px !important;
}
#account-register .btn-primary {
  background: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
}
#account-register .btn-primary:hover {
  background: var(--ht-primary-hover) !important;
  border-color: var(--ht-primary-hover) !important;
}
#account-register .btn-light {
  font-size: .78rem !important;
  padding: .3rem .75rem !important;
  border-color: var(--ht-border) !important;
  background: #f8f5fc !important;
  color: var(--ht-text) !important;
}

/* Checks / radios */
#account-register .form-check-input:checked {
  background-color: var(--ht-primary) !important;
  border-color: var(--ht-primary) !important;
}

/* Responsive register */
@media (max-width: 640px) {
  .ht-fields-grid { grid-template-columns: 1fr; }
  .ht-register-submit { flex-direction: column; align-items: flex-end; }
}