/* sks-global.css — loaded by templates/layout/base.html on EVERY page, right after theme.css (render-blocking):
   the layout-critical rules must be present at first paint. Until 2026-09-14 the container escape lived only in
   sks-bc-page.css, loaded inside the page body → the page first painted inside Cornerstone's 1280 px container
   and widened once that file arrived (the "shrinks, then loads" flash). */

/* Cornerstone wraps the page block in .body > .container (max-width 1280px, side padding); the ported Shopify
   pages are full-bleed → neutralise the container for them (same rule as sks-bc-page.css, here for first paint). */
.body > .container:has(.sks-pdp, .sks-plp, #sks-choose-kilt) { padding-left: 0; padding-right: 0; max-width: none; }
.body:has(.sks-pdp, .sks-plp, #sks-choose-kilt) { margin-top: 0 !important; padding-top: 0 !important; }

/* No horizontal scrollbar anywhere: `100vw` includes the vertical scrollbar on Windows (17 px) — the footer's
   full-bleed hack and the two page stylesheets that used it are fixed at the source, this is the safety net.
   `clip` does not create a scroll container (sticky headers keep working). */
html, body { overflow-x: clip; }

/* SKS — Dawn font variables.
 * The ported section CSS refers to var(--font-heading-family) / var(--font-body-family).
 * Those were only declared on .sks-pdp and .sks-plp (assets/sks/css/sks-bc-page.css), so on
 * any page without one of those wrappers the variable was undefined, the font-family
 * declaration became invalid and the text fell back to BigCommerce's Karla / Montserrat.
 * Declared here at the root so they resolve everywhere. This only sets the variables — it
 * does not change the font of anything that does not already ask for them.
 */
:root {
  --font-body-family: Assistant, sans-serif;
  --font-heading-family: Assistant, sans-serif;
  --font-body-scale: 1.0;
  --font-heading-scale: 1.0;
}

/* ---- Reviews.io floating widget: right edge -------------------------------
 * The widget's own stylesheet (assets.reviews.io/css/widgets/floating-widget.css)
 * puts the vertically-centred tab on the RIGHT by default; the per-widget settings
 * saved in Reviews.io (June 2023) override that to the left with these same
 * variables, injected as "[data-widget-id=…] .FloatingWidget-prefix .FloatingWidget".
 * The owner wants it on the right (2026-09-17), so the right-side defaults are put
 * back here with a more specific selector. The launcher's corner rounding is set
 * inline by the script from the same left-side setting, hence the important.
 * Remove this block if the position is ever changed to Right inside Reviews.io.
 */
.reviews-io-floating-widget[data-widget-id] .FloatingWidget-prefix .FloatingWidget.FloatingWidget--positionVerticalCenter {
  --launcher-position-left: auto;
  --launcher-position-right: 0px;
  --panel-position-left: auto;
  --panel-position-right: 0px;
}

.reviews-io-floating-widget[data-widget-id] .FloatingWidget-prefix .FloatingWidget--positionVerticalCenter .R-LauncherButton {
  border-radius: 2px 0 0 2px !important;
  /* owner 2026-09-17: a slimmer tab — the script sets min-width 160px / min-height 155px inline */
  height: auto !important;
  max-width: 150px !important;
  min-height: 0 !important;
  min-width: 150px !important;
  width: 150px !important;
}


/* Phones: no top padding on the body (2026-09-18). Cornerstone pads the body by its fixed header's height
 * (55px, foundation/global/_global.scss) below the "medium" breakpoint; this theme's header (#sks-hd) is in
 * the page flow, so the padding only left a blank strip above the announcement bar. */
@media (max-width: 800px) {
  body {
    padding-top: 0 !important;
  }
}


/* ---- iOS: stop the tap-to-zoom on form fields (2026-09-23) ------------------------
 * iOS Safari zooms the whole page in whenever a focused field's text is under 16px, and
 * it never zooms back out: the page is then wider than the screen with the sticky bars
 * sitting over the content, which reads as the page having frozen. 16px is the threshold,
 * so on touch screens every field you can type into, plus every dropdown, is raised to
 * exactly that. Desktop keeps its own sizes (the query needs a coarse pointer).
 * Deliberately left alone: the header search (input.skf-enhance is the only element with
 * that class, sks-header.html) and checkout, which renders on layout/empty and so never
 * loads this file at all. Sliders, colour swatches, checkboxes, radios, buttons and file
 * pickers never trigger the zoom, so they keep their sizes too.
 */
@media (hover: none) and (pointer: coarse) {
  body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="file"]):not([type="image"]):not(.skf-enhance),
  body select:not(.skf-enhance),
  body textarea {
    font-size: 16px !important;
  }
}