/* HaTuaBaht SG: FESTIVE DECORATIONS, PERMANENT LAVENDER + SPRING GREEN.
   The core colours remain defined in lavender-spring.css for every season.
   Seasonal treatments use ornaments and small accent details only. */
:root {
  --htb-evergreen-purple: #6752A2;
  --htb-evergreen-green: #4C7655;
  --htb-evergreen-lavender: #EEE7FC;
  --htb-evergreen-spring: #DFF0D5;
}
body[data-season-theme] {
  --pink: var(--htb-evergreen-purple);
  --pink-dark: #4A3B7C;
  --ink: #302B42;
  --muted: #6B6580;
  --bg: #FAF9FE;
  --season-accent: #927CC3;
  --season-badge-bg: #F4EFFD;
  --season-badge-border: #DDD3F3;
  --season-emoji-one: '🌷';
  --season-emoji-two: '✨';
}
body[data-season-theme="halloween"] {
  --season-accent:#D68B49;
  --season-badge-bg:#FFF2E4;
  --season-badge-border:#E7C7A6;
  --season-emoji-one:'🎃';
  --season-emoji-two:'🦇';
}
body[data-season-theme="easter"] {
  --season-accent:#8EBB82;
  --season-badge-bg:#F5F5FF;
  --season-badge-border:#BFDDB6;
  --season-emoji-one:'🐣';
  --season-emoji-two:'🥚';
}
body[data-season-theme="christmas"] {
  --season-accent:#BF7777;
  --season-badge-bg:#F3FBF2;
  --season-badge-border:#B9DBBD;
  --season-emoji-one:'🎄';
  --season-emoji-two:'❄️';
}
body[data-season-theme="valentine"] {
  --season-accent:#D39DBB;
  --season-badge-bg:#FDF1F8;
  --season-badge-border:#E8C9DB;
  --season-emoji-one:'💝';
  --season-emoji-two:'💌';
}
body[data-season-theme="summer"] {
  --season-accent:#E6C46F;
  --season-badge-bg:#F8F7E8;
  --season-badge-border:#E6E3C1;
  --season-emoji-one:'☀️';
  --season-emoji-two:'🌻';
}
/* Structural brand surfaces and buttons never switch into orange, black, red or pink.
   Only small ornaments use the authentic holiday accent. */
body[data-season-theme] .hero {
  background:
     radial-gradient(circle at 83% 29%, #D5ECD0 0%, transparent 45%),
     linear-gradient(125deg,#EEE7FC 0%,#F9F7FF 58%,#DFF0D5 100%);
  color:#302B42;
}
body[data-season-theme] .hero h1,
body[data-season-theme] .hero .hero-copy h1,
body[data-season-theme] .catalog-banner h1{color:inherit}
body[data-season-theme] .hero h1 em,
body[data-season-theme] .hero .hero-copy h1 em{color:#674F9F}
body[data-season-theme] .hero .hero-description{color:#615A77}
body[data-season-theme] .hero .hero-note{color:#635582}
body[data-season-theme] .hero .hero-note-icon{color:#635582}
body[data-season-theme] .hero .text-link{color:#604D8B;border-bottom-color:#A99BD0}
body[data-season-theme] .hero .text-link:hover{color:#3C315A}
body[data-season-theme] .hero .eyebrow{background:#FFFFFFCC;border-color:#D9CDEE;color:#5E4C91}
body[data-season-theme] .site-header{background:#FEFDFFEB;border-color:#E3DCEF}
body[data-season-theme] .site-header .logo-text,
body[data-season-theme] .site-header .desktop-nav a,
body[data-season-theme] .site-header .icon-button,
body[data-season-theme] .site-header .cart-trigger{color:#302B42}
body[data-season-theme] .site-header .logo-text strong{color:#6651A3}
body[data-season-theme] .site-header .desktop-nav a:hover{color:#6752A2}
body[data-season-theme] .announcement{background:#604E92;color:#FFFFFF}
body[data-season-theme] .primary-btn,
body[data-season-theme] .hero .primary-btn{background:#4C7655;border-color:#4C7655;color:#FFFFFF}
body[data-season-theme] .primary-btn:hover,
body[data-season-theme] .hero .primary-btn:hover{background:#365C42;border-color:#365C42;color:#FFFFFF}
body[data-season-theme] .logo-mark{background:#D9F1CB;color:#3B7952}
body[data-season-theme] .home-categories{background:linear-gradient(180deg,#F2EFFC,#EFF9EB)}
body[data-season-theme] .how-section{background:#F2EFFA}
body[data-season-theme] .questions-section{background:#F4F7F1}
body[data-season-theme] footer{background:#332D4B;color:#F8F4FF}
body[data-season-theme] .catalog-banner{
  background:radial-gradient(circle at 90% 5%,#668E83 0%,transparent 45%),linear-gradient(115deg,#51427E,#7969A8 65%,#5D896E);
  color:#FFFFFF;
}
body[data-season-theme] .catalog-banner h1 em{color:#D9F4C8}
/* Seasonal ornaments repeat through home and catalogue rather than replacing brand. */
.hero,.home-categories,.how-section,.about-section,.catalog-banner{position:relative;isolation:isolate}
.hero::before,.hero::after,.home-categories::before,.how-section::after,.about-section::after,.catalog-banner::after {
  pointer-events:none;user-select:none;position:absolute;line-height:1;z-index:1;
  filter:drop-shadow(0 6px 9px #40325516);
}
body[data-season-theme] .hero::before{content:var(--season-emoji-one);right:4%;top:13%;font-size:clamp(30px,4vw,65px);transform:rotate(13deg)}
body[data-season-theme] .hero::after{content:var(--season-emoji-two);right:26%;bottom:13%;font-size:clamp(24px,3vw,48px);transform:rotate(-16deg)}
body[data-season-theme] .home-categories::before{content:var(--season-emoji-two);right:4%;top:20px;font-size:44px;opacity:.85}
body[data-season-theme] .how-section::after{content:var(--season-emoji-one);left:4%;bottom:34px;font-size:38px;opacity:.85}
body[data-season-theme] .about-section::after{content:var(--season-emoji-two);right:3%;bottom:25px;font-size:40px;opacity:.88}
body[data-season-theme] .catalog-banner::after{content:var(--season-emoji-one);right:7%;top:24%;font-size:clamp(34px,4vw,60px)}
body[data-season-theme="default"] .hero::before,
body[data-season-theme="default"] .hero::after,
body[data-season-theme="default"] .home-categories::before,
body[data-season-theme="default"] .how-section::after,
body[data-season-theme="default"] .about-section::after,
body[data-season-theme="default"] .catalog-banner::after{content:none}
/* The seasonal ribbon is an additional decoration, not a replacement for homepage art. */
.seasonal-pin {
  position:absolute;top:14px;left:19%;z-index:5;
  color:#594C84;background:var(--season-badge-bg);
  border:1px solid var(--season-badge-border);border-radius:999px;
  padding:10px 14px;box-shadow:0 10px 24px #3c345329;
  font-size:12px;line-height:1.3;font-weight:850;letter-spacing:.015em;
  max-width:240px;text-align:center;transform:rotate(-5deg);
}
.seasonal-pin[hidden]{display:none!important}
body[data-season-theme]:not([data-season-theme="default"]) .art-card-front,
body[data-season-theme]:not([data-season-theme="default"]) .art-card-back{
  outline:2px solid var(--season-badge-border);
  outline-offset:3px;
}
body[data-season-theme]:not([data-season-theme="default"]) .perks-grid .perk-symbol{color:#6752A2}
body[data-season-theme]:not([data-season-theme="default"]) .step-card{border-top:3px solid var(--season-accent)}
body[data-season-theme]:not([data-season-theme="default"]) .about-art{
  box-shadow:0 5px 0 var(--season-badge-border),0 20px 36px #52467F19;
}
body[data-season-theme]:not([data-season-theme="default"]) .catalog-banner .small-label::before{content:var(--season-emoji-two);margin-right:8px}
/* Hero photo replacement remains editable and preserves the whole uploaded image. */
.hero-card-image{width:100%;height:100%;object-fit:contain;padding:14px;background:rgba(255,255,255,.55)}
.hero-card-fallback{font-size:106px;filter:drop-shadow(0 14px 8px #6d4d7220);transform:rotate(-11deg)}
.about-feature-image{width:100%;height:100%;object-fit:contain;display:block;border-radius:34px;padding:18px;background:rgba(255,255,255,.55)}
.about-feature-fallback{position:relative;width:100%;height:100%}
.about-art.has-feature-image{padding:0;overflow:hidden;background:linear-gradient(135deg,#e7ddff,#d8f4e1)}
.about-art.has-feature-image .about-heart,.about-art.has-feature-image .about-star,.about-art.has-feature-image .about-text{display:none}
@media(max-width:900px){
 body[data-season-theme] .hero::before{right:2%;top:17%;font-size:36px}
 body[data-season-theme] .hero::after{right:19%;bottom:10%;font-size:32px}
 .seasonal-pin{left:3%;top:0}
}
@media(max-width:680px){
 body[data-season-theme] .hero::before{top:auto;bottom:27%;right:4%;font-size:32px}
 body[data-season-theme] .hero::after{bottom:8%;right:19%;font-size:30px}
 .seasonal-pin{top:1px;left:4%;transform:rotate(-3deg);padding:8px 11px;font-size:11px}
 body[data-season-theme] .home-categories::before,body[data-season-theme] .about-section::after{font-size:26px}
 body[data-season-theme] .how-section::after{font-size:25px}
 body[data-season-theme] .catalog-banner::after{right:3%;top:auto;bottom:14px;font-size:28px}
}
@media(prefers-reduced-motion:reduce){.seasonal-pin{transform:none}}


/* Fun decorative buttons while keeping HaTuaBaht SG brand colours.
   Applies across seasons: the main purple/green remain fixed, while tiny festive charms change. */
:root{
  --button-decoration-default:'✿';
}
body[data-season-theme="halloween"]{--button-decoration-default:'🎃';}
body[data-season-theme="easter"]{--button-decoration-default:'🌼';}
body[data-season-theme="christmas"]{--button-decoration-default:'❄️';}
body[data-season-theme="valentine"]{--button-decoration-default:'💜';}
body[data-season-theme="summer"]{--button-decoration-default:'🌿';}
body[data-season-theme="default"],body:not([data-season-theme]){--button-decoration-default:'✿';}

.primary-btn,
.add-button,
.category-tabs button,
.subcategory-tabs button,
.directory-subgroups button,
.continue-shopping,
.checkout-submit,
.checkout-dialog .primary-btn,
.catalog-banner .primary-btn {
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}

.primary-btn,
.checkout-submit,
.checkout-dialog .primary-btn,
.catalog-banner .primary-btn {
  padding-inline:26px;
  border-radius:999px;
  box-shadow:0 12px 24px rgba(71,86,76,.18), inset 0 0 0 1px rgba(255,255,255,.18);
}
.primary-btn::before,
.checkout-submit::before,
.checkout-dialog .primary-btn::before,
.catalog-banner .primary-btn::before {
  content:'';
  position:absolute;
  inset:3px;
  border-radius:999px;
  border:1px dashed rgba(255,255,255,.35);
  z-index:-1;
}
.primary-btn::after,
.checkout-submit::after,
.checkout-dialog .primary-btn::after,
.catalog-banner .primary-btn::after {
  content:var(--button-decoration-default);
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%) rotate(-8deg);
  font-size:15px;
  opacity:.95;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.12));
}
.primary-btn:hover,
.checkout-submit:hover,
.checkout-dialog .primary-btn:hover,
.catalog-banner .primary-btn:hover {
  transform:translateY(-2px) scale(1.01);
  box-shadow:0 16px 28px rgba(71,86,76,.23), inset 0 0 0 1px rgba(255,255,255,.22);
}

.text-link,
.continue-shopping {
  position:relative;
  padding:8px 14px 9px;
  border-radius:999px;
  border:1px dashed rgba(103,82,162,.38);
  background:rgba(255,255,255,.6);
  box-shadow:0 6px 18px rgba(103,82,162,.08);
}
.text-link::before,
.continue-shopping::before {
  content:'✦';
  font-size:11px;
  margin-right:8px;
  color:#7B67B7;
}
.text-link::after,
.continue-shopping::after {
  content:'✦';
  font-size:11px;
  margin-left:8px;
  color:#7B67B7;
}
.text-link:hover,
.continue-shopping:hover {
  background:#fff;
  transform:translateY(-1px);
}

.category-tabs button,
.subcategory-tabs button,
.directory-subgroups button {
  padding-inline:16px 18px;
  border-radius:999px;
  box-shadow:0 8px 16px rgba(103,82,162,.07);
}
.category-tabs button::after,
.subcategory-tabs button::after,
.directory-subgroups button::after {
  content:'✿';
  display:inline-block;
  margin-left:8px;
  font-size:11px;
  line-height:1;
  opacity:.75;
}
.category-tabs button.active::after,
.category-tabs button:hover::after,
.subcategory-tabs button.active::after,
.subcategory-tabs button:hover::after,
.directory-subgroups button:hover::after {
  opacity:1;
}

.add-button {
  border-radius:18px;
  box-shadow:0 10px 18px rgba(76,118,85,.10);
  padding-inline:12px;
}
.add-button::before {
  content:'';
  position:absolute;
  inset:3px;
  border-radius:14px;
  border:1px dashed rgba(76,118,85,.22);
}
.add-button::after {
  content:'＋';
  font-weight:900;
  margin-left:6px;
}
.add-button:hover {transform:translateY(-1px)}

.icon-button,
.cart-trigger,
.close-button {
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease;
}
body[data-season-theme] .icon-button,
body[data-season-theme] .cart-trigger,
body[data-season-theme] .close-button {
  box-shadow:0 6px 14px rgba(103,82,162,.08);
}
body[data-season-theme] .icon-button:hover,
body[data-season-theme] .cart-trigger:hover,
body[data-season-theme] .close-button:hover {
  transform:translateY(-1px) rotate(-4deg);
}

@media(max-width:680px){
  .primary-btn,
  .checkout-submit,
  .checkout-dialog .primary-btn,
  .catalog-banner .primary-btn{padding-inline:22px}
  .primary-btn::after,
  .checkout-submit::after,
  .checkout-dialog .primary-btn::after,
  .catalog-banner .primary-btn::after{right:11px;font-size:13px}
  .text-link,
  .continue-shopping{padding:7px 12px 8px}
  .category-tabs button,
  .subcategory-tabs button,
  .directory-subgroups button{padding-inline:13px 15px}
}


/* Decorative sticker uploads for the Explore categories section */
.home-categories .container{position:relative}
.categories-sticker-layer{position:absolute;inset:0;pointer-events:none;z-index:0}
.home-categories .small-label,.home-categories h2,.home-categories p,.home-categories #home-collection-list,.home-categories .home-catalog-actions{position:relative;z-index:1}
.section-sticker{position:absolute;display:block;width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(72,54,112,.18));opacity:.98;transform-origin:center center}
.section-sticker[hidden]{display:none!important}
.categories-sticker-layer .sticker-a{left:-24px;top:8px;transform:rotate(-10deg)}
.categories-sticker-layer .sticker-b{right:-20px;top:86px;transform:rotate(12deg)}
.categories-sticker-layer .sticker-c{left:4%;bottom:28px;transform:rotate(-8deg)}
.categories-sticker-layer .sticker-d{right:11%;bottom:10px;transform:rotate(8deg)}
@media (max-width: 900px){
  .section-sticker{width:72px;height:72px}
  .categories-sticker-layer .sticker-a{left:-8px;top:-6px}
  .categories-sticker-layer .sticker-b{right:-4px;top:110px}
  .categories-sticker-layer .sticker-c{left:0;bottom:14px}
  .categories-sticker-layer .sticker-d{right:4%;bottom:-4px}
}
@media (max-width: 670px){
  .section-sticker{width:58px;height:58px;opacity:.95}
  .categories-sticker-layer .sticker-a{left:-2px;top:-10px}
  .categories-sticker-layer .sticker-b{right:8px;top:74px}
  .categories-sticker-layer .sticker-c{left:6px;bottom:88px}
  .categories-sticker-layer .sticker-d{right:18px;bottom:54px}
}

/* Keep the green/lavender brand while making the CTA decorations standalone. */
.hero-actions .primary-btn, .home-catalog-actions .primary-btn{padding-right:52px}
.hero-actions .primary-btn > span[aria-hidden], .home-catalog-actions .primary-btn > span[aria-hidden]{display:none!important}
/* Large, varied scrapbook ornaments in category section. Never capture taps. */
.home-categories{background-image:radial-gradient(circle at 16% 8%,#dccdfa82 0%,transparent 31%),radial-gradient(circle at 89% 90%,#cceccc91 0%,transparent 37%)}
.home-categories .catalog-tile{box-shadow:0 16px 30px #6752a216;transition:transform .25s ease,box-shadow .25s ease}
.home-categories .catalog-tile:hover{transform:translateY(-4px) rotate(-.3deg);box-shadow:0 23px 40px #6752a22b}
.home-categories .home-catalog-actions{position:relative}
.home-categories .home-catalog-actions::after{content:'✦  ♡  ✿';color:#a296cb;position:absolute;top:16px;margin-left:25px;font-size:23px;letter-spacing:22px;pointer-events:none}
.category-sticker-collection{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:visible}
.categories-sticker-layer .decor-sticker{position:absolute;width:clamp(72px,9vw,130px);height:clamp(72px,9vw,130px);object-fit:contain;pointer-events:none;filter:drop-shadow(0 12px 14px #4a32632d);animation:htbStickerFloat 5.5s ease-in-out infinite alternate;max-width:calc(100vw - 20px)}
.categories-sticker-layer .decor-sticker[hidden]{display:none!important}
.floating-sticker-0{left:-12%;top:6%;transform:rotate(-12deg);animation-delay:.2s!important}
.floating-sticker-1{right:-10%;top:4%;transform:rotate(12deg);animation-delay:1s!important}
.floating-sticker-2{left:-15%;top:45%;transform:rotate(-6deg);animation-delay:2s!important}
.floating-sticker-3{right:-13%;top:53%;transform:rotate(8deg);animation-delay:3s!important}
.floating-sticker-4{left:-6%;bottom:0;transform:rotate(-12deg);animation-delay:1.5s!important}
.floating-sticker-5{right:-4%;bottom:0;transform:rotate(11deg);animation-delay:2.5s!important}
.floating-sticker-6{left:39%;bottom:-36px;transform:rotate(-8deg);animation-delay:.8s!important}
.floating-sticker-7{right:36%;top:-56px;transform:rotate(10deg);animation-delay:3.7s!important}
@keyframes htbStickerFloat{0%{translate:0 2px;rotate:-4deg;scale:1}50%{translate:0 -7px;rotate:4deg;scale:1.03}100%{translate:0 3px;rotate:-2deg;scale:1}}
.birthday-promo-banner{display:inline-flex;align-items:center;border:2px dashed #8774ba;padding:9px 17px;margin-top:10px;border-radius:100px;color:#514279;background:#fffaf9;font-size:13px;font-weight:900;box-shadow:0 8px 18px #765bac20}
.birthday-price-pill,.birthday-promo-inline{display:block;background:#f4ecff;border:1px solid #d4c5ed;border-radius:12px;padding:8px 10px;color:#594780;font-size:12px;font-weight:800;margin:8px 0}
body[data-birthday-week="true"] .hero::before{content:'🎂';right:4%;top:16%}
body[data-birthday-week="true"] .home-categories::before{content:'🎉';right:3%;top:15px}
body[data-birthday-week="true"] .primary-btn::after{content:'🎂'}
@media(max-width:1200px){.categories-sticker-layer .decor-sticker{width:85px;height:85px}.floating-sticker-0,.floating-sticker-2,.floating-sticker-4{left:-3%}.floating-sticker-1,.floating-sticker-3,.floating-sticker-5{right:-3%}}
@media(max-width:690px){.categories-sticker-layer .decor-sticker{width:55px;height:55px;opacity:.9}.floating-sticker-0{left:1%;top:-32px}.floating-sticker-1{right:1%;top:8px}.floating-sticker-2{left:0;top:42%}.floating-sticker-3{right:0;top:60%}.home-categories .home-catalog-actions::after{display:none}}
@media(prefers-reduced-motion:reduce){.categories-sticker-layer .decor-sticker{animation:none!important}.home-categories .catalog-tile{transition:none}}

/* Decorative charms are the action icons; never put overlapping arrows on the seasonal home CTA. */
.hero-actions .primary-btn > span[aria-hidden="true"],.home-catalog-actions .primary-btn > span[aria-hidden="true"]{display:none!important}
.hero-actions .primary-btn::after,.home-catalog-actions .primary-btn::after{right:13px;z-index:2}
body[data-season-theme] .primary-btn{padding-right:54px}
@media(prefers-reduced-motion:reduce){.categories-sticker-layer .decor-sticker{animation:none!important}}

body[data-season-theme="birthday"] { --season-accent:#D39DBB; --season-badge-bg:#FFF3FB; --season-badge-border:#E9C7DD; --season-emoji-one:'🎂'; --season-emoji-two:'🎉'; }
body[data-season-theme="chinese-new-year"] { --season-accent:#C99653; --season-badge-bg:#FFF3E8; --season-badge-border:#E7C9A9; --season-emoji-one:'🧧'; --season-emoji-two:'🏮'; }
body[data-season-theme="hari-raya"] { --season-accent:#8BAE77; --season-badge-bg:#F4FBED; --season-badge-border:#C9DFB8; --season-emoji-one:'🌙'; --season-emoji-two:'✨'; }
body[data-season-theme="vesak"] { --season-accent:#A587C8; --season-badge-bg:#FAF6FF; --season-badge-border:#D8C8EE; --season-emoji-one:'🪷'; --season-emoji-two:'🕯️'; }
body[data-season-theme="national-day"] { --season-accent:#D27F7F; --season-badge-bg:#FFF1F1; --season-badge-border:#E8C1C1; --season-emoji-one:'🇸🇬'; --season-emoji-two:'⭐'; }
body[data-season-theme="mid-autumn"] { --season-accent:#D0A767; --season-badge-bg:#FFF7E9; --season-badge-border:#E6D2AB; --season-emoji-one:'🏮'; --season-emoji-two:'🌕'; }
body[data-season-theme="deepavali"] { --season-accent:#D9A15F; --season-badge-bg:#FFF6EA; --season-badge-border:#E9D0AF; --season-emoji-one:'🪔'; --season-emoji-two:'✨'; }
body[data-season-theme="new-year"] { --season-accent:#90A8D7; --season-badge-bg:#F3F7FF; --season-badge-border:#CDD8F1; --season-emoji-one:'🎆'; --season-emoji-two:'🥳'; }
body[data-season-theme="birthday"]{--button-decoration-default:'🎂';}
body[data-season-theme="chinese-new-year"]{--button-decoration-default:'🧧';}
body[data-season-theme="hari-raya"]{--button-decoration-default:'🌙';}
body[data-season-theme="vesak"]{--button-decoration-default:'🪷';}
body[data-season-theme="national-day"]{--button-decoration-default:'⭐';}
body[data-season-theme="mid-autumn"]{--button-decoration-default:'🏮';}
body[data-season-theme="deepavali"]{--button-decoration-default:'🪔';}
body[data-season-theme="new-year"]{--button-decoration-default:'🎆';}
