/* TUHU brand palette: one late-loaded layer keeps the existing theme contract intact. */
:root {
  --tuhu-soft: #ECECF6;
  --tuhu-disabled-bg: #E7E5E1;
  --tuhu-disabled-text: #8B8990;
}

@supports (color: color-mix(in srgb, black 10%, white)) {
  :root {
    --tuhu-soft: color-mix(in srgb, var(--tuhu-accent) 10%, var(--tuhu-surface));
  }
}

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

/* The default Fink scheme owns most storefront sections. */
.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b {
  background-color: var(--tuhu-background);
  background-image: none;
  color: var(--tuhu-text);
  border-color: var(--tuhu-border);
}

.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b .text-subdued,
.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b .link-faded {
  color: var(--tuhu-text-muted);
}

.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b :is(h1, h2, h3, h4, h5, h6):not(.text-white) {
  color: var(--tuhu-accent);
}

.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b a:not(.button):not(.link-faded) {
  color: var(--tuhu-accent);
}

/* Header, announcement bar and footer retain their existing hooks and layout. */
.announcement-bar.color-scheme--scheme-3,
.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 {
  background-color: var(--tuhu-accent);
  background-image: none;
  color: var(--tuhu-button-text);
  border-color: var(--tuhu-accent);
}

.announcement-bar.color-scheme--scheme-3 :is(a, span),
.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 :is(h1, h2, h3, h4, h5, h6, a, p, span, label) {
  color: inherit;
}

.header-sidebar.color-scheme--scheme-2,
.color-scheme--dialog {
  background-color: var(--tuhu-surface);
  background-image: none;
  color: var(--tuhu-text);
  border-color: var(--tuhu-border);
}

.color-scheme--dialog :is(h1, h2, h3, h4, h5, h6) {
  color: var(--tuhu-accent);
}

/* Shared action controls. Status colors below are intentionally not overridden. */
.button,
.haravan-challenge__button,
.haravan-payment-button__button--unbranded {
  background-color: var(--tuhu-accent) !important;
  background-image: none !important;
  border-color: var(--tuhu-accent) !important;
  color: var(--tuhu-button-text) !important;
  transition: background-color .24s ease, border-color .24s ease, color .24s ease, opacity .24s ease, transform .25s cubic-bezier(.23, 1, .32, 1), box-shadow .25s cubic-bezier(.23, 1, .32, 1);
}

.button--outline {
  background-color: transparent !important;
  border-color: var(--tuhu-accent) !important;
  color: var(--tuhu-accent) !important;
}

@media (hover: hover) and (pointer: fine) {
  .button:not([disabled]):hover,
  .haravan-challenge__button:not([disabled]):hover,
  .haravan-payment-button__button--unbranded:not([disabled]):hover {
    background-color: var(--tuhu-hover) !important;
    border-color: var(--tuhu-hover) !important;
    color: var(--tuhu-button-text) !important;
    transform: translateY(-2px);
    box-shadow: 0 9px 20px rgba(44, 46, 132, .2);
  }

  .button--outline:not([disabled]):hover {
    background-color: var(--tuhu-soft) !important;
    border-color: var(--tuhu-accent) !important;
    color: var(--tuhu-accent) !important;
    box-shadow: 0 7px 16px rgba(44, 46, 132, .12);
  }
}

.button:not([disabled]):active,
.haravan-challenge__button:not([disabled]):active,
.haravan-payment-button__button--unbranded:not([disabled]):active {
  transform: translateY(0) scale(.985);
}

.button:focus-visible,
.haravan-challenge__button:focus-visible,
.haravan-payment-button__button--unbranded:focus-visible {
  outline: 2px solid var(--tuhu-accent) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px var(--tuhu-surface) !important;
}

.button[disabled],
.haravan-challenge__button[disabled],
.haravan-payment-button__button--unbranded[disabled] {
  background: var(--tuhu-disabled-bg) !important;
  border-color: var(--tuhu-disabled-bg) !important;
  color: var(--tuhu-disabled-text) !important;
  opacity: 1 !important;
}

/* Content cards and product pricing use the same surface/accent roles. */
.product-card,
.horizontal-product-card,
.fink-cart-line,
.collection-toolbar,
.fink-field,
.search-page-form .form-control,
.haravan-section--main-search .search-page-form input.search-input {
  background-color: var(--tuhu-surface);
  border-color: var(--tuhu-border);
}

.product-card__info :is(.h1, .h2, .h3, .h4, .h5, .h6),
.product-card__info a:not(.button) {
  color: var(--tuhu-text);
}

.product-info :is(h1, h2, h3, h4, h5, h6),
.price-list sale-price,
.fink-cart-line__price {
  color: var(--tuhu-accent);
}

.product-card__info a:not(.button):hover,
.product-info a:not(.button):hover {
  color: var(--tuhu-accent);
}

.price-list compare-at-price,
.price-list compare-at-price *,
.fink-cart-line .text-subdued,
.fink-cart-summary .text-subdued {
  color: var(--tuhu-text-muted);
}

.feature-badge {
  background-color: var(--tuhu-soft) !important;
  border-color: var(--tuhu-border) !important;
  color: var(--tuhu-accent) !important;
}

.empty-state .button,
.fink-empty-state .button {
  background-color: var(--tuhu-accent) !important;
  border-color: var(--tuhu-accent) !important;
  color: var(--tuhu-button-text) !important;
}

.empty-state .button:hover,
.fink-empty-state .button:hover {
  background-color: var(--tuhu-hover) !important;
  border-color: var(--tuhu-hover) !important;
  color: var(--tuhu-button-text) !important;
}

/* Inputs stay scoped to theme-owned controls so editor controls are unaffected. */
.fink-field,
.form-control .input,
.form-control textarea,
.form-control select,
.search-page-form input,
.haravan-section--main-search .search-page-form input.search-input {
  background-color: var(--tuhu-surface);
  border-color: var(--tuhu-border);
  color: var(--tuhu-text);
}

.fink-field:focus,
.form-control .input:focus,
.form-control textarea:focus,
.form-control select:focus,
.search-page-form input:focus,
.haravan-section--main-search .search-page-form input.search-input:focus {
  border-color: var(--tuhu-accent) !important;
  box-shadow: 0 0 0 1px var(--tuhu-accent) !important;
  outline: none !important;
}

.fink-field::placeholder,
.form-control .input::placeholder,
.form-control textarea::placeholder,
.search-page-form input::placeholder {
  color: var(--tuhu-text-muted);
}

.accordion__toggle,
.accordion__toggle svg,
.product-info .accordion__toggle,
.product-info .accordion__toggle svg {
  color: var(--tuhu-accent);
}

.pagination__link,
.fink-collection-pagination .pagination__link {
  color: var(--tuhu-accent) !important;
  border-color: var(--tuhu-accent) !important;
}

.pagination__link[aria-current="page"],
.pagination__link--current,
.pagination__link.is-active {
  background-color: var(--tuhu-accent) !important;
  color: var(--tuhu-button-text) !important;
}

.haravan-section--main-search .main-search__tabs-nav {
  border-color: var(--tuhu-border) !important;
}

.haravan-section--main-search .main-search__tabs-nav button {
  color: var(--tuhu-accent) !important;
  border-bottom-color: var(--tuhu-accent) !important;
}

.header-search,
.cart-drawer,
.cart-drawer__footer,
.cart-drawer__item-media {
  background-color: var(--tuhu-surface) !important;
}

.header-search {
  border-color: var(--tuhu-border) !important;
}

.cart-drawer__header,
.cart-drawer__item,
.cart-drawer__footer,
.quantity-selector--sm {
  border-color: var(--tuhu-border) !important;
}

.cart-drawer__item-price,
.cart-drawer__total-price {
  color: var(--tuhu-accent);
}

.product-gallery--custom .product-gallery__thumbnail {
  background: var(--tuhu-surface) !important;
  border-color: var(--tuhu-border) !important;
  opacity: .45 !important;
  transform: none !important;
  transition: opacity .2s ease, background-color .2s ease, border-color .2s ease !important;
}

.product-gallery--custom .product-gallery__thumbnail[aria-current="true"],
.product-gallery--custom .product-gallery__thumbnail.is-active {
  background: var(--tuhu-soft) !important;
  border-color: var(--tuhu-accent) !important;
  box-shadow: inset 0 0 0 1px var(--tuhu-accent) !important;
  opacity: 1 !important;
  transform: none !important;
}

.product-gallery--custom .product-gallery__thumbnail-scroller {
  padding: .2rem;
  scroll-padding-block: .2rem;
}

/* Preserve a visible keyboard focus ring after the legacy icon reset. */
.header a:focus-visible,
.header button:focus-visible,
.header summary:focus-visible,
.header__nav-icon:focus-visible,
[aria-controls*="header-search"]:focus-visible,
[aria-controls="cart-drawer"]:focus-visible,
[aria-controls="sidebar-menu"]:focus-visible {
  outline: 2px solid var(--tuhu-accent) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 1px var(--tuhu-surface) !important;
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .haravan-challenge__button,
  .haravan-payment-button__button--unbranded {
    transition: none;
  }
}

/* UI polish: keep storefront-owned controls readable without touching editor hooks. */
.header.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b {
  background-color: var(--tuhu-background) !important;
  background-image: none !important;
  color: var(--tuhu-text) !important;
}

.header.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b :is(a, button, summary, .link-faded),
.header.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b :is(svg, .icon) {
  color: var(--tuhu-text) !important;
}

.header.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b :is(a:hover, button:hover, summary:hover),
.header.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b :is(a.is-active, summary.is-active, .is-active) {
  color: var(--tuhu-accent) !important;
}

.header.color-scheme--scheme-35ae9643-55a2-43e9-917a-d2c1f96c442b :is(a.is-active, summary.is-active)::after {
  background: var(--tuhu-accent) !important;
}

/* ==========================================================================
   TUHU BRAND MOBILE NAVIGATION DRAWER (header-sidebar)
   Synchronized with desktop header navigation & brand identity
   ========================================================================== */

.header-sidebar.color-scheme--scheme-2 {
  background-color: var(--tuhu-surface) !important;
  color: var(--tuhu-text) !important;
  border-color: var(--tuhu-border) !important;
}

.header-sidebar::part(content) {
  background-color: var(--tuhu-surface) !important;
  color: var(--tuhu-text) !important;
  border-color: var(--tuhu-border) !important;
  box-shadow: 4px 0 24px rgba(44, 46, 132, 0.08) !important;
}

.header-sidebar::part(header) {
  background-color: var(--tuhu-background) !important;
  border-block-end: 1px solid var(--tuhu-border) !important;
  padding: 0.875rem 1.25rem !important;
  min-height: 3.75rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.header-sidebar::part(close-button) {
  color: var(--tuhu-text) !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
  background-color: transparent !important;
}

.header-sidebar::part(close-button):hover {
  color: var(--tuhu-accent) !important;
  background-color: var(--tuhu-soft) !important;
}

/* Mobile Menu Items - Default state matches Desktop: dark charcoal var(--tuhu-text) */
.header-sidebar .header-sidebar__linklist-button,
.header-sidebar .header-sidebar__linklist a,
.header-sidebar .header-sidebar__linklist button {
  color: var(--tuhu-text) !important;
  font-family: var(--heading-font-family) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 0.95rem 1.25rem !important;
  border: none !important;
  background: transparent !important;
  text-decoration: none !important;
  transition: color 0.2s ease, background-color 0.2s ease, padding-left 0.2s ease !important;
  position: relative !important;
}

/* Dividers between menu items */
.header-sidebar .header-sidebar__linklist > li {
  border-block-end: 1px solid var(--tuhu-border) !important;
}

.header-sidebar .header-sidebar__linklist.divide-y > :not([hidden]) ~ :not([hidden]) {
  border-top-color: var(--tuhu-border) !important;
}

/* Hover & touch feedback */
.header-sidebar .header-sidebar__linklist-button:hover,
.header-sidebar .header-sidebar__linklist a:hover,
.header-sidebar .header-sidebar__linklist button:hover {
  color: var(--tuhu-accent) !important;
  background-color: var(--tuhu-soft) !important;
  padding-left: 1.45rem !important;
}

/* Active state matches Desktop Menu: Brand blue var(--tuhu-accent) + active indicator */
.header-sidebar .header-sidebar__linklist-button.is-active,
.header-sidebar .header-sidebar__linklist a.is-active,
.header-sidebar .header-sidebar__linklist button.is-active {
  color: var(--tuhu-accent) !important;
  font-weight: 600 !important;
  background-color: var(--tuhu-soft) !important;
}

.header-sidebar .header-sidebar__linklist-button.is-active::before,
.header-sidebar .header-sidebar__linklist a.is-active::before,
.header-sidebar .header-sidebar__linklist button.is-active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background-color: var(--tuhu-accent);
  border-radius: 0 2px 2px 0;
}

/* Chevron arrow icon */
.header-sidebar .header-sidebar__linklist-button svg,
.header-sidebar .header-sidebar__linklist button svg {
  color: var(--tuhu-text-muted) !important;
  transition: transform 0.2s ease, color 0.2s ease !important;
  flex-shrink: 0;
}

.header-sidebar .header-sidebar__linklist-button:hover svg,
.header-sidebar .header-sidebar__linklist button:hover svg,
.header-sidebar .header-sidebar__linklist-button.is-active svg {
  color: var(--tuhu-accent) !important;
  transform: translateX(3px);
}

/* Sub-panel (Menu cấp 2 & 3) - Left aligned, perfectly lined up with list items */
.header-sidebar .header-sidebar__back-button {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: left !important;
  gap: 0.625rem !important;
  width: 100% !important;
  padding: 0.875rem 1.25rem !important;
  font-family: var(--heading-font-family) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--tuhu-accent) !important;
  background-color: var(--tuhu-background) !important;
  border: none !important;
  border-block-end: 1px solid var(--tuhu-border) !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
}

.header-sidebar .header-sidebar__back-button span {
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  color: var(--tuhu-accent) !important;
  font-family: var(--heading-font-family) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  display: inline-block !important;
}

.header-sidebar .header-sidebar__back-button:hover {
  background-color: var(--tuhu-soft) !important;
}

.header-sidebar .header-sidebar__back-button svg {
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  color: var(--tuhu-accent) !important;
  transition: transform 0.2s ease !important;
}

.header-sidebar .header-sidebar__back-button:hover svg {
  transform: translateX(-3px);
}

.header-sidebar .header-sidebar__sub-panel .header-sidebar__linklist-button.font-bold {
  font-weight: 600 !important;
  color: var(--tuhu-accent) !important;
}

.header-sidebar .header-sidebar__sub-panel .link-faded {
  color: var(--tuhu-text-muted) !important;
  font-size: 0.8125rem !important;
  padding: 0.375rem 0 !important;
  display: block !important;
  transition: color 0.2s ease, padding-left 0.2s ease !important;
}

.header-sidebar .header-sidebar__sub-panel .link-faded:hover,
.header-sidebar .header-sidebar__sub-panel .link-faded.is-active {
  color: var(--tuhu-accent) !important;
  padding-left: 0.25rem !important;
}

/* Drawer Footer & Localization */
.header-sidebar .header-sidebar__footer {
  border-block-start: 1px solid var(--tuhu-border) !important;
  padding: 1rem 1.25rem !important;
  margin-top: auto !important;
  background-color: var(--tuhu-background) !important;
}

.header-sidebar .header-sidebar__footer .localization-toggle {
  color: var(--tuhu-text-muted) !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  transition: color 0.2s ease !important;
}

.header-sidebar .header-sidebar__footer .localization-toggle:hover {
  color: var(--tuhu-accent) !important;
}

.header-sidebar .header-sidebar__footer .localization-toggle svg {
  color: inherit !important;
}

.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6,
.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 :is(h1, h2, h3, h4, h5, h6, p, a, span, label, .text-subdued, .link-faded),
.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 :is(svg, .icon) {
  color: #FFFFFF !important;
}

.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 .link-faded:hover,
.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 .social-media__item a:hover {
  color: var(--tuhu-button-text) !important;
  opacity: .82;
}

.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 .footer__block--newsletter form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: .625rem;
}

.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 .footer__block--newsletter .form-control {
  background: #FFFFFF;
  border-color: rgba(255, 255, 255, .72);
}

.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 .footer__block--newsletter .form-control :is(input, label),
.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 .footer__block--newsletter .form-control input::placeholder {
  color: var(--tuhu-text) !important;
}

.footer.color-scheme--scheme-fee47177-31e3-4fe5-ad39-ac98e23a00f6 .footer__block--newsletter .button {
  height: 100%;
  min-height: 2.75rem;
  margin: 0;
  padding-inline: 1.25rem;
  background: var(--tuhu-button-text) !important;
  border-color: var(--tuhu-button-text) !important;
  color: var(--tuhu-accent) !important;
}

/* Keep paired storefront actions aligned while preserving their existing hooks. */
.combined-product-and-buy {
  flex-wrap: nowrap !important;
  align-items: stretch;
  gap: .75rem !important;
}

.combined-product-and-buy > .contents > .v-stack {
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
}

.combined-product-and-buy buy-buttons,
.combined-product-and-buy buy-buttons > .button {
  display: flex;
  width: 100%;
  height: 100%;
}

.cart-drawer__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: .625rem;
}

.cart-drawer__actions a.button {
  display: inline-flex !important;
  min-width: 0;
  min-height: 2.75rem;
  margin: 0 !important;
  padding: .55rem .4rem !important;
  font-size: clamp(.6875rem, 2.4vw, .75rem);
  line-height: 1.2;
  letter-spacing: .1em;
}

/* Slim native scrollbars for the page and theme-owned scroll panels. */
html,
.cart-drawer__body,
.predictive-search,
.header__dropdown-menu,
.header-sidebar__scroller {
  scrollbar-width: thin;
  scrollbar-color: var(--tuhu-accent) var(--tuhu-soft);
}

html::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.cart-drawer__body::-webkit-scrollbar,
.predictive-search::-webkit-scrollbar,
.header__dropdown-menu::-webkit-scrollbar,
.header-sidebar__scroller::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

html::-webkit-scrollbar-track,
.cart-drawer__body::-webkit-scrollbar-track,
.predictive-search::-webkit-scrollbar-track,
.header__dropdown-menu::-webkit-scrollbar-track,
.header-sidebar__scroller::-webkit-scrollbar-track {
  background: var(--tuhu-soft);
}

html::-webkit-scrollbar-thumb,
.cart-drawer__body::-webkit-scrollbar-thumb,
.predictive-search::-webkit-scrollbar-thumb,
.header__dropdown-menu::-webkit-scrollbar-thumb,
.header-sidebar__scroller::-webkit-scrollbar-thumb {
  min-height: 36px;
  border: 2px solid var(--tuhu-soft);
  border-radius: 999px;
  background: var(--tuhu-accent);
}

@media (hover: hover) and (pointer: fine) {
  html::-webkit-scrollbar-thumb:hover,
  .cart-drawer__body::-webkit-scrollbar-thumb:hover,
  .predictive-search::-webkit-scrollbar-thumb:hover,
  .header__dropdown-menu::-webkit-scrollbar-thumb:hover,
  .header-sidebar__scroller::-webkit-scrollbar-thumb:hover {
    background: var(--tuhu-hover);
  }
}

.fink-product-card,
.template-blog .fink-page-shell .product-card {
  overflow: visible;
  border: 1px solid rgba(44, 46, 132, .12);
  border-radius: .75rem;
  background: var(--tuhu-surface);
  box-shadow: 0 8px 24px rgba(47, 48, 56, .06);
}

.fink-product-card .product-card__info,
.template-blog .fink-page-shell .product-card .product-card__info {
  gap: .5rem;
  padding: .9rem .9rem 1rem;
}

.fink-product-card .product-title,
.template-blog .fink-page-shell .product-card .product-card__info > a {
  color: var(--tuhu-text) !important;
  line-height: 1.45;
}

.fink-product-card .price-list,
.fink-product-card sale-price,
.template-blog .fink-page-shell .product-card .text-subdued {
  color: var(--tuhu-accent) !important;
}

.fink-product-card fieldset {
  margin: 0;
  padding: 0 .9rem 1rem;
}

.fink-product-card .product-card__quick-add-button {
  opacity: 1;
  transform: none;
  background: var(--tuhu-accent) !important;
  color: var(--tuhu-button-text) !important;
  box-shadow: 0 4px 12px rgba(44, 46, 132, .2);
}

.fink-product-card .product-card__quick-add-button:hover,
.fink-product-card .product-card__quick-add-button:focus-visible {
  background: var(--tuhu-hover) !important;
  color: var(--tuhu-button-text) !important;
}

.color-swatch {
  --swatch-size: 1.65rem;
  width: var(--swatch-size) !important;
  height: var(--swatch-size) !important;
  min-width: var(--swatch-size) !important;
  min-height: var(--swatch-size) !important;
  border: 2px solid var(--tuhu-surface) !important;
  box-shadow: 0 0 0 1px rgba(47, 48, 56, .2) !important;
  transform: none !important;
  transition: box-shadow .2s ease, transform .2s ease !important;
}

.color-swatch:focus-visible {
  box-shadow: 0 0 0 2px var(--tuhu-accent) !important;
  transform: translateY(-1px) !important;
}

@media (hover: hover) and (pointer: fine) {
  .color-swatch:hover {
    box-shadow: 0 0 0 2px var(--tuhu-accent) !important;
    transform: translateY(-1px) !important;
  }
}

input[data-fink-card-variant]:checked + .color-swatch,
input:checked + .color-swatch {
  outline: 0 !important;
  box-shadow: 0 0 0 2px var(--tuhu-accent), 0 0 0 4px var(--tuhu-surface) !important;
  transform: none !important;
}

.fink-collection-pagination,
.fink-pagination .pagination {
  gap: .4rem !important;
  margin-block: 2.75rem 3.5rem !important;
  padding: .35rem !important;
  width: auto !important;
  border: 1px solid var(--tuhu-border) !important;
  border-radius: 999px;
  background: var(--tuhu-surface);
  box-shadow: 0 5px 18px rgba(47, 48, 56, .06);
}

.fink-collection-pagination .pagination__link,
.fink-pagination .pagination > li > :is(a, span) {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 2.35rem !important;
  height: 2.35rem !important;
  border: 0 !important;
  border-radius: 999px;
  color: var(--tuhu-text) !important;
}

.fink-collection-pagination .pagination__link:hover,
.fink-pagination .pagination > li > a:hover {
  background: var(--tuhu-soft) !important;
  color: var(--tuhu-accent) !important;
  opacity: 1 !important;
}

.fink-collection-pagination .pagination__link[aria-current="page"],
.fink-collection-pagination .pagination__link--current,
.fink-collection-pagination .pagination__link.is-active,
.fink-pagination .pagination > li.active > span {
  background: var(--tuhu-accent) !important;
  color: var(--tuhu-button-text) !important;
  box-shadow: none !important;
}

.fink-collection-pagination .pagination__link::after {
  display: none !important;
}

.fink-collection-pagination .pagination__link--ellipsis,
.fink-collection-pagination .pagination__link--disabled {
  background: transparent !important;
  color: var(--tuhu-text-muted) !important;
}

.template-blog .fink-page-shell .fink-collection-grid {
  align-items: stretch;
  gap: clamp(1.25rem, 2vw, 2rem);
}

.template-blog .fink-page-shell .product-card__media {
  aspect-ratio: 1.35 / 1;
  background: var(--tuhu-soft);
}

.template-blog .fink-page-shell .product-card__image {
  position: static;
  aspect-ratio: 1.35 / 1;
  object-fit: cover;
}

.template-blog .fink-page-shell .product-card__info {
  justify-items: start;
  text-align: start;
}

.template-blog .fink-page-shell .product-card__info > a:hover {
  color: var(--tuhu-accent) !important;
}

.slideshow .page-dots {
  gap: .45rem !important;
  padding: .45rem .6rem;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 999px;
  background: rgba(47, 48, 56, .32);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.slideshow .page-dots > button {
  position: relative;
  width: 1.25rem !important;
  height: 1.25rem !important;
  padding: 0;
  border-radius: 999px;
  color: #FFFFFF;
}

.slideshow .page-dots > button::after {
  inset: .28rem;
  opacity: .55;
  background: #FFFFFF;
}

.slideshow .page-dots > button[aria-current="true"]::after {
  opacity: 1;
  background: var(--tuhu-button-text);
}

.slideshow .page-dots .circular-progress {
  position: absolute;
  inset: .08rem;
  width: 1.1rem;
  height: 1.1rem;
}

@media screen and (max-width: 999px) {
  .product-gallery--custom .product-gallery__thumbnail-list.md\:hidden {
    position: relative !important;
    top: auto !important;
    display: flex !important;
    width: 100%;
    max-width: 100%;
    margin-inline: 0 !important;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: .4rem;
    padding: .85rem .75rem !important;
    overflow: visible !important;
    transform: none !important;
  }

  .product-gallery--custom .product-gallery__thumbnail-list.md\:hidden > button {
    width: 1.15rem;
    height: 1.15rem;
    min-width: 1.15rem;
    flex: 0 0 1.15rem;
    padding: 0;
    border: 1px solid rgba(47, 48, 56, .28);
    border-radius: 50%;
    background: var(--tuhu-surface);
  }

  .product-gallery--custom .product-gallery__thumbnail-list.md\:hidden > button[aria-current="true"] {
    border-color: var(--tuhu-accent);
    background: var(--tuhu-accent);
    box-shadow: 0 0 0 3px var(--tuhu-surface), 0 0 0 4px var(--tuhu-accent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .haravan-challenge__button,
  .haravan-payment-button__button--unbranded,
  .fink-product-card,
  .fink-product-card .product-card__quick-add-button,
  .color-swatch,
  .pagination__link,
  .slideshow .page-dots > button,
  .product-gallery--custom .product-gallery__thumbnail {
    transition: none !important;
    transform: none !important;
  }
}