/** Shopify CDN: Minification failed

Line 173:40 Unexpected ")"

**/
/* ==========================================================================
   lw-overrides.css — every global Leatherwood CSS rule, in one file.
   Loaded once by snippets/lw-head-end.liquid right after {{ content_for_header }},
   i.e. after Horizon's base.css and the compiled block/section stylesheets.
   Stock Horizon files carry NO Leatherwood CSS (see scripts/lw-stock-hooks.txt);
   component CSS for our own snippets/blocks stays in their {% stylesheet %}.
   ========================================================================== */

/* --- Base ---------------------------------------------------------------- */

/* Live site: body copy (Archivo), nav links and buttons carry +0.02em tracking.
   Headings set their own --font-h*--letter-spacing explicitly, so they aren't
   affected by this inherited value. */
body {
  letter-spacing: 0.02em;
}

/* Smooth in-page jumps (#form-jump "Claim my free mockup" CTAs). Was a Horizon 4.1.3 base rule. */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

/* Empty resource-list grids (e.g. "More styles" with nothing to show) take no space.
   Was a Horizon 4.1.3 base rule. */
.section-resource-list__content:empty {
  display: none;
}

/* App forms (Globo form builder / product options): radio + checkbox labels lay out as
   inline flex rows. Horizon 4.1.3 did this globally; 4.1.4 dropped it, Globo relies on it.
   :where() keeps the original 4.1.3 specificity (label:has(input) = 0,1,2). */
:where(.globo-formbuilder, .gpo-app) label:has(input[type='radio']),
:where(.globo-formbuilder, .gpo-app) label:has(input[type='checkbox']) {
  display: inline-flex;
  align-items: center;
  gap: var(--padding-2xs);
  cursor: pointer;
}

:where(.globo-formbuilder, .gpo-app) label:has(input[type='radio']:disabled),
:where(.globo-formbuilder, .gpo-app) label:has(input[type='checkbox']:disabled) {
  cursor: not-allowed;
}

/* --- Header / menu ------------------------------------------------------- */

/* Mega menu (Horizon layout, collection-image mode): long child lists flow into two
   columns instead of overflowing the panel. */
.mega-menu__grid ul.list-unstyled:not([style]):has(> li:nth-child(9)) {
  column-count: 2;
  column-gap: 24px;
}

/* --- Footer -------------------------------------------------------------- */

/* Footer renders immediately (Horizon's content-visibility:auto clipped/late-painted it). */
.footer-content {
  contain: none;
  content-visibility: visible;
}

/* --- Product cards / product page --------------------------------------- */

/* Quote-only model: no price/sale badges on product cards (mirror live). */
.product-badges {
  display: none;
}

/* Neutralize app-injected review blocks (e.g. Vitals) so they do not steal a grid column. */
.product-information__grid > .rr-block,
product-component > .rr-block {
  grid-column: 1 / -1;
  order: 99;
}

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

/* Tighten the empty cart on mobile (was ~110px dead space above the title). */
@media screen and (max-width: 749px) {
  .cart-page--empty .cart-page__title {
    margin-top: 0;
  }

  .cart-page--empty .cart-page__more-blocks {
    margin-top: var(--margin-xl);
  }
}

/* ==========================================================================
   LW design system (2026-09-29) — one button system, tap targets, app widgets.
   Colours/sizes come from theme settings (Buttons, Typography); these rules
   only cover what settings can't reach.
   ========================================================================== */

/* Compact card CTA ("Get free mockup" under product cards) — primary button, card-sized */
.button.lw-card-cta {
  padding-block: 10px;
  padding-inline: 12px;
  font-size: var(--font-size--sm);
  line-height: 1.2;
  min-height: 44px;
}

/* Mobile tap targets: every button and form control >= 44px tall */
@media screen and (max-width: 749px) {
  .button,
  .button-secondary,
  .button-custom,
  button.shopify-payment-button__button--unbranded,
  .vtl-pr__btn {
    min-height: 44px;
  }

  .globo-formbuilder button,
  .globo-formbuilder .flat-button,
  .globo-formbuilder select,
  .globo-formbuilder input:not([type='checkbox'], [type='radio'], [type='file'], [type='hidden']) {
    min-height: 44px !important;
  }
}

/* Vitals reviews carousel: show full reviewer names; title on the H2 scale */
.Vtl-ReviewsCarousel__ReviewName {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.Vtl-ReviewsCarousel__Title {
  font-family: var(--font-h2--family) !important;
  font-size: var(--font-h2--size) !important;
  font-weight: var(--font-h2--weight) !important;
  line-height: var(--font-h2--line-height) !important;
  text-transform: none !important;
}

/* Vitals review buttons: brand ink instead of pure black */
.vtl-pr-review-form__button {
  background-color: #232323 !important;
}

/* Globo Product Options rich-text headings (e.g. "Sampler Pack" on pack pages): brand heading font */
.gpo-app .gpo-paragraph :is(h1, h2, h3) {
  font-family: var(--font-heading--family) !important;
  font-weight: var(--font-heading--weight) !important;
  font-size: var(--font-h3--size) !important;
  text-transform: none !important;
}

/* Horizon 4.2.0: rounded cards use overflow:clip, so long one-line titles widened grid columns. Let card content shrink. */
.product-card__content { min-width: 0; }

/* Vitals injects an empty countdown holder (expired 2024 campaign) with a 32px margin above
   Add to cart. Hide it while empty; goes away entirely when Vitals is removed. */
#vitals-countdown-holder:empty { display: none; }

/* Buy-it-now / Shop Pay / PayPal stay hidden on product pages (live parity: Vitals did this
   with its own CSS; the Vitals app embed is off on this theme). Quote-led store. */
.shopify-payment-button,
shopify-accelerated-checkout,
shopify-accelerated-checkout-cart { display: none !important; }

/* ===== LW style controls (scripts/lw-gen-style-settings.py, snippets/lws-vars + lws-section) =====
   Rules below only match when a setting is changed from its default (snippets/lws-vars prints only
   changed values), so untouched settings never change a page. Element styles are generated into each
   block's own stylesheet (/* lws-css */); only the shared button / section rules live here. */
/* Section layout: width + phone padding (lws-sec on the .section element). */
.lws-narrow { --page-width: calc(60rem + var(--page-margin) * 2); }
@media screen and (max-width: 749px) {
  .lws-sec.spacing-style {
    padding-block: calc(var(--lws-pad-top-m, var(--padding-block-start)) + var(--section-top-offset, 0px)) var(--lws-pad-bottom-m, var(--padding-block-end));
  }
}
/* Button style (lws-btn on the button; lws-btns on a row/bar = every button inside). */
:is(.lws-btn[style*="--lws-btn-bg:"]:not(#lws), .lws-btns[style*="--lws-btn-bg:"]:not(#lws) .lws-btn) { background-color: var(--lws-btn-bg) !important; }
:is(.lws-btn[style*="--lws-btn-bg:"]:not(#lws), .lws-btns[style*="--lws-btn-bg:"]:not(#lws) .lws-btn):hover { filter: brightness(0.92); }
:is(.lws-btn[style*="--lws-btn-fg:"]:not(#lws), .lws-btns[style*="--lws-btn-fg:"]:not(#lws) .lws-btn) { color: var(--lws-btn-fg) !important; }
:is(.lws-btn[style*="--lws-btn-border:"]:not(#lws), .lws-btns[style*="--lws-btn-border:"]:not(#lws) .lws-btn) { box-shadow: inset 0 0 0 max(1px, var(--button-border-width, 1px)) var(--lws-btn-border) !important; }
:is(.lws-btn[style*="--lws-btn-radius:"]:not(#lws), .lws-btns[style*="--lws-btn-radius:"]:not(#lws) .lws-btn) { border-radius: var(--lws-btn-radius) !important; }
:is(.lws-btn[style*="--lws-btn-size:"]:not(#lws), .lws-btns[style*="--lws-btn-size:"]:not(#lws) .lws-btn) { font-size: var(--lws-btn-size) !important; }
:is(.lws-btn[style*="--lws-btn-h:"]:not(#lws), .lws-btns[style*="--lws-btn-h:"]:not(#lws) .lws-btn) { min-height: var(--lws-btn-h) !important; padding-block: 0 !important; }
.lws-btns[style*="--lws-btn-gap:"]:not(#lws) { gap: var(--lws-btn-gap) !important; }

/* Tap target: the phone menu button's hit area was 14x46 px (just the icon). Make the box 44 px wide
   with the icon centred, and pull it 15 px left so the icon stays exactly where it was. */
@media screen and (max-width: 989px) {
  header-drawer .header__icon--menu.header__icon--summary {
    box-sizing: border-box;
    min-width: 44px;
    padding-inline: 0 !important;
    margin-inline-start: -15px;
    justify-content: center;
  }
}

/* Policy pages: long URLs/strings must wrap on phones (privacy policy overflowed at 390px). */
.shopify-policy__body, .shopify-policy__container { overflow-wrap: anywhere; }
.shopify-policy__container { max-width: min(65ch, 100%) !important; box-sizing: border-box; }
