/* Same-origin overrides for the WordPress chrome fonts.
 *
 * The theme's Teko and "Astra" (menu caret icons) @font-face rules use ABSOLUTE
 * https://www.cnaembroidery.com/... URLs. Fonts are always fetched in CORS mode,
 * and those responses carry no Access-Control-Allow-Origin header — so from any
 * other origin (e.g. localhost during dev) the browser blocks them, leaving a
 * fallback font and tofu (□) icon boxes.
 *
 * These declarations re-point the same font families at the catalog's own
 * origin. Injected AFTER the theme CSS (just before </body>), so they win the
 * cascade. Same-origin in both dev and production, so fonts always load.
 */
/* WordPress maps Teko weights 400/500/700 all to the SAME file — Teko Light
   (LYjNdG7kmE0gfaN9pQ.woff2 = our teko-light.woff2). So the site's nav renders
   in Teko Light. Match that exactly for the chrome weights (300–500) so the
   menu has the same advance widths and fits on one line like production.
   Keep 600/700 mapped to the heavier files for the catalog's own headings
   (e.g. "THE CATALOG"), which use font-weight:700. */
@font-face{font-family:'Teko';src:url('fonts/teko-light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Teko';src:url('fonts/teko-light.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Teko';src:url('fonts/teko-light.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Teko';src:url('fonts/teko-semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Teko';src:url('fonts/teko-bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
/* Astra icon font — used by footer social icons and other ast-icons. */
@font-face{font-family:'Astra';src:url('wp-chrome/astra.woff') format('woff');font-weight:normal;font-style:normal;font-display:swap}

/* Dropdown caret: Astra injects the arrow as an inline <svg> via JavaScript
   that runs on the full WordPress page, not in the sliced header snapshot — so
   each parent item is left with two empty .icon-arrow spans (Astra's own
   "hide the first" rule doesn't apply here either). Collapse all of Astra's
   arrow markup and draw exactly one matching CSS chevron on the toggle. */
.menu-item-has-children > .menu-link .ast-icon.icon-arrow{display:none}
.ast-header-navigation-arrow svg{display:none}
.ast-header-navigation-arrow::after{
  content:"";display:inline-block;width:.72em;height:.5em;margin-left:.18em;
  vertical-align:middle;background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Header background: the site's main header bar is navy (#18275d, an Astra
   global setting), but the homepage layers a Transparent Header that makes the
   bar see-through at the top of the page (it normally overlays a navy hero).
   The catalog has no hero behind it, and the sync-chrome snapshot can capture
   either the transparent or the default (white) variant. Force the solid navy
   bar full-width regardless of which variant was snapshotted. */
.ast-primary-header-bar,
.main-header-bar,
#ast-fixed-header .main-header-bar,
.ast-theme-transparent-header .ast-primary-header-bar,
.ast-theme-transparent-header .main-header-bar{
  background-color:#18275d !important;
  background-image:none !important;
}