:root{--hao-cream:#fbf7ef;--hao-cream2:#f3ecdf;--hao-brown:#56331f;--hao-dark:#28160f;--hao-muted:#75685f;--hao-line:rgba(86,51,31,.17)}
.hao-shop{width:100%;color:var(--hao-dark);font-family:inherit}.hao-shop-toolbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:26px;flex-wrap:wrap}.hao-filters{display:flex;gap:9px;flex-wrap:wrap}.hao-filter{padding:9px 17px;border:1px solid var(--hao-line);border-radius:999px;color:var(--hao-brown);text-decoration:none;background:#fff}.hao-filter.is-active,.hao-filter:hover{background:var(--hao-brown);color:#fff}.hao-shop-tools{display:flex;gap:16px;align-items:center}.hao-product-count{color:var(--hao-muted);font-size:14px}.hao-sort-form select{padding:9px 34px 9px 12px;border:1px solid var(--hao-line);border-radius:8px;background:#fff}.hao-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.hao-product-card{background:#fff;border:1px solid var(--hao-line);border-radius:14px;overflow:hidden;box-shadow:0 7px 24px rgba(40,22,15,.06)}.hao-product-card__image{aspect-ratio:1/1;background:var(--hao-cream2);overflow:hidden;position:relative}.hao-product-card__image img{width:100%;height:100%;object-fit:cover;display:block}.hao-image-fallback{width:100%;height:100%;display:grid;place-content:center;text-align:center;background:linear-gradient(145deg,#f7f0e5,#ece0d0);color:var(--hao-brown)}.hao-image-fallback span{font-family:Georgia,serif;font-size:46px;line-height:.9}.hao-image-fallback small{letter-spacing:.35em;margin-top:7px}.hao-product-card__body{padding:16px}.hao-product-card h3{font-size:21px;line-height:1.15;margin:0 0 8px}.hao-product-card__short{margin:0 0 14px;color:var(--hao-muted);line-height:1.45;min-height:42px}.hao-product-card__meta{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:13px}.hao-product-card__meta span{color:var(--hao-muted);font-size:13px}.hao-product-card__meta strong{font-size:20px;color:var(--hao-brown)}.hao-quick-view{width:100%;padding:11px;border:0;border-radius:8px;background:var(--hao-brown);color:#fff;font-weight:600;cursor:pointer}.hao-pagination{display:flex;justify-content:center;gap:8px;margin:30px 0 5px;flex-wrap:wrap}.hao-pagination a{min-width:38px;height:38px;padding:0 10px;display:grid;place-items:center;border:1px solid var(--hao-line);border-radius:7px;text-decoration:none;color:var(--hao-brown);background:#fff}.hao-pagination a.is-active{background:var(--hao-brown);color:#fff}.hao-page-nav{min-width:78px!important}
.hao-modal{display:none;position:fixed;inset:0;z-index:999999}.hao-modal.is-open{display:block}.hao-modal__backdrop{position:absolute;inset:0;background:rgba(25,14,9,.73);backdrop-filter:blur(3px)}.hao-modal__dialog{position:relative;z-index:2;width:min(1120px,calc(100% - 28px));max-height:calc(100vh - 28px);overflow:auto;margin:14px auto;background:var(--hao-cream);border-radius:18px;box-shadow:0 30px 90px rgba(0,0,0,.3)}.hao-modal__close{position:absolute;top:13px;right:15px;z-index:5;border:0;background:rgba(255,255,255,.94);width:40px;height:40px;border-radius:50%;font-size:28px;color:var(--hao-brown);cursor:pointer}.hao-modal__content{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:27px 27px 17px}.hao-modal__image-wrap{aspect-ratio:1/1;border-radius:13px;overflow:hidden;background:var(--hao-cream2)}.hao-modal__main-image{width:100%;height:100%;object-fit:cover;display:block}.hao-modal__fallback{height:100%}.hao-modal__thumbs{display:flex;gap:8px;margin-top:9px;overflow:auto}.hao-modal__thumb{flex:0 0 68px;width:68px;height:68px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:none;cursor:pointer}.hao-modal__thumb.is-active{border-color:var(--hao-brown)}.hao-modal__thumb img{width:100%;height:100%;object-fit:cover}.hao-modal__brand{font-size:13px;color:var(--hao-muted);margin-bottom:3px}.hao-modal__title{font-size:38px;line-height:1.05;margin:0 45px 5px 0}.hao-modal__sku-wrap{font-size:12px;color:var(--hao-muted);margin-top:7px}.hao-modal__price-row{display:flex;gap:12px;align-items:baseline;margin:11px 0 15px}.hao-modal__price{font-size:29px;color:var(--hao-brown)}.hao-modal__weight{color:var(--hao-muted)}.hao-modal__short{font-size:16px;line-height:1.5;padding-bottom:15px;border-bottom:1px solid var(--hao-line)}.hao-variants{padding:14px 0;border-bottom:1px solid var(--hao-line)}.hao-variant-group{margin-bottom:10px}.hao-variant-group label{font-weight:700;display:block;margin-bottom:6px}.hao-variant-group select{width:100%;padding:10px;border:1px solid var(--hao-line);border-radius:8px;background:#fff}.hao-variant-note{display:block;color:var(--hao-muted);margin-top:5px}.hao-modal__description{line-height:1.6;margin-top:15px}.hao-modal__details-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:17px}.hao-modal__details-grid h3{font-size:18px;margin:0 0 10px}.hao-modal__features{margin:0;padding-left:19px;line-height:1.5}.hao-modal__features li{margin:0 0 6px}.hao-modal__specs{margin:0}.hao-modal__specs-row{display:grid;grid-template-columns:105px 1fr;gap:9px;padding:5px 0;border-bottom:1px solid rgba(86,51,31,.1)}.hao-modal__specs dt{font-weight:700}.hao-modal__specs dd{margin:0;color:#5f5148}.hao-modal__extra{margin-top:15px;border-top:1px solid var(--hao-line)}.hao-extra-row{display:grid;grid-template-columns:145px 1fr;gap:12px;padding:9px 0;border-bottom:1px solid rgba(86,51,31,.1)}.hao-marketplaces{border-top:1px solid var(--hao-line);padding:20px 27px 26px;text-align:center;background:rgba(255,255,255,.42)}.hao-marketplaces h3{margin:0 0 3px;font-size:23px}.hao-marketplaces p{margin:0 0 14px;color:var(--hao-muted)}.hao-marketplaces__buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.hao-marketplace{display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:9px;text-decoration:none!important;color:#fff!important;font-weight:700}.hao-marketplace--shopee{background:#ee4d2d}.hao-marketplace--lazada{background:#2742c7}.hao-marketplace--tiktok{background:#111}.hao-no-marketplace{margin-top:8px;color:var(--hao-muted);font-size:14px}.hao-modal-open{overflow:hidden}[hidden]{display:none!important}
@media(max-width:1024px) and (min-width:768px){.hao-product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.hao-product-card__body{padding:12px}.hao-product-card h3{font-size:17px}.hao-product-card__short{font-size:13px}}
@media(max-width:900px){.hao-modal__content{grid-template-columns:1fr}.hao-modal__image-wrap{aspect-ratio:1/1}}
@media(max-width:767px){.hao-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hao-shop-toolbar,.hao-shop-tools{align-items:flex-start}.hao-shop-tools{width:100%;justify-content:space-between;flex-wrap:wrap}.hao-product-card__short{min-height:0}.hao-modal__dialog{width:calc(100% - 14px);margin:7px auto;max-height:calc(100vh - 14px)}.hao-modal__content{padding:18px 14px 12px;gap:18px}.hao-modal__title{font-size:30px}.hao-modal__details-grid{grid-template-columns:1fr}.hao-extra-row{grid-template-columns:1fr;gap:3px}.hao-marketplaces{padding:17px 14px 20px}.hao-marketplaces__buttons{grid-template-columns:1fr}}

.hao-modal__old-price{text-decoration:line-through;opacity:.6;margin-right:8px}.hao-sale-badge{display:inline-block;margin-left:10px;padding:4px 8px;border-radius:999px;background:#f3e7dc;font-size:12px;font-weight:700}.hao-sale-badge[hidden],.hao-modal__old-price[hidden]{display:none!important}

.hao-card-slides{position:absolute;inset:0}.hao-card-slide{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;opacity:0;transition:opacity .22s ease;pointer-events:none}.hao-card-slide.is-active{opacity:1}.hao-card-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:34px;height:34px;border-radius:50%;border:1px solid rgba(86,51,31,.2);background:rgba(255,255,255,.9);color:var(--hao-brown);font-size:24px;line-height:1;display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .2s ease}.hao-card-prev{left:8px}.hao-card-next{right:8px}.hao-product-card__image:hover .hao-card-nav{opacity:1}.hao-card-dots{position:absolute;left:50%;bottom:9px;transform:translateX(-50%);z-index:3;display:flex;gap:5px;padding:5px 7px;border-radius:999px;background:rgba(255,255,255,.72)}.hao-card-dot{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(86,51,31,.28);cursor:pointer}.hao-card-dot.is-active{background:var(--hao-brown)}@media(max-width:767px){.hao-card-nav{display:none}.hao-card-dots{bottom:7px}}


/* v8.4 interaction + Quick View refinements */
:root{--hao-hover:#f58120}
.hao-modal__close{display:flex;align-items:center;justify-content:center;font-size:0;line-height:0;transition:background-color .18s ease,color .18s ease,border-color .18s ease;position:absolute}
.hao-modal__close::before,.hao-modal__close::after{content:"";position:absolute;width:17px;height:2px;border-radius:2px;background:currentColor;left:50%;top:50%;transform-origin:center}
.hao-modal__close::before{transform:translate(-50%,-50%) rotate(45deg)}
.hao-modal__close::after{transform:translate(-50%,-50%) rotate(-45deg)}
.hao-card-nav{display:flex;align-items:center;justify-content:center;font-size:0;line-height:0;transition:opacity .2s ease,background-color .18s ease,color .18s ease,border-color .18s ease}
.hao-card-nav::before{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform-origin:center}
.hao-card-prev::before{transform:translate(-42%,-50%) rotate(-135deg)}.hao-card-next::before{transform:translate(-58%,-50%) rotate(45deg)}
.hao-modal__extra--media{margin-top:14px}.hao-modal__extra--mobile{display:none}
.hao-modal__media .hao-extra-row{grid-template-columns:125px 1fr}.hao-modal__media .hao-extra-row span{min-width:0;overflow-wrap:anywhere}
.hao-modal__info .hao-modal__description{padding-bottom:2px}
.hao-modal__price-row{flex-wrap:wrap}

/* One consistent hover accent across Product System controls */
.hao-filter:hover,.hao-filter:focus-visible,.hao-quick-view:hover,.hao-quick-view:focus-visible,.hao-pagination a:hover,.hao-pagination a:focus-visible,.hao-card-nav:hover,.hao-card-nav:focus-visible,.hao-modal__close:hover,.hao-modal__close:focus-visible,.hao-marketplace:hover,.hao-marketplace:focus-visible{background:#f58120!important;border-color:#f58120!important;color:#fff!important;outline:none}
.hao-card-dot:hover,.hao-card-dot:focus-visible{background:#f58120!important;outline:none}
.hao-modal__thumb:hover,.hao-modal__thumb:focus-visible{border-color:#f58120!important;outline:none}
.hao-variant-group select:hover,.hao-variant-group select:focus,.hao-sort-form select:hover,.hao-sort-form select:focus{border-color:#f58120!important;outline-color:#f58120}
.hao-pagination a.is-active:hover,.hao-filter.is-active:hover{background:#f58120!important;border-color:#f58120!important}

@media(max-width:767px){
  .hao-modal__extra--media{display:none!important}
  .hao-modal__extra--mobile{display:block}
  .hao-modal__info .hao-modal__extra--mobile{margin-top:15px}
  .hao-card-nav{display:none}
}

/* v8.5: unified interactive hover accent */
.hao-filter,.hao-quick-view,.hao-pagination a,.hao-card-nav,.hao-modal__close,.hao-marketplace,.hao-card-dot,.hao-modal__thumb,.hao-variant-group select,.hao-sort-form select{transition:background-color .18s ease,color .18s ease,border-color .18s ease,opacity .18s ease,box-shadow .18s ease}
.hao-filter:hover,.hao-filter:focus-visible,.hao-quick-view:hover,.hao-quick-view:focus-visible,.hao-pagination a:hover,.hao-pagination a:focus-visible,.hao-card-nav:hover,.hao-card-nav:focus-visible,.hao-modal__close:hover,.hao-modal__close:focus-visible,.hao-marketplace:hover,.hao-marketplace:focus-visible{background:#f58120!important;border-color:#f58120!important;color:#fff!important;outline:none}
.hao-card-dot:hover,.hao-card-dot:focus-visible{background:#f58120!important;outline:none}
.hao-modal__thumb:hover,.hao-modal__thumb:focus-visible{border-color:#f58120!important;outline:none}
.hao-variant-group select:hover,.hao-variant-group select:focus,.hao-sort-form select:hover,.hao-sort-form select:focus{border-color:#f58120!important;outline:2px solid rgba(245,129,32,.15);outline-offset:1px}

/* v8.6 — approved Hao Cacao palette, cleaner slider controls, sticky close, unified details layout */
:root{
  --hao-brown:#5a2d18;
  --hao-hover:#f58120;
  --hao-dark:#221313;
  --hao-muted:#221313;
  --hao-cream:#fffcf5;
  --hao-cream2:#fffcf5;
  --hao-line:rgba(90,45,24,.20);
}
.hao-shop,.hao-product-card,.hao-modal__dialog,.hao-modal__content,.hao-marketplaces{color:#221313;background:#fffcf5}
.hao-product-card{border-color:rgba(90,45,24,.20);box-shadow:0 7px 24px rgba(34,19,19,.08)}
.hao-product-card h3,.hao-modal__title,.hao-modal__details-grid h3,.hao-marketplaces h3{color:#221313}
.hao-product-card__short,.hao-product-count,.hao-variant-note,.hao-modal__brand,.hao-marketplaces p,.hao-no-marketplace,.hao-modal__specs dd{color:#221313;opacity:.72}
.hao-product-card__meta strong,.hao-modal__price{color:#5a2d18}
.hao-product-card__image,.hao-modal__image-wrap{background:#fffcf5}
.hao-image-fallback{background:#fffcf5!important;color:#5a2d18!important}

/* Product card primary action — force theme/Elementor overrides away. */
.hao-quick-view{
  appearance:none!important;-webkit-appearance:none!important;
  width:100%!important;padding:12px 16px!important;
  border:1px solid #5a2d18!important;border-radius:8px!important;
  background:#5a2d18!important;color:#fffcf5!important;
  box-shadow:none!important;text-decoration:none!important;
  font-weight:700!important;letter-spacing:.02em!important;
}
.hao-quick-view:hover,.hao-quick-view:focus-visible{
  background:#f58120!important;border-color:#f58120!important;color:#fffcf5!important;outline:none!important;
}

/* Slider arrows — exact geometric centering and palette enforcement. */
.hao-card-nav{
  appearance:none!important;-webkit-appearance:none!important;
  width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;
  padding:0!important;margin:0!important;border-radius:50%!important;
  border:1px solid #5a2d18!important;background:#fffcf5!important;color:#5a2d18!important;
  box-shadow:none!important;display:flex!important;align-items:center!important;justify-content:center!important;
  line-height:0!important;font-size:0!important;
}
.hao-card-nav::before{
  content:""!important;position:absolute!important;left:50%!important;top:50%!important;
  width:8px!important;height:8px!important;margin:0!important;
  border-top:2px solid currentColor!important;border-right:2px solid currentColor!important;
  transform-origin:50% 50%!important;
}
.hao-card-prev::before{transform:translate(-50%,-50%) rotate(-135deg)!important}
.hao-card-next::before{transform:translate(-50%,-50%) rotate(45deg)!important}
.hao-card-nav:hover,.hao-card-nav:focus-visible{
  background:#f58120!important;border-color:#f58120!important;color:#fffcf5!important;outline:none!important;
}

/* Clean carousel dots: no pill/button theme artifacts. */
.hao-card-dots{
  left:50%!important;bottom:10px!important;transform:translateX(-50%)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  gap:6px!important;padding:4px 6px!important;margin:0!important;
  border:0!important;border-radius:999px!important;background:#fffcf5!important;
  box-shadow:none!important;line-height:0!important;
}
.hao-card-dot{
  appearance:none!important;-webkit-appearance:none!important;
  display:block!important;flex:0 0 7px!important;
  width:7px!important;height:7px!important;min-width:7px!important;min-height:7px!important;
  padding:0!important;margin:0!important;border:1px solid #5a2d18!important;
  border-radius:50%!important;background:#fffcf5!important;
  box-shadow:none!important;font-size:0!important;line-height:0!important;
}
.hao-card-dot.is-active{background:#5a2d18!important;border-color:#5a2d18!important}
.hao-card-dot:hover,.hao-card-dot:focus-visible{background:#f58120!important;border-color:#f58120!important;outline:none!important}

/* Quick View close: circular, brown, and sticky while the modal scrolls. */
.hao-modal__close{
  appearance:none!important;-webkit-appearance:none!important;
  position:sticky!important;top:12px!important;right:auto!important;
  margin:12px 12px -54px auto!important;
  width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;
  padding:0!important;border:1px solid #5a2d18!important;border-radius:50%!important;
  background:#fffcf5!important;color:#5a2d18!important;box-shadow:none!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  z-index:30!important;font-size:0!important;line-height:0!important;
}
.hao-modal__close::before,.hao-modal__close::after{
  width:17px!important;height:2px!important;background:currentColor!important;left:50%!important;top:50%!important;
}
.hao-modal__close::before{transform:translate(-50%,-50%) rotate(45deg)!important}
.hao-modal__close::after{transform:translate(-50%,-50%) rotate(-45deg)!important}
.hao-modal__close:hover,.hao-modal__close:focus-visible{
  background:#f58120!important;border-color:#f58120!important;color:#fffcf5!important;outline:none!important;
}

/* Details order: Features | Specifications, with Ingredients / Usage / Storage directly beneath Specifications on every device. */
.hao-modal__specs-column{min-width:0}
.hao-modal__extra{margin-top:16px;border-top:1px solid rgba(90,45,24,.20)}
.hao-extra-row{border-bottom:1px solid rgba(90,45,24,.14)}
.hao-modal__specs-row{border-bottom:1px solid rgba(90,45,24,.14)}
.hao-extra-row strong,.hao-modal__specs dt{color:#221313}
.hao-extra-row span,.hao-modal__specs dd{color:#221313;opacity:.82}

/* Remaining controls use the approved palette only. */
.hao-filter,.hao-pagination a,.hao-sort-form select,.hao-variant-group select,.hao-modal__thumb{
  background:#fffcf5!important;color:#221313!important;border-color:#5a2d18!important;
  box-shadow:none!important;
}
.hao-filter.is-active,.hao-pagination a.is-active{background:#5a2d18!important;color:#fffcf5!important;border-color:#5a2d18!important}
.hao-filter:hover,.hao-filter:focus-visible,.hao-pagination a:hover,.hao-pagination a:focus-visible{
  background:#f58120!important;color:#fffcf5!important;border-color:#f58120!important;outline:none!important;
}
.hao-sort-form select:hover,.hao-sort-form select:focus,.hao-variant-group select:hover,.hao-variant-group select:focus{
  border-color:#f58120!important;outline:2px solid rgba(245,129,32,.18)!important;outline-offset:1px!important;
}
.hao-modal__thumb.is-active{border-color:#5a2d18!important}
.hao-modal__thumb:hover,.hao-modal__thumb:focus-visible{border-color:#f58120!important;outline:none!important}
.hao-sale-badge{background:#fffcf5!important;color:#5a2d18!important;border:1px solid #5a2d18!important}
.hao-modal__old-price{color:#221313!important;opacity:.55}

/* Marketplace buttons keep their official marketplace colors by exception. */
.hao-marketplace--shopee:hover,.hao-marketplace--shopee:focus-visible{background:#ee4d2d!important;border-color:#ee4d2d!important;color:#fff!important}
.hao-marketplace--lazada:hover,.hao-marketplace--lazada:focus-visible{background:#2742c7!important;border-color:#2742c7!important;color:#fff!important}
.hao-marketplace--tiktok:hover,.hao-marketplace--tiktok:focus-visible{background:#111!important;border-color:#111!important;color:#fff!important}

@media(max-width:767px){
  .hao-modal__details-grid{grid-template-columns:1fr!important}
  .hao-modal__extra{display:block!important;margin-top:14px!important}
  .hao-card-dots{bottom:8px!important}
}


/* v8.7 — responsive placement of Ingredients / Preparation / Storage only. */
.hao-modal__extra--desktop{display:block}
.hao-modal__extra--after-details{display:none}

/* Tablet: keep these fields beneath the complete Features + Specifications section. */
@media (min-width:768px) and (max-width:1024px){
  .hao-modal__extra--desktop{display:none!important}
  .hao-modal__extra--after-details{display:block!important;margin-top:16px!important}
}

/* Mobile: Features stack first, Specifications second, then these fields directly below Specifications. */
@media (max-width:767px){
  .hao-modal__extra--desktop{display:none!important}
  .hao-modal__extra--after-details{display:block!important;margin-top:14px!important}
}


/* v8.9 — compact dropdown catalog controls + equal-height card actions */
.hao-shop-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.hao-controls-form{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.hao-control{display:flex;flex-direction:column;gap:6px;min-width:190px}
.hao-control>span{font-size:13px;font-weight:700;color:#221313}
.hao-control select{width:100%;min-height:44px;padding:9px 36px 9px 12px;border:1px solid rgba(90,45,24,.32);border-radius:9px;background:#fffcf5;color:#221313;font:inherit;cursor:pointer}
.hao-control select:hover,.hao-control select:focus{border-color:#f58120!important;outline:2px solid rgba(245,129,32,.15);outline-offset:1px}
.hao-shop-tools{margin-left:auto;display:flex;align-items:center;min-height:44px}
.hao-product-card{display:flex!important;flex-direction:column;height:100%}
.hao-product-card__body{display:flex;flex-direction:column;flex:1}
.hao-product-card__meta{margin-top:auto}
.hao-product-card__body>.hao-quick-view{margin-top:auto}
@media(max-width:767px){
  .hao-shop-toolbar{display:block;margin-bottom:18px}
  .hao-controls-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
  .hao-control{min-width:0;width:100%}
  .hao-control select{min-height:42px;font-size:14px;padding:8px 30px 8px 10px}
  .hao-shop-tools{margin:10px 0 0;min-height:0;width:100%}
  .hao-product-count{font-size:13px}
}
@media(max-width:420px){.hao-controls-form{grid-template-columns:1fr}}

/* v1.0 Elementor Product Row — same cards/Quick View as Shop; selection only differs. */
.hao-selected-product-row .hao-product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1024px) and (min-width:768px){.hao-selected-product-row .hao-product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:767px){.hao-selected-product-row .hao-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v1.1 — Product Search + typography + primary button palette */
:root{
  --hao-primary:#f58120;
  --hao-primary-hover:#eea744;
}

/* Product titles */
.hao-product-card h3,
.hao-modal__title{
  font-family:Georgia, 'Times New Roman', serif!important;
}

/* Product Search shortcode / Elementor widget */
.hao-product-search{width:100%;margin:0}
.hao-product-search__row{display:flex;align-items:stretch;width:100%}
.hao-product-search__input{
  flex:1 1 auto;min-width:0;min-height:46px;margin:0!important;padding:10px 14px!important;
  border:1px solid rgba(90,45,24,.32)!important;border-right:0!important;
  border-radius:9px 0 0 9px!important;background:#fffcf5!important;color:#221313!important;
  box-shadow:none!important;font:inherit!important;
}
.hao-product-search__input:focus{border-color:#f58120!important;outline:2px solid rgba(245,129,32,.15)!important;outline-offset:1px!important}
.hao-product-search__button{
  appearance:none!important;-webkit-appearance:none!important;min-height:46px!important;
  width:50px!important;min-width:50px!important;padding:10px!important;margin:0!important;border:1px solid #f58120!important;
  border-radius:0 9px 9px 0!important;background:#f58120!important;color:#fff!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  font:inherit!important;font-weight:700!important;cursor:pointer!important;box-shadow:none!important;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease!important;
}
.hao-product-search__icon{display:block;width:22px;height:22px;fill:currentColor}
.hao-product-search__button:hover,.hao-product-search__button:focus-visible{
  background:#eea744!important;border-color:#eea744!important;color:#fff!important;outline:none!important;
}
.hao-search-summary{margin:-8px 0 18px;color:#221313;font-size:14px}

/* Main Product System buttons — primary orange, hover gold. */
.hao-quick-view,
.hao-pagination a,
.hao-card-nav,
.hao-modal__close{
  background:#f58120!important;
  border-color:#f58120!important;
  color:#fff!important;
}
.hao-quick-view:hover,.hao-quick-view:focus-visible,
.hao-pagination a:hover,.hao-pagination a:focus-visible,
.hao-card-nav:hover,.hao-card-nav:focus-visible,
.hao-modal__close:hover,.hao-modal__close:focus-visible{
  background:#eea744!important;
  border-color:#eea744!important;
  color:#fff!important;
  outline:none!important;
}
.hao-pagination a.is-active{background:#f58120!important;border-color:#f58120!important;color:#fff!important}
.hao-pagination a.is-active:hover{background:#eea744!important;border-color:#eea744!important}
.hao-card-dot.is-active{background:#f58120!important;border-color:#f58120!important}
.hao-card-dot:hover,.hao-card-dot:focus-visible{background:#eea744!important;border-color:#eea744!important}

/* Marketplace buttons intentionally keep marketplace brand colors. */
.hao-marketplace--shopee,.hao-marketplace--shopee:hover,.hao-marketplace--shopee:focus-visible{background:#ee4d2d!important;border-color:#ee4d2d!important;color:#fff!important}
.hao-marketplace--lazada,.hao-marketplace--lazada:hover,.hao-marketplace--lazada:focus-visible{background:#2742c7!important;border-color:#2742c7!important;color:#fff!important}
.hao-marketplace--tiktok,.hao-marketplace--tiktok:hover,.hao-marketplace--tiktok:focus-visible{background:#111!important;border-color:#111!important;color:#fff!important}

@media(max-width:767px){
  .hao-product-search__button{width:46px!important;min-width:46px!important;padding:9px!important}
}

/* v1.3 — Icon-first expandable product search */
.hao-product-search-wrap{
  position:relative;display:inline-flex;align-items:center;justify-content:flex-end;
  width:auto;max-width:100%;z-index:30;
}
.hao-product-search-toggle{
  appearance:none!important;-webkit-appearance:none!important;width:44px!important;height:44px!important;
  min-width:44px!important;min-height:44px!important;padding:10px!important;margin:0!important;
  border:0!important;border-radius:50%!important;background:transparent!important;color:#f58120!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;cursor:pointer!important;
  box-shadow:none!important;transition:background-color .18s ease,color .18s ease,opacity .18s ease!important;
}
.hao-product-search-toggle:hover,.hao-product-search-toggle:focus-visible{
  background:rgba(245,129,32,.10)!important;color:#eea744!important;outline:2px solid rgba(245,129,32,.20)!important;outline-offset:2px!important;
}
.hao-product-search-wrap .hao-product-search{
  position:absolute;right:0;top:50%;width:clamp(230px,30vw,350px);margin:0!important;
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-50%) scaleX(.92);transform-origin:right center;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;z-index:31;
}
.hao-product-search-wrap.is-open .hao-product-search{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(-50%) scaleX(1)}
.hao-product-search-wrap.is-open .hao-product-search-toggle{opacity:0;visibility:hidden;pointer-events:none}
.hao-product-search-wrap .hao-product-search__row{box-shadow:0 6px 20px rgba(34,19,19,.12);border-radius:9px}

/* v1.3 — Responsive hamburger navigation */
.hao-hamburger{position:relative;display:inline-flex;align-items:center;z-index:40}
.hao-hamburger__toggle,.hao-hamburger__close{
  appearance:none!important;-webkit-appearance:none!important;border:0!important;background:transparent!important;
  color:#f58120!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-width:44px!important;min-height:44px!important;padding:9px!important;margin:0!important;cursor:pointer!important;
  box-shadow:none!important;border-radius:8px!important;gap:7px!important;font:inherit!important;font-weight:600!important;
  transition:background-color .18s ease,color .18s ease!important;
}
.hao-hamburger__toggle:hover,.hao-hamburger__toggle:focus-visible,.hao-hamburger__close:hover,.hao-hamburger__close:focus-visible{
  background:rgba(245,129,32,.10)!important;color:#eea744!important;outline:2px solid rgba(245,129,32,.20)!important;outline-offset:2px!important;
}
.hao-hamburger-icon,.hao-hamburger-close-icon{width:26px;height:26px;display:block;fill:currentColor}
.hao-hamburger__backdrop{position:fixed;inset:0;background:rgba(34,19,19,.36);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility .2s ease;z-index:99997}
.hao-hamburger__panel{
  position:fixed;top:0;right:0;width:min(390px,92vw);height:100%;max-height:100vh;overflow-y:auto;overscroll-behavior:contain;
  background:#fffcf5;color:#221313;box-shadow:-12px 0 32px rgba(34,19,19,.16);z-index:99998;
  transform:translateX(102%);visibility:hidden;transition:transform .24s ease,visibility .24s ease;
}
.hao-hamburger.is-open .hao-hamburger__backdrop{opacity:1;visibility:visible;pointer-events:auto}
.hao-hamburger.is-open .hao-hamburger__panel{transform:translateX(0);visibility:visible}
.hao-hamburger__top{display:flex;justify-content:flex-start;align-items:center;min-height:68px;padding:12px 18px;border-bottom:1px solid rgba(90,45,24,.14)}
.hao-hamburger-nav{padding:0 0 24px}
.hao-hamburger-nav__list,.hao-hamburger-nav__list .sub-menu{list-style:none!important;margin:0!important;padding:0!important}
.hao-hamburger-nav__list>li{position:relative;border-bottom:1px solid rgba(90,45,24,.14)}
.hao-hamburger-nav__list li>a{
  display:flex;align-items:center;min-height:58px;padding:14px 58px 14px 24px;text-decoration:none!important;
  color:#221313!important;background:transparent!important;font-size:18px;font-weight:600;line-height:1.25;
}
.hao-hamburger-nav__list li>a:hover,.hao-hamburger-nav__list li>a:focus-visible,
.hao-hamburger-nav__list li.current-menu-item>a,.hao-hamburger-nav__list li.current-menu-ancestor>a{color:#f58120!important}
.hao-submenu-toggle{
  position:absolute;right:12px;top:8px;width:44px;height:44px;padding:0!important;margin:0!important;border:0!important;
  border-radius:8px!important;background:transparent!important;color:#5a2d18!important;display:flex!important;align-items:center!important;justify-content:center!important;cursor:pointer!important;
}
.hao-submenu-toggle:hover,.hao-submenu-toggle:focus-visible{background:rgba(245,129,32,.10)!important;color:#f58120!important;outline:2px solid rgba(245,129,32,.18)!important;outline-offset:1px!important}
.hao-submenu-toggle svg{width:20px;height:20px;fill:currentColor;transition:transform .18s ease}
.hao-hamburger-nav__list li.is-submenu-open>.hao-submenu-toggle svg{transform:rotate(180deg)}
.hao-hamburger-nav__list .sub-menu{display:none;background:rgba(90,45,24,.035);border-top:1px solid rgba(90,45,24,.08)}
.hao-hamburger-nav__list li.is-submenu-open>.sub-menu{display:block}
.hao-hamburger-nav__list .sub-menu li{position:relative;border-bottom:1px solid rgba(90,45,24,.08)}
.hao-hamburger-nav__list .sub-menu li:last-child{border-bottom:0}
.hao-hamburger-nav__list .sub-menu a{min-height:50px;padding:11px 58px 11px 38px;font-size:16px;font-weight:500}
.hao-hamburger-nav__list .sub-menu .sub-menu a{padding-left:54px;font-size:15px}
body.hao-menu-open{overflow:hidden!important}

@media(max-width:767px){
  .hao-product-search-wrap .hao-product-search{
    position:absolute;right:0;top:calc(100% + 8px);width:min(360px,calc(100vw - 28px));
    transform:translateY(-4px) scale(.98);transform-origin:top right;
  }
  .hao-product-search-wrap.is-open .hao-product-search{transform:translateY(0) scale(1)}
  .hao-product-search-wrap .hao-product-search__input{font-size:16px!important}
  .hao-hamburger__panel{width:100%;max-width:none}
  .hao-hamburger-nav__list li>a{min-height:62px;padding-left:28px;font-size:19px}
}

@media(prefers-reduced-motion:reduce){
  .hao-product-search-wrap .hao-product-search,.hao-hamburger__backdrop,.hao-hamburger__panel,.hao-submenu-toggle svg{transition:none!important}
}

/* ============================================================
   v1.5 — Crawlable Product Pages + Bulk Orders
   ============================================================ */
.hao-quick-view{text-decoration:none!important;text-align:center}

/* Purchase/action buttons automatically reflow based on however many URLs exist. */
.hao-marketplaces__buttons{
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;
}
.hao-marketplace--bulk,
.hao-marketplace--bulk:hover,
.hao-marketplace--bulk:focus-visible{
  background:#19b9a5!important;
  border-color:#19b9a5!important;
  color:#fff!important;
}

/* Real, public /product/... page. It intentionally uses the same detail classes/data as Quick View. */
.hao-product-page-shell{
  width:100%;
  padding:86px 20px 64px;
  background:#fffcf5;
}
.hao-product-page{
  width:min(1120px,100%);
  margin:0 auto;
  background:var(--hao-cream,#fbf7ef);
  color:var(--hao-dark,#28160f);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 16px 50px rgba(40,22,15,.08);
}
.hao-product-page__content{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:32px;
  padding:30px 30px 20px;
}
.hao-product-page .hao-modal__title{
  margin-right:0!important;
}
.hao-product-page .hao-modal__main-image{
  background:#f3ecdf;
}
.hao-product-page .hao-marketplaces{
  padding-bottom:30px;
}
.hao-product-page .hao-marketplace{
  text-decoration:none!important;
}

@media (min-width:768px) and (max-width:1024px){
  .hao-product-page-shell{padding:70px 18px 50px}
  .hao-product-page__content{gap:24px;padding:24px 22px 18px}
  .hao-product-page .hao-modal__title{font-size:32px!important}
}

@media (max-width:767px){
  .hao-product-page-shell{padding:56px 12px 36px}
  .hao-product-page{border-radius:14px}
  .hao-product-page__content{grid-template-columns:1fr;gap:18px;padding:16px}
  .hao-product-page .hao-modal__title{font-size:29px!important;line-height:1.08!important}
  .hao-product-page .hao-marketplaces{padding:18px 16px 22px}
  .hao-marketplaces__buttons{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .hao-marketplace{min-height:48px!important;font-size:14px!important;padding:8px!important}
}

@media (max-width:420px){
  .hao-product-page-shell{padding-left:8px;padding-right:8px;padding-top:48px}
  .hao-marketplaces__buttons{grid-template-columns:1fr!important}
}
\n\n/* ============================================================
   v1.11 — Stable media order, responsive square galleries, clean arrows
   ============================================================ */
/* Keep every Quick View / Product Page media stage square and fully visible on all devices. */
.hao-modal__media,.hao-modal__info{min-width:0!important;max-width:100%!important}
.hao-modal__image-wrap{
  width:100%!important;max-width:100%!important;height:auto!important;aspect-ratio:1/1!important;
  overflow:hidden!important;display:block!important;position:relative!important;
}
.hao-modal__main-image{
  width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;
  object-fit:contain!important;object-position:center center!important;display:block!important;
}
.hao-modal__thumbs{width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-inline:contain!important}
.hao-modal__thumb img{object-fit:contain!important;object-position:center center!important;background:#fffcf5!important}

/* Product-card carousel: arrows only, no circular button/background. Keep a generous invisible tap target. */
.hao-card-nav{
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:42px!important;height:48px!important;min-width:42px!important;min-height:48px!important;
  padding:0!important;margin:0!important;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;color:#f58120!important;opacity:1!important;
}
.hao-card-nav:hover,.hao-card-nav:focus-visible{
  background:transparent!important;border:0!important;color:#eea744!important;box-shadow:none!important;outline:none!important;
}
.hao-card-nav::before{width:11px!important;height:11px!important;border-top:3px solid currentColor!important;border-right:3px solid currentColor!important}
.hao-card-prev{left:4px!important}.hao-card-next{right:4px!important}

/* Ensure the modal itself never creates horizontal clipping on narrow devices. */
.hao-modal__dialog{max-width:calc(100vw - 14px)!important;overflow-x:hidden!important}
.hao-modal__content{min-width:0!important}

@media(max-width:900px){
  .hao-modal__content{grid-template-columns:minmax(0,1fr)!important}
  .hao-modal__media,.hao-modal__info{width:100%!important;min-width:0!important}
}
@media(max-width:767px){
  .hao-modal__dialog{width:calc(100% - 14px)!important;max-width:calc(100vw - 14px)!important}
  .hao-modal__content{padding:18px 14px 12px!important;gap:18px!important}
  .hao-modal__image-wrap{width:100%!important;aspect-ratio:1/1!important}
  .hao-card-nav{display:flex!important;width:38px!important;height:46px!important;min-width:38px!important;min-height:46px!important}
  .hao-card-nav::before{width:10px!important;height:10px!important}
}
