/* ==========================================================================
   MilletStory -- design tokens and shared primitives
   --------------------------------------------------------------------------
   The --ms-* names alias Astra's global palette rather than restating hex values,
   so changing the palette in Customize -> Global -> Colors flows through every
   rule in this theme. inc/palette.php records the intended values as code.

   TYPOGRAPHY: this theme sets no font-family anywhere, by design. Astra's
   configured fonts stay the single source of truth. Weight, size, spacing and
   letter-spacing are styled; family never is.
   ========================================================================== */

:root {
  --millet-green:       var(--ast-global-color-0, #103D20);
  --millet-green-dark:  var(--ast-global-color-1, #072C15);
  --millet-ink:         var(--ast-global-color-2, #1E1A10);
  --millet-body:        var(--ast-global-color-3, #595549);
  --millet-cream:       var(--ast-global-color-4, #FBF4EA);
  --millet-cream-deep:  var(--ast-global-color-5, #F2EADD);
  --millet-border:      var(--ast-global-color-7, #DED6C9);
  --millet-gold:        var(--ast-global-color-8, #D49838);

  --millet-card:        #FEFBF8;
  --millet-green-mid:   #20432B;
  --millet-footer-text: #F1EAE0;

  --millet-radius:      10px;
  --millet-radius-pill: 999px;
  --millet-shadow:      0 2px 12px rgba(30, 26, 16, .07);
  --millet-gap:         clamp(16px, 2.5vw, 28px);
  --millet-section-space:     clamp(40px, 6vw, 72px);
  /* Matches Astra's site-content-width (1140). Astra emits .ast-container
     max-width:1180px with 20px padding, giving a 1140 content box. */
  --millet-max-width:        1140px;
}

/* --------------------------------------------------------------------------
   Full-bleed guard.
   The product page's Why/Promise band breaks out with 100vw, which includes the
   scrollbar and would otherwise cause a horizontal scrollbar.

   `clip`, NOT `hidden`: overflow:hidden creates a scroll container, which breaks
   position:sticky for descendants. The sticky header sits outside #content so it
   is unaffected either way, but clip keeps this safe if anything sticky is ever
   added inside the content area.
   -------------------------------------------------------------------------- */
#content {
  overflow-x: clip;
}

/* --------------------------------------------------------------------------
   Sticky header.
   Astra's own sticky-header module is Pro-gated, but the mockups all show a
   sticky header and position:sticky needs no JS. z-index stays below Astra's
   mobile off-canvas (which sits far higher) so the menu still overlays it.
   -------------------------------------------------------------------------- */
.ast-main-header-wrap { /* ASTRA-DEP: header wrapper class */
  position: sticky;
  top: 0;
  z-index: 50;
}
.admin-bar .ast-main-header-wrap { top: 32px; } /* ASTRA-DEP */
@media (max-width: 782px) {
  .admin-bar .ast-main-header-wrap { top: 46px; } /* ASTRA-DEP */
}
/* Below tablet the admin bar is position:fixed only above 600px. */
@media (max-width: 600px) {
  .admin-bar .ast-main-header-wrap { top: 0; } /* ASTRA-DEP */
}

/* --------------------------------------------------------------------------
   Shared primitives used by the ms-* blocks
   -------------------------------------------------------------------------- */
.millet-icon {
  width: 22px;
  height: 22px;
  display: block;
  color: var(--millet-green);
}

/* --------------------------------------------------------------------------
   Lists inside editor-authored HTML.

   These wrappers print content straight from the ACF WYSIWYG fields and
   WooCommerce's short description, so their lists arrive with Astra's default
   `ul { margin: 0 0 1.5em 3em }` (main.min.css) -- a 3em left margin that pushes
   every bullet well right of the text it belongs to.

   Scoped to the wrappers rather than set globally, so nothing here can disturb
   Astra's or WooCommerce's own lists (menus, product grids, pagination, widgets).
   The class gives 0-1-1, which beats Astra's bare 0-0-1 element selector.
   -------------------------------------------------------------------------- */
.millet-detail-panel :where(ul, ol),
.millet-promise-body :where(ul, ol),
.millet-category-tagline :where(ul, ol),
.woocommerce-product-details__short-description :where(ul, ol) {
  padding-left: 15px;
  margin-left: 0px;
}

/* Buttons: styled via WooCommerce core classes so they survive a theme change. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .button.alt,
.millet-buy-now {
  border-radius: var(--millet-radius);
  font-weight: 700;
  letter-spacing: .3px;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

/* Respect a reduced-motion preference for every transition this theme adds. */
@media (prefers-reduced-motion: reduce) {
  * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}