/* Temply Studio UX fixes (Hark, 2026-10-08). Brand: amber #ffa520 + ink #111827, black text on amber. */
:root{--hk-amber:#ffa520;--hk-amber-strong:#b86600;--hk-amber-soft:#fff4df;--hk-ink:#111827}
/* 1. Unify leftover purple accents to brand amber */
#pixio-react-shop-root .bg-\[\#6d5aa4\],#pixio-react-shop-root .bg-\[\#6658a6\]{background-color:var(--hk-amber)!important;color:#000!important}
#pixio-react-shop-root .hover\:bg-\[\#58488b\]:hover{background-color:#e6941a!important}
#pixio-react-shop-root .bg-\[\#6658a6\]\/25{background-color:rgba(255,165,32,.3)!important}
#pixio-react-shop-root .text-\[\#6d5aa4\],#pixio-react-shop-root .text-\[\#7562ad\]{color:var(--hk-amber-strong)!important}
#pixio-react-shop-root .hover\:bg-\[\#f3effb\]:hover,#pixio-react-shop-root .bg-\[\#f3effb\],#pixio-react-shop-root .bg-\[\#f2edfb\]{background-color:var(--hk-amber-soft)!important}
#pixio-react-shop-root .border-\[\#d8cdea\]{border-color:#e9d9bd!important}
#pixio-react-shop-root .text-\[\#514867\],#pixio-react-shop-root .text-\[\#40375f\]{color:var(--hk-ink)!important}
#pixio-react-shop-root a[href*="/checkout/?add-to-cart"]{background-color:var(--hk-amber)!important;color:#000!important;box-shadow:0 8px 18px rgba(184,102,0,.18)!important}
#pixio-react-shop-root a[href*="/checkout/?add-to-cart"]:hover{background-color:#e6941a!important}
#pixio-react-shop-root a[href*="/checkout/?add-to-cart"] svg{color:#000!important}
/* 2. Shop: drop the duplicate "Shop by workflow" block so products appear sooner */
.ts-p4-workflow-head,.ts-p4-workflow-grid{display:none!important}
/* 3. Cart: payment & security row */
.hk-pay-row{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:5px;margin-top:14px;padding-top:12px;border-top:1px dashed currentColor;border-top-color:rgba(127,127,127,.35);font-size:11px;white-space:nowrap}
.hk-pay-lock{display:inline-flex;align-items:center;gap:4px;font-weight:800;margin-right:2px;color:inherit;opacity:.95}
.pc-total-box .hk-pay-lock{color:inherit!important}
.hk-pay-lock svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2}
.hk-pay-chip{display:inline-block;padding:3px 6px;border:1px solid rgba(17,24,39,.14);border-radius:6px;background:#fff;font-weight:700;font-size:11px;letter-spacing:.02em;color:#344054}
/* 4. Added-to-cart toast */
.hk-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;z-index:99999;display:flex;align-items:center;gap:14px;max-width:calc(100vw - 32px);padding:12px 14px 12px 18px;border-radius:14px;background:var(--hk-ink);color:#fff;font:600 14px/1.3 inherit;box-shadow:0 14px 34px rgba(0,0,0,.25);transition:all .3s ease}
.hk-toast.is-on{opacity:1;transform:translate(-50%,0)}
.hk-toast a{flex-shrink:0;padding:8px 14px;border-radius:10px;background:var(--hk-amber);color:#000!important;font-weight:800;text-decoration:none!important;white-space:nowrap}
.hk-toast button{background:none;border:0;color:#fff;opacity:.6;font-size:18px;cursor:pointer;padding:0 2px}
/* 5. Mega menu: label/count spacing */
.temply-mega-count,.mega-count,.menu-count{margin-left:.4em}
/* 6. Logo tagline: never clip */
.ds-logo,.site-logo,.ds-brand{min-width:0}
.ds-logo-tagline,.site-tagline,.ds-brand-tagline{white-space:nowrap;overflow:visible!important;text-overflow:clip!important}
@media (max-width:767px){.ds-logo-tagline,.site-tagline,.ds-brand-tagline{display:none!important}}
/* 7. Comfortable tap targets on mobile */
@media (max-width:767px){#pixio-react-shop-root select,#pixio-react-shop-root button{min-height:44px}}

/* 8. Purple tokens replaced in bundles with brand classes */
.hk-bg-amber{background-color:var(--hk-amber)!important;color:#000!important}
.hk-bg-amber svg{color:#000!important}
.hk-hover-amber:hover{background-color:#e6941a!important}
.hk-bg-amber25{background-color:rgba(255,165,32,.3)!important}
.hk-dot-hover:hover{background-color:rgba(255,165,32,.55)!important}
.hk-text-amber{color:var(--hk-amber-strong)!important}
.hk-border-amber{border-color:var(--hk-amber)!important;box-shadow:0 4px 12px rgba(184,102,0,.18)!important}
.hk-soft{background-color:var(--hk-amber-soft)!important}
.hk-hover-soft:hover{background-color:var(--hk-amber-soft)!important}
.hk-border-soft{border-color:#e9d9bd!important}
.hk-ink{color:var(--hk-ink)!important}
.hk-muted{color:#667085!important}
@media (max-width:380px){.hk-pay-row{flex-wrap:wrap}}
.hk-pay-row{flex-wrap:wrap!important;row-gap:6px;gap:4px;font-size:10.5px}
.hk-pay-chip{padding:2px 5px!important;font-size:10px!important}
.hk-pay-lock{flex-basis:100%;justify-content:center;margin:0 0 2px}
#pixio-react-shop-root .hk-bg-amber,#pixio-react-shop-root .hk-border-amber{--tw-shadow-color:rgba(184,102,0,.2)}
#pixio-react-shop-root a.hk-bg-amber{box-shadow:0 8px 18px rgba(184,102,0,.2)!important}
/* Round 2 (2026-10-08) */
.ts-product-card__body>.ts-product-card__badge{position:static!important;display:inline-block!important;align-self:flex-start;margin:0 0 6px!important;background:var(--hk-amber-soft)!important;color:var(--hk-amber-strong)!important;padding:3px 8px!important;font-size:10px!important;line-height:1.3!important;letter-spacing:.06em!important;border-radius:999px!important;box-shadow:0 2px 6px rgba(0,0,0,.12)!important}