/*
Theme Name: Blackwattle Firewood
Theme URI: https://blackwattlefirewood.co.za
Author: Digital Fold
Author URI: https://digitalfold.co.za
Description: A custom high-performance WooCommerce-ready theme for Black Wattle Firewood. Warm, premium, conversion-focused.
Version: 3.10.8
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 8.0
Text Domain: blackwattle-premium
*/


/* ========================================================================
   DESIGN TOKENS
   ======================================================================== */

:root {
  --bw-bg: #141414;
  --bw-bg-warm: #1a1a1a;
  --bw-bg-deep: #1e1e1e;
  --bw-paper: #202020;
  --bw-wood: #8b5e3c;
  --bw-wood-light: #a87a5a;
  --bw-wood-dark: #0e0e0e;
  --bw-charcoal: #f0ebe4;
  --bw-text: #f0ebe4;
  --bw-text-secondary: rgba(240, 235, 228, 0.65);
  --bw-muted: rgba(240, 235, 228, 0.4);
  --bw-accent: #c46754;
  --bw-accent-hover: #d4776a;
  --bw-accent-soft: rgba(196, 103, 84, 0.15);
  --bw-green: #6db87d;
  --bw-green-soft: rgba(45, 90, 61, 0.25);
  --bw-border: rgba(255, 255, 255, 0.08);
  --bw-border-light: rgba(255, 255, 255, 0.05);
  --bw-radius-sm: 10px;
  --bw-radius: 16px;
  --bw-radius-lg: 24px;
  --bw-radius-xl: 32px;
  --bw-shadow-xs: 0 1px 3px rgba(0, 0, 0, 0.25);
  --bw-shadow-sm: 0 4px 16px rgba(0, 0, 0, 0.3);
  --bw-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
  --bw-shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.4);
  --bw-shadow-accent: 0 8px 24px rgba(196, 103, 84, 0.3);
  /* All site containers share the same max-width and gutters so every section
     aligns flush with the CTA banner (which references a 1320px column). */
  --bw-container: min(1320px, calc(100% - 3rem));
  --bw-container-narrow: min(960px, calc(100% - 3rem));
  --bw-container-wide: min(1320px, calc(100% - 3rem));
  --bw-font: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --bw-font-display: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --bw-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --bw-transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}


/* ========================================================================
   RESET & BASE
   ======================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}

body {
  font-family: var(--bw-font);
  font-size: 16px;
  line-height: 1.7;
  color: var(--bw-text);
  background: var(--bw-bg);
  overflow-x: clip;
}

@supports not (overflow-x: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

iframe,
video,
embed,
object {
  max-width: 100%;
}

input,
textarea,
select,
button {
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--bw-transition-fast);
}

button {
  font-family: inherit;
  cursor: pointer;
}

ul, ol {
  list-style: none;
}

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}


/* ========================================================================
   LAYOUT
   ======================================================================== */

.bw-container {
  width: var(--bw-container);
  margin: 0 auto;
}

.bw-container--narrow {
  width: var(--bw-container-narrow);
  margin: 0 auto;
}

.bw-container--wide {
  width: var(--bw-container-wide);
  margin: 0 auto;
}

.bw-site {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  max-width: 100%;
}

.bw-main {
  flex: 1;
  min-width: 0;
}

.bw-container,
.bw-container--narrow,
.bw-container--wide,
.bw-container > *,
.bw-container--narrow > *,
.bw-container--wide > * {
  min-width: 0;
}


/* ========================================================================
   SECTION
   ======================================================================== */

.bw-section {
  padding: clamp(3.5rem, 6vw, 6rem) 0;
}

.bw-section--alt {
  background: var(--bw-bg-warm);
}

.bw-section--deep {
  background: var(--bw-bg-deep);
}

.bw-section--light {
  background: #fff;
  color: #1a1a1a;
}

.bw-section--light .bw-section-label {
  color: var(--bw-accent);
}

.bw-section--light .bw-section-title {
  color: #1a1a1a;
}

.bw-section--light .bw-section-subtitle {
  color: rgba(26, 26, 26, 0.55);
}

.bw-section--light h3 {
  color: #1a1a1a;
}

.bw-section--light p {
  color: rgba(26, 26, 26, 0.65);
}

.bw-section--light a:not(.bw-btn) {
  color: var(--bw-accent);
}

.bw-section-header {
  margin-bottom: clamp(2rem, 3vw, 3rem);
  max-width: 680px;
}

.bw-section-header--center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.bw-section-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--bw-accent);
  margin-bottom: 0.75rem;
}

.bw-section-label::before {
  content: "";
  width: 1.5rem;
  height: 2px;
  background: currentColor;
  border-radius: 1px;
}

.bw-section-title {
  font-family: var(--bw-font-display);
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--bw-charcoal);
}

.bw-section-subtitle {
  margin-top: 0.75rem;
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--bw-text-secondary);
  max-width: 60ch;
}

.bw-section-header--center .bw-section-label {
  justify-content: center;
}

.bw-section-header--center .bw-section-subtitle {
  margin-left: auto;
  margin-right: auto;
}

.bw-section-title--hero {
  text-transform: uppercase;
  font-size: clamp(2rem, 4vw, 3rem);
  letter-spacing: -0.01em;
}

.bw-text-bold {
  font-weight: 800;
}

.bw-text-light {
  font-weight: 300;
}


/* ========================================================================
   BUTTONS
   ======================================================================== */

.bw-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 48px;
  padding: 0 1.75rem;
  border: 2px solid transparent;
  border-radius: 4px;
  font-family: var(--bw-font);
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: all var(--bw-transition);
}

.bw-btn svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.bw-btn--primary {
  color: #fff;
  background: var(--bw-accent);
  border-color: var(--bw-accent);
}

.bw-btn--primary:hover {
  background: var(--bw-accent-hover);
  border-color: var(--bw-accent-hover);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(196, 103, 84, 0.3);
}

.bw-btn--secondary {
  color: var(--bw-text);
  background: transparent;
  border-color: var(--bw-border);
}

.bw-btn--secondary:hover {
  border-color: rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.06);
}

.bw-btn--ghost {
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}

.bw-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.35);
}

.bw-btn--outline {
  color: #fff;
  background: transparent;
  border-color: #fff;
}

.bw-btn--outline:hover {
  background: #fff;
  color: #000;
}

.bw-btn--outline-dark {
  color: #1a1a1a;
  background: transparent;
  border-color: #1a1a1a;
}

.bw-btn--outline-dark:hover {
  background: #1a1a1a;
  color: #fff;
}

.bw-btn--large {
  min-height: 54px;
  padding: 0 2.2rem;
  font-size: 0.9rem;
}

.bw-btn--small {
  min-height: 40px;
  padding: 0 1.25rem;
  font-size: 0.8rem;
}

/* Button + leading icon (e.g. WhatsApp glyph + label).
   Reusable across the theme — keeps icon vertically centred with the
   label and gives a consistent gap regardless of button size. */
.bw-btn--with-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
}

.bw-btn__icon {
  flex: 0 0 auto;
  display: inline-block;
  line-height: 0;
}


/* ========================================================================
   TOPBAR
   ======================================================================== */

.bw-topbar {
  width: 100%;
  background: #fff;
  color: #1a1a1a;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: center;
  padding: 0.5rem 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  column-gap: 0.35rem;
  row-gap: 0.1rem;
}

.bw-topbar__message,
.bw-topbar__cta {
  display: inline-flex;
  align-items: center;
}

.bw-topbar__cta {
  gap: 0.35rem;
  white-space: nowrap;
}

.bw-topbar a {
  color: var(--bw-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}

.bw-topbar a:hover {
  color: var(--bw-accent-hover);
}

@media (max-width: 480px) {
  .bw-topbar {
    width: 100%;
    padding: 0.45rem 0.7rem;
    font-size: 0.68rem;
    line-height: 1.45;
    letter-spacing: 0.045em;
  }
}


/* ========================================================================
   HEADER
   ======================================================================== */

.bw-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(14, 14, 14, 0.97);
  backdrop-filter: blur(20px) saturate(1.3);
  -webkit-backdrop-filter: blur(20px) saturate(1.3);
  border-bottom: 1px solid var(--bw-border);
  transition: box-shadow var(--bw-transition);
}

.bw-header.is-scrolled {
  background: #0e0e0e;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
}

.bw-header-inner {
  width: var(--bw-container-wide);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  min-height: 90px;
  padding: 5px 0;
}

.bw-brand {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}

.bw-brand-logo {
  display: block;
  height: 70px;
  max-height: 70px;
  width: auto;
  max-width: 225px;
  object-fit: contain;
  filter: none;
  transition: filter 0.2s ease, opacity 0.2s ease;
}

.bw-nav {
  flex: 1;
  display: flex;
  justify-content: center;
}

.bw-nav ul {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.bw-nav a {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 0.85rem 0.65rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  transition: color var(--bw-transition-fast);
  position: relative;
}

/* Animated underline indicator — slides in for active, peeks in on hover. */
.bw-nav a::after {
  content: "";
  position: absolute;
  left: 0.85rem;
  right: 0.85rem;
  bottom: 0.15rem;
  height: 2px;
  border-radius: 2px;
  background: var(--bw-accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease;
  opacity: 0;
  pointer-events: none;
}

.bw-nav a:hover {
  color: #fff;
}

.bw-nav a:hover::after {
  transform: scaleX(0.5);
  opacity: 0.55;
}

.bw-nav .current-menu-item > a,
.bw-nav .current_page_item > a,
.bw-nav .current-menu-ancestor > a,
.bw-nav a[aria-current="page"] {
  color: #fff;
}

.bw-nav .current-menu-item > a::after,
.bw-nav .current_page_item > a::after,
.bw-nav .current-menu-ancestor > a::after,
.bw-nav a[aria-current="page"]::after {
  transform: scaleX(1);
  opacity: 1;
}

.bw-header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.bw-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 0;
  background: transparent;
  color: var(--bw-text-secondary);
  transition: all var(--bw-transition-fast);
  position: relative;
}

.bw-icon-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.bw-icon-btn svg {
  width: 22px;
  height: 22px;
}

.bw-cart-count {
  position: absolute;
  top: 4px;
  right: 4px;
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  background: var(--bw-accent);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 800;
  display: grid;
  place-items: center;
  line-height: 1;
}

.bw-nav-toggle {
  display: none;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  align-items: center;
  justify-content: center;
  color: var(--bw-text);
}

.bw-nav-toggle svg {
  width: 22px;
  height: 22px;
}


/* ========================================================================
   HERO
   ======================================================================== */

.bw-hero {
  position: relative;
  overflow: hidden;
  background: #000;
  color: #fff;
}

.bw-hero-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 75vh;
}

.bw-hero-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(4rem, 8vw, 7rem) clamp(2rem, 4vw, 3rem);
  padding-left: max(1.5rem, calc(50vw - 660px));
}

.bw-hero h1 {
  font-family: var(--bw-font-display);
  font-size: clamp(2.4rem, 4.5vw, 4rem);
  line-height: 1.08;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  margin-bottom: 0;
}

.bw-hero-text-light {
  font-weight: 300;
}

.bw-hero-text-bold {
  font-weight: 800;
  font-style: italic;
}

.bw-hero-accent-line {
  display: block;
  width: 120px;
  height: 3px;
  background: var(--bw-accent);
  margin: 2rem 0 2.5rem;
  border-radius: 2px;
}

.bw-hero-accent-line--center {
  margin: 1.5rem auto 0;
}

.bw-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}


.bw-hero-image {
  position: relative;
  overflow: hidden;
}

.bw-hero-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bw-hero-image-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.9rem;
  text-align: center;
  padding: 2rem;
}


/* ========================================================================
   TRUST STRIP
   ======================================================================== */

.bw-trust-strip {
  padding: clamp(1.5rem, 2.5vw, 2.25rem) 0;
  border-bottom: 1px solid var(--bw-border-light);
}

.bw-trust-strip-inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

.bw-trust-item {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.75rem;
}

/* Mobile carousel dots — hidden on desktop, populated by JS on mobile. */
.bw-trust-strip-dots {
  display: none;
}

.bw-trust-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--bw-accent-soft);
  display: grid;
  place-items: center;
  flex-shrink: 0;
  color: var(--bw-accent);
}

.bw-trust-icon svg {
  width: 22px;
  height: 22px;
}

.bw-trust-label {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  line-height: 1.3;
}


/* ========================================================================
   PRODUCT CAROUSEL
   ======================================================================== */

.bw-carousel-wrap {
  position: relative;
}

.bw-carousel {
  display: flex;
  gap: 1.25rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 0.5rem;
}

.bw-carousel::-webkit-scrollbar {
  display: none;
}

.bw-carousel-item {
  flex: 0 0 calc(25% - 0.94rem);
  scroll-snap-align: start;
  min-width: 260px;
}

.bw-product-card {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  overflow: hidden;
  box-shadow: var(--bw-shadow-xs);
  transition: all var(--bw-transition);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.bw-product-card:hover {
  box-shadow: var(--bw-shadow);
  border-color: rgba(255, 255, 255, 0.15);
  transform: translateY(-3px);
}

.bw-product-thumb {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--bw-bg-warm);
  position: relative;
}

.bw-product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.bw-product-card:hover .bw-product-thumb img {
  transform: scale(1.04);
}

.bw-product-body {
  padding: 1.25rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.bw-product-name {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--bw-charcoal);
  margin-bottom: 0.35rem;
}

.bw-product-name a {
  color: inherit;
}

.bw-product-name a:hover {
  color: var(--bw-accent);
}

.bw-product-desc {
  font-size: 0.88rem;
  color: var(--bw-muted);
  line-height: 1.5;
  margin-bottom: 0.75rem;
  flex: 1;
}

.bw-product-price {
  font-size: 1.15rem;
  font-weight: 800;
  color: #fff;
  margin-bottom: 0.85rem;
}

.bw-product-card .bw-btn {
  width: 100%;
}

.bw-carousel-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.75rem;
}

/* Centered CTA below a section / carousel (e.g. "Shop All" under products). */
.bw-section-cta {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}

.bw-carousel-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1.5px solid var(--bw-border);
  background: var(--bw-paper);
  display: grid;
  place-items: center;
  color: var(--bw-text-secondary);
  transition: all var(--bw-transition-fast);
  box-shadow: var(--bw-shadow-xs);
}

.bw-carousel-btn:hover {
  background: var(--bw-charcoal);
  color: #fff;
  border-color: var(--bw-charcoal);
}

.bw-carousel-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.bw-carousel-btn svg {
  width: 18px;
  height: 18px;
}

.bw-carousel-dots {
  display: flex;
  gap: 0.5rem;
}

.bw-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: 0;
  background: var(--bw-border);
  padding: 0;
  transition: all var(--bw-transition-fast);
}

.bw-carousel-dot.is-active {
  width: 24px;
  background: var(--bw-accent);
}


/* ========================================================================
   HOW IT WORKS (step cards)
   ======================================================================== */

.bw-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  padding-top: 1.5rem;
}

.bw-step-card {
  border: 2px solid var(--bw-accent);
  border-radius: var(--bw-radius);
  padding: 2.5rem 1.5rem 2rem;
  text-align: center;
  position: relative;
}

.bw-step-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--bw-accent);
  color: #fff;
  display: grid;
  place-items: center;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}

.bw-step-icon svg {
  width: 24px;
  height: 24px;
}

.bw-step-number {
  font-size: 2rem;
  font-weight: 300;
  color: rgba(26, 26, 26, 0.2);
  margin-bottom: 0.5rem;
  line-height: 1;
}

.bw-step-card h3 {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
  line-height: 1.3;
}

.bw-step-card p {
  font-size: 0.88rem;
  line-height: 1.55;
}



/* ========================================================================
   DELIVERY
   ======================================================================== */

.bw-delivery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  align-items: start;
}

.bw-delivery-content h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 0.65rem;
}

.bw-delivery-content p {
  color: var(--bw-text-secondary);
  line-height: 1.7;
  margin-bottom: 1rem;
}

.bw-delivery-list {
  display: grid;
  gap: 0.6rem;
  margin-bottom: 1.5rem;
}

.bw-delivery-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  font-size: 0.94rem;
  color: var(--bw-text-secondary);
  line-height: 1.5;
}

.bw-delivery-list li::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--bw-accent);
  flex-shrink: 0;
  margin-top: 0.55rem;
}

.bw-delivery-areas {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  padding: 1.5rem;
  box-shadow: var(--bw-shadow-xs);
}

.bw-delivery-areas h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--bw-border-light);
}

.bw-area-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.bw-area-tag {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.85rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--bw-text-secondary);
  background: var(--bw-bg);
  border: 1px solid var(--bw-border-light);
}

/* ---- Delivery on white bg ---- */
.bw-section--light .bw-delivery-content h3 {
  color: #1a1a1a;
}

.bw-section--light .bw-delivery-content p,
.bw-section--light .bw-delivery-list li {
  color: rgba(26, 26, 26, 0.6);
}

.bw-section--light .bw-delivery-areas {
  background: #f7f5f2;
  border-color: rgba(0, 0, 0, 0.08);
}

.bw-section--light .bw-delivery-areas h3 {
  color: #1a1a1a;
  border-bottom-color: rgba(0, 0, 0, 0.08);
}

.bw-section--light .bw-area-tag {
  color: rgba(26, 26, 26, 0.6);
  background: #fff;
  border-color: rgba(0, 0, 0, 0.1);
}

.bw-section--light .bw-area-tag:hover {
  background: rgba(196, 103, 84, 0.08);
  border-color: rgba(196, 103, 84, 0.25);
  color: var(--bw-accent);
}


/* ========================================================================
   ABOUT / BRAND STORY
   ======================================================================== */

.bw-about {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 4vw, 3.5rem);
  align-items: center;
}

.bw-about-visual {
  border-radius: var(--bw-radius-lg);
  overflow: hidden;
  background: linear-gradient(145deg, #1a1a1a, #0e0e0e);
  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;
  box-shadow: var(--bw-shadow-lg);
}

.bw-about-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bw-about-visual .bw-hero-image-placeholder {
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.9rem;
  text-align: center;
  padding: 2rem;
}

.bw-about-content .bw-section-label {
  margin-bottom: 0.75rem;
}

.bw-about-content .bw-section-title {
  margin-bottom: 1rem;
}

.bw-about-content p {
  color: var(--bw-text-secondary);
  line-height: 1.75;
  margin-bottom: 1rem;
}

.bw-about-content p:last-of-type {
  margin-bottom: 1.75rem;
}

.bw-about-stats {
  display: flex;
  gap: 2.5rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bw-border);
}

.bw-stat-value {
  display: block;
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--bw-charcoal);
  line-height: 1.2;
}

.bw-stat-label {
  font-size: 0.82rem;
  color: var(--bw-muted);
  margin-top: 0.2rem;
}


/* ========================================================================
   TRUST SIGNALS / TESTIMONIALS
   ======================================================================== */

.bw-trust-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.bw-trust-card {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  padding: 1.75rem;
  box-shadow: var(--bw-shadow-xs);
  text-align: center;
}

.bw-trust-card-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--bw-green-soft);
  color: var(--bw-green);
  display: grid;
  place-items: center;
  margin: 0 auto 1rem;
}

.bw-trust-card-icon svg {
  width: 24px;
  height: 24px;
}

.bw-trust-card h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 0.5rem;
}

.bw-trust-card p {
  font-size: 0.9rem;
  color: var(--bw-text-secondary);
  line-height: 1.6;
}


/* ========================================================================
   FAQ
   ======================================================================== */

.bw-faq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.bw-faq {
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  background: var(--bw-paper);
  overflow: hidden;
  transition: all var(--bw-transition-fast);
}

.bw-faq[open] {
  box-shadow: var(--bw-shadow-sm);
  border-color: #d5c7b5;
}

.bw-faq summary {
  cursor: pointer;
  padding: 1.1rem 1.25rem;
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--bw-charcoal);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  list-style: none;
  transition: color var(--bw-transition-fast);
}

.bw-faq summary::-webkit-details-marker {
  display: none;
}

.bw-faq summary::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  flex-shrink: 0;
  transition: transform var(--bw-transition-fast);
}

.bw-faq[open] summary::after {
  transform: rotate(-135deg);
}

.bw-faq summary:hover {
  color: var(--bw-accent);
}

.bw-faq-answer {
  padding: 0 1.25rem 1.15rem;
  font-size: 0.92rem;
  color: var(--bw-text-secondary);
  line-height: 1.65;
}

.bw-faq-more {
  text-align: center;
  margin-top: 1.5rem;
}


/* ========================================================================
   CTA BANNER (hero-style split layout)
   ======================================================================== */

.bw-cta-banner {
  background: #000;
  color: #fff;
  overflow: hidden;
}

.bw-cta-banner-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 45vh;
}

.bw-cta-banner-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(3rem, 6vw, 5rem) clamp(2rem, 4vw, 3rem);
  padding-left: max(1.5rem, calc(50vw - 660px));
}

.bw-cta-banner-content h2 {
  font-family: var(--bw-font-display);
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.bw-cta-banner-content p {
  font-size: 1.05rem;
  color: rgba(255, 248, 237, 0.75);
  max-width: 48ch;
  line-height: 1.65;
  margin-bottom: 2rem;
}

.bw-cta-banner-content .bw-btn {
  align-self: flex-start;
}

.bw-cta-banner-image {
  position: relative;
  overflow: hidden;
}

.bw-cta-banner-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* ========================================================================
   FOOTER
   ======================================================================== */

.bw-footer {
  background: #0e0e0e;
  color: rgba(245, 235, 222, 0.85);
  margin-top: auto;
  border-top: 1px solid var(--bw-border);
}

.bw-footer-main {
  width: var(--bw-container-wide);
  margin: 0 auto;
  padding: clamp(2.5rem, 4vw, 3.5rem) 0;
}

.bw-footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 0.8fr 1fr;
  gap: clamp(1.5rem, 3vw, 2.5rem);
}

/* Get In Touch — list with icon + text rows. Each row stays a single link
   (the icon picks up the link colour) so the whole row remains tappable. */
.bw-footer-contact li a {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  line-height: 1.3;
}

.bw-footer-contact__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  color: var(--bw-accent, #c46754);
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.bw-footer-contact li a:hover .bw-footer-contact__icon,
.bw-footer-contact li a:focus-visible .bw-footer-contact__icon {
  background: var(--bw-accent, #c46754);
  color: #fff;
  transform: translateY(-1px);
}

/* WhatsApp footer link — sits in the accent palette by default to match the
   phone / email / pin icons above it, then switches to WhatsApp green on
   hover/focus to give the brand a little nod when the user actually engages. */
.bw-footer-contact li a.bw-footer-contact__link--wa:hover .bw-footer-contact__icon,
.bw-footer-contact li a.bw-footer-contact__link--wa:focus-visible .bw-footer-contact__icon {
  background: #25d366 !important;
  color: #fff !important;
  transform: translateY(-1px);
}

.bw-footer-contact__text {
  flex: 1 1 auto;
  min-width: 0;
}

.bw-footer-logo-link {
  display: block;
  margin-bottom: 1rem;
  max-width: 100px;
}

.bw-footer .bw-footer-logo {
  display: block;
  height: auto;
  width: 100%;
  max-width: 100px;
  max-height: 100px;
  object-fit: contain;
}

.bw-footer-brand-name {
  display: block;
  font-weight: 800;
  font-size: 1.1rem;
  color: #fff;
  margin-bottom: 0.75rem;
}

.bw-footer-brand p {
  font-size: 0.9rem;
  line-height: 1.65;
  max-width: 32ch;
}

.bw-footer h4 {
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(245, 235, 222, 0.5);
  margin-bottom: 1rem;
}

.bw-footer ul {
  display: grid;
  gap: 0.55rem;
}

.bw-footer a {
  font-size: 0.9rem;
  transition: color var(--bw-transition-fast);
}

.bw-footer a:hover {
  color: #fff;
}

.bw-footer-bottom {
  border-top: 1px solid rgba(245, 235, 222, 0.1);
  padding: 1.25rem 0;
}

.bw-footer-bottom-inner {
  width: var(--bw-container-wide);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.82rem;
  color: rgba(245, 235, 222, 0.45);
}

.bw-footer-legal {
  display: flex;
  gap: 1.5rem;
}

.bw-footer-legal a:hover {
  color: rgba(245, 235, 222, 0.75);
}

.bw-footer-credit {
  color: rgba(245, 235, 222, 0.45);
  margin-left: 0.25rem;
}

.bw-footer-credit::before {
  content: "·";
  margin-right: 0.25rem;
}

.bw-footer-credit a {
  color: rgba(245, 235, 222, 0.45);
  transition: color 0.2s ease;
}

.bw-footer-credit a:hover {
  color: rgba(245, 235, 222, 0.75);
}


/* ========================================================================
   GENERIC CONTENT (page.php, index.php, WooCommerce)
   ======================================================================== */

/* ---- Default Page Hero ---- */
.bw-page-hero {
  padding: clamp(4rem, 8vw, 6rem) 0 clamp(3rem, 5vw, 4rem);
  background: #000;
  color: #fff;
  text-align: center;
}

.bw-page-hero .bw-container {
  max-width: 720px;
  margin: 0 auto;
}

.bw-page-hero-title {
  font-size: clamp(2rem, 4.5vw, 3rem);
  font-weight: 800;
  line-height: 1.1;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}

.bw-page-hero-desc {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.75;
  margin-top: 1rem;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* ---- Generic Content ---- */
.bw-content {
  padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(3rem, 6vw, 5rem);
}

.bw-content .entry-content {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
  padding: clamp(2rem, 4vw, 3rem);
}

/* ---- Prose: rich text typography for policy/legal pages ---- */
.bw-prose h2 {
  font-size: 1.375rem;
  font-weight: 800;
  color: var(--bw-charcoal);
  margin: 2.5rem 0 0.75rem;
  letter-spacing: -0.01em;
}

.bw-prose h2:first-child {
  margin-top: 0;
}

.bw-prose h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin: 2rem 0 0.625rem;
}

.bw-prose h4 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin: 1.5rem 0 0.5rem;
}

.bw-prose p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.8;
  margin-bottom: 1rem;
}

.bw-prose p:last-child {
  margin-bottom: 0;
}

.bw-prose strong {
  color: var(--bw-text);
  font-weight: 700;
}

.bw-prose a {
  color: var(--bw-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color var(--bw-transition-fast);
}

.bw-prose a:hover {
  color: var(--bw-accent-hover);
}

.bw-prose ul,
.bw-prose ol {
  margin: 1rem 0;
  padding-left: 1.5rem;
  display: grid;
  gap: 0.5rem;
}

.bw-prose li {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.7;
}

.bw-prose li::marker {
  color: var(--bw-accent);
}

.bw-prose blockquote {
  border-left: 3px solid var(--bw-accent);
  background: rgba(196, 103, 84, 0.06);
  border-radius: 0 var(--bw-radius) var(--bw-radius) 0;
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
}

.bw-prose blockquote p {
  color: var(--bw-text);
  font-weight: 500;
}

.bw-prose hr {
  border: none;
  border-top: 1px solid var(--bw-border);
  margin: 2rem 0;
}

.bw-prose table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  overflow: hidden;
  margin: 1.5rem 0;
}

.bw-prose th {
  background: var(--bw-bg);
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--bw-muted);
  padding: 0.75rem 1rem;
  text-align: left;
  border-bottom: 1px solid var(--bw-border);
}

.bw-prose td {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--bw-border-light);
}

.bw-prose tr:last-child td {
  border-bottom: none;
}

@media (max-width: 480px) {
  .bw-page-hero {
    padding: 3rem 0 2rem;
  }

  .bw-content .entry-content {
    padding: 1.5rem 1.25rem;
  }
}


/* ========================================================================
   WOOCOMMERCE OVERRIDES
   ======================================================================== */

.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
  display: none;
}

.woocommerce-page .site-main,
.woocommerce .site-main {
  width: var(--bw-container);
  margin: 2rem auto 3rem;
}

.woocommerce .product,
.woocommerce ul.products li.product {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  overflow: hidden;
  padding: 1rem;
  box-shadow: var(--bw-shadow-xs);
  transition: all var(--bw-transition);
}

.woocommerce ul.products li.product:hover {
  box-shadow: var(--bw-shadow);
  transform: translateY(-2px);
}

.woocommerce span.onsale {
  background: var(--bw-accent);
  border-radius: 999px;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  border-radius: 999px;
  background: var(--bw-accent);
  color: #fff;
  font-weight: 700;
  transition: all var(--bw-transition);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
  background: var(--bw-accent-hover);
}


/* ========================================================================
   SHOP ARCHIVE
   ======================================================================== */

/* ---- Hero Background Image + Overlay (shared) ---- */
.bw-hero-section {
  position: relative;
  overflow: hidden;
}

.bw-hero-section > .bw-container,
.bw-hero-section > .bw-container > * {
  position: relative;
  z-index: 2;
}

.bw-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.bw-hero-bg__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.bw-hero-bg-overlay {
  position: absolute;
  inset: 0;
  background: #000;
}

/* ---- Shop Hero ---- */
.bw-shop-hero {
  padding: clamp(4rem, 8vw, 6rem) 0 clamp(3rem, 5vw, 4rem);
  background: #000;
  color: #fff;
  text-align: center;
}

.bw-shop-hero .bw-container {
  max-width: 720px;
  margin: 0 auto;
}

.bw-shop-hero-title {
  font-size: clamp(2rem, 4.5vw, 3rem);
  line-height: 1.1;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin: 0.75rem 0 0;
}

.bw-shop-hero-desc {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.75;
  max-width: 600px;
  margin: 1.5rem auto 0;
}

/* ---- Shop Body ---- */
.bw-shop {
  padding: clamp(2rem, 3vw, 3rem) 0 clamp(3rem, 5vw, 5rem);
}

.bw-shop-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: clamp(1.5rem, 2.5vw, 2.5rem);
  align-items: start;
}

/* ---- Sidebar ---- */

.bw-shop-sidebar {
  position: sticky;
  top: 100px;
}

.bw-sidebar-inner {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  box-shadow: var(--bw-shadow-xs);
  overflow: hidden;
}

.bw-sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--bw-border-light);
}

.bw-sidebar-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin: 0;
}

.bw-filter-clear {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--bw-accent);
  transition: color var(--bw-transition-fast);
}

.bw-filter-clear:hover {
  color: var(--bw-accent-hover);
}

.bw-filter-group {
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--bw-border-light);
}

.bw-filter-group:last-of-type {
  border-bottom: 0;
}

.bw-filter-heading {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  margin: 0 0 0.65rem;
}

.bw-filter-list {
  display: grid;
  gap: 0.15rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.bw-filter-list > li {
  list-style: none;
  margin: 0;
}

/* Checkbox-style filter row.
   The link itself acts as a toggle: clicking once applies the filter, clicking
   it again removes it. The fake checkbox on the left gives clear affordance
   that multiple values can be browsed independently. */
.bw-filter-row {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.5rem 0.65rem;
  border-radius: var(--bw-radius-sm);
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--bw-text-secondary);
  text-decoration: none;
  transition: background var(--bw-transition-fast), color var(--bw-transition-fast);
}

.bw-filter-row:hover {
  background: rgba(255, 255, 255, 0.05);
  color: var(--bw-charcoal);
}

.bw-filter-row:focus-visible {
  outline: 2px solid var(--bw-accent, #c46754);
  outline-offset: 2px;
}

.bw-filter-row.is-active {
  color: var(--bw-charcoal);
  font-weight: 700;
}

.bw-filter-row__label {
  flex: 1;
  min-width: 0;
}

/* Fake checkbox indicator. Picks up text colour so it inherits the dark/light
   theme automatically. */
.bw-filter-checkbox {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  border: 1.5px solid rgba(255, 255, 255, 0.25);
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.bw-filter-checkbox svg {
  width: 12px;
  height: 12px;
  opacity: 0;
  transform: scale(0.6);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.bw-filter-row:hover .bw-filter-checkbox {
  border-color: rgba(255, 255, 255, 0.45);
}

.bw-filter-row.is-active .bw-filter-checkbox {
  background: var(--bw-accent, #c46754);
  border-color: var(--bw-accent, #c46754);
}

.bw-filter-row.is-active .bw-filter-checkbox svg {
  opacity: 1;
  transform: scale(1);
}

.bw-filter-count {
  flex: 0 0 auto;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--bw-muted);
  background: rgba(255, 255, 255, 0.06);
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  line-height: 1.4;
}

.bw-filter-row.is-active .bw-filter-count {
  background: rgba(196, 103, 84, 0.18);
  color: var(--bw-accent);
}

.bw-sidebar-cta {
  padding: 1.15rem;
  background: var(--bw-bg);
  text-align: center;
}

.bw-sidebar-cta h3 {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 0.35rem;
}

.bw-sidebar-cta p {
  font-size: 0.84rem;
  color: var(--bw-text-secondary);
  line-height: 1.5;
  margin-bottom: 0.85rem;
}

/* ---- Main Grid Area ---- */

.bw-shop-main {
  min-width: 0;
}

.bw-shop-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
  flex-wrap: wrap;
}

.bw-shop-result-count {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--bw-muted);
}

.bw-shop-toolbar-right {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.bw-filter-toggle {
  display: none;
}

.bw-shop-toolbar .woocommerce-ordering {
  margin: 0;
}

.bw-shop-toolbar .woocommerce-ordering select,
.bw-shop-toolbar select.orderby {
  appearance: none;
  -webkit-appearance: none;
  min-height: 40px;
  padding: 0 2.2rem 0 0.85rem;
  border: 1.5px solid var(--bw-border);
  border-radius: 4px;
  background:
    var(--bw-paper)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='%237a6e65'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m19.5 8.25-7.5 7.5-7.5-7.5'/%3E%3C/svg%3E")
    no-repeat right 0.6rem center / 16px 16px;
  font-family: var(--bw-font);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--bw-text-secondary);
  cursor: pointer;
  transition: all var(--bw-transition-fast);
}

.bw-shop-toolbar .woocommerce-ordering select:hover,
.bw-shop-toolbar select.orderby:hover {
  border-color: rgba(255, 255, 255, 0.2);
}

.bw-shop-toolbar .woocommerce-ordering select:focus,
.bw-shop-toolbar select.orderby:focus {
  outline: 2px solid var(--bw-accent);
  outline-offset: 2px;
  border-color: var(--bw-accent);
}

/* Shop product grid */
.bw-shop-main .woocommerce ul.products,
.bw-shop-main ul.products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  margin: 0;
  padding: 0;
}

.bw-shop-main .woocommerce ul.products li.product,
.bw-shop-main ul.products li.product {
  margin: 0;
  padding: 0;
  width: 100% !important;
  float: none;
  background: var(--bw-paper);
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  overflow: hidden;
  box-shadow: var(--bw-shadow-xs);
  transition: all var(--bw-transition);
  display: flex;
  flex-direction: column;
}

.bw-shop-main ul.products li.product:hover {
  box-shadow: var(--bw-shadow);
  transform: translateY(-3px);
  border-color: rgba(255, 255, 255, 0.15);
}

.bw-shop-main ul.products li.product .woocommerce-LoopProduct-link {
  display: block;
  width: 100%;
  align-self: stretch;
}

.bw-shop-main ul.products li.product a img,
.bw-shop-main ul.products li.product .attachment-woocommerce_thumbnail {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0;
  margin: 0;
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.bw-shop-main ul.products li.product:hover a img {
  transform: scale(1.03);
}

.bw-shop-main ul.products li.product .woocommerce-loop-product__title {
  padding: 0.85rem 1rem 0;
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  line-height: 1.35;
}

.bw-shop-main ul.products li.product .price {
  padding: 0.35rem 1rem 0;
  font-size: 1.05rem;
  font-weight: 800;
  color: #fff;
}

.bw-shop-main ul.products li.product .button,
.bw-shop-main ul.products li.product .added_to_cart {
  margin: auto 1rem 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 1rem;
  border-radius: 4px;
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #fff;
  background: var(--bw-accent);
  border: 0;
  transition: all var(--bw-transition);
  align-self: flex-start;
}

.bw-shop-main ul.products li.product .button:hover {
  background: var(--bw-accent-hover);
}

.bw-shop-main ul.products li.product .added_to_cart {
  background: #fff;
  color: var(--bw-bg);
}

.bw-shop-main ul.products li.product span.onsale {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  margin: 0;
  border-radius: 999px;
  background: var(--bw-accent);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.25rem 0.65rem;
  z-index: 2;
}

/* ===== Stock badge (top-right pill on shop loop card) =====
   Sits opposite the .onsale pill so both can co-exist if a product is on sale
   AND out of stock. Uses a neutral charcoal pill so it reads as informational
   rather than promotional. */
.bw-shop-main ul.products li.product {
  position: relative;
}

.bw-stock-badge {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  padding: 0.3rem 0.7rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  line-height: 1;
  pointer-events: none;
}

.bw-stock-badge--out {
  background: rgba(20, 20, 20, 0.85);
  color: #fff;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.bw-stock-badge--out::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff6b6b;
  box-shadow: 0 0 0 2px rgba(255, 107, 107, 0.25);
}

/* Dim the product image when it's sold out so the card reads as unavailable
   without making it disappear entirely. */
.bw-shop-main ul.products li.product.outofstock .woocommerce-LoopProduct-link img,
.bw-shop-main ul.products li.product.outofstock a img {
  opacity: 0.55;
  filter: saturate(0.7);
  transition: opacity var(--bw-transition), filter var(--bw-transition);
}

/* Replace the loop add-to-cart button with a calm "Sold out" pill. */
.bw-shop-main ul.products li.product .bw-loop-soldout {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.15);
  cursor: not-allowed;
  pointer-events: none;
}

.bw-shop-main ul.products li.product .bw-loop-soldout:hover {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.65);
}

/* Pagination */
.bw-shop-pagination {
  margin-top: 2rem;
}

.bw-shop-pagination .woocommerce-pagination {
  border: 0;
}

.bw-shop-pagination .woocommerce-pagination ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  border: 0;
}

.bw-shop-pagination .woocommerce-pagination ul li {
  border: 0;
}

.bw-shop-pagination .woocommerce-pagination ul li a,
.bw-shop-pagination .woocommerce-pagination ul li span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: var(--bw-radius-sm);
  border: 1.5px solid var(--bw-border);
  background: var(--bw-paper);
  font-weight: 700;
  font-size: 0.88rem;
  color: var(--bw-text-secondary);
  transition: all var(--bw-transition-fast);
}

.bw-shop-pagination .woocommerce-pagination ul li a:hover {
  background: var(--bw-bg-warm);
  border-color: #c5b9aa;
  color: var(--bw-charcoal);
}

.bw-shop-pagination .woocommerce-pagination ul li span.current {
  background: var(--bw-charcoal);
  border-color: var(--bw-charcoal);
  color: #fff;
}

/* Empty state */
.bw-shop-empty {
  text-align: center;
  padding: clamp(3rem, 6vw, 5rem) 1rem;
  color: var(--bw-muted);
}

.bw-shop-empty svg {
  margin-bottom: 1rem;
  opacity: 0.35;
}

.bw-shop-empty h2 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 0.4rem;
}

.bw-shop-empty p {
  color: var(--bw-text-secondary);
  margin-bottom: 1.25rem;
}


/* ========================================================================
   SINGLE PRODUCT
   ======================================================================== */

.bw-single-product {
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(3rem, 6vw, 6rem);
  background: var(--bw-bg);
  min-height: 60vh;
}

/* Breadcrumb */
.bw-breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--bw-muted);
  margin-bottom: clamp(1.5rem, 2.5vw, 2.5rem);
  flex-wrap: wrap;
}

.bw-breadcrumb a {
  color: var(--bw-text-secondary);
  text-decoration: none;
  transition: color var(--bw-transition-fast);
}

.bw-breadcrumb a:hover {
  color: var(--bw-accent);
}

.bw-breadcrumb-sep {
  display: flex;
  align-items: center;
  color: var(--bw-border);
}

.bw-breadcrumb [aria-current="page"] {
  color: var(--bw-text);
  font-weight: 600;
}

/* Layout: Gallery + Details */
.bw-sp-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
  margin-bottom: clamp(2.5rem, 4vw, 4rem);
}

/* Gallery */
.bw-sp-gallery {
  position: sticky;
  top: 100px;
}

.bw-sp-main-image {
  position: relative;
  border-radius: var(--bw-radius-lg);
  overflow: hidden;
  background: var(--bw-bg-warm);
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-in;
}

.bw-sp-main-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.bw-sp-main-image:hover img {
  transform: scale(1.03);
}

.bw-sp-no-image {
  color: var(--bw-border);
}

.bw-sp-badge {
  position: absolute;
  top: 1rem;
  left: 1rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.35rem 0.85rem;
  border-radius: 100px;
  z-index: 2;
}

.bw-sp-badge--sale {
  background: var(--bw-accent);
  color: #fff;
}

.bw-sp-thumbnails {
  display: flex;
  gap: 0.625rem;
  margin-top: 0.875rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 4px;
}

.bw-sp-thumbnails::-webkit-scrollbar {
  display: none;
}

.bw-sp-thumb {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  border-radius: var(--bw-radius-sm);
  overflow: hidden;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color var(--bw-transition-fast), box-shadow var(--bw-transition-fast);
  background: var(--bw-bg-warm);
  padding: 0;
}

.bw-sp-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bw-sp-thumb.is-active {
  border-color: var(--bw-accent);
  box-shadow: 0 0 0 2px rgba(196, 103, 84, 0.2);
}

.bw-sp-thumb:hover:not(.is-active) {
  border-color: var(--bw-border);
}

/* Details */
.bw-sp-details {
  padding-top: 0.25rem;
}

.bw-sp-category {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: var(--bw-accent);
  margin-bottom: 0.625rem;
}

.bw-sp-category a {
  color: var(--bw-accent);
  text-decoration: none;
}

.bw-sp-category a:hover {
  text-decoration: underline;
}

.bw-sp-title {
  font-size: clamp(1.5rem, 2.5vw, 2.25rem);
  font-weight: 800;
  line-height: 1.2;
  color: var(--bw-charcoal);
  margin: 0 0 0.875rem;
  letter-spacing: -0.01em;
}

.bw-sp-price {
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 1rem;
}

.bw-sp-price del {
  font-size: 0.8em;
  color: var(--bw-muted);
  font-weight: 500;
  margin-right: 0.5rem;
}

.bw-sp-price ins {
  text-decoration: none;
  color: var(--bw-accent);
}

/* Stock Status */
.bw-sp-stock {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 0.3rem 0.75rem;
  border-radius: 100px;
  margin-bottom: 1.25rem;
}

.bw-sp-stock--in {
  background: var(--bw-green-soft);
  color: var(--bw-green);
}

.bw-sp-stock--out {
  background: rgba(196, 103, 84, 0.1);
  color: var(--bw-accent);
}

/* Short Description */
.bw-sp-short-desc {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--bw-text-secondary);
  margin-bottom: 1.5rem;
  max-width: 540px;
}

.bw-sp-short-desc p:last-child {
  margin-bottom: 0;
}

/* Add to Cart (WooCommerce form) */
.bw-sp-add-to-cart {
  margin-bottom: 1.75rem;
  padding-bottom: 1.75rem;
  border-bottom: 1px solid var(--bw-border-light);
}

.bw-sp-add-to-cart .cart {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.bw-sp-add-to-cart .quantity {
  display: flex;
  align-items: center;
  border: 2px solid var(--bw-border);
  border-radius: 4px;
  overflow: hidden;
  background: var(--bw-paper);
}

.bw-qty-btn {
  display: grid;
  place-items: center;
  width: 44px;
  height: 48px;
  border: none;
  background: transparent;
  color: var(--bw-charcoal);
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s ease, color 0.15s ease;
}

.bw-qty-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
}

.bw-qty-btn:active {
  background: rgba(255, 255, 255, 0.12);
}

.bw-qty-minus {
  border-right: 1px solid var(--bw-border);
}

.bw-qty-plus {
  border-left: 1px solid var(--bw-border);
}

.bw-sp-add-to-cart .quantity input[type="number"] {
  width: 48px;
  height: 48px;
  text-align: center;
  border: none;
  font-size: 1rem;
  font-weight: 600;
  color: var(--bw-charcoal);
  background: transparent;
  -moz-appearance: textfield;
  appearance: textfield;
}

.bw-sp-add-to-cart .quantity input::-webkit-inner-spin-button,
.bw-sp-add-to-cart .quantity input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.bw-sp-add-to-cart .single_add_to_cart_button,
.bw-sp-add-to-cart .button.alt,
.bw-sp-add-to-cart button.button.alt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #C46754 !important;
  color: #fff !important;
  font-size: 0.85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0.75rem 2rem;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  transition: background var(--bw-transition-fast), box-shadow var(--bw-transition-fast), transform var(--bw-transition-fast);
  height: 48px;
}

.bw-sp-add-to-cart .single_add_to_cart_button:hover,
.bw-sp-add-to-cart .button.alt:hover,
.bw-sp-add-to-cart button.button.alt:hover {
  background: #b05a48 !important;
  box-shadow: var(--bw-shadow-accent);
  transform: translateY(-1px);
}

.bw-sp-add-to-cart .single_add_to_cart_button:active,
.bw-sp-add-to-cart .button.alt:active {
  transform: translateY(0);
}

.bw-sp-add-to-cart .variations {
  width: 100%;
  margin-bottom: 1rem;
  border-collapse: collapse;
}

.bw-sp-add-to-cart .variations td {
  padding: 0.5rem 0;
}

.bw-sp-add-to-cart .variations .label {
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--bw-text);
  padding-right: 1rem;
  vertical-align: middle;
  white-space: nowrap;
}

.bw-sp-add-to-cart .variations select {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 2px solid var(--bw-border);
  border-radius: 4px;
  font-size: 0.9375rem;
  color: var(--bw-text);
  background: var(--bw-paper);
  cursor: pointer;
  transition: border-color var(--bw-transition-fast);
}

.bw-sp-add-to-cart .variations select:focus {
  border-color: var(--bw-accent);
  outline: none;
}

.bw-sp-add-to-cart .reset_variations {
  font-size: 0.8125rem;
  color: var(--bw-muted);
  text-decoration: underline;
  margin-top: 0.25rem;
  display: inline-block;
}

.bw-sp-add-to-cart .woocommerce-variation-price {
  margin-bottom: 0.75rem;
}

/* Highlights Strip */
.bw-sp-highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 1.75rem;
}

.bw-sp-highlight {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--bw-text-secondary);
  padding: 0.625rem 0.75rem;
  background: var(--bw-bg-warm);
  border-radius: var(--bw-radius-sm);
}

.bw-sp-highlight svg {
  flex-shrink: 0;
  color: var(--bw-accent);
}

/* Meta Details */
.bw-sp-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bw-border-light);
}

.bw-sp-meta-item {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
}

.bw-sp-meta-label {
  color: var(--bw-muted);
  font-weight: 500;
}

.bw-sp-meta-value {
  color: var(--bw-text);
  font-weight: 600;
}

.bw-sp-meta-value a {
  color: var(--bw-text);
  text-decoration: none;
}

.bw-sp-meta-value a:hover {
  color: var(--bw-accent);
}

/* ========================================================================
   PRODUCT TABS
   ======================================================================== */

.bw-sp-tabs-wrap {
  margin-bottom: clamp(2.5rem, 4vw, 4rem);
}

.bw-sp-tabs-wrap .woocommerce-tabs {
  background: var(--bw-paper);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
  border: 1px solid var(--bw-border-light);
  overflow: hidden;
}

.bw-sp-tabs-wrap .woocommerce-tabs ul.tabs {
  list-style: none;
  display: flex;
  gap: 0;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--bw-border-light);
  background: var(--bw-bg);
  overflow-x: auto;
}

.bw-sp-tabs-wrap .woocommerce-tabs ul.tabs li {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
}

.bw-sp-tabs-wrap .woocommerce-tabs ul.tabs li a {
  display: block;
  padding: 1rem 1.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--bw-muted);
  text-decoration: none;
  white-space: nowrap;
  position: relative;
  transition: color var(--bw-transition-fast);
}

.bw-sp-tabs-wrap .woocommerce-tabs ul.tabs li a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 1rem;
  right: 1rem;
  height: 2px;
  border-radius: 2px;
  background: transparent;
  transition: background var(--bw-transition-fast);
}

.bw-sp-tabs-wrap .woocommerce-tabs ul.tabs li.active a {
  color: var(--bw-charcoal);
}

.bw-sp-tabs-wrap .woocommerce-tabs ul.tabs li.active a::after {
  background: var(--bw-accent);
}

.bw-sp-tabs-wrap .woocommerce-tabs ul.tabs li a:hover {
  color: var(--bw-text);
}

.bw-sp-tabs-wrap .woocommerce-tabs .panel {
  padding: clamp(1.25rem, 2.5vw, 2rem) clamp(1.25rem, 2.5vw, 2rem);
}

.bw-sp-tabs-wrap .woocommerce-tabs .panel h2 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 1rem;
}

.bw-sp-tabs-wrap .woocommerce-tabs .panel p,
.bw-sp-tabs-wrap .woocommerce-tabs .panel li {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--bw-text-secondary);
}

.bw-sp-tabs-wrap .woocommerce-tabs .panel table {
  width: 100%;
  border-collapse: collapse;
}

.bw-sp-tabs-wrap .woocommerce-tabs .panel table th,
.bw-sp-tabs-wrap .woocommerce-tabs .panel table td {
  padding: 0.75rem 1rem;
  text-align: left;
  border-bottom: 1px solid var(--bw-border-light);
  font-size: 0.875rem;
}

.bw-sp-tabs-wrap .woocommerce-tabs .panel table th {
  font-weight: 600;
  color: var(--bw-text);
  width: 35%;
}

.bw-sp-tabs-wrap .woocommerce-tabs .panel table td {
  color: var(--bw-text-secondary);
}

/* Reviews inside tabs */
.bw-sp-tabs-wrap .woocommerce-Reviews #reviews {
  padding: 0;
}

.bw-sp-tabs-wrap .comment-form {
  margin-top: 1.5rem;
}

.bw-sp-tabs-wrap .comment-form label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-text);
  margin-bottom: 0.375rem;
}

.bw-sp-tabs-wrap .comment-form input[type="text"],
.bw-sp-tabs-wrap .comment-form input[type="email"],
.bw-sp-tabs-wrap .comment-form textarea {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 2px solid var(--bw-border);
  border-radius: 4px;
  font-size: 0.9375rem;
  color: var(--bw-text);
  background: var(--bw-paper);
  transition: border-color var(--bw-transition-fast);
  margin-bottom: 1rem;
}

.bw-sp-tabs-wrap .comment-form input:focus,
.bw-sp-tabs-wrap .comment-form textarea:focus {
  border-color: var(--bw-accent);
  outline: none;
}

.bw-sp-tabs-wrap .comment-form .form-submit input[type="submit"] {
  background: var(--bw-accent);
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.85rem;
  padding: 0.625rem 1.5rem;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background var(--bw-transition-fast);
}

.bw-sp-tabs-wrap .comment-form .form-submit input[type="submit"]:hover {
  background: var(--bw-accent-hover);
}

/* Star rating in reviews */
.bw-sp-tabs-wrap .star-rating {
  display: inline-flex;
  color: #e2a84b;
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.bw-sp-tabs-wrap .commentlist {
  list-style: none;
  padding: 0;
  margin: 0;
}

.bw-sp-tabs-wrap .commentlist li {
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--bw-border-light);
}

.bw-sp-tabs-wrap .commentlist li:last-child {
  border-bottom: none;
}

.bw-sp-tabs-wrap .comment_container {
  display: flex;
  gap: 1rem;
}

.bw-sp-tabs-wrap .comment_container img.avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex-shrink: 0;
}

.bw-sp-tabs-wrap .comment-text .meta {
  font-size: 0.8125rem;
  color: var(--bw-muted);
  margin-bottom: 0.5rem;
}

.bw-sp-tabs-wrap .comment-text .meta strong {
  color: var(--bw-text);
}

/* ---- Zoom hint icon ---- */
.bw-sp-zoom-hint {
  position: absolute;
  bottom: 0.85rem;
  right: 0.85rem;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  z-index: 3;
  opacity: 0;
  transform: scale(0.85);
  transition: opacity 0.25s ease, transform 0.25s ease;
  pointer-events: none;
}

.bw-sp-main-image:hover .bw-sp-zoom-hint {
  opacity: 1;
  transform: scale(1);
}

/* ---- Gallery Arrows ---- */
.bw-sp-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.25s ease, background 0.2s ease;
}

.bw-sp-main-image:hover .bw-sp-arrow {
  opacity: 1;
}

.bw-sp-arrow:hover {
  background: rgba(0, 0, 0, 0.75);
}

.bw-sp-arrow:active {
  transform: translateY(-50%) scale(0.92);
}

.bw-sp-arrow--prev {
  left: 0.75rem;
}

.bw-sp-arrow--next {
  right: 0.75rem;
}

/* ========================================================================
   LIGHTBOX
   ======================================================================== */

body.bw-lightbox-open {
  overflow: hidden;
}

.bw-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.bw-lightbox.is-open {
  visibility: visible;
  opacity: 1;
}

.bw-lightbox-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.92);
  cursor: pointer;
}

.bw-lightbox-close {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  z-index: 3;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  cursor: pointer;
  transition: background 0.2s ease;
}

.bw-lightbox-close:hover {
  background: rgba(255, 255, 255, 0.2);
}

.bw-lightbox-stage {
  position: relative;
  z-index: 2;
  max-width: 90vw;
  max-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bw-lightbox-img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 6px;
  opacity: 0;
  transform: scale(0.96);
  transition: opacity 0.3s ease, transform 0.3s ease;
  user-select: none;
  -webkit-user-drag: none;
}

.bw-lightbox-img.is-loaded {
  opacity: 1;
  transform: scale(1);
}

.bw-lightbox-spinner {
  position: absolute;
  width: 32px;
  height: 32px;
  border: 3px solid rgba(255, 255, 255, 0.15);
  border-top-color: #fff;
  border-radius: 50%;
  display: none;
  animation: bw-spin 0.7s linear infinite;
}

.bw-lightbox-spinner.is-visible {
  display: block;
}

@keyframes bw-spin {
  to { transform: rotate(360deg); }
}

.bw-lightbox-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

.bw-lightbox-arrow:hover {
  background: rgba(255, 255, 255, 0.2);
}

.bw-lightbox-arrow:active {
  transform: translateY(-50%) scale(0.92);
}

.bw-lightbox-prev {
  left: 1.5rem;
}

.bw-lightbox-next {
  right: 1.5rem;
}

.bw-lightbox-counter {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: 0.1em;
}

@media (max-width: 768px) {
  .bw-lightbox-arrow {
    width: 40px;
    height: 40px;
  }

  .bw-lightbox-arrow svg {
    width: 22px;
    height: 22px;
  }

  .bw-lightbox-prev {
    left: 0.75rem;
  }

  .bw-lightbox-next {
    right: 0.75rem;
  }

  .bw-lightbox-close {
    top: 0.75rem;
    right: 0.75rem;
    width: 40px;
    height: 40px;
  }

  .bw-lightbox-img {
    max-width: 95vw;
    max-height: 80vh;
  }
}


/* ========================================================================
   RELATED PRODUCTS
   ======================================================================== */

.bw-sp-related {
  padding-top: 1rem;
}

.bw-sp-related .bw-section-header {
  text-align: left;
}

.bw-sp-related-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(1rem, 1.5vw, 1.5rem);
  margin-top: 1.5rem;
}

.bw-sp-related .bw-product-card {
  background: var(--bw-paper);
  border-radius: var(--bw-radius);
  overflow: hidden;
  box-shadow: var(--bw-shadow-xs);
  border: 1px solid var(--bw-border-light);
  transition: box-shadow var(--bw-transition), transform var(--bw-transition);
}

.bw-sp-related .bw-product-card:hover {
  box-shadow: var(--bw-shadow);
  transform: translateY(-3px);
}

.bw-sp-related .bw-product-thumb {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--bw-bg-warm);
}

.bw-sp-related .bw-product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.bw-sp-related .bw-product-card:hover .bw-product-thumb img {
  transform: scale(1.05);
}

.bw-sp-related .bw-product-body {
  padding: 1rem 1.125rem 1.25rem;
}

.bw-sp-related .bw-product-name {
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 0.375rem;
}

.bw-sp-related .bw-product-name a {
  color: var(--bw-charcoal);
  text-decoration: none;
  transition: color var(--bw-transition-fast);
}

.bw-sp-related .bw-product-name a:hover {
  color: var(--bw-accent);
}

.bw-sp-related .bw-product-price {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.75rem;
}

.bw-sp-related .bw-btn--small {
  font-size: 0.8125rem;
  padding: 0.5rem 1rem;
}


/* ========================================================================
   CART PAGE (WooCommerce Block Cart)
   ======================================================================== */

.woocommerce-cart .bw-content {
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(3rem, 6vw, 6rem);
  background: var(--bw-bg);
  min-height: 60vh;
}

.woocommerce-cart .bw-content .bw-container--narrow {
  width: var(--bw-container-wide);
}

.woocommerce-cart .entry-content {
  max-width: none;
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  border-radius: 0;
}

/* ---- Block Cart Container ---- */
.wp-block-woocommerce-cart {
  font-family: var(--bw-font);
}

.wc-block-cart {
  padding-top: 0 !important;
}

/* ---- Cart Items Table ---- */
.wc-block-cart table.wc-block-cart-items {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
  overflow: hidden;
}

.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__header {
  background: var(--bw-bg);
}

.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__header th {
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  padding: 0.875rem 1.25rem !important;
}

.wc-block-cart table.wc-block-cart-items td {
  padding: 1.25rem !important;
  border-color: var(--bw-border-light) !important;
}

/* Product Image */
.wc-block-cart .wc-block-cart-item__image a {
  border-radius: var(--bw-radius-sm) !important;
  overflow: hidden;
  display: block;
}

.wc-block-cart .wc-block-cart-item__image img {
  border-radius: var(--bw-radius-sm);
  object-fit: cover;
}

/* Product Name */
.wc-block-cart .wc-block-components-product-name {
  font-size: 0.9375rem !important;
  font-weight: 600;
  color: var(--bw-charcoal);
  text-decoration: none !important;
  transition: color var(--bw-transition-fast);
}

.wc-block-cart .wc-block-components-product-name:hover {
  color: var(--bw-accent) !important;
}

/* Product Metadata (variations) */
.wc-block-cart .wc-block-components-product-metadata {
  color: var(--bw-muted);
}

.wc-block-cart .wc-block-components-product-metadata .wc-block-components-product-metadata__description,
.wc-block-cart .wc-block-components-product-metadata .wc-block-components-product-metadata__variation-data {
  color: var(--bw-muted);
}

/* Product Price */
.wc-block-cart .wc-block-cart-item__prices {
  color: var(--bw-text);
  font-weight: 600;
}

.wc-block-cart .wc-block-cart-item__total {
  font-weight: 700 !important;
  color: var(--bw-charcoal);
}

.wc-block-cart .wc-block-components-formatted-money-amount {
  color: var(--bw-charcoal);
}

/* Quantity Selector */
.wc-block-cart .wc-block-components-quantity-selector {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius-sm) !important;
  background: var(--bw-paper);
  overflow: hidden;
}

.wc-block-cart .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
  font-weight: 600;
  color: var(--bw-charcoal);
  font-size: 0.9375rem !important;
}

.wc-block-cart .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input:focus {
  box-shadow: inset 0 0 0 1px var(--bw-accent) !important;
}

.wc-block-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
  color: var(--bw-text-secondary);
  transition: color var(--bw-transition-fast);
}

.wc-block-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:hover {
  color: var(--bw-accent);
}

/* Remove Link */
.wc-block-cart .wc-block-cart-item__remove-link {
  color: var(--bw-muted) !important;
  text-decoration: none !important;
  transition: color var(--bw-transition-fast);
}

.wc-block-cart .wc-block-cart-item__remove-link:hover {
  color: var(--bw-accent) !important;
}

/* Row border */
.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row {
  border-color: var(--bw-border-light) !important;
}

/* ---- Sidebar / Totals ---- */
.wc-block-cart .wc-block-components-sidebar {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
  overflow: hidden;
  padding: 0 !important;
}

/* ---- Cart Totals card — consistent horizontal inset ----
   WC ships different default left/right padding on the title, the
   "Add coupons" toggle, the totals rows, the footer, and the submit
   button. We force all of them to the same 1.5rem horizontal inset so
   the content has visible breathing room from the card edges and lines
   up cleanly down the panel. */
.wc-block-cart .wc-block-cart__totals-title {
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  padding: 1.125rem 1.5rem 0.75rem !important;
  margin: 0;
  background: var(--bw-bg);
  border-bottom: 1px solid var(--bw-border-light);
}

/* Totals items (Subtotal, fee rows, etc.) */
.wc-block-cart .wc-block-components-totals-item {
  padding: 0.75rem 1.5rem !important;
}

/* Footer / grand total row */
.wc-block-cart .wc-block-components-totals-footer-item {
  padding: 1rem 1.5rem !important;
}

/* "Add coupons" panel toggle (header row) */
.wc-block-cart .wc-block-components-totals-coupon .wc-block-components-panel__button {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* "Add coupons" panel content (the input + apply button) */
.wc-block-cart .wc-block-components-totals-coupon__content {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

/* Proceed to checkout — pull it inside the same 1.5rem inset so the
   button doesn't kiss the card edges. We use the wrapper block, not
   the button itself, so the button's own padding stays intact. */
.wc-block-cart .wp-block-woocommerce-proceed-to-checkout-block,
.wc-block-cart .wc-proceed-to-checkout {
  padding: 0 1.5rem 1.5rem !important;
}

.wc-block-cart .wc-block-components-totals-item__label {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--bw-text-secondary);
}

.wc-block-cart .wc-block-components-totals-item__value {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--bw-charcoal);
}

/* Footer totals (Grand total) */
.wc-block-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-weight: 800 !important;
  color: var(--bw-charcoal) !important;
}

.wc-block-cart .wc-block-components-totals-footer-item {
  border-top: 2px solid var(--bw-border);
}

/* Order summary block border */
.wc-block-cart .wp-block-woocommerce-cart-order-summary-block {
  border-bottom: none !important;
  margin-bottom: 0 !important;
}

.wp-block-woocommerce-cart-order-summary-totals-block {
  border-top-color: var(--bw-border-light) !important;
}

/* Coupon toggle */
.wc-block-cart .wc-block-components-totals-coupon .wc-block-components-panel__button {
  color: var(--bw-text);
  font-weight: 600;
  font-size: 0.875rem;
}

.wc-block-cart .wc-block-components-totals-coupon .wc-block-components-panel__button:hover {
  color: var(--bw-accent);
}

/* Coupon form */
.wc-block-cart .wc-block-components-totals-coupon__input input {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius-sm) !important;
  font-size: 0.875rem;
  color: #1a1a1a !important;
  padding: 0.5rem 0.75rem;
}

.wc-block-cart .wc-block-components-totals-coupon__input input::placeholder,
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__input input::placeholder {
  color: rgba(26, 26, 26, 0.55) !important;
  opacity: 1;
}

.wc-block-cart .wc-block-components-totals-coupon__input input:focus {
  border-color: var(--bw-accent) !important;
  box-shadow: none !important;
  outline: none;
}

.wc-block-cart .wc-block-components-totals-coupon__button,
.wc-block-cart .wc-block-components-totals-coupon__button.wc-block-components-button,
.wc-block-cart .wc-block-components-totals-coupon__button.wp-element-button {
  background: var(--bw-accent) !important;
  border: 0 !important;
  color: #fff !important;
  border-radius: var(--bw-radius) !important;
  font-weight: 700 !important;
  font-size: 0.875rem !important;
  padding: 0.7rem 1.25rem !important;
  box-shadow: none !important;
  transition: background 0.2s ease, transform 0.1s ease;
}

.wc-block-cart .wc-block-components-totals-coupon__button:hover,
.wc-block-cart .wc-block-components-totals-coupon__button.wc-block-components-button:hover,
.wc-block-cart .wc-block-components-totals-coupon__button.wp-element-button:hover {
  background: #b85a48 !important;
  color: #fff !important;
}

.wc-block-cart .wc-block-components-totals-coupon__button .wc-block-components-button__text {
  color: #fff !important;
}

/* ---- Proceed to Checkout Button ---- */
.wc-block-cart__submit-button,
.wc-block-cart .wc-block-cart__submit-button {
  background: #C46754 !important;
  color: #fff !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  padding: 0.875rem 1.5rem !important;
  border: none !important;
  border-radius: var(--bw-radius-sm) !important;
  cursor: pointer;
  letter-spacing: 0.01em;
  transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
  text-decoration: none;
  min-height: 52px !important;
}

.wc-block-cart__submit-button:hover,
.wc-block-cart .wc-block-cart__submit-button:hover {
  background: #b05a48 !important;
  box-shadow: 0 8px 24px rgba(196, 103, 84, 0.25) !important;
  transform: translateY(-1px);
}

.wc-block-cart__submit-button:active,
.wc-block-cart .wc-block-cart__submit-button:active {
  transform: translateY(0);
}

.wc-block-cart__submit-button:focus,
.wc-block-cart .wc-block-cart__submit-button:focus {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #C46754 !important;
  outline: none !important;
}

/* ---- Express Payment ---- */
.wc-block-cart .wc-block-components-express-payment--cart {
  border-top: 1px solid var(--bw-border-light);
  padding-top: 1rem;
  margin-top: 0.5rem;
}

.wc-block-cart .wc-block-components-express-payment-continue-rule {
  color: var(--bw-muted);
  font-size: 0.8125rem;
}

.wc-block-cart .wc-block-components-express-payment-continue-rule::before,
.wc-block-cart .wc-block-components-express-payment-continue-rule::after {
  border-color: var(--bw-border-light) !important;
}

/* ---- Payment Method Icons ---- */
.wc-block-cart .wc-block-components-payment-method-icons {
  margin-bottom: 0.5rem;
}

/* ---- Empty Cart ---- */

.woocommerce-cart .bw-content {
  min-height: 60vh;
}

/* Neutralise .bw-prose inside WooCommerce cart blocks */
.woocommerce-cart .bw-prose {
  max-width: none;
}

.woocommerce-cart .bw-prose ul,
.woocommerce-cart .bw-prose ol {
  display: revert;
  gap: revert;
  padding-left: revert;
  margin: revert;
}

.woocommerce-cart .bw-prose li {
  font-size: revert;
  color: revert;
  line-height: revert;
}

.woocommerce-cart .bw-prose li::marker {
  color: revert;
}

.woocommerce-cart .bw-prose a {
  color: #fff;
  text-decoration: none;
  text-underline-offset: revert;
}

.woocommerce-cart .bw-prose a:hover {
  color: var(--bw-accent);
}

.woocommerce-cart .bw-prose p {
  color: revert;
  font-size: revert;
  line-height: revert;
}

/* Hide ALL default WooCommerce empty cart content */
.wp-block-woocommerce-empty-cart-block > *:not(.bw-empty-cart-msg) {
  display: none !important;
}

/* Hide product grids and sibling content after the cart block */
.woocommerce-cart .wp-block-woocommerce-product-new,
.woocommerce-cart .wc-block-grid,
.woocommerce-cart .entry-content > .wp-block-woocommerce-cart ~ * {
  display: none !important;
}

.wp-block-woocommerce-empty-cart-block {
  padding: 5rem 1rem 4rem;
  text-align: center;
}

/* Our custom empty cart message */
.bw-empty-cart-msg {
  text-align: center;
}

.bw-empty-cart-text {
  color: rgba(255, 255, 255, 0.55);
  font-size: 1.0625rem;
  margin-bottom: 2rem;
}

.bw-empty-cart-msg .bw-btn {
  color: #fff !important;
  text-decoration: none !important;
}

/* ---- Notices / Messages ---- */
.woocommerce-cart .wc-block-components-notice-banner,
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-error {
  background: var(--bw-paper) !important;
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius) !important;
  padding: 1rem 1.25rem !important;
  margin-bottom: 1.5rem !important;
  font-size: 0.9375rem;
  color: var(--bw-text);
  box-shadow: var(--bw-shadow-xs);
  border-left: 4px solid var(--bw-accent) !important;
}

/* ---- Shipping / Address ---- */
.wc-block-cart .wc-block-components-totals-shipping__change-address-button,
.wc-block-cart .wc-block-components-totals-shipping__change-address__link {
  color: var(--bw-accent) !important;
}

.wc-block-cart .wc-block-components-address-form input,
.wc-block-cart .wc-block-components-address-form select {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius-sm) !important;
  font-size: 0.875rem;
  color: var(--bw-text);
  padding: 0.5rem 0.75rem;
}

.wc-block-cart .wc-block-components-address-form input:focus,
.wc-block-cart .wc-block-components-address-form select:focus {
  border-color: var(--bw-accent) !important;
  box-shadow: none !important;
  outline: none;
}

/* ---- Cross-sells ---- */
.wp-block-woocommerce-cart-cross-sells-block .wp-block-heading {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bw-charcoal);
}

.wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-name {
  font-weight: 600;
  color: var(--bw-charcoal);
}

.wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-image img {
  border-radius: var(--bw-radius-sm);
}

/* Sale badge */
.wc-block-cart .wc-block-components-sale-badge,
.wc-block-cart .wc-block-components-product-sale-badge {
  background: var(--bw-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.2rem 0.6rem;
}

/* Panel accordion borders */
.wc-block-cart .wc-block-components-panel {
  border-color: var(--bw-border-light) !important;
}

/* Radio controls (shipping options) */
.wc-block-cart .wc-block-components-radio-control__input {
  accent-color: var(--bw-accent);
}

/* Sticky checkout on mobile */
@media (max-width: 782px) {
  .wc-block-cart .wc-block-cart__submit-container--sticky {
    background: var(--bw-paper) !important;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3) !important;
    border-top: 1px solid var(--bw-border-light);
    padding: 1rem !important;
  }

  .wc-block-cart .wc-block-cart__submit-container--sticky::before {
    display: none !important;
  }
}


/* ========================================================================
   CHECKOUT PAGE (WooCommerce Block Checkout)
   ======================================================================== */

.woocommerce-checkout .bw-content {
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(3rem, 6vw, 6rem);
  background: var(--bw-bg);
  min-height: 60vh;
}

.woocommerce-checkout .bw-content .bw-container--narrow {
  width: var(--bw-container-wide);
}

.woocommerce-checkout .entry-content {
  max-width: none;
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  border-radius: 0;
}

.wp-block-woocommerce-checkout {
  font-family: var(--bw-font);
}

/* ---- Step Sections ---- */
.wc-block-components-checkout-step {
  margin-bottom: 1.75rem !important;
}

.wc-block-components-checkout-step__heading {
  margin-bottom: 1rem;
}

.wc-block-components-checkout-step__heading h2,
.wc-block-components-checkout-step__title {
  font-size: 1.0625rem !important;
  font-weight: 700 !important;
  color: #fff;
  letter-spacing: -0.005em;
}

.wc-block-components-checkout-step__description {
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.5);
}

/* Step numbers */
.wc-block-components-checkout-step--with-step-number .wc-block-components-checkout-step__container::before {
  color: var(--bw-accent) !important;
  font-weight: 800;
}

/* ---- Form Inputs (Text) ---- */
.wp-block-woocommerce-checkout .wc-block-components-text-input input,
.wp-block-woocommerce-checkout .wc-block-components-text-input textarea {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius) !important;
  font-family: var(--bw-font);
  font-size: 0.9375rem;
  color: #fff !important;
  background: var(--bw-bg) !important;
  padding: 0.75rem 1rem !important;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-woocommerce-checkout .wc-block-components-text-input input:focus,
.wp-block-woocommerce-checkout .wc-block-components-text-input textarea:focus {
  border-color: var(--bw-accent) !important;
  border-width: 2px !important;
  background: var(--bw-paper) !important;
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1) !important;
  outline: none;
}

/* ---- Order Notes textarea ----
   The "Add a note to your order" field is its own WC Blocks component
   (wc-block-checkout__add-note) and isn't wrapped in wc-block-components-text-input,
   so the rule above doesn't reach it — leaving us with a default white textarea.
   Catch it explicitly here, and also add a defensive textarea selector for any
   future block fields that might appear bare. */
.wp-block-woocommerce-checkout .wc-block-checkout__add-note textarea,
.wp-block-woocommerce-checkout .wc-block-components-checkout-step textarea {
  display: block;
  width: 100%;
  min-height: 110px;
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius) !important;
  font-family: var(--bw-font);
  font-size: 0.9375rem;
  line-height: 1.5;
  color: #fff !important;
  background: var(--bw-bg) !important;
  padding: 0.75rem 1rem !important;
  resize: vertical;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-woocommerce-checkout .wc-block-checkout__add-note textarea::placeholder,
.wp-block-woocommerce-checkout .wc-block-components-checkout-step textarea::placeholder {
  color: rgba(255, 255, 255, 0.4) !important;
}

.wp-block-woocommerce-checkout .wc-block-checkout__add-note textarea:focus,
.wp-block-woocommerce-checkout .wc-block-components-checkout-step textarea:focus {
  border-color: var(--bw-accent) !important;
  background: var(--bw-paper) !important;
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1) !important;
  outline: none;
}

/* "Add a note to your order" checkbox row sits just above the textarea —
   make sure its label colour matches our other field labels. */
.wp-block-woocommerce-checkout .wc-block-checkout__add-note .wc-block-components-checkbox__label {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 0.9375rem;
}

.wp-block-woocommerce-checkout .wc-block-components-text-input label {
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.wp-block-woocommerce-checkout .wc-block-components-text-input.is-active label {
  color: var(--bw-accent) !important;
}

/* Floating-label breathing room.
   When a field has a value, WC's <label> shrinks and floats to the top of
   the field. With our default 0.75rem symmetric padding the label and the
   value sit on top of each other (visible on Postal code, Country/Region,
   Province in the screenshot). Push the value down + tighten the bottom
   when the field is in its active/filled state so there's a clear gap. */
.wp-block-woocommerce-checkout .wc-block-components-text-input.is-active input,
.wp-block-woocommerce-checkout .wc-block-components-text-input.is-active textarea {
  padding-top: 1.15rem !important;
  padding-bottom: 0.4rem !important;
}

.wp-block-woocommerce-checkout .has-error .wc-block-components-text-input input {
  border-color: #c44 !important;
}

/* ---- Select Inputs ----
   WooCommerce Blocks renders a <div class="wc-blocks-components-select__container">
   with its OWN default border. If we only style the inner <select>, we get
   stacked borders that read as a bright white halo around the field. So we
   move our border onto the container and strip the inner select's border. */
.wp-block-woocommerce-checkout .wc-blocks-components-select {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wp-block-woocommerce-checkout .wc-blocks-components-select__container {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius) !important;
  background: var(--bw-bg) !important;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  box-shadow: none !important;
}

.wp-block-woocommerce-checkout .wc-blocks-components-select__container:focus-within {
  border-color: var(--bw-accent) !important;
  background: var(--bw-paper) !important;
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1) !important;
}

.wp-block-woocommerce-checkout .wc-blocks-components-select__select {
  border: 0 !important;
  border-radius: var(--bw-radius) !important;
  font-family: var(--bw-font);
  font-size: 0.9375rem;
  color: #fff !important;
  background: transparent !important;
  /* Asymmetric padding: native <select> always has a value, so the floating
     label always sits at the top — push the value down so they don't touch. */
  padding: 1.15rem 1rem 0.4rem !important;
  box-shadow: none !important;
}

.wp-block-woocommerce-checkout .wc-blocks-components-select__select:focus {
  outline: none !important;
  box-shadow: none !important;
}

.wp-block-woocommerce-checkout .wc-blocks-components-select__label {
  color: rgba(255, 255, 255, 0.5);
}

.wp-block-woocommerce-checkout .wc-blocks-components-select__expand {
  fill: rgba(255, 255, 255, 0.4) !important;
}

/* ---- Combobox / Autocomplete (Country / Region) ----
   Same problem as the select above: the outer combobox-control wraps a
   token-field input-container, and both can render their own border. We
   pin the visible border to the inner __input-container and zero out the
   outer wrapper so there's no double-line halo. */
.wp-block-woocommerce-checkout .wc-block-components-combobox-control,
.wp-block-woocommerce-checkout .wc-block-components-combobox {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__input-container {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius) !important;
  background: var(--bw-bg) !important;
  box-shadow: none !important;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__input-container.is-active,
.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__input-container:focus-within {
  border-color: var(--bw-accent) !important;
  background: var(--bw-paper) !important;
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1) !important;
}

.wp-block-woocommerce-checkout .wc-block-components-combobox input[type="text"] {
  font-family: var(--bw-font);
  color: #fff !important;
}

/* Combobox floating-label breathing room. The country combobox almost always
   has a value (defaults to South Africa here), so its label is permanently
   in the floated-up state — give the input enough top padding to not collide
   with it. We push the input padding rather than the container so the border
   stays the right size. */
.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__input-container.is-active input[type="text"],
.wp-block-woocommerce-checkout .wc-block-components-combobox.has-value input[type="text"] {
  padding-top: 0.85rem !important;
  padding-bottom: 0.15rem !important;
}

.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__suggestions-list {
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius) !important;
  box-shadow: var(--bw-shadow-sm) !important;
  background: var(--bw-paper) !important;
}

.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__suggestion {
  color: #fff;
}

.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__suggestion.is-selected {
  background: var(--bw-accent-soft) !important;
  color: var(--bw-accent) !important;
}

.wp-block-woocommerce-checkout .wc-block-components-combobox .components-form-token-field__label {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* ---- Checkboxes ---- */
.wp-block-woocommerce-checkout .wc-block-components-checkbox__input[type="checkbox"] {
  accent-color: var(--bw-accent);
}

.wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__label {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.6);
}

/* ---- Radio Controls (shipping / payment) ---- */
.wp-block-woocommerce-checkout .wc-block-components-radio-control__input {
  accent-color: var(--bw-accent);
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control__label {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #fff;
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control__description {
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.5);
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control__secondary-label {
  font-weight: 700;
  color: #fff;
}

/* ---- Checkout helper text / links ---- */
.wp-block-woocommerce-checkout .wc-block-components-address-form__address_2-toggle {
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 0.8125rem;
}

.wp-block-woocommerce-checkout .wc-block-components-address-form__address_2-toggle:hover {
  color: var(--bw-accent) !important;
}

/* Payment accordion options */
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option {
  border-color: var(--bw-border-light) !important;
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option--checked-option-highlighted::after {
  border-color: var(--bw-accent) !important;
}

/* Shipping method toggle */
.wp-block-woocommerce-checkout .wc-block-checkout__shipping-method-container {
  background-color: var(--bw-bg-warm) !important;
  border-radius: var(--bw-radius-sm) !important;
}

.wp-block-woocommerce-checkout .wc-block-checkout__shipping-method-option--selected {
  background: var(--bw-paper) !important;
  border-color: var(--bw-accent) !important;
  box-shadow: var(--bw-shadow-xs);
}

/* ---- Order Summary Sidebar ---- */
.wc-block-checkout__sidebar {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius-lg) !important;
  box-shadow: var(--bw-shadow-xs);
  overflow: hidden;
}

.wp-block-woocommerce-checkout-order-summary-block {
  border: none !important;
  border-radius: 0 !important;
}

/* Summary title.
   On checkout, WC wraps this in a flex <button> with its own default padding
   for the mobile collapsible toggle — which leaves a big empty dark band
   below the heading text on desktop. We tighten everything to one consistent
   header bar height. */
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  padding: 0.85rem 1rem !important;
  margin: 0 !important;
  min-height: 0 !important;
  line-height: 1.3 !important;
  background: var(--bw-bg);
  border-bottom: 1px solid var(--bw-border-light);
}

.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title-text,
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title-source {
  padding: 0 !important;
  margin: 0 !important;
  text-indent: 0 !important;
}

/* Kill the top padding WC default sets on the cart-items wrapper so the
   first product sits flush under the heading, not 30–40 px below it. */
.wp-block-woocommerce-checkout-order-summary-block .wp-block-woocommerce-checkout-order-summary-cart-items-block,
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-order-summary {
  padding: 0 !important;
  margin: 0 !important;
}

/* ---- Consistent left/right padding across the whole summary panel ----
   WC ships different default paddings for the title, the order-summary
   items, and the totals rows, so the heading text could sit further from
   the left edge than the product image below it (visible "gap to the left
   of the heading"). We force the same 1rem left/right inset on all three
   layers so everything aligns vertically. */
.wc-block-checkout__sidebar .wc-block-components-order-summary-item {
  border-color: var(--bw-border-light) !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-order-summary-item__image img {
  border-radius: var(--bw-radius-sm) !important;
}

.wc-block-checkout__sidebar .wc-block-components-product-name {
  font-weight: 600 !important;
  color: #fff !important;
}

.wc-block-checkout__sidebar .wc-block-components-order-summary-item__quantity {
  background: var(--bw-accent) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: none !important;
  font-weight: 700;
  font-size: 0.6875rem;
}

.wc-block-checkout__sidebar .wc-block-components-product-metadata {
  color: var(--bw-muted) !important;
}

/* Sidebar totals */
.wc-block-checkout__sidebar .wc-block-components-totals-item {
  padding: 0.625rem 1rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-item__label {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--bw-text-secondary);
}

.wc-block-checkout__sidebar .wc-block-components-totals-item__value {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #fff;
}

/* Grand total */
.wc-block-checkout__sidebar .wc-block-components-totals-footer-item {
  border-top: 2px solid var(--bw-border) !important;
  padding: 1rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-checkout__sidebar .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-weight: 800 !important;
  color: #fff !important;
}

/* Summary wrapper borders */
.wc-block-checkout__sidebar .wc-block-components-totals-wrapper {
  border-color: var(--bw-border-light) !important;
}

.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-totals-block {
  border-top-color: var(--bw-border-light) !important;
}

/* Coupon in sidebar */
.wc-block-checkout__sidebar .wc-block-components-totals-coupon .wc-block-components-panel__button {
  color: var(--bw-text);
  font-weight: 600;
  font-size: 0.875rem;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

/* Coupon panel content (Enter code + Apply) — pull it inside the same 1rem inset. */
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__content {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-coupon .wc-block-components-panel__button:hover {
  color: var(--bw-accent);
}

.wc-block-checkout__sidebar .wc-block-components-totals-coupon__input input {
  color: #1a1a1a !important;
}

/* Apply-coupon button. Newer WC Blocks ship this as a generic
   wc-block-components-button + wp-element-button, which adds light
   default theme styling that wins the cascade — leaving us with a
   cream button + white text (invisible). We brand it explicitly. */
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button,
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button.wc-block-components-button,
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button.wp-element-button {
  background: var(--bw-accent) !important;
  border: 0 !important;
  color: #fff !important;
  border-radius: var(--bw-radius) !important;
  font-weight: 700 !important;
  padding: 0.7rem 1.25rem !important;
  box-shadow: none !important;
  transition: background 0.2s ease, transform 0.1s ease;
}

.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button:hover,
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button.wc-block-components-button:hover,
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button.wp-element-button:hover {
  background: #b85a48 !important;
  color: #fff !important;
}

.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button:disabled,
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Inner label span — make sure the text colour can't be overridden by
   any nested span with its own colour rule. */
.wc-block-checkout__sidebar .wc-block-components-totals-coupon__button .wc-block-components-button__text {
  color: #fff !important;
}

/* Panel toggles */
.wc-block-checkout__sidebar .wc-block-components-panel__button {
  font-size: 0.875rem;
}

/* ---- Place Order Button ---- */
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button {
  background: #C46754 !important;
  color: #fff !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  padding: 0.875rem 2rem !important;
  border: none !important;
  border-radius: var(--bw-radius-sm) !important;
  cursor: pointer;
  letter-spacing: 0.01em;
  transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
  min-height: 52px !important;
}

.wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:hover {
  background: #b05a48 !important;
  box-shadow: 0 8px 24px rgba(196, 103, 84, 0.25) !important;
  transform: translateY(-1px);
}

.wc-block-components-checkout-place-order-button:active,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:active {
  transform: translateY(0);
}

.wc-block-components-checkout-place-order-button:focus,
.wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:focus {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #C46754 !important;
  outline: none !important;
}

/* ---- Return to Cart Link ---- */
.wc-block-components-checkout-return-to-cart-button {
  color: var(--bw-text-secondary) !important;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none !important;
  transition: color var(--bw-transition-fast);
}

.wc-block-components-checkout-return-to-cart-button:hover {
  color: var(--bw-accent) !important;
}

.wc-block-components-checkout-return-to-cart-button svg {
  fill: currentColor !important;
}

/* ---- Terms & Conditions ---- */
.wc-block-checkout__terms {
  border-top-color: var(--bw-border-light) !important;
  font-size: 0.8125rem !important;
  color: var(--bw-muted);
}

.wc-block-checkout__terms a {
  color: var(--bw-accent);
}

/* ---- Login Prompt ---- */
.wp-block-woocommerce-checkout .wc-block-checkout__login-prompt {
  font-size: 0.8125rem;
  color: var(--bw-muted);
}

.wp-block-woocommerce-checkout .wc-block-checkout__login-prompt a {
  color: var(--bw-accent);
  font-weight: 600;
  text-decoration: none;
}

.wp-block-woocommerce-checkout .wc-block-checkout__login-prompt a:hover {
  text-decoration: underline;
}

/* ---- Express Payment ---- */
.wp-block-woocommerce-checkout .wc-block-components-express-payment--checkout .wc-block-components-express-payment__title-container::before,
.wp-block-woocommerce-checkout .wc-block-components-express-payment--checkout .wc-block-components-express-payment__title-container::after {
  border-color: var(--bw-border-light) !important;
}

.wp-block-woocommerce-checkout .wc-block-components-express-payment--checkout .wc-block-components-express-payment__content {
  border-color: var(--bw-border-light) !important;
  border-radius: 0 0 var(--bw-radius-sm) var(--bw-radius-sm) !important;
}

.wp-block-woocommerce-checkout .wc-block-components-express-payment-continue-rule {
  color: var(--bw-muted);
}

.wp-block-woocommerce-checkout .wc-block-components-express-payment-continue-rule::before,
.wp-block-woocommerce-checkout .wc-block-components-express-payment-continue-rule::after {
  border-color: var(--bw-border-light) !important;
}

/* ---- Notices ---- */
.woocommerce-checkout .wc-block-components-notice-banner {
  background: var(--bw-paper) !important;
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius) !important;
  border-left: 4px solid var(--bw-accent) !important;
  padding: 1rem 1.25rem !important;
  margin-bottom: 1.5rem !important;
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.85);
  box-shadow: var(--bw-shadow-xs);
}

.woocommerce-checkout .wc-block-components-notice-banner.is-error {
  border-left-color: #c44 !important;
}

.woocommerce-checkout .wc-block-components-notice-banner .wc-block-components-notice-banner__content {
  color: rgba(255, 255, 255, 0.85);
}

/* ---- Address Card (saved addresses) ---- */
.wp-block-woocommerce-checkout .wc-block-components-address-card {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius-sm) !important;
  padding: 1rem !important;
  background: var(--bw-paper);
}

.wp-block-woocommerce-checkout .wc-block-components-address-card__edit {
  color: var(--bw-accent) !important;
  font-weight: 600;
}

.wp-block-woocommerce-checkout .wc-block-components-address-card address {
  font-size: 0.875rem;
  color: var(--bw-text-secondary);
}

.wp-block-woocommerce-checkout .wc-block-components-address-card__address-section--primary {
  color: var(--bw-text) !important;
}

/* ---- Shipping no-results message ---- */
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control__no-shipping-address-message {
  background: var(--bw-bg-warm) !important;
  border-radius: var(--bw-radius-sm) !important;
  color: var(--bw-muted) !important;
  font-size: 0.875rem;
}

/* ---- Autocomplete suggestions ---- */
.wp-block-woocommerce-checkout .wc-block-components-address-autocomplete-suggestions {
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius-sm) !important;
  box-shadow: var(--bw-shadow-sm) !important;
  background: var(--bw-paper) !important;
}

.wp-block-woocommerce-checkout .wc-block-components-address-autocomplete-suggestions .suggestions-list li:hover,
.wp-block-woocommerce-checkout .wc-block-components-address-autocomplete-suggestions .suggestions-list li.active {
  background-color: var(--bw-accent) !important;
  color: #fff !important;
}

/* ---- Sale badge ---- */
.wc-block-checkout__sidebar .wc-block-components-sale-badge {
  background: var(--bw-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}


/* ========================================================================
   ORDER CONFIRMATION PAGE
   ======================================================================== */

.woocommerce-order-received .bw-content {
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(3rem, 6vw, 6rem);
  background: var(--bw-bg);
  min-height: 60vh;
}

.woocommerce-order-received .entry-content {
  max-width: var(--bw-container);
  margin: 0 auto;
}

/* ---- Status Banner ---- */
.wc-block-order-confirmation-status {
  text-align: center;
  margin-top: 0 !important;
  margin-bottom: 2rem !important;
  padding: clamp(1.5rem, 3vw, 2.5rem) !important;
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
}

.wc-block-order-confirmation-status h1,
.wc-block-order-confirmation-status h2,
.wc-block-order-confirmation-status h3 {
  font-size: clamp(1.25rem, 2vw, 1.75rem) !important;
  font-weight: 800 !important;
  color: var(--bw-charcoal);
  margin: 0 0 0.5rem;
}

.wc-block-order-confirmation-status p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  max-width: 520px;
  margin: 0 auto !important;
  line-height: 1.6;
}

.wc-block-order-confirmation-status .wc-block-order-confirmation-status__actions {
  margin-top: 1.25rem !important;
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
}

.wc-block-order-confirmation-status .wc-block-order-confirmation-status__actions a {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--bw-accent);
  text-decoration: none;
  transition: color var(--bw-transition-fast);
  margin: 0 !important;
}

.wc-block-order-confirmation-status .wc-block-order-confirmation-status__actions a:hover {
  color: var(--bw-accent-hover);
  text-decoration: underline;
}

/* ---- Order Summary Strip ---- */
.wc-block-order-confirmation-summary {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
  padding: clamp(1.25rem, 2vw, 1.75rem) !important;
  margin-top: 0 !important;
  margin-bottom: 2rem !important;
}

.wc-block-order-confirmation-summary ul {
  gap: 0 !important;
  margin: 0 !important;
}

.wc-block-order-confirmation-summary ul li {
  flex: 1 1 0;
  text-align: center;
  padding: 0.75rem 1rem;
  position: relative;
}

.wc-block-order-confirmation-summary ul li + li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 20%;
  bottom: 20%;
  width: 1px;
  background: var(--bw-border-light);
}

.wc-block-order-confirmation-summary ul li > .wc-block-order-confirmation-summary-list-item__key {
  display: block !important;
  font-size: 0.6875rem;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  margin-bottom: 0.25rem;
}

.wc-block-order-confirmation-summary ul li > .wc-block-order-confirmation-summary-list-item__value {
  font-size: 0.9375rem;
  font-weight: 700 !important;
  color: var(--bw-charcoal);
}

@media (max-width: 640px) {
  .wc-block-order-confirmation-summary ul {
    flex-direction: column !important;
    gap: 0 !important;
  }

  .wc-block-order-confirmation-summary ul li {
    text-align: left;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--bw-border-light);
  }

  .wc-block-order-confirmation-summary ul li:last-child {
    border-bottom: none;
  }

  .wc-block-order-confirmation-summary ul li + li::before {
    display: none;
  }

  .wc-block-order-confirmation-summary ul li > .wc-block-order-confirmation-summary-list-item__key {
    margin-bottom: 0;
    min-width: 100px;
  }
}

/* ---- Order Totals Table ---- */
.wc-block-order-confirmation-totals {
  margin-top: 0 !important;
  margin-bottom: 2rem !important;
}

.wc-block-order-confirmation-totals table {
  width: 100%;
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius-lg) !important;
  box-shadow: var(--bw-shadow-xs);
  overflow: hidden;
  background: var(--bw-paper);
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.wc-block-order-confirmation-totals table thead {
  background: var(--bw-bg);
}

.wc-block-order-confirmation-totals table thead th {
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  padding: 0.875rem 1.25rem !important;
  border-bottom: 1px solid var(--bw-border-light);
  border-top: none !important;
}

.wc-block-order-confirmation-totals table td,
.wc-block-order-confirmation-totals table tbody th {
  padding: 1rem 1.25rem !important;
  font-size: 0.9375rem;
  color: var(--bw-text);
  border-color: var(--bw-border-light) !important;
}

.wc-block-order-confirmation-totals table tbody td:first-child {
  font-weight: 600;
  color: var(--bw-charcoal);
}

.wc-block-order-confirmation-totals table .product-name a {
  color: var(--bw-charcoal);
  text-decoration: none;
  font-weight: 600;
  transition: color var(--bw-transition-fast);
}

.wc-block-order-confirmation-totals table .product-name a:hover {
  color: var(--bw-accent);
}

.wc-block-order-confirmation-totals table .product-name .product-quantity,
.wc-block-order-confirmation-totals table .wc-item-meta {
  color: var(--bw-muted);
  font-weight: 400;
}

.wc-block-order-confirmation-totals table tfoot th {
  font-weight: 600 !important;
  color: var(--bw-text-secondary);
  padding: 0.875rem 1.25rem !important;
}

.wc-block-order-confirmation-totals table tfoot td {
  font-weight: 600;
  color: var(--bw-charcoal);
  padding: 0.875rem 1.25rem !important;
}

.wc-block-order-confirmation-totals table tfoot tr:last-child th,
.wc-block-order-confirmation-totals table tfoot tr:last-child td {
  font-size: 1.0625rem !important;
  font-weight: 800 !important;
  color: var(--bw-charcoal);
  border-top: 2px solid var(--bw-border) !important;
  padding-top: 1.125rem !important;
  padding-bottom: 1.125rem !important;
}

.wc-block-order-confirmation-totals table .wc-block-order-confirmation-totals__note,
.wc-block-order-confirmation-totals table .wc-block-order-confirmation-totals__total {
  text-align: right;
}

/* ---- Address Cards ---- */
.wc-block-order-confirmation-address-wrapper,
.woocommerce-order-confirmation-address-wrapper {
  margin-block-start: 0 !important;
  margin-bottom: 2rem;
}

.wc-block-order-confirmation-address-wrapper .wp-block-heading,
.wc-block-order-confirmation-billing-wrapper .wp-block-heading,
.wc-block-order-confirmation-shipping-wrapper .wp-block-heading {
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  color: var(--bw-charcoal);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.75rem !important;
}

.wc-block-order-confirmation-shipping-address,
.wc-block-order-confirmation-billing-address {
  background: var(--bw-paper) !important;
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius) !important;
  box-shadow: var(--bw-shadow-xs);
  padding: 1.25rem !important;
}

.wc-block-order-confirmation-shipping-address address,
.wc-block-order-confirmation-billing-address address,
.wc-block-order-confirmation-shipping-address p,
.wc-block-order-confirmation-billing-address p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.7;
}

.wc-block-order-confirmation-shipping-address p strong,
.wc-block-order-confirmation-billing-address p strong {
  color: var(--bw-text);
}

.wc-block-order-confirmation-shipping-address .woocommerce-customer-details--phone,
.wc-block-order-confirmation-billing-address .woocommerce-customer-details--phone,
.wc-block-order-confirmation-billing-address .woocommerce-customer-details--email {
  margin-top: 0.75rem !important;
  padding-top: 0.75rem;
  border-top: 1px solid var(--bw-border-light);
  font-weight: 600;
  color: var(--bw-text);
}

/* ---- Order Note ---- */
.wc-block-order-confirmation-order-note {
  background: var(--bw-bg-warm) !important;
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius) !important;
  padding: 1.25rem !important;
  margin-top: 1.5rem !important;
}

.wc-block-order-confirmation-order-note .wc-block-order-confirmation-order-note__label {
  color: var(--bw-text) !important;
  font-size: 0.8125rem;
}

.wc-block-order-confirmation-order-note p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.7;
}

/* ---- Downloads Table ---- */
.wc-block-order-confirmation-downloads {
  margin-top: 0 !important;
  margin-bottom: 2rem !important;
}

.wc-block-order-confirmation-downloads table {
  width: 100%;
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius-lg) !important;
  box-shadow: var(--bw-shadow-xs);
  overflow: hidden;
  background: var(--bw-paper);
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.wc-block-order-confirmation-downloads table thead {
  background: var(--bw-bg);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
}

.wc-block-order-confirmation-downloads table thead th {
  padding: 0.875rem 1.25rem !important;
  font-weight: 700 !important;
  color: var(--bw-muted);
}

.wc-block-order-confirmation-downloads table td {
  padding: 1rem 1.25rem !important;
  font-size: 0.9375rem;
  color: var(--bw-text);
  border-color: var(--bw-border-light) !important;
}

.wc-block-order-confirmation-downloads table a {
  color: var(--bw-accent);
  font-weight: 600;
  text-decoration: none;
}

.wc-block-order-confirmation-downloads table a:hover {
  text-decoration: underline;
}

/* ---- Create Account Section ---- */
.wc-block-order-confirmation-create-account {
  background: var(--bw-bg-warm) !important;
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg) !important;
  padding: clamp(1.5rem, 3vw, 2.5rem) !important;
  margin-top: 2rem !important;
  margin-bottom: 2rem !important;
}

.wc-block-order-confirmation-create-account h2,
.wc-block-order-confirmation-create-account h3 {
  font-size: 1.125rem !important;
  font-weight: 700 !important;
  color: var(--bw-charcoal);
}

.wc-block-order-confirmation-create-account p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.6;
}

.wc-block-order-confirmation-create-account form .wc-block-components-text-input input {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius-sm) !important;
  font-family: var(--bw-font);
  color: var(--bw-text);
}

.wc-block-order-confirmation-create-account form .wc-block-components-text-input input:focus {
  border-color: var(--bw-accent) !important;
}

.wc-block-order-confirmation-create-account form .wc-block-components-button {
  background: #C46754 !important;
  color: #fff !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: var(--bw-radius-sm) !important;
  transition: background var(--bw-transition-fast), box-shadow var(--bw-transition-fast);
}

.wc-block-order-confirmation-create-account form .wc-block-components-button:hover {
  background: #b05a48 !important;
  box-shadow: var(--bw-shadow-accent);
}

.wc-block-order-confirmation-create-account form .wc-block-components-button:focus {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #C46754 !important;
}

/* ---- Verify Email (guest orders) ---- */
.wc-block-order-confirmation-status-description .woocommerce-verify-email {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  padding: 1.5rem;
  margin-top: 2rem !important;
}

.wc-block-order-confirmation-status-description .woocommerce-verify-email #verify-email {
  border: 2px solid var(--bw-border) !important;
  border-radius: var(--bw-radius-sm) !important;
  padding: 0.625rem 0.875rem;
  font-size: 0.9375rem;
  color: var(--bw-text);
  transition: border-color var(--bw-transition-fast);
}

.wc-block-order-confirmation-status-description .woocommerce-verify-email #verify-email:focus {
  border-color: var(--bw-accent) !important;
  outline: none;
}

.wc-block-order-confirmation-status-description .woocommerce-verify-email button,
.wc-block-order-confirmation-status-description .woocommerce-verify-email input[type="submit"] {
  background: #C46754 !important;
  color: #fff !important;
  font-weight: 700;
  border: none;
  border-radius: var(--bw-radius-sm);
  padding: 0.625rem 1.5rem;
  cursor: pointer;
  transition: background var(--bw-transition-fast);
}

.wc-block-order-confirmation-status-description .woocommerce-verify-email button:hover,
.wc-block-order-confirmation-status-description .woocommerce-verify-email input[type="submit"]:hover {
  background: #b05a48 !important;
}

/* ---- Notices on order confirmation ---- */
.woocommerce-order-received .wc-block-components-notice-banner {
  background: var(--bw-paper) !important;
  border: 1px solid var(--bw-border-light) !important;
  border-radius: var(--bw-radius) !important;
  border-left: 4px solid var(--bw-accent) !important;
  padding: 1rem 1.25rem !important;
  margin-bottom: 1.5rem !important;
  font-size: 0.9375rem;
  color: var(--bw-text);
  box-shadow: var(--bw-shadow-xs);
}

/* ---- Headings (page-level) ---- */
.woocommerce-order-received .wp-block-woocommerce-order-confirmation-status .wp-block-heading,
.woocommerce-order-received .entry-content > .wp-block-heading {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 1rem;
}

/* ---- Additional fields list ---- */
.wc-block-components-additional-fields-list {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.7;
}

.wc-block-components-additional-fields-list dt {
  color: var(--bw-text);
}


/* ========================================================================
   MY ACCOUNT (Classic Shortcode)
   ======================================================================== */

.woocommerce-account .bw-content {
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(3rem, 6vw, 6rem);
  background: var(--bw-bg);
  min-height: 60vh;
}

.woocommerce-account .entry-content {
  max-width: var(--bw-container);
  margin: 0 auto;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* ---- Force the page wrapper to use full width on the account page
       (page.php uses .bw-container--narrow which is too tight for the dashboard) ---- */
.woocommerce-account .bw-content > .bw-container--narrow {
  width: var(--bw-container);
  max-width: var(--bw-container);
}

/* ---- Layout: My Account dashboard (logged in: nav + content) ----
   Use :has() so the rule fires whenever the WC navigation is present,
   regardless of body classes. WC outputs: notices-wrapper, nav, content —
   so we use grid-template-areas to force the correct placement. ---- */
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  grid-template-areas:
    "notices notices"
    "nav     content";
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) > .woocommerce-notices-wrapper {
  grid-area: notices;
  margin: 0;
}
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) > .woocommerce-notices-wrapper:empty {
  display: none;
}
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) > .woocommerce-MyAccount-navigation {
  grid-area: nav;
}
.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) > .woocommerce-MyAccount-content {
  grid-area: content;
}

/* ---- Layout: Login / Register / Reset password (no nav present) ---- */
.woocommerce-account .woocommerce:has(#customer_login),
.woocommerce-account .woocommerce:has(.woocommerce-ResetPassword) {
  display: block !important;
  grid-template-columns: none !important;
  max-width: 480px;
  margin: 0 auto !important;
  padding: 0 !important;
  width: 100%;
}

/* ---- Navigation Sidebar ---- */
.woocommerce-MyAccount-navigation {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
  overflow: hidden;
  position: sticky;
  top: 100px;
  /* Override WooCommerce's default float / 30% width */
  width: auto !important;
  float: none !important;
  margin: 0 !important;
}

/* Override WooCommerce's default float / 68% width on the content area */
.woocommerce-MyAccount-content {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  min-width: 0;
}

.woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0.5rem 0;
}

.woocommerce-MyAccount-navigation ul li {
  margin: 0;
  padding: 0;
}

.woocommerce-MyAccount-navigation ul li a {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.75rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--bw-text-secondary);
  text-decoration: none;
  transition: background var(--bw-transition-fast), color var(--bw-transition-fast);
  border-left: 3px solid transparent;
}

.woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--bw-accent-soft);
  color: var(--bw-accent);
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--dashboard.is-active a {
  background: var(--bw-accent-soft);
  color: var(--bw-accent);
  font-weight: 700;
  border-left-color: var(--bw-accent);
}

/* Nav icons via ::before (add visual weight to items) */
.woocommerce-MyAccount-navigation ul li a::before {
  content: "";
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  opacity: 0.5;
  background: currentColor;
  border-radius: 4px;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
}

.woocommerce-MyAccount-navigation-link--dashboard a::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m2.25 12 8.954-8.955a1.126 1.126 0 0 1 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m2.25 12 8.954-8.955a1.126 1.126 0 0 1 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--orders a::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 10.5V6a3.75 3.75 0 1 0-7.5 0v4.5m11.356-1.993 1.263 12c.07.665-.45 1.243-1.119 1.243H4.25a1.125 1.125 0 0 1-1.12-1.243l1.264-12A1.125 1.125 0 0 1 5.513 7.5h12.974c.576 0 1.059.435 1.119 1.007ZM8.625 10.5a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm7.5 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 10.5V6a3.75 3.75 0 1 0-7.5 0v4.5m11.356-1.993 1.263 12c.07.665-.45 1.243-1.119 1.243H4.25a1.125 1.125 0 0 1-1.12-1.243l1.264-12A1.125 1.125 0 0 1 5.513 7.5h12.974c.576 0 1.059.435 1.119 1.007ZM8.625 10.5a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm7.5 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Z'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--downloads a::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-address a::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25S4.5 17.642 4.5 10.5a7.5 7.5 0 1 1 15 0Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15 10.5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25S4.5 17.642 4.5 10.5a7.5 7.5 0 1 1 15 0Z'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-account a::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--customer-logout a::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15m3 0 3-3m0 0-3-3m3 3H9'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15m3 0 3-3m0 0-3-3m3 3H9'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--payment-methods a::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M2.25 8.25h19.5M2.25 9h19.5m-16.5 5.25h6m-6 2.25h3m-3.75 3h15a2.25 2.25 0 0 0 2.25-2.25V6.75A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25v10.5A2.25 2.25 0 0 0 4.5 19.5Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M2.25 8.25h19.5M2.25 9h19.5m-16.5 5.25h6m-6 2.25h3m-3.75 3h15a2.25 2.25 0 0 0 2.25-2.25V6.75A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25v10.5A2.25 2.25 0 0 0 4.5 19.5Z'/%3E%3C/svg%3E");
}

/* ---- Main Content Area ---- */
.woocommerce-MyAccount-content {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-xs);
  padding: clamp(1.5rem, 2.5vw, 2.5rem);
}

.woocommerce-MyAccount-content > p:first-child {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.7;
}

.woocommerce-MyAccount-content > p a {
  color: var(--bw-accent);
  font-weight: 600;
  text-decoration: none;
}

.woocommerce-MyAccount-content > p a:hover {
  text-decoration: underline;
}

.woocommerce-MyAccount-content > h2,
.woocommerce-MyAccount-content > h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin: 0 0 1rem;
}

/* ---- Orders Table ---- */
.woocommerce-orders-table {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0;
  font-size: 0.9375rem;
}

.woocommerce-orders-table thead th {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  padding: 0.75rem 1rem;
  border-bottom: 2px solid var(--bw-border-light);
  text-align: left;
  white-space: nowrap;
  background: var(--bw-bg);
}

.woocommerce-orders-table tbody td,
.woocommerce-orders-table tbody th {
  padding: 0.875rem 1rem;
  border-bottom: 1px solid var(--bw-border-light);
  vertical-align: middle;
  color: var(--bw-text);
}

.woocommerce-orders-table tbody tr:last-child td,
.woocommerce-orders-table tbody tr:last-child th {
  border-bottom: none;
}

.woocommerce-orders-table tbody th a {
  color: var(--bw-accent);
  font-weight: 700;
  text-decoration: none;
}

.woocommerce-orders-table tbody th a:hover {
  text-decoration: underline;
}

.woocommerce-orders-table .woocommerce-orders-table__cell-order-actions a.button {
  display: inline-flex;
  align-items: center;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-accent);
  background: transparent;
  border: 1.5px solid var(--bw-accent);
  border-radius: var(--bw-radius-sm);
  padding: 0.375rem 0.875rem;
  text-decoration: none;
  transition: background var(--bw-transition-fast), color var(--bw-transition-fast);
  white-space: nowrap;
  margin: 0.125rem;
}

.woocommerce-orders-table .woocommerce-orders-table__cell-order-actions a.button:hover {
  background: var(--bw-accent);
  color: #fff;
}

/* ---- View Order Detail ---- */
.woocommerce-MyAccount-content .woocommerce-order-details,
.woocommerce-MyAccount-content .woocommerce-customer-details {
  margin-top: 1.5rem;
}

.woocommerce-MyAccount-content .order_details,
.woocommerce-MyAccount-content .shop_table {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0;
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  overflow: hidden;
  font-size: 0.9375rem;
}

.woocommerce-MyAccount-content .order_details thead,
.woocommerce-MyAccount-content .shop_table thead {
  background: var(--bw-bg);
}

.woocommerce-MyAccount-content .order_details thead th,
.woocommerce-MyAccount-content .shop_table thead th {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--bw-border-light);
  text-align: left;
}

.woocommerce-MyAccount-content .order_details tbody td,
.woocommerce-MyAccount-content .shop_table tbody td,
.woocommerce-MyAccount-content .order_details tfoot th,
.woocommerce-MyAccount-content .order_details tfoot td,
.woocommerce-MyAccount-content .shop_table tfoot th,
.woocommerce-MyAccount-content .shop_table tfoot td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--bw-border-light);
  color: var(--bw-text);
}

.woocommerce-MyAccount-content .order_details tbody tr:last-child td,
.woocommerce-MyAccount-content .shop_table tbody tr:last-child td {
  border-bottom: 1px solid var(--bw-border-light);
}

.woocommerce-MyAccount-content .order_details tfoot tr:last-child th,
.woocommerce-MyAccount-content .order_details tfoot tr:last-child td {
  font-weight: 800;
  color: var(--bw-charcoal);
  border-top: 2px solid var(--bw-border);
  border-bottom: none;
}

.woocommerce-MyAccount-content .order_details a,
.woocommerce-MyAccount-content .shop_table a {
  color: var(--bw-accent);
  text-decoration: none;
}

.woocommerce-MyAccount-content .order_details a:hover,
.woocommerce-MyAccount-content .shop_table a:hover {
  text-decoration: underline;
}

/* ---- Addresses ---- */
.woocommerce-Addresses {
  display: flex !important;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-top: 1rem;
  width: 100% !important;
  float: none !important;
  clear: both;
}

/* WooCommerce's default layout.css adds ::before and ::after pseudo-elements
   to .col2-set with `content: " "; display: table` (a clearfix). In a flex
   container those become invisible flex items and push the real cards onto
   new rows. Kill them. */
.woocommerce-Addresses::before,
.woocommerce-Addresses::after {
  content: none !important;
  display: none !important;
}

/* Neutralise WooCommerce's default float/48%-width on .col-1/.col-2,
   and force each address to take up exactly half the row (minus the gap) */
.woocommerce-Addresses > .woocommerce-Address,
.woocommerce-Addresses > .col-1,
.woocommerce-Addresses > .col-2,
.woocommerce-Addresses > .u-column1,
.woocommerce-Addresses > .u-column2 {
  flex: 1 1 calc(50% - 0.75rem);
  width: calc(50% - 0.75rem) !important;
  max-width: calc(50% - 0.75rem) !important;
  float: none !important;
  margin: 0 !important;
  min-width: 0;
  box-sizing: border-box;
}

/* Order: Shipping on the left, Billing on the right.
   WC outputs Billing first (.u-column1) and Shipping second (.u-column2). */
.woocommerce-Addresses > .u-column1,
.woocommerce-Addresses > .col-1 {
  order: 2;
}
.woocommerce-Addresses > .u-column2,
.woocommerce-Addresses > .col-2 {
  order: 1;
}

@media (max-width: 640px) {
  .woocommerce-Addresses > .woocommerce-Address,
  .woocommerce-Addresses > .col-1,
  .woocommerce-Addresses > .col-2,
  .woocommerce-Addresses > .u-column1,
  .woocommerce-Addresses > .u-column2 {
    flex: 1 1 100%;
    width: 100% !important;
    max-width: 100% !important;
  }
}

.woocommerce-Addresses .woocommerce-Address {
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  padding: 1.5rem;
  background: var(--bw-bg);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
}

.woocommerce-Addresses .woocommerce-Address header,
.woocommerce-Addresses .woocommerce-Address .woocommerce-Address-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0;
  padding-bottom: 0.875rem;
  border-bottom: 1px solid var(--bw-border-light);
}

.woocommerce-Addresses .woocommerce-Address header h3,
.woocommerce-Addresses .woocommerce-Address-title h3 {
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #fff;
  margin: 0;
  line-height: 1.3;
  white-space: nowrap;
}

.woocommerce-Addresses .woocommerce-Address header a,
.woocommerce-Addresses .woocommerce-Address-title a {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--bw-accent);
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  padding: 0.375rem 0.75rem;
  border: 1px solid var(--bw-accent);
  border-radius: var(--bw-radius-sm);
  transition: background var(--bw-transition-fast), color var(--bw-transition-fast);
}

.woocommerce-Addresses .woocommerce-Address header a:hover,
.woocommerce-Addresses .woocommerce-Address-title a:hover {
  background: var(--bw-accent);
  color: #fff;
  text-decoration: none;
}

.woocommerce-Addresses .woocommerce-Address address {
  font-style: normal;
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.7;
  margin: 0;
}

/* ---- Edit Address / Account Forms ---- */
.woocommerce-MyAccount-content .woocommerce-address-fields,
.woocommerce-MyAccount-content .woocommerce-EditAccountForm {
  max-width: 560px;
}

.woocommerce-MyAccount-content .form-row {
  margin-bottom: 1rem;
}

.woocommerce-MyAccount-content .form-row label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-text);
  margin-bottom: 0.375rem;
}

.woocommerce-MyAccount-content .form-row label .required {
  color: var(--bw-accent);
}

.woocommerce-MyAccount-content .form-row input[type="text"],
.woocommerce-MyAccount-content .form-row input[type="email"],
.woocommerce-MyAccount-content .form-row input[type="tel"],
.woocommerce-MyAccount-content .form-row input[type="password"],
.woocommerce-MyAccount-content .form-row select,
.woocommerce-MyAccount-content .form-row textarea {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 2px solid var(--bw-border);
  border-radius: var(--bw-radius-sm);
  font-size: 0.9375rem;
  font-family: var(--bw-font);
  color: var(--bw-text);
  background: var(--bw-paper);
  transition: border-color var(--bw-transition-fast);
  box-sizing: border-box;
}

.woocommerce-MyAccount-content .form-row input:focus,
.woocommerce-MyAccount-content .form-row select:focus,
.woocommerce-MyAccount-content .form-row textarea:focus {
  border-color: var(--bw-accent);
  outline: none;
}

.woocommerce-MyAccount-content .form-row .select2-container--default .select2-selection--single {
  border: 2px solid var(--bw-border);
  border-radius: var(--bw-radius-sm);
  height: auto;
  padding: 0.5rem 0.875rem;
}

.woocommerce-MyAccount-content button[type="submit"],
.woocommerce-MyAccount-content input[type="submit"],
.woocommerce-MyAccount-content .button:not(.wc-forward) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #C46754;
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 700;
  padding: 0.75rem 2rem;
  border: none;
  border-radius: var(--bw-radius-sm);
  cursor: pointer;
  letter-spacing: 0.01em;
  transition: background var(--bw-transition-fast), box-shadow var(--bw-transition-fast), transform var(--bw-transition-fast);
}

.woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce-MyAccount-content input[type="submit"]:hover,
.woocommerce-MyAccount-content .button:not(.wc-forward):hover {
  background: #b05a48;
  box-shadow: var(--bw-shadow-accent);
  transform: translateY(-1px);
}

.woocommerce-MyAccount-content button[type="submit"]:active,
.woocommerce-MyAccount-content input[type="submit"]:active {
  transform: translateY(0);
}

/* Fieldset legend */
.woocommerce-MyAccount-content fieldset {
  border: none;
  padding: 0;
  margin: 1.5rem 0 0;
}

.woocommerce-MyAccount-content fieldset legend {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--bw-border-light);
  width: 100%;
}

/* ---- Pagination ---- */
.woocommerce-MyAccount-content .woocommerce-pagination {
  display: flex;
  gap: 0.5rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bw-border-light);
}

.woocommerce-MyAccount-content .woocommerce-pagination a.button {
  font-size: 0.8125rem;
  padding: 0.5rem 1rem;
  background: var(--bw-bg);
  color: var(--bw-text);
  border: 1.5px solid var(--bw-border);
}

.woocommerce-MyAccount-content .woocommerce-pagination a.button:hover {
  border-color: var(--bw-accent);
  color: var(--bw-accent);
  background: var(--bw-accent-soft);
  box-shadow: none;
  transform: none;
}

/* ---- Notices ---- */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info,
.woocommerce-account .woocommerce-error,
.woocommerce-account .woocommerce-notice {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  padding: 1rem 1.25rem 1rem 3rem;
  margin-bottom: 1.5rem;
  font-size: 0.9375rem;
  color: var(--bw-text);
  box-shadow: var(--bw-shadow-xs);
  border-left: 4px solid var(--bw-accent);
  list-style: none;
  grid-column: 1 / -1;
  position: relative;
}

/* Re-position the WooCommerce icon (::before) so it doesn't overlap the text */
.woocommerce-account .woocommerce-message::before,
.woocommerce-account .woocommerce-info::before,
.woocommerce-account .woocommerce-error::before,
.woocommerce-account .woocommerce-notice::before {
  position: absolute !important;
  top: 50% !important;
  left: 1rem !important;
  transform: translateY(-50%);
  display: inline-block !important;
  line-height: 1;
  font-size: 1rem;
}

.woocommerce-account .woocommerce-error {
  border-left-color: #c44;
}

.woocommerce-account .woocommerce-message a,
.woocommerce-account .woocommerce-info a,
.woocommerce-account .woocommerce-notice a {
  color: var(--bw-accent);
  font-weight: 600;
  text-decoration: none;
}

.woocommerce-account .woocommerce-message a:hover,
.woocommerce-account .woocommerce-info a:hover,
.woocommerce-account .woocommerce-notice a:hover {
  text-decoration: underline;
}

.woocommerce-account .woocommerce-message .button.wc-forward,
.woocommerce-account .woocommerce-info .button.wc-forward,
.woocommerce-account .woocommerce-notice .button.wc-forward {
  background: transparent;
  color: var(--bw-accent);
  border: none;
  padding: 0;
  font-size: inherit;
  font-weight: 600;
  box-shadow: none;
  transform: none;
}

.woocommerce-account .woocommerce-message .button.wc-forward:hover,
.woocommerce-account .woocommerce-notice .button.wc-forward:hover {
  text-decoration: underline;
  background: transparent;
  box-shadow: none;
  transform: none;
}

/* ========================================================================
   LOGIN / REGISTER / LOST PASSWORD — FULL REDESIGN
   ======================================================================== */

/* Page-level centering for logged-out state */
.woocommerce-account:not(.logged-in) .bw-content {
  min-height: 70vh;
  display: flex;
  align-items: center;
}

.woocommerce-account:not(.logged-in) .bw-container {
  width: 100%;
}

.woocommerce-account:not(.logged-in) .entry-content {
  width: 100%;
}

.woocommerce-account:not(.logged-in) .woocommerce {
  display: block;
  max-width: 860px;
  margin: 0 auto;
  padding: 2rem 0;
}

/* WooCommerce notices on login pages */
.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper .woocommerce-info {
  max-width: 860px;
  margin: 0 auto 1.5rem;
  padding: 0.875rem 1.25rem;
  border-radius: var(--bw-radius);
  font-size: 0.875rem;
}

/* ---- Login + Register layout ---- */
/* We toggle between login and register via JS, so they never appear together.
   Use a single-column flex layout so the visible card always takes full width. */
.woocommerce-account #customer_login {
  display: block !important;
  position: relative;
  max-width: 480px;
  width: 100%;
  margin: 0 auto !important;
  padding: 0 !important;
  float: none !important;
}

.woocommerce-account #customer_login > .u-column1,
.woocommerce-account #customer_login > .u-column2 {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-account #customer_login > div {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  position: relative;
  box-sizing: border-box;
}

/* Strip the inner WooCommerce form border/background so the form sits flat on the page */
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register,
.woocommerce-account .woocommerce-ResetPassword {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Form headings — centered above each card */
.woocommerce-account #customer_login h2 {
  font-size: 1.5rem;
  font-weight: 800;
  color: #fff;
  margin: 0 0 1.5rem;
  padding: 0 0 1rem;
  border-bottom: none;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: center;
  position: relative;
}

.woocommerce-account #customer_login h2::after,
.woocommerce-account .bw-reset-heading::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: var(--bw-accent);
  margin: 1rem auto 0;
  border-radius: 2px;
}

/* Reset Password heading (mirrors login/register heading style) */
.woocommerce-account .bw-reset-heading {
  font-size: 1.5rem;
  font-weight: 800;
  color: #fff;
  margin: 0 auto 1.5rem;
  padding: 0 0 1rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: center;
  position: relative;
  max-width: 440px;
}

/* Register toggle link below login form */
.bw-register-toggle {
  display: block;
  text-align: center;
  margin-top: 2rem;
  padding-top: 0;
  border-top: none;
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.6);
}

.bw-register-toggle a {
  color: var(--bw-accent);
  font-weight: 700;
  text-decoration: none;
  margin-left: 0.375rem;
  transition: color 0.2s ease;
}

.bw-register-toggle a:hover {
  color: var(--bw-accent-hover);
  text-decoration: underline;
}

/* Hide the inline register column (we use toggle behaviour instead) */
.woocommerce-account #customer_login > .u-column2 {
  display: none;
}

.woocommerce-account #customer_login.bw-show-register > .u-column1 {
  display: none;
}

.woocommerce-account #customer_login.bw-show-register > .u-column2 {
  display: block;
}


/* Form rows */
.woocommerce-account #customer_login .form-row,
.woocommerce-account .woocommerce-form .form-row {
  margin-bottom: 1rem;
}

.woocommerce-account #customer_login .form-row label,
.woocommerce-account .woocommerce-form .form-row > label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 0.375rem;
  letter-spacing: 0.01em;
}

.woocommerce-account #customer_login .form-row label .required,
.woocommerce-account .woocommerce-form .form-row label .required {
  color: var(--bw-accent);
}

/* Inputs */
.woocommerce-account #customer_login .form-row input[type="text"],
.woocommerce-account #customer_login .form-row input[type="email"],
.woocommerce-account #customer_login .form-row input[type="password"],
.woocommerce-account .woocommerce-form .form-row input[type="text"],
.woocommerce-account .woocommerce-form .form-row input[type="email"],
.woocommerce-account .woocommerce-form .form-row input[type="password"],
.woocommerce-account .woocommerce-ResetPassword .form-row input[type="text"],
.woocommerce-account .woocommerce-ResetPassword .form-row input[type="password"] {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 2px solid var(--bw-border);
  border-radius: var(--bw-radius);
  font-size: 0.9375rem;
  font-family: var(--bw-font);
  color: #fff;
  background: var(--bw-bg);
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  box-sizing: border-box;
}

.woocommerce-account #customer_login .form-row input:focus,
.woocommerce-account .woocommerce-form .form-row input:focus,
.woocommerce-account .woocommerce-ResetPassword .form-row input:focus {
  border-color: var(--bw-accent);
  background: var(--bw-paper);
  outline: none;
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1);
}

.woocommerce-account #customer_login .form-row input::placeholder,
.woocommerce-account .woocommerce-form .form-row input::placeholder {
  color: var(--bw-muted);
  opacity: 0.6;
}

/* Submit buttons */
.woocommerce-account #customer_login button[type="submit"],
.woocommerce-account #customer_login .button,
.woocommerce-account .woocommerce-form button[type="submit"],
.woocommerce-account .woocommerce-form .button,
.woocommerce-account .woocommerce-ResetPassword button[type="submit"],
.woocommerce-account .woocommerce-ResetPassword .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  background: #C46754;
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 700;
  font-family: var(--bw-font);
  padding: 0.8125rem 1.5rem;
  border: none;
  border-radius: var(--bw-radius);
  cursor: pointer;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
  margin-top: 0.5rem;
  letter-spacing: 0.01em;
}

.woocommerce-account #customer_login button[type="submit"]:hover,
.woocommerce-account #customer_login .button:hover,
.woocommerce-account .woocommerce-form button[type="submit"]:hover,
.woocommerce-account .woocommerce-form .button:hover,
.woocommerce-account .woocommerce-ResetPassword button[type="submit"]:hover,
.woocommerce-account .woocommerce-ResetPassword .button:hover {
  background: #b05a48;
  box-shadow: var(--bw-shadow-accent);
  transform: translateY(-1px);
}

.woocommerce-account #customer_login button[type="submit"]:active,
.woocommerce-account .woocommerce-form button[type="submit"]:active,
.woocommerce-account .woocommerce-ResetPassword button[type="submit"]:active {
  transform: translateY(0);
}

/* Remember me checkbox */
.woocommerce-account .woocommerce-form-login__rememberme {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 0.75rem;
  cursor: pointer;
}

.woocommerce-account .woocommerce-form-login__rememberme input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--bw-accent);
  cursor: pointer;
  border-radius: 3px;
}

/* Lost password link */
.woocommerce-account .lost_password {
  margin-top: 1rem;
  text-align: center;
}

.woocommerce-account .lost_password a {
  font-size: 0.8125rem;
  color: var(--bw-muted);
  text-decoration: none;
  transition: color 0.2s ease;
  position: relative;
}

.woocommerce-account .lost_password a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  background: var(--bw-accent);
  transform: scaleX(0);
  transition: transform 0.2s ease;
  transform-origin: right;
}

.woocommerce-account .lost_password a:hover {
  color: var(--bw-accent);
}

.woocommerce-account .lost_password a:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* Auto-generated password notice in register column */
.woocommerce-account #customer_login .u-column2 .woocommerce-form-register > p:not(.form-row):not(.woocommerce-form-row) {
  font-size: 0.8125rem;
  color: var(--bw-muted);
  background: var(--bw-bg);
  padding: 0.75rem 1rem;
  border-radius: var(--bw-radius);
  border-left: 3px solid var(--bw-accent);
  line-height: 1.5;
  margin-bottom: 1rem;
}

/* ---- Single login form (no registration enabled) ---- */
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-form-login {
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  max-width: 440px;
  margin: 0 auto;
}

.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-form-login h2 {
  text-align: center;
}

/* ---- Lost Password / Reset Password Form ---- */
.woocommerce-account .woocommerce-ResetPassword,
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-form-login,
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-form-register {
  max-width: 440px;
  margin-left: auto;
  margin-right: auto;
}

.woocommerce-account .woocommerce-ResetPassword {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-sm);
  padding: 2.5rem 2rem;
}

.woocommerce-account .woocommerce-ResetPassword > p:first-of-type {
  font-size: 0.875rem;
  color: var(--bw-text-secondary);
  line-height: 1.6;
  margin-bottom: 1.5rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--bw-border-light);
}

.woocommerce-account .woocommerce-ResetPassword .form-row,
.woocommerce-account #customer_login .form-row,
.woocommerce-account .woocommerce-form .form-row {
  margin-bottom: 1rem;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  clear: both;
}

.woocommerce-account .woocommerce-ResetPassword .form-row label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-text);
  margin-bottom: 0.375rem;
}

.woocommerce-account .woocommerce-ResetPassword .form-row label .required {
  color: var(--bw-accent);
}

.woocommerce-account .woocommerce-ResetPassword .clear {
  display: none;
}

/* ---- Responsive: My Account ---- */
@media (max-width: 840px) {
  /* Override the desktop :has() grid (240px + 1fr) so on mobile the nav stacks
     above the content full-width. Same selector specificity needed to win. */
  .woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
    grid-template-columns: 1fr;
    grid-template-areas:
      "notices"
      "nav"
      "content";
    gap: 1.25rem;
  }

  .woocommerce-MyAccount-navigation {
    position: static;
    width: 100% !important;
  }

  /* Horizontal scrolling tab bar — feels native on mobile and hides nothing.
     Each item is a pill so touch targets stay big. */
  .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.4rem;
    padding: 0.5rem;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
  }

  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
    display: none;
  }

  .woocommerce-MyAccount-navigation ul li {
    flex: 0 0 auto;
  }

  .woocommerce-MyAccount-navigation ul li a {
    padding: 0.55rem 0.95rem;
    border-left: none;
    border-radius: 999px;
    font-size: 0.85rem;
    white-space: nowrap;
  }

  .woocommerce-MyAccount-navigation ul li a::before {
    display: none;
  }

  .woocommerce-MyAccount-navigation ul li.is-active a {
    border-left-color: transparent;
    background: var(--bw-accent);
    color: #fff;
  }

  /* Content card needs to be a comfy single column with sensible padding. */
  .woocommerce-MyAccount-content {
    width: 100% !important;
    padding: 1.25rem 1.15rem;
  }

  .woocommerce-Addresses {
    grid-template-columns: 1fr;
  }

  .woocommerce-account #customer_login > div {
    padding: 1.75rem 1.25rem;
  }

  .woocommerce-account .woocommerce-ResetPassword {
    padding: 2rem 1.5rem;
  }
}

@media (max-width: 640px) {
  .woocommerce-orders-table,
  .woocommerce-orders-table thead,
  .woocommerce-orders-table tbody,
  .woocommerce-orders-table tr,
  .woocommerce-orders-table td,
  .woocommerce-orders-table th {
    display: block;
    width: 100%;
  }

  .woocommerce-orders-table thead {
    display: none;
  }

  .woocommerce-orders-table tbody tr {
    padding: 1rem 0;
    border-bottom: 1px solid var(--bw-border-light);
  }

  .woocommerce-orders-table tbody tr:last-child {
    border-bottom: none;
  }

  .woocommerce-orders-table tbody td,
  .woocommerce-orders-table tbody th {
    padding: 0.25rem 0;
    border-bottom: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .woocommerce-orders-table tbody td::before,
  .woocommerce-orders-table tbody th::before {
    content: attr(data-title);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--bw-muted);
    flex-shrink: 0;
    margin-right: 0.75rem;
  }
}


/* ========================================================================
   RESPONSIVE
   ======================================================================== */

@media (max-width: 1080px) {
  .bw-hero-inner {
    grid-template-columns: 1fr;
  }

  .bw-hero-content {
    padding: clamp(3rem, 6vw, 5rem) 1.5rem;
    text-align: center;
    align-items: center;
  }

  .bw-hero-accent-line {
    margin-left: auto;
    margin-right: auto;
  }

  .bw-hero-actions {
    justify-content: center;
  }

  .bw-hero-image {
    min-height: 50vw;
    max-height: 400px;
  }

  .bw-trust-strip-inner {
    grid-template-columns: repeat(2, 1fr);
  }

  .bw-steps-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .bw-trust-grid {
    grid-template-columns: 1fr 1fr;
  }

  .bw-delivery,
  .bw-about {
    grid-template-columns: 1fr;
  }

  /* On mobile, show the brand-story copy above the image. */
  .bw-about .bw-about-content {
    order: 1;
  }
  .bw-about .bw-about-visual {
    order: 2;
  }

  .bw-footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }

  .bw-shop-main .woocommerce ul.products,
  .bw-shop-main ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bw-sp-related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@media (max-width: 840px) {
  .bw-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--bw-bg);
    border-bottom: 1px solid var(--bw-border);
    box-shadow: var(--bw-shadow);
    padding: 0.75rem 1rem;
    z-index: 99;
  }

  .bw-nav.is-open {
    display: block;
  }

  .bw-nav ul {
    flex-direction: column;
    align-items: stretch;
    gap: 0.15rem;
  }

  .bw-nav a {
    min-height: 46px;
    padding: 0.65rem 1rem 0.75rem;
    font-size: 0.95rem;
  }

  .bw-nav a::after {
    left: 1rem;
    right: 1rem;
    bottom: 0.25rem;
  }

  .bw-nav-toggle {
    display: inline-flex;
  }

  .bw-header-actions .bw-btn {
    display: none;
  }

  .bw-carousel-item {
    flex: 0 0 calc(50% - 0.625rem);
    min-width: 220px;
  }

  .bw-faq-grid {
    grid-template-columns: 1fr;
  }

  .bw-sp-layout {
    grid-template-columns: 1fr;
  }

  .bw-sp-gallery {
    position: static;
  }

  .bw-sp-highlights {
    grid-template-columns: 1fr;
  }

  .bw-sp-related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bw-shop-layout {
    grid-template-columns: 1fr;
  }

  /* ----- Off-canvas filters drawer (mobile/tablet) ----- */
  .bw-shop-sidebar {
    position: fixed;
    inset: 0;
    z-index: 9000;
    pointer-events: none;
    visibility: hidden;
    transition: visibility 0s linear 0.32s;
  }

  .bw-shop-sidebar.is-open {
    pointer-events: auto;
    visibility: visible;
    transition: visibility 0s linear 0s;
  }

  .bw-sidebar-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 8, 8, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity 0.28s ease;
    cursor: pointer;
  }

  .bw-shop-sidebar.is-open .bw-sidebar-backdrop {
    opacity: 1;
  }

  /* The drawer panel: pinned to the right, slides in. */
  .bw-shop-sidebar .bw-sidebar-inner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(380px, 88vw);
    max-width: none;
    margin: 0;
    background: var(--bw-bg, #0e0e0e);
    border-left: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: -20px 0 60px rgba(0, 0, 0, 0.55);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    transform: translateX(100%);
    transition: transform 0.32s cubic-bezier(0.2, 0.8, 0.2, 1);
  }

  .bw-shop-sidebar.is-open .bw-sidebar-inner {
    transform: translateX(0);
  }

  /* Sticky drawer header (Filters title + clear + close button). */
  .bw-shop-sidebar .bw-sidebar-header {
    position: sticky;
    top: 0;
    z-index: 2;
    flex-shrink: 0;
    margin: 0;
    padding: 1rem 1.1rem;
    background: rgba(0, 0, 0, 0.5);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
  }

  .bw-sidebar-header-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .bw-sidebar-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: #fff;
    cursor: pointer;
    transition: background 0.18s ease, transform 0.18s ease;
  }

  .bw-sidebar-close:hover,
  .bw-sidebar-close:focus-visible {
    background: rgba(255, 255, 255, 0.14);
    transform: scale(1.04);
    outline: none;
  }

  /* Filter groups + CTA stack with comfortable padding inside the drawer. */
  .bw-shop-sidebar .bw-sidebar-inner > .bw-filter-group,
  .bw-shop-sidebar .bw-sidebar-inner > .bw-sidebar-cta {
    margin: 0;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  }

  .bw-shop-sidebar .bw-sidebar-inner > .bw-sidebar-cta {
    border-bottom: none;
    margin-top: auto;
  }

  /* Sticky bottom action bar inside the drawer ("Show N products"). */
  .bw-shop-sidebar .bw-sidebar-footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    flex-shrink: 0;
    padding: 0.85rem 1.1rem;
    padding-bottom: max(0.85rem, env(safe-area-inset-bottom, 0.85rem));
    background: rgba(0, 0, 0, 0.6);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  .bw-shop-sidebar .bw-sidebar-footer .bw-btn {
    width: 100%;
    justify-content: center;
  }

  /* Lock body scroll while drawer is open. */
  body.bw-shop-filters-open {
    overflow: hidden;
  }

  .bw-filter-toggle {
    display: inline-flex;
  }

  .bw-shop-main .woocommerce ul.products,
  .bw-shop-main ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Hide drawer-only chrome on desktop. */
@media (min-width: 841px) {
  .bw-sidebar-backdrop,
  .bw-sidebar-close,
  .bw-sidebar-footer {
    display: none !important;
  }
}

@media (max-width: 640px) {
  body {
    font-size: 15px;
  }

  :root {
    --bw-container: min(1320px, calc(100% - 1.5rem));
    --bw-container-narrow: min(960px, calc(100% - 1.5rem));
    --bw-container-wide: min(1320px, calc(100% - 1.5rem));
  }

  .bw-section-title,
  .bw-hero h1,
  .bw-contact-hero-title,
  .bw-about-hero-title,
  .bw-faq-hero-title,
  .bw-environmental-hero-title,
  .bw-page-hero-title,
  .bw-shop-hero-title,
  .woocommerce-products-header__title,
  .product_title {
    overflow-wrap: anywhere;
  }

  .bw-btn,
  .button,
  button,
  input[type="button"],
  input[type="submit"] {
    white-space: normal;
  }

  .bw-header-inner,
  .bw-header-actions,
  .bw-hero-actions,
  .bw-carousel-wrap,
  .bw-delivery,
  .bw-about,
  .bw-footer-grid,
  .bw-cta-banner-inner,
  .bw-contact-grid,
  .bw-about-split,
  .bw-about-fact-strip,
  .bw-faq-grid,
  .bw-final-cta-actions,
  .woocommerce,
  .woocommerce-page {
    min-width: 0;
    max-width: 100%;
  }

  /* Trust strip becomes a horizontal scroll-snap carousel on mobile. */
  .bw-trust-strip-inner {
    display: flex;
    grid-template-columns: none;
    gap: 0.75rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* Edge bleed so first/last items can fully snap to the viewport edges. */
    margin: 0 -0.75rem;
    padding: 0.25rem 0.75rem 0.5rem;
    scroll-padding-left: 0.75rem;
  }

  .bw-trust-strip-inner::-webkit-scrollbar {
    display: none;
  }

  .bw-trust-strip-inner .bw-trust-item {
    flex: 0 0 calc(100% - 1.5rem);
    scroll-snap-align: start;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
  }

  .bw-trust-strip-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    margin-top: 1rem;
  }

  .bw-trust-strip-dots button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.25);
    cursor: pointer;
    transition: background 0.18s ease, transform 0.18s ease, width 0.22s ease;
  }

  .bw-trust-strip-dots button.is-active {
    background: var(--bw-accent, #c46754);
    width: 22px;
    border-radius: 4px;
  }

  .bw-trust-strip-dots button:focus-visible {
    outline: 2px solid var(--bw-accent, #c46754);
    outline-offset: 3px;
  }

  .bw-steps-grid {
    grid-template-columns: 1fr 1fr;
    column-gap: 1rem;
    row-gap: 2.25rem;
    padding-top: 2rem;
  }

  .bw-step-card {
    padding: 2rem 1rem 1.75rem;
  }

  .bw-trust-grid {
    grid-template-columns: 1fr;
  }

  .bw-carousel-item {
    flex: 0 0 calc(85%);
    min-width: 240px;
  }

  .bw-footer-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
    text-align: center;
  }

  /* Center the logo + brand block. */
  .bw-footer-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .bw-footer-logo-link {
    margin-left: auto;
    margin-right: auto;
  }

  /* Center the column headings + lists. */
  .bw-footer h4 {
    text-align: center;
  }

  .bw-footer ul {
    align-items: center;
  }

  .bw-footer ul li {
    text-align: center;
  }

  .bw-footer-contact li a {
    justify-content: center;
  }

  .bw-footer-bottom-inner {
    flex-direction: column;
    gap: 0.75rem;
    text-align: center;
  }

  /* Stack legal links cleanly on small screens. */
  .bw-footer-legal {
    flex-wrap: wrap;
    justify-content: center;
  }

  .bw-about-stats {
    gap: 1.5rem;
  }

  .bw-cta-banner-inner {
    grid-template-columns: 1fr;
  }

  .bw-cta-banner-content {
    padding: clamp(3rem, 6vw, 4rem) 1.5rem;
    text-align: center;
    align-items: center;
  }

  .bw-cta-banner-content .bw-btn {
    align-self: center;
  }

  .bw-cta-banner-content p {
    margin-left: auto;
    margin-right: auto;
  }

  .bw-cta-banner-image {
    min-height: 40vw;
    max-height: 350px;
  }

  .bw-shop-main .woocommerce ul.products,
  .bw-shop-main ul.products {
    grid-template-columns: 1fr;
  }

  /* Center the product card content on mobile single-column layout. */
  .bw-shop-main ul.products li.product {
    align-items: center;
    text-align: center;
  }

  .bw-shop-main ul.products li.product .woocommerce-loop-product__title,
  .bw-shop-main ul.products li.product .price {
    width: 100%;
    text-align: center;
  }

  .bw-shop-main ul.products li.product .button,
  .bw-shop-main ul.products li.product .added_to_cart {
    align-self: stretch;
    width: auto;
    margin-left: 1rem;
    margin-right: 1rem;
  }

  .bw-sp-related-grid {
    grid-template-columns: 1fr;
  }

  .bw-sp-thumb {
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
  }

  .bw-sp-tabs-wrap .woocommerce-tabs ul.tabs li a {
    padding: 0.75rem 1rem;
    font-size: 0.8125rem;
  }
}


/* ========================================================================
   SIDE CART (SLIDE-IN DRAWER)
   ======================================================================== */

.bw-side-cart-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.bw-side-cart-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.bw-side-cart {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  min-height: 100vh;
  min-height: 100dvh;
  width: 420px;
  max-width: 92vw;
  background: var(--bw-paper);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: -8px 0 40px rgba(0, 0, 0, 0.12);
}

.bw-side-cart.is-open {
  transform: translateX(0);
}

.bw-sc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--bw-border);
  flex-shrink: 0;
}

.bw-sc-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bw-text);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.bw-sc-count {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--bw-muted);
}

.bw-sc-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--bw-muted);
  padding: 0.375rem;
  border-radius: 50%;
  transition: color 0.2s ease, background 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bw-sc-close:hover {
  color: var(--bw-text);
  background: var(--bw-bg-warm);
}

/* Body / items area */
.bw-sc-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 1.5rem;
  overscroll-behavior: contain;
}

.bw-sc-body::-webkit-scrollbar {
  width: 4px;
}

.bw-sc-body::-webkit-scrollbar-track {
  background: transparent;
}

.bw-sc-body::-webkit-scrollbar-thumb {
  background: var(--bw-border);
  border-radius: 4px;
}

/* Empty state */
.bw-sc-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3rem 1rem;
  gap: 1rem;
  color: var(--bw-muted);
  min-height: 200px;
}

.bw-sc-empty svg {
  opacity: 0.35;
}

.bw-sc-empty p {
  font-size: 1rem;
  font-weight: 500;
  color: var(--bw-text-secondary);
  margin: 0;
}

/* Cart item */
.bw-sc-item {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--bw-border);
  position: relative;
  animation: bwScItemIn 0.25s ease;
}

@keyframes bwScItemIn {
  from { opacity: 0; transform: translateX(12px); }
  to { opacity: 1; transform: translateX(0); }
}

.bw-sc-item:last-child {
  border-bottom: none;
}

.bw-sc-item-img {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  border-radius: var(--bw-radius);
  overflow: hidden;
  background: var(--bw-bg-warm);
  display: block;
}

.bw-sc-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bw-sc-item-details {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.bw-sc-item-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--bw-text);
  text-decoration: none;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.bw-sc-item-name:hover {
  color: var(--bw-accent);
}

.bw-sc-item-price {
  font-size: 0.8125rem;
  color: var(--bw-text-secondary);
  font-weight: 500;
}

.bw-sc-item-price del {
  opacity: 0.5;
  margin-right: 0.25rem;
}

.bw-sc-item-price ins {
  text-decoration: none;
  color: var(--bw-accent);
  font-weight: 600;
}

/* Quantity controls */
.bw-sc-qty-wrap {
  display: inline-flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0;
  border: 1px solid var(--bw-border);
  border-radius: var(--bw-radius);
  overflow: hidden;
  margin-top: 0.375rem;
  width: fit-content;
  max-width: 100%;
}

.bw-sc-qty-btn {
  appearance: none;
  -webkit-appearance: none;
  background: var(--bw-bg);
  border: none;
  cursor: pointer;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
  margin: 0;
  flex: 0 0 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bw-text-secondary);
  transition: background 0.15s ease, color 0.15s ease;
}

.bw-sc-qty-btn:hover:not(:disabled) {
  background: var(--bw-bg-warm);
  color: var(--bw-text);
}

.bw-sc-qty-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.bw-sc-qty-value {
  width: 32px;
  min-width: 32px;
  flex: 0 0 32px;
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-text);
  line-height: 30px;
  user-select: none;
}

/* Remove button */
.bw-sc-remove {
  position: absolute;
  top: 1rem;
  right: 0;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--bw-muted);
  padding: 0.25rem;
  border-radius: var(--bw-radius-sm);
  transition: color 0.15s ease, background 0.15s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bw-sc-remove:hover {
  color: #c0392b;
  background: rgba(192, 57, 43, 0.06);
}

/* Footer */
.bw-sc-footer {
  flex-shrink: 0;
  padding: 1.25rem 1.5rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--bw-border);
  background: var(--bw-bg);
}

/* Shipping progress bar */
.bw-sc-shipping-bar {
  margin-bottom: 1rem;
}

.bw-sc-shipping-msg {
  font-size: 0.8125rem;
  color: var(--bw-text-secondary);
  margin: 0 0 0.5rem;
  line-height: 1.4;
}

.bw-sc-shipping-msg strong {
  color: var(--bw-accent);
}

.bw-sc-shipping-unlocked {
  color: #27ae60;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

.bw-sc-shipping-unlocked svg {
  color: #27ae60;
  flex-shrink: 0;
}

.bw-sc-bar-track {
  width: 100%;
  height: 6px;
  background: var(--bw-border);
  border-radius: 3px;
  overflow: hidden;
}

.bw-sc-bar-fill {
  height: 100%;
  background: var(--bw-accent);
  border-radius: 3px;
  transition: width 0.4s ease;
}

/* Subtotal */
.bw-sc-subtotal {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.25rem;
}

.bw-sc-subtotal span {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
}

.bw-sc-subtotal strong {
  font-size: 1.125rem;
  color: var(--bw-text);
}

.bw-sc-tax-note {
  font-size: 0.75rem;
  color: var(--bw-muted);
  margin: 0 0 1rem;
}

/* Checkout CTA */
.bw-sc-checkout-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.875rem 1.5rem !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  border-radius: var(--bw-radius) !important;
  text-decoration: none;
  background: #C46754 !important;
  color: #fff !important;
  border: none;
  cursor: pointer;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.bw-sc-checkout-btn:hover {
  background: #b05a48 !important;
  box-shadow: var(--bw-shadow-accent);
  transform: translateY(-1px);
}

.bw-sc-checkout-btn svg {
  transition: transform 0.2s ease;
}

.bw-sc-checkout-btn:hover svg {
  transform: translateX(3px);
}

/* View full cart link */
.bw-sc-viewcart-link {
  display: block;
  text-align: center;
  margin-top: 0.75rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-text-secondary);
  text-decoration: none;
  padding: 0.5rem;
  border-radius: var(--bw-radius);
  transition: color 0.2s ease, background 0.2s ease;
}

.bw-sc-viewcart-link:hover {
  color: var(--bw-accent);
  background: var(--bw-accent-soft);
}

/* Loading state */
.bw-sc-loading {
  pointer-events: none;
  opacity: 0.5;
}

.bw-sc-item.is-removing {
  opacity: 0;
  transform: translateX(20px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

/* Body scroll lock when cart is open */
body.bw-sc-open {
  overflow: hidden;
}

/* Responsive */
@media (max-width: 480px) {
  .bw-side-cart {
    width: 100%;
    max-width: 100%;
  }

  .bw-sc-header {
    padding: 1rem clamp(1rem, 5vw, 1.25rem);
  }

  .bw-sc-body {
    padding: 0.75rem clamp(1rem, 5vw, 1.25rem);
  }

  .bw-sc-footer {
    padding: 1rem clamp(1rem, 5vw, 1.25rem);
    padding-bottom: max(1.5rem, calc(1rem + env(safe-area-inset-bottom, 0px)));
  }

  .bw-sc-item {
    gap: 0.875rem;
    padding: 1rem 2rem 1rem 0;
  }

  .bw-sc-item-img {
    width: 64px;
    height: 64px;
  }

  .bw-sc-qty-wrap {
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center;
    align-self: flex-start;
  }

  .bw-sc-qty-btn {
    display: inline-flex !important;
    width: 32px !important;
    min-width: 32px;
    height: 32px;
    min-height: 32px;
    flex: 0 0 32px;
    padding: 0 !important;
    margin: 0 !important;
  }

  .bw-sc-qty-value {
    width: 34px;
    min-width: 34px;
    flex-basis: 34px;
    line-height: 32px;
  }

  .bw-sc-remove {
    top: 1rem;
    right: 0;
  }

  .bw-sc-tax-note {
    margin-bottom: 0.875rem;
    line-height: 1.35;
  }

  .bw-sc-checkout-btn {
    min-height: 52px;
  }
}


/* ========================================================================
   404 — PAGE NOT FOUND
   ======================================================================== */

.bw-404 {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 75vh;
  padding: 3rem 1.5rem;
  text-align: center;
  background:
    radial-gradient(ellipse at 20% 80%, rgba(196, 103, 84, 0.04) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(107, 62, 38, 0.03) 0%, transparent 50%),
    var(--bw-bg);
}

.bw-404-inner {
  max-width: 520px;
  margin: 0 auto;
}

/* Big 4_4 graphic */
.bw-404-graphic {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  margin-bottom: 1.75rem;
  user-select: none;
}

.bw-404-num {
  font-size: clamp(5rem, 12vw, 8rem);
  font-weight: 900;
  color: var(--bw-charcoal);
  line-height: 1;
  letter-spacing: -0.04em;
  opacity: 0.12;
}

.bw-404-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(4rem, 10vw, 6.5rem);
  height: clamp(4rem, 10vw, 6.5rem);
  border-radius: 50%;
  background: var(--bw-accent-soft);
  color: var(--bw-accent);
  flex-shrink: 0;
  animation: bw404Pulse 3s ease-in-out infinite;
}

.bw-404-icon svg {
  width: 50%;
  height: 50%;
}

@keyframes bw404Pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}

.bw-404-title {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: var(--bw-charcoal);
  margin: 0 0 0.75rem;
  letter-spacing: -0.02em;
}

.bw-404-desc {
  font-size: 1rem;
  color: var(--bw-text-secondary);
  line-height: 1.6;
  margin: 0 auto 2rem;
  max-width: 400px;
}

/* CTA buttons */
.bw-404-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.875rem;
  flex-wrap: wrap;
  margin-bottom: 2.5rem;
}

.bw-404-actions .bw-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.8125rem 1.75rem;
  font-size: 0.9375rem;
  font-weight: 700;
  border-radius: var(--bw-radius);
  text-decoration: none;
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease, color 0.2s ease, border-color 0.2s ease;
}

.bw-404-actions .bw-btn--primary {
  background: #C46754;
  color: #fff;
  border: 2px solid #C46754;
}

.bw-404-actions .bw-btn--primary:hover {
  background: #b05a48;
  border-color: #b05a48;
  box-shadow: var(--bw-shadow-accent);
  transform: translateY(-1px);
}

.bw-404-actions .bw-btn--outline {
  background: transparent;
  color: var(--bw-text);
  border: 2px solid var(--bw-border);
}

.bw-404-actions .bw-btn--outline:hover {
  border-color: var(--bw-accent);
  color: var(--bw-accent);
  background: var(--bw-accent-soft);
  transform: translateY(-1px);
}

/* Helper links */
.bw-404-links {
  padding-top: 2rem;
  border-top: 1px solid var(--bw-border-light);
}

.bw-404-links-label {
  font-size: 0.8125rem;
  color: var(--bw-muted);
  margin: 0 0 0.75rem;
}

.bw-404-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  flex-wrap: wrap;
}

.bw-404-nav a {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-text-secondary);
  text-decoration: none;
  padding: 0.375rem 0.75rem;
  border-radius: var(--bw-radius-sm);
  transition: color 0.2s ease, background 0.2s ease;
}

.bw-404-nav a:hover {
  color: var(--bw-accent);
  background: var(--bw-accent-soft);
}

@media (max-width: 480px) {
  .bw-404 {
    min-height: 65vh;
    padding: 2rem 1.25rem;
  }

  .bw-404-actions {
    flex-direction: column;
    gap: 0.625rem;
  }

  .bw-404-actions .bw-btn {
    width: 100%;
    justify-content: center;
  }
}


/* ========================================================================
   HOMEPAGE-SPECIFIC OVERRIDES
   ======================================================================== */

/* ---- About / Brand story visual on homepage ---- */
body.home .bw-about-visual {
  background: linear-gradient(145deg, #1a1a1a, #0e0e0e);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
}


/* ========================================================================
   CONTACT PAGE
   ======================================================================== */

/* Hero */
.bw-contact-hero {
  background: #000;
  color: #fff;
  padding: clamp(4rem, 8vw, 6rem) 0 clamp(3rem, 5vw, 4rem);
  text-align: center;
}

.bw-contact-hero-inner {
  max-width: 720px;
  margin: 0 auto;
}

.bw-contact-hero-title {
  font-family: var(--bw-font-display);
  font-size: clamp(2rem, 4.5vw, 3rem);
  line-height: 1.1;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin: 0.75rem 0 0;
}

.bw-contact-hero-desc {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.7);
  max-width: 600px;
  margin: 1.5rem auto 0;
}

/* Main grid: info left, form right */
.bw-contact-main {
  padding: clamp(2.5rem, 5vw, 4rem) 0;
}

.bw-contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: clamp(2rem, 4vw, 3.5rem);
  align-items: start;
}

/* ---- Contact info cards ---- */
.bw-contact-info {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.bw-ci-card {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.25rem;
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bw-ci-card:hover {
  border-color: var(--bw-border);
  box-shadow: var(--bw-shadow-xs);
}

.bw-ci-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--bw-accent-soft);
  color: var(--bw-accent);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.bw-ci-icon svg {
  width: 22px;
  height: 22px;
}

.bw-ci-card h3 {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--bw-muted);
  margin-bottom: 0.35rem;
}

.bw-ci-card a,
.bw-ci-card p {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--bw-text);
  text-decoration: none;
  line-height: 1.5;
  transition: color 0.2s ease;
  margin: 0;
}

.bw-ci-card a:hover {
  color: var(--bw-accent);
}

/* ---- WhatsApp call-to-action card on contact page ----
   Replaced the old "Follow Us" socials block (Facebook + Instagram are not
   active for this brand). Visually it matches the other .bw-ci-card blocks
   above it (Hours, Phone, Email, etc.) — same paper background, same border,
   same accent-tinted icon tile — so the contact column reads as one
   consistent stack instead of one outlier. The WhatsApp green only appears
   on hover/focus, when the user is actively engaging with the link. */
.bw-ci-whatsapp {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem;
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  color: var(--bw-text);
  text-decoration: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.bw-ci-whatsapp:hover,
.bw-ci-whatsapp:focus-visible {
  border-color: var(--bw-border);
  box-shadow: var(--bw-shadow-xs);
  transform: translateY(-2px);
  color: var(--bw-text);
}

/* Icon tile — sits in the accent palette like the other .bw-ci-icon tiles
   by default, then transitions to WhatsApp green on hover. */
.bw-ci-whatsapp__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--bw-accent-soft);
  color: var(--bw-accent);
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.bw-ci-whatsapp__icon svg {
  width: 22px;
  height: 22px;
}

.bw-ci-whatsapp:hover .bw-ci-whatsapp__icon,
.bw-ci-whatsapp:focus-visible .bw-ci-whatsapp__icon {
  background: #25d366;
  color: #fff;
  box-shadow: 0 6px 14px rgba(37, 211, 102, 0.35);
}

.bw-ci-whatsapp__text {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

/* Title styled as the other card headings (uppercase muted label) so the
   block reads structurally identical to Hours / Email / Phone. */
.bw-ci-whatsapp__title {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--bw-muted);
  line-height: 1.25;
}

.bw-ci-whatsapp__sub {
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.5;
  color: var(--bw-text);
}

.bw-ci-whatsapp__chevron {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--bw-muted);
  transition: transform 0.2s ease, color 0.2s ease;
}

.bw-ci-whatsapp:hover .bw-ci-whatsapp__chevron,
.bw-ci-whatsapp:focus-visible .bw-ci-whatsapp__chevron {
  transform: translateX(3px);
  color: var(--bw-accent);
}

@media (max-width: 480px) {
  .bw-ci-whatsapp {
    padding: 1rem;
    gap: 0.85rem;
  }

  .bw-ci-whatsapp__icon {
    width: 40px;
    height: 40px;
  }

  .bw-ci-whatsapp__icon svg {
    width: 20px;
    height: 20px;
  }

  .bw-ci-whatsapp__sub {
    font-size: 0.875rem;
  }
}

/* ---- Legacy "Follow Us" socials styles (kept for backward compat in case
        any other template ever reuses these classes — Facebook/Instagram
        block on the contact page itself was removed). ---- */
.bw-ci-socials {
  padding: 1.5rem 1.25rem;
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  margin-top: 0.5rem;
}

.bw-ci-socials h3 {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--bw-muted);
  margin-bottom: 1rem;
}

.bw-ci-social-links {
  display: flex;
  gap: 0.625rem;
}

.bw-ci-social-btn {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--bw-bg);
  border: 1px solid var(--bw-border-light);
  display: grid;
  place-items: center;
  color: var(--bw-text-secondary);
  transition: all 0.2s ease;
}

.bw-ci-social-btn:hover {
  background: #1877f2;
  color: #fff;
  border-color: #1877f2;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(24, 119, 242, 0.3);
}

.bw-ci-social-btn--wa:hover {
  background: #25d366;
  border-color: #25d366;
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
}

.bw-ci-social-btn:last-child:hover {
  background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  border-color: #e6683c;
  box-shadow: 0 4px 12px rgba(220, 39, 67, 0.3);
}

/* ---- Contact form card ---- */
.bw-contact-form-card {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  box-shadow: var(--bw-shadow-sm);
  padding: clamp(1.75rem, 3vw, 2.5rem);
}

.bw-contact-form-card h2 {
  font-size: 1.375rem;
  font-weight: 800;
  color: var(--bw-charcoal);
  margin-bottom: 0.25rem;
  letter-spacing: -0.01em;
}

.bw-cf-desc {
  font-size: 0.875rem;
  color: var(--bw-muted);
  margin-bottom: 1.75rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--bw-border-light);
}

/* Form fields */
.bw-contact-form {
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
}

.bw-cf-row--half {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.bw-cf-field label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bw-text);
  margin-bottom: 0.375rem;
  letter-spacing: 0.01em;
}

.bw-cf-req {
  color: var(--bw-accent);
}

.bw-cf-field input,
.bw-cf-field select,
.bw-cf-field textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 2px solid var(--bw-border);
  border-radius: var(--bw-radius);
  font-size: 0.9375rem;
  font-family: var(--bw-font);
  color: var(--bw-text);
  background: var(--bw-bg);
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  box-sizing: border-box;
}

.bw-cf-field input::placeholder,
.bw-cf-field textarea::placeholder {
  color: var(--bw-muted);
  opacity: 0.6;
}

.bw-cf-field input:focus,
.bw-cf-field select:focus,
.bw-cf-field textarea:focus {
  border-color: var(--bw-accent);
  background: var(--bw-paper);
  outline: none;
  box-shadow: 0 0 0 3px rgba(196, 103, 84, 0.1);
}

.bw-cf-field select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23a09488'%3E%3Cpath fill-rule='evenodd' d='M5.22 8.22a.75.75 0 0 1 1.06 0L10 11.94l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L5.22 9.28a.75.75 0 0 1 0-1.06Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 18px;
  padding-right: 2.5rem;
  cursor: pointer;
}

.bw-cf-field textarea {
  resize: vertical;
  min-height: 120px;
}

/* Invalid fields */
.bw-cf-field input:invalid:not(:placeholder-shown),
.bw-cf-field textarea:invalid:not(:placeholder-shown) {
  border-color: #c0392b;
}

/* Submit button */
.bw-cf-submit {
  width: 100%;
  padding: 0.875rem 1.5rem !important;
  font-size: 0.9375rem !important;
  margin-top: 0.25rem;
}

.bw-cf-submit-loading svg {
  animation: bwSpin 0.8s linear infinite;
}

@keyframes bwSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.bw-cf-submit.is-loading .bw-cf-submit-text { display: none; }
.bw-cf-submit.is-loading .bw-cf-submit-loading { display: inline-flex !important; }
.bw-cf-submit.is-loading svg:last-child { display: none; }

/* Status messages */
.bw-cf-status {
  border-radius: var(--bw-radius);
  font-size: 0.875rem;
  line-height: 1.5;
  font-weight: 600;
}

.bw-cf-status:empty {
  display: none;
}

.bw-cf-status.bw-cf-success {
  background: rgba(39, 174, 96, 0.08);
  border: 1px solid rgba(39, 174, 96, 0.2);
  color: #1e8449;
  padding: 0.875rem 1.25rem;
}

.bw-cf-status.bw-cf-error {
  background: rgba(192, 57, 43, 0.06);
  border: 1px solid rgba(192, 57, 43, 0.15);
  color: #c0392b;
  padding: 0.875rem 1.25rem;
}

/* ---- FAQ section below ---- */
.bw-contact-faqs .bw-section-header {
  margin-bottom: 2rem;
}

/* ---- Responsive ---- */
@media (max-width: 840px) {
  .bw-contact-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .bw-contact-info {
    order: 1;
  }

  .bw-contact-form-wrap {
    order: 2;
  }
}

@media (max-width: 480px) {
  .bw-cf-row--half {
    grid-template-columns: 1fr;
  }

  .bw-contact-form-card {
    padding: 1.5rem 1.25rem;
  }

  .bw-contact-hero {
    padding: 3rem 0 2rem;
  }
}


/* ========================================================================
   ABOUT PAGE
   ======================================================================== */

/* ---- Hero ---- */
.bw-about-hero {
  padding: clamp(4rem, 8vw, 6rem) 0 clamp(3rem, 5vw, 4rem);
  background: #000;
  color: #fff;
  text-align: center;
}

.bw-about-hero-inner {
  max-width: 720px;
  margin: 0 auto;
}

.bw-about-hero-title {
  font-size: clamp(2rem, 4.5vw, 3rem);
  line-height: 1.1;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin: 0.75rem 0 0;
}

.bw-about-hero-desc {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.75;
  max-width: 620px;
  margin: 1.5rem auto 0;
}


/* ---- Why Black Wattle — Split Layout ---- */
.bw-about-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: stretch;
}

.bw-about-split-content .bw-section-title {
  margin: 0.5rem 0 1.25rem;
}

.bw-about-split-content p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.75;
  margin-bottom: 1rem;
}

.bw-about-split-content p:last-child {
  margin-bottom: 0;
}

.bw-about-split-visual {
  position: relative;
  display: flex;
  min-height: 0;
}

/* ---- Image (or placeholder) on the right of the split ----
   Matches the height of the text column next to it via grid stretch. */
.bw-about-image {
  position: relative;
  width: 100%;
  margin: 0;
  border-radius: var(--bw-radius-lg);
  overflow: hidden;
  box-shadow: var(--bw-shadow-md);
  background: var(--bw-paper);
  min-height: 100%;
}

.bw-about-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bw-about-image--placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  text-align: center;
  padding: 2rem;
  border: 2px dashed rgba(255, 255, 255, 0.18);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
  color: rgba(255, 255, 255, 0.45);
}

.bw-about-image--placeholder svg {
  width: 64px;
  height: 64px;
  opacity: 0.4;
}

.bw-about-image-placeholder-label {
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.bw-about-image-placeholder-label a {
  color: var(--bw-accent);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}

.bw-about-image-placeholder-label a:hover {
  color: var(--bw-accent-hover);
}

/* ---- Fact strip — horizontal row below the split ---- */
.bw-about-fact-strip {
  margin-top: clamp(2rem, 4vw, 3rem);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.bw-about-fact-card {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  box-shadow: var(--bw-shadow-xs);
  transition: box-shadow var(--bw-transition), transform var(--bw-transition);
}

.bw-about-fact-card:hover {
  box-shadow: var(--bw-shadow-sm);
  transform: translateY(-2px);
}

.bw-about-fact-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bw-accent-soft);
  border-radius: var(--bw-radius-sm);
  color: var(--bw-accent);
}

.bw-about-fact-icon svg {
  width: 22px;
  height: 22px;
}

.bw-about-fact-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.bw-about-fact-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--bw-muted);
  line-height: 1.3;
}

.bw-about-fact-value {
  display: block;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
  margin-top: 0.125rem;
}


/* ---- The Problem — Card Grid ---- */
.bw-about-problem-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}

.bw-about-problem-card {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius);
  padding: clamp(1.25rem, 2vw, 1.75rem);
  box-shadow: var(--bw-shadow-xs);
  transition: box-shadow var(--bw-transition), transform var(--bw-transition);
}

.bw-about-problem-card:hover {
  box-shadow: var(--bw-shadow-sm);
  transform: translateY(-2px);
}

.bw-about-problem-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(196, 103, 84, 0.06);
  border-radius: var(--bw-radius-sm);
  color: var(--bw-accent);
  margin-bottom: 1rem;
}

.bw-about-problem-icon svg {
  width: 22px;
  height: 22px;
}

.bw-about-problem-card h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--bw-charcoal);
  margin-bottom: 0.5rem;
}

.bw-about-problem-card p {
  font-size: 0.875rem;
  color: var(--bw-text-secondary);
  line-height: 1.7;
}


/* ---- Indigenous Firewood — Callout ---- */
.bw-about-callout {
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  padding: clamp(2rem, 4vw, 3rem);
  box-shadow: var(--bw-shadow-sm);
}

.bw-about-callout-header {
  margin-bottom: 1.5rem;
}

.bw-about-callout-header .bw-section-title {
  margin-top: 0.5rem;
}

.bw-section-label--alert {
  background: rgba(196, 103, 84, 0.1);
  color: var(--bw-accent);
}

.bw-about-callout-body p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.75;
  margin-bottom: 1.25rem;
}

.bw-about-callout-body p:last-child {
  margin-bottom: 0;
}

.bw-about-highlight-box {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  background: linear-gradient(135deg, rgba(196, 103, 84, 0.06) 0%, rgba(196, 103, 84, 0.02) 100%);
  border-left: 3px solid var(--bw-accent);
  border-radius: 0 var(--bw-radius) var(--bw-radius) 0;
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0;
}

.bw-about-highlight-icon {
  flex-shrink: 0;
  color: var(--bw-accent);
  margin-top: 0.125rem;
}

.bw-about-highlight-icon svg {
  width: 22px;
  height: 22px;
}

.bw-about-highlight-box p {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--bw-text);
  line-height: 1.7;
  margin: 0;
}


/* ---- The Better Choice — CTA ---- */
.bw-about-choice-card {
  text-align: center;
  background: var(--bw-paper);
  border: 1px solid var(--bw-border-light);
  border-radius: var(--bw-radius-lg);
  padding: clamp(2.5rem, 5vw, 4rem) clamp(2rem, 4vw, 3rem);
  box-shadow: var(--bw-shadow-sm);
}

.bw-about-choice-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background: var(--bw-green-soft);
  color: var(--bw-green);
  border-radius: 50%;
  margin-bottom: 1.25rem;
}

.bw-about-choice-icon svg {
  width: 32px;
  height: 32px;
}

.bw-about-choice-card h2 {
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 800;
  color: var(--bw-charcoal);
  margin-bottom: 0.75rem;
}

.bw-about-choice-card > p {
  font-size: 0.9375rem;
  color: var(--bw-text-secondary);
  line-height: 1.75;
  max-width: 580px;
  margin: 0 auto 2rem;
}

.bw-about-choice-actions {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
}


/* ---- About Page Responsive ---- */
@media (max-width: 840px) {
  .bw-about-split {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .bw-about-split-visual {
    min-height: 0;
  }

  .bw-about-image {
    aspect-ratio: 16 / 10;
    min-height: 0;
  }

  .bw-about-fact-strip {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .bw-about-problem-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .bw-about-hero {
    padding: 3rem 0 2rem;
  }

  .bw-about-callout {
    padding: 1.5rem 1.25rem;
  }

  .bw-about-highlight-box {
    flex-direction: column;
    gap: 0.75rem;
  }

  .bw-about-choice-card {
    padding: 2rem 1.5rem;
  }

  .bw-about-choice-actions {
    flex-direction: column;
  }

  .bw-about-choice-actions .bw-btn {
    width: 100%;
    justify-content: center;
  }
}


/* ========================================================================
   FAQS PAGE
   ======================================================================== */

/* ---- Hero ---- */
.bw-faq-hero {
  padding: clamp(4rem, 8vw, 6rem) 0 clamp(3rem, 5vw, 4rem);
  background: #000;
  color: #fff;
  text-align: center;
}

.bw-faq-hero-inner {
  max-width: 620px;
  margin: 0 auto;
}

.bw-faq-hero-title {
  font-size: clamp(2rem, 4.5vw, 3rem);
  line-height: 1.1;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin: 0.75rem 0 0;
}

.bw-faq-hero-desc {
  font-size: clamp(0.9375rem, 1.5vw, 1.0625rem);
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.75;
  margin-top: 1.5rem;
}

/* ---- Single-column FAQ list for dedicated page ---- */
.bw-faq-grid--single {
  grid-template-columns: 1fr;
  gap: 1rem;
  max-width: 800px;
  margin: 0 auto;
}

.bw-faq-grid--single .bw-faq {
  background: var(--bw-paper);
  box-shadow: var(--bw-shadow-xs);
}

.bw-faq-grid--single .bw-faq[open] {
  box-shadow: var(--bw-shadow-sm);
}

.bw-faq-grid--single .bw-faq summary {
  padding: 1.25rem 1.5rem;
  font-size: 1rem;
}

.bw-faq-grid--single .bw-faq-answer {
  padding: 0 1.5rem 1.5rem;
}

.bw-faq-grid--single .bw-faq-answer p {
  margin-bottom: 0.75rem;
}

.bw-faq-grid--single .bw-faq-answer p:last-child {
  margin-bottom: 0;
}

/* ---- Action buttons inside FAQ answers ---- */
.bw-faq-actions {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-top: 1.25rem;
}

/* ---- CTA with multiple buttons ---- */
.bw-final-cta-actions {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1.5rem;
}

/* ---- FAQs Page Responsive ---- */
@media (max-width: 480px) {
  .bw-faq-hero {
    padding: 3rem 0 2rem;
  }

  .bw-faq-grid--single .bw-faq summary {
    padding: 1rem 1.25rem;
  }

  .bw-faq-grid--single .bw-faq-answer {
    padding: 0 1.25rem 1.25rem;
  }

  .bw-faq-actions {
    flex-direction: column;
  }

  .bw-faq-actions .bw-btn {
    width: 100%;
    justify-content: center;
  }

  .bw-final-cta-actions {
    flex-direction: column;
  }

  .bw-final-cta-actions .bw-btn {
    width: 100%;
    justify-content: center;
  }
}


/* ========================================================================
   HERO ENTRANCE (prevents flash before GSAP)
   ======================================================================== */

.home .bw-hero-content {
  visibility: hidden;
}

.home .bw-hero-image {
  visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .home .bw-hero-content,
  .home .bw-hero-image {
    visibility: visible !important;
  }
}


/* ========================================================================
   SCROLL REVEAL ANIMATIONS
   ======================================================================== */

.bw-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              transform 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-delay: calc(var(--reveal-i, 0) * 0.09s);
}

.bw-reveal--left {
  transform: translateX(-32px) translateY(0);
}

.bw-reveal--right {
  transform: translateX(32px) translateY(0);
}

.bw-reveal--scale {
  transform: scale(0.94) translateY(0);
}

.bw-reveal.is-visible {
  opacity: 1;
  transform: translate(0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .bw-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* ========================================================================
   KINDLING NOTICE
   ======================================================================== */

.bw-kindling-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: rgba(234, 179, 8, 0.1);
  border: 1px solid rgba(234, 179, 8, 0.3);
  border-radius: 6px;
  padding: 14px 18px;
  margin-bottom: 20px;
  color: #ca8a04;
  font-size: 0.9rem;
  line-height: 1.5;
}

.bw-kindling-notice svg {
  flex-shrink: 0;
  margin-top: 1px;
  color: #ca8a04;
}


/* ========================================================================
   SITE SEARCH OVERLAY
   Modern, accessible, full-screen on mobile / panel on desktop.
   ======================================================================== */

/* Trigger button: visually consistent with other header icon buttons. */
.bw-search-toggle {
  cursor: pointer;
}

/* Lock body scroll while overlay open. */
body.bw-search-open {
  overflow: hidden;
}

.bw-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(0px, 5vh, 80px) 1rem 1rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}

.bw-search-overlay[hidden] {
  display: none;
}

.bw-search-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}

.bw-search-overlay__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 8, 8, 0.78);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  cursor: pointer;
}

.bw-search-overlay__panel {
  position: relative;
  width: min(720px, 100%);
  max-height: calc(100vh - 4rem);
  background: #161616;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: translateY(-12px) scale(0.985);
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.bw-search-overlay.is-open .bw-search-overlay__panel {
  transform: translateY(0) scale(1);
}

.bw-search-overlay__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.25rem 0.5rem;
}

.bw-search-overlay__title {
  margin: 0;
  font-family: var(--bw-font-display, inherit);
  font-size: 0.78rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
  font-weight: 600;
}

.bw-search-overlay__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #fff;
  cursor: pointer;
  transition: background 0.18s ease, transform 0.18s ease;
}

.bw-search-overlay__close:hover {
  background: rgba(255, 255, 255, 0.12);
  transform: scale(1.04);
}

.bw-search-overlay__form {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem 1.25rem 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.bw-search-overlay__icon {
  position: absolute;
  left: 1.6rem;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.55);
  pointer-events: none;
  line-height: 0;
}

.bw-search-overlay__input {
  flex: 1;
  width: 100%;
  font-size: 1.15rem;
  background: transparent;
  border: 1px solid transparent;
  color: #fff;
  padding: 0.95rem 2.6rem 0.95rem 2.75rem;
  border-radius: 12px;
  outline: none;
  transition: background 0.18s ease, border-color 0.18s ease;
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
}

.bw-search-overlay__input::placeholder {
  color: rgba(255, 255, 255, 0.4);
}

.bw-search-overlay__input:focus {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(196, 103, 84, 0.5);
}

/* Hide native search clear button — we use our own. */
.bw-search-overlay__input::-webkit-search-cancel-button,
.bw-search-overlay__input::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
}

.bw-search-overlay__clear {
  position: absolute;
  right: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  border: none;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.18s ease, color 0.18s ease;
}

.bw-search-overlay__clear:hover {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.bw-search-overlay__hint {
  padding: 0.75rem 1.5rem 1rem;
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.bw-search-overlay__hint kbd {
  display: inline-block;
  padding: 0.05rem 0.45rem;
  margin: 0 0.15rem;
  font-size: 0.72rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 4px;
  color: #fff;
}

.bw-search-overlay__results {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem 0.75rem 1rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
}

.bw-search-overlay__results::-webkit-scrollbar {
  width: 8px;
}

.bw-search-overlay__results::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.18);
  border-radius: 4px;
}

/* Loading state */
.bw-search-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 2rem 1rem;
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.95rem;
}

.bw-search-spinner {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.18);
  border-top-color: var(--bw-accent, #c46754);
  animation: bw-search-spin 0.7s linear infinite;
}

@keyframes bw-search-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Empty / no-results / error states */
.bw-search-empty {
  text-align: center;
  padding: 2.5rem 1.25rem 2rem;
}

.bw-search-empty__title {
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0 0 0.4rem;
  color: #fff;
}

.bw-search-empty__sub {
  margin: 0 0 1.25rem;
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.92rem;
}

/* Results list */
.bw-search-results-list {
  display: flex;
  flex-direction: column;
  padding: 0.25rem 0;
}

.bw-search-result {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: 0.75rem;
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: background 0.18s ease, transform 0.18s ease;
}

.bw-search-result + .bw-search-result {
  margin-top: 2px;
}

.bw-search-result:hover,
.bw-search-result:focus-visible {
  background: rgba(255, 255, 255, 0.06);
  outline: none;
}

.bw-search-result__thumb {
  width: 64px;
  height: 64px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bw-search-result__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bw-search-result__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.bw-search-result__name {
  font-size: 0.98rem;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bw-search-result__sku {
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.45);
}

.bw-search-result__price {
  font-size: 0.95rem;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}

/* Reset WC default price markup styling inside results */
.bw-search-result__price .woocommerce-Price-amount,
.bw-search-result__price ins,
.bw-search-result__price del,
.bw-search-result__price bdi {
  color: inherit;
  text-decoration: none;
}

.bw-search-result__price del {
  opacity: 0.5;
  margin-right: 0.35rem;
  font-weight: 500;
}

/* View-all footer link */
.bw-search-viewall {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.95rem 1rem;
  margin-top: 0.5rem;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  color: #fff;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.bw-search-viewall:hover,
.bw-search-viewall:focus-visible {
  background: rgba(196, 103, 84, 0.14);
  border-color: rgba(196, 103, 84, 0.45);
  outline: none;
}

.bw-search-viewall svg {
  transition: transform 0.18s ease;
}

.bw-search-viewall:hover svg {
  transform: translateX(2px);
}

/* ----- Tablet ----- */
@media (max-width: 768px) {
  .bw-search-overlay {
    padding-top: 0;
  }
}

/* ----- Mobile: full-screen ----- */
@media (max-width: 640px) {
  .bw-search-overlay {
    padding: 0;
    align-items: stretch;
  }

  .bw-search-overlay__panel {
    width: 100%;
    max-height: 100vh;
    height: 100vh;
    height: 100dvh;
    border-radius: 0;
    border: none;
  }

  .bw-search-overlay__header {
    padding: 0.85rem 1rem 0.4rem;
  }

  .bw-search-overlay__form {
    padding: 0.25rem 1rem 0.85rem;
  }

  .bw-search-overlay__icon {
    left: 1.35rem;
  }

  .bw-search-overlay__clear {
    right: 1.25rem;
  }

  .bw-search-overlay__input {
    font-size: 1rem;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
  }

  .bw-search-overlay__hint {
    padding: 0.6rem 1.1rem 0.85rem;
    font-size: 0.78rem;
  }

  .bw-search-overlay__results {
    padding: 0.5rem 0.4rem 1.5rem;
  }

  .bw-search-result {
    grid-template-columns: 56px 1fr;
    grid-template-rows: auto auto;
    gap: 0.6rem 0.85rem;
    padding: 0.6rem;
  }

  .bw-search-result__thumb {
    grid-row: span 2;
    width: 56px;
    height: 56px;
  }

  .bw-search-result__price {
    grid-column: 2;
    font-size: 0.9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bw-search-overlay,
  .bw-search-overlay__panel,
  .bw-search-result,
  .bw-search-viewall {
    transition: none !important;
  }

  .bw-search-spinner {
    animation: none !important;
  }
}


/* ========================================================================
   ACTIVE FILTER CHIPS (shop / search)
   Removable pill that surfaces the current search term so it can be cleared.
   ======================================================================== */

.bw-active-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 1.25rem;
  padding: 0.85rem 1rem;
  background: rgba(196, 103, 84, 0.08);
  border: 1px solid rgba(196, 103, 84, 0.2);
  border-radius: 10px;
}

.bw-active-filters__label {
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.65);
  margin-right: 0.25rem;
}

.bw-active-filters__clear-all {
  margin-left: auto;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.18s ease;
}

.bw-active-filters__clear-all:hover,
.bw-active-filters__clear-all:focus-visible {
  color: var(--bw-accent, #c46754);
  outline: none;
}

.bw-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.5rem 0.4rem 0.75rem;
  background: var(--bw-accent, #c46754);
  color: #fff;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  line-height: 1;
  transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
  border: 1px solid transparent;
}

.bw-chip:hover,
.bw-chip:focus-visible {
  background: #b15846;
  color: #fff;
  outline: none;
  box-shadow: 0 6px 16px rgba(196, 103, 84, 0.35);
}

.bw-chip__label {
  max-width: 22ch;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bw-chip__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  transition: background 0.18s ease;
}

.bw-chip:hover .bw-chip__close,
.bw-chip:focus-visible .bw-chip__close {
  background: rgba(255, 255, 255, 0.32);
}

@media (max-width: 480px) {
  .bw-active-filters {
    padding: 0.7rem 0.85rem;
  }

  .bw-chip__label {
    max-width: 14ch;
  }
}

/* ========================================================================
   Outlier delivery fee notice (rendered above cart + checkout totals when
   the customer's shipping postcode is outside the free-delivery zone).
   ======================================================================== */
.bw-outlier-fee-notice {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  margin: 0 0 1.25rem;
  padding: 1rem 1.1rem;
  background: linear-gradient(135deg, rgba(196, 103, 84, 0.08), rgba(196, 103, 84, 0.04));
  border: 1px solid rgba(196, 103, 84, 0.28);
  border-left: 4px solid var(--bw-accent, #c46754);
  border-radius: 10px;
  color: #2c1810;
  font-size: 0.95rem;
  line-height: 1.55;
}

.bw-outlier-fee-notice__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-top: 1px;
  border-radius: 50%;
  background: rgba(196, 103, 84, 0.16);
  color: var(--bw-accent, #c46754);
}

.bw-outlier-fee-notice__icon svg {
  width: 18px;
  height: 18px;
}

.bw-outlier-fee-notice__text {
  margin: 0;
  flex: 1 1 auto;
  color: inherit;
}

@media (max-width: 480px) {
  .bw-outlier-fee-notice {
    padding: 0.85rem 0.95rem;
    gap: 0.7rem;
    font-size: 0.9rem;
  }

  .bw-outlier-fee-notice__icon {
    width: 28px;
    height: 28px;
  }
}

/* ========================================================================
   Accessibility skip-link (visible on keyboard focus only).
   ======================================================================== */
.bw-skip-link.screen-reader-text:focus,
.bw-skip-link.screen-reader-text:focus-visible {
  position: fixed;
  top: 12px;
  left: 12px;
  width: auto;
  height: auto;
  padding: 0.7rem 1rem;
  margin: 0;
  overflow: visible;
  clip: auto;
  background: var(--bw-accent, #c46754);
  color: #fff;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
  z-index: 100000;
}

/* ========================================================================
   Text-only brand fallback (used when no custom logo is uploaded).
   ======================================================================== */
.bw-brand-text {
  display: inline-block;
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 1.25rem;
  letter-spacing: 0.04em;
  color: #fff;
  text-transform: uppercase;
  line-height: 1.1;
  white-space: nowrap;
}

.bw-footer-logo--text {
  display: inline-block;
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  font-weight: 800;
  font-size: 1.15rem;
  letter-spacing: 0.04em;
  color: #fff;
  text-transform: uppercase;
  line-height: 1.1;
}

@media (max-width: 480px) {
  .bw-brand-text {
    font-size: 1.05rem;
  }
}