:root{--ease-out:cubic-bezier(0.23, 1, 0.32, 1);--ease-in-out:cubic-bezier(0.77, 0, 0.175, 1);--ph-green:#0F5041;--ph-green-deep:#0A3B30;--ph-hero:#1B6B58;--ph-brown:#BB7543;--ph-brown-dark:#9E5F33;--ph-peach:#F2C49F;--ph-cream:#F8F4E8;--ph-white:#FFFFFF;--ph-surface:#FAF8F5;--ph-off:#FDFBF5;--ph-beige:#E5DEC8;--ph-img:#E6DECA;--ph-sand:#D4C9A8;--ph-ball:#D8E86A;--ph-gray:#8D9098;--ph-muted:#6b6b6b;--ph-ink:#2C2C2C;--ph-star:#F4B400;--ph-instock:#2E9E6B;--ph-shadow:0 2px 8px rgba(15,80,65,.08);--ph-shadow-lg:0 14px 40px rgba(10,59,48,.18)}

.ph-btn,.ph-btn-line{align-items:center;border-radius:25px;cursor:pointer;display:inline-flex;font-family:Manrope,sans-serif;font-size:1rem;font-weight:600;gap:.5rem;justify-content:center;padding:0 30px;text-decoration:none;text-transform:none;transition:background-color .3s var(--ease-out),color .3s var(--ease-out)}
.ph-btn{background-color:var(--ph-brown);border:0;color:#fff;line-height:45px}
.ph-btn:hover,.ph-btn:focus{background-color:var(--ph-brown-dark);color:#fff}
.ph-btn:focus-visible{outline:2px solid var(--ph-brown);outline-offset:3px}
.ph-btn-line{background-color:transparent;border:1px solid var(--ph-green);color:var(--ph-green);line-height:43px}
.ph-btn-line:hover,.ph-btn-line:focus{background-color:var(--ph-green);color:var(--ph-cream)}
.ph-btn-line:focus-visible{outline:2px solid var(--ph-green);outline-offset:3px}

.ph-price{align-items:baseline;display:flex;flex-wrap:wrap;gap:8px}
.ph-price b,.ph-price ins{background:none;color:var(--ph-brown);font-size:17px;font-weight:700;text-decoration:none}
.ph-price s,.ph-price del{color:var(--ph-muted);font-size:14px;font-weight:400}
.ph-price .amount{color:inherit}

.ph-stock{align-items:center;color:var(--ph-green);display:flex;font-size:12.5px;font-weight:600;gap:6px}
.ph-stock::before{background-color:var(--ph-instock);border-radius:50%;content:"";flex:none;height:7px;width:7px}
.ph-stock--back::before{background-color:var(--ph-brown)}
.ph-stock--out{color:var(--ph-muted)}
.ph-stock--out::before{background-color:var(--ph-gray)}

html,body{overflow-x: hidden;}
/* clip, unlike hidden, makes no scroll container, so the sticky header keeps working. */
@supports (overflow-x: clip){html,body,html body.not-scroll{overflow-x: clip;}html body.not-scroll{overflow-y: visible;}}

.woocommerce-Price-amount bdi {
    color: #BB7543 !important;
    font-weight: 700;
}

/* ── Form controls: brand styling (PROJECT CONVENTION — see DESIGN.md "Form inputs") ──────
   Every form control on the site uses padelhaus green as its accent. accent-color brands
   native checkboxes / radios / range inputs site-wide (matching the shop-filter checkboxes);
   new custom controls must be styled to match rather than left at browser defaults. */
input[type="checkbox"],
input[type="radio"],
input[type="range"] {
    accent-color: #0F5041;
}