/*
Theme Name: Shay Lite
Theme URI: https://shayandcompany.com/
Author: Codevelop
Description: Ultra-light WooCommerce theme for Shay & Company. No jQuery, no page builder, no framework. Single inlined stylesheet, ~4KB of deferred JS, built for 100/100 PageSpeed on mobile and desktop.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shay-lite
Tags: e-commerce, custom-menu, custom-logo, translation-ready, accessibility-ready
WC requires at least: 8.0
WC tested up to: 9.9
*/

/* ==========================================================================
   1. Tokens
   ========================================================================== */
:root{
  --deep:#29331F;      /* headings, darkest olive */
  --olive:#4F5E3F;     /* primary action */
  --olive-d:#4F5E3F;   /* hover */
  --sage:#8A9B72;
  --sage-l:#A8B592;
  --mist:#E1E2D9;      /* pale green surface */
  --mist-b:#DDE3D3;
  --cream:#FBF8F2;     /* page background */
  --paper:#F4F2EF;
  --sand:#F6F1E4;      /* warm surface */
  --tan:#F6E3CE;
  --line:#E8E1D2;
  --line-2:#F0EAE0;
  --ink:#2B2B26;       /* body copy */
  --ink-2:#4A4A42;
  --muted:#67645A;
  --gold:#C89A3C;
  --gold-l:#E9CE8E;
  --rust:#8A4E29;
  --rust-2:#A9683F;
  --white:#FFFFFF;
  --night:#1F2716;  
  --grey: #6C6C6C;/* footer */

  --ff: Mulish, sans-serif;
  --wrap:1360px;
  --gut:32px;
  --r:0px;            /* homepage & category are square; product page uses --r-soft */
  --r-soft:12px;
  --shadow:0 14px 32px rgba(41,51,31,.13);
  --t:150ms ease;
}

/* ==========================================================================
   2. Reset
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--ff);font-size:16px;font-weight:400;line-height:1.55;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased}
img,svg,video{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl,dd{margin:0}
ul[role=list],ol[role=list]{list-style:none;padding:0}
a{color:var(--olive);text-decoration:none}
a:hover{color:var(--olive-d);text-decoration:underline}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;background:var(--deep);color:var(--cream);padding:12px 20px;font-weight:800}
.skip-link:focus{left:0}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ==========================================================================
   3. Layout helpers
   ========================================================================== */
.wrap{max-width:var(--wrap);
   margin-inline:auto;
   padding-inline:var(--gut); 
}
.wrap-n{max-width:1000px;margin-inline:auto;padding-inline:var(--gut)}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g5{grid-template-columns:repeat(5,1fr)}
.flex-1{flex:1}
.sec{padding-block:60px 0}

/* Type scale */
.eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--cream);background:var(--olive);padding:7px 14px}
.eyebrow--rust{background:var(--rust)}
.eyebrow--tan{color:var(--rust);background:var(--tan);letter-spacing:.16em;padding:6px 13px}
.h-sec{font-size:34px !important;font-weight:800 !important;letter-spacing:-.025em;color:var(--deep);margin:0;text-transform: capitalize;}
.h-sub{font-size:15.5px;color:var(--muted);margin:4px 0 0}
.lede{font-size:19px;line-height:1.55;color:var(--ink-2);text-wrap:pretty}

/* Section head with rule */
.sec-head{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap;padding-bottom:16px;border-bottom:2px solid var(--deep)}
.link-gold{font-size:14px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--olive);border-bottom:2px solid var(--gold);padding-bottom:3px}
.link-gold:hover{color:var(--deep);text-decoration:none}

/* Buttons */
.btn{display:inline-block;font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:17px 34px;border:0;text-align:center;transition:background var(--t),color var(--t)}
.btn:hover{text-decoration:none}
.btn--primary{color:var(--cream);background:var(--olive)}
.btn--primary:hover{background:var(--deep);color:var(--cream)}
.btn--ghost{color:var(--deep);background:transparent;border:2px solid var(--olive);padding:15px 32px}
.btn--ghost:hover{background:var(--mist-b);color:var(--deep)}
.btn--sm{padding: 12px 14px;font-size:13.5px;letter-spacing:.07em}
.btn--gold{background:var(--gold);color:var(--deep)}
.btn--gold:hover{background:var(--gold-l);color:var(--deep)}
.btn--block{display:block;width:100%}
/* Dark-hero ghost ? cream text + white border, for use on night/olive-d backgrounds */
.btn--ghost-on-dark{color:var(--cream);background:transparent;border:2px solid rgba(255,255,255,.55);padding:15px 32px}
.btn--ghost-on-dark:hover{background:rgba(255,255,255,.12);border-color:var(--cream);color:var(--cream);text-decoration:none}

/* ==========================================================================
   4. Header
   ========================================================================== */

/* Main header row ? logo | search | tools */
.site-header{background:var(--white);position:relative;z-index:100}
.hdr{display:flex;align-items:center;gap:24px;padding-block:8px;border-bottom:1px solid var(--line)}
.brand{flex-shrink:0;display:block;line-height:0}
.brand img{height:80px !important;width:auto}
.brand__text{font-size:20px;font-weight:900;color:var(--deep);letter-spacing:-.02em;line-height:1.1}
.hdr__search{flex:1;min-width:0}

/* Search form */
.searchform{display:flex;align-items:center;border:1.5px solid var(--olive);background:var(--white);border-radius:0;padding:5px 8px 5px 16px;gap:10px;max-width:520px;width:100%;margin: auto;}
.searchform__icon{flex-shrink:0;stroke:var(--muted);fill:none}
.searchform input[type=search]{flex:1;min-width:0;border:0;font-size:14.5px;background:transparent;color:var(--ink)}
.searchform input[type=search]::placeholder{color:var(--muted)}
.searchform input[type=search]:focus{outline:0}
.searchform button{display:none}

/* Header tools */
.hdr__tools{display:flex;align-items:center;gap:20px;flex-shrink:0}
.tool{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--deep);white-space:nowrap;line-height:1.2;border:0;padding:0;background:none;border-radius:0}
.tool:hover{color:var(--olive);text-decoration:none}
.tool svg{stroke:currentColor;fill:none;flex-shrink:0}
.tool--fav span{display:inline}
.tool--cart{border:1.5px solid var(--olive);padding:9px 16px;font-size:13.5px;font-weight:600;color:var(--deep)}
.tool--cart:hover{    border-color: var(--deep);color: var(--white);background: var(--sage);}
.tool__count{background:var(--rust);color:var(--cream);font-size:10px;font-weight:800;border-radius:999px;padding:1px 6px;}
.tool--cart-mobile{display:none}

/* Support dropdown ? phone, email and hours behind one trigger */
.hdr__support{position:relative}
.tool--support{font-family:inherit}
.tool--support .tool__chev{transition:transform var(--t)}
.tool--support[aria-expanded=true] .tool__chev{transform:rotate(180deg)}
.support-panel{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);
  min-width:230px;background:var(--white);border:1.5px solid var(--olive);
  box-shadow:0 10px 24px rgba(43,43,38,.15);
  padding:14px;display:flex;flex-direction:column;gap:10px;z-index:210;
}
.support-panel[hidden]{display:none}
.support-panel__row{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:13.5px;font-weight:600;padding:6px 4px}
.support-panel__row svg{flex-shrink:0;stroke:var(--olive);fill:none}
.support-panel__row:hover{color:var(--olive);text-decoration:none}
.support-panel__hours{font-size:12px;color:var(--muted);padding:2px 4px 0}

/* ==========================================================================
   4a. Category bar (dark) ? menu trigger, quick links, store hours
   ========================================================================== */
.catbar{background:var(--olive-d)}
.catbar__in{display:flex;align-items:stretch;gap:8px}
.catbar__links{
  flex:1;min-width:0;display:flex;align-items:stretch;
  overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
}
.catbar__links::-webkit-scrollbar{display:none}
.catbar__all{
  display:flex;align-items:center;gap:8px;flex-shrink:0;white-space:nowrap;
  background:none;border:0;cursor:pointer;font-family:inherit;
  padding:12px 16px;margin-left:-12px;
  font-size:14px;font-weight:700;color:var(--cream);
  transition:background var(--t);
}
.catbar__all:hover{background:rgba(255,255,255,.08)}
.catbar__all svg{flex-shrink:0;stroke:currentColor;fill:none}
.catbar__link{
  display:flex;align-items:center;flex-shrink:0;white-space:nowrap;
  padding:12px 14px;font-size:13.5px;font-weight:600;color:var(--gold-l);
  transition:background var(--t),color var(--t);
}
.catbar__link:hover{background:rgba(255,255,255,.08);color:#FFF2CE;text-decoration:none}
.catbar__meta{
  display:flex;align-items:center;gap:14px;flex-shrink:0;white-space:nowrap;
  padding-left:14px;font-size:12.5px;color:var(--mist-b);
  border-left:1px solid rgba(255,255,255,.15);
}
.catbar__sep{color:rgb(107,122,90)}
.catbar__meta a{color:var(--mist-b)}
.catbar__meta a:hover{color:var(--white);text-decoration:none}

/* Nav ? two rows */
.nav{display:none}
.nav__in{display:flex;align-items:center;justify-content:center;flex-wrap:wrap}
.nav__in--primary{border-bottom:1px solid rgba(255,255,255,.08)}
.nav__in--secondary{    background: rgb(43, 43, 38);}

/* Menu base */
.menu{display:flex;align-items:center;list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:center}
.menu > li{position:relative}
.menu > li > a{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(251,248,242,.85);padding:13px 14px;white-space:nowrap;transition:color var(--t)}
.menu > li > a:hover,.menu > li:hover > a,.menu > li.is-open > a{text-decoration:none}
.menu > li.menu-item-highlight > a{background:var(--gold);color:var(--deep);border-radius:999px;padding:7px 16px;margin:6px 8px;font-size:11.5px}
.menu > li.menu-item-highlight > a:hover{background:var(--gold-l);color:var(--deep)}

/* Chevron on items with children */
.menu > li.menu-item-has-children > a::after,
.menu > li.has-children > a::after{content:"";display:inline-block;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.65;margin-left:2px}
.menu .sub-menu{display:none;position:absolute;top:100%;left:0;min-width:220px;background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow);list-style:none;margin:0;padding:8px 0;z-index:200}
.menu li.is-open > .sub-menu{display:block}
@media (hover:none){.menu li:hover > .sub-menu{display:none}.menu li.is-open > .sub-menu{display:block}}
.menu .sub-menu a{display:block;padding:9px 18px;font-size:13.5px;font-weight:500;color:var(--ink);transition:background var(--t)}
.menu .sub-menu a:hover{background:var(--mist);color:var(--deep);text-decoration:none}
.menu .sub-menu .sub-menu{top:0;left:100%}

/* Mega panel */
.menu > li.mega{position:static}
.menu > li.mega > .sub-menu{
  left:0;right:0;width:100%;padding:32px var(--gut) 36px;
  display:none;columns:unset;
  grid-template-columns:repeat(4,1fr) 280px;
  gap:0 32px;
  background:var(--white);
  border-top:2px solid var(--gold);
  box-shadow:0 20px 40px rgba(41,51,31,.14);
}
.menu > li.mega:hover > .sub-menu,.menu > li.mega.is-open > .sub-menu{display:grid}
@media (hover:none){.menu > li.mega:hover > .sub-menu{display:none}.menu > li.mega.is-open > .sub-menu{display:grid}}

/* Mega column headings */
.menu > li.mega > .sub-menu > li{break-inside:unset;margin-bottom:0}
.menu > li.mega > .sub-menu > li > a{
  display:block;font-size:11px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--rust);padding:0 0 10px;
  border-bottom:0;margin-bottom:8px;
}
.menu > li.mega > .sub-menu > li > a:hover{color:var(--rust-2);background:none;text-decoration:none}

/* Mega sub-items */
.menu > li.mega > .sub-menu .sub-menu{
  display:block;position:static;border:0;box-shadow:none;
  padding:0;min-width:0;background:none;
}
.menu > li.mega > .sub-menu .sub-menu a{
  padding:6px 0;font-size:13.5px;font-weight:400;color:var(--ink-2);
  border-bottom:0;
}
.menu > li.mega > .sub-menu .sub-menu a:hover{background:none;color:var(--olive)}

/* Mega "Read more" links */
.menu > li.mega > .sub-menu .sub-menu .menu-item-read-more > a{
  color:var(--rust);font-weight:600;font-size:13px;
}

/* Mega images panel (last column) */
.mega-images{display:flex;flex-direction:column;gap:16px}
.mega-images__item{display:block;text-decoration:none}
.mega-images__item img{width:100%;height:100px;object-fit:cover;display:block}
.mega-images__label{font-size:12.5px;font-weight:600;color:var(--deep);margin-top:6px}
.mega-images__item:hover .mega-images__label{color:var(--olive)}

/* Mobile toggle button (hidden on desktop) */
.nav__toggle{display:none}

/* ==========================================================================
   4b. Mobile drawer
   ========================================================================== */
.mob-drawer{position:fixed;inset:0;z-index:500;pointer-events:none;visibility:hidden}
.mob-drawer.is-open{pointer-events:auto;visibility:visible}
.mob-drawer__overlay{position:absolute;inset:0;background:rgba(0,0,0,.45);opacity:0;transition:opacity .3s ease}
.mob-drawer.is-open .mob-drawer__overlay{opacity:1}
.mob-drawer__panel{
  position:absolute;top:0;left:0;bottom:0;
  width:min(320px,88vw);
  background:var(--cream);
  display:flex;flex-direction:column;
  transform:translateX(-100%);
  transition:transform .3s ease;
  overflow-y:auto;
  z-index:1;
}
.mob-drawer.is-open .mob-drawer__panel{transform:translateX(0)}
.mob-drawer__head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px;border-bottom:1px solid var(--line);
  flex-shrink:0;
}
.mob-drawer__title{font-size:22px;font-weight:700;color:var(--olive-d)}
.mob-drawer__actions{display:flex;align-items:center;gap:10px}
.mob-drawer__mail{color:var(--olive-d);display:flex;padding:4px}
.mob-drawer__mail:hover{color:var(--olive)}
.mob-drawer__mail svg{stroke:currentColor;fill:none}
.mob-drawer__close{background:none;border:0;padding:4px;color:var(--olive-d);display:flex}
.mob-drawer__close:hover{color:var(--olive)}
.mob-drawer__body{flex:1;overflow-y:auto}

.mob-menu{list-style:none;margin:0;padding:0;display:block;flex-wrap:unset;justify-content:unset}
.mob-menu > li{position:relative;display:block}
.mob-menu > li.mega{position:relative}
.mob-menu > li > a{display:none !important}
.mob-menu > li:not(.menu-item-has-children):not(.has-children) > a{display:flex !important;align-items:center;padding:13px 20px;font-size:15.5px;font-weight:600;color:var(--ink);background:transparent;border-bottom:1px solid var(--line-2);text-transform:none;letter-spacing:0}
.mob-menu > li:not(.menu-item-has-children):not(.has-children) > a::after{display:none !important}
.mob-menu > li:not(.menu-item-has-children):not(.has-children) > a:hover{color:var(--olive);text-decoration:none}
.mob-menu > li.menu-item-highlight > a{display:flex !important;padding:13px 20px;font-size:15.5px;font-weight:700;color:var(--rust);background:var(--cream);border-bottom:1px solid var(--line-2);text-transform:none;letter-spacing:0}
.mob-menu .nav__toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:13px 20px;font-size:15.5px;font-weight:600;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line-2);cursor:pointer;text-align:left;font-family:var(--ff)}
.mob-menu > li.is-open > .nav__toggle{background:var(--deep);color:var(--cream);font-weight:700}
.mob-menu .nav__toggle::after{content:"";display:block;flex-shrink:0;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-3px;transition:transform .2s ease}
.mob-menu > li.is-open > .nav__toggle::after{transform:rotate(-135deg);margin-top:3px}
.mob-menu .sub-menu{display:none;list-style:none;margin:0;padding:0;position:static;width:auto;min-width:0;box-shadow:none;border:0;columns:unset;grid-template-columns:unset}
.mob-menu > li.is-open > .sub-menu,.mob-menu > li.mega.is-open > .sub-menu{display:block}
.mob-menu .sub-menu > li{display:block;border-bottom:1px solid var(--line-2)}
.mob-menu .sub-menu > li > a{display:flex !important;align-items:center;justify-content:space-between;padding:11px 20px 11px 34px;font-size:14px;font-weight:700;color:var(--ink);background:var(--mist);text-transform:none;letter-spacing:0}
.mob-menu .sub-menu > li > a::after{display:none !important}
.mob-menu .sub-menu > li > a:hover{color:var(--olive);text-decoration:none}
.mob-menu .sub-menu > li.is-open > a{background:var(--mist-b)}
.mob-menu .sub-menu .nav__toggle{padding:11px 20px 11px 34px;font-size:14px;font-weight:700;background:var(--mist);border-bottom:1px solid var(--line-2)}
.mob-menu .sub-menu > li.is-open > .nav__toggle{background:var(--mist-b);color:var(--ink)}
.mob-menu .sub-menu .sub-menu{display:none;position:static;box-shadow:none;border:0;background:var(--cream)}
.mob-menu .sub-menu li.is-open > .sub-menu{display:block}
.mob-menu .sub-menu .sub-menu > li{border-bottom:1px solid var(--line-2)}
.mob-menu .sub-menu .sub-menu a{display:block !important;padding:9px 20px 9px 48px;font-size:13px;font-weight:500;color:var(--rust-2);background:var(--cream);text-transform:none;letter-spacing:0}
.mob-menu .sub-menu .sub-menu a::after{display:none !important}
.mob-menu .sub-menu .sub-menu a:hover{color:var(--rust);text-decoration:none}
/* "View all <Category>" ? the only route to a parent category's own page,
   since the parent <a> is hidden in the drawer. */
.mob-menu .sub-menu > li.menu-item-view-all > a{
  display:flex !important;align-items:center;
  padding:11px 20px 11px 34px;font-size:13.5px;font-weight:700;
  color:var(--rust);background:var(--mist);
  text-transform:none;letter-spacing:0;
}
.mob-menu .sub-menu > li.menu-item-view-all > a:hover{color:var(--rust-2);text-decoration:underline}
.mob-menu .sub-menu > li.menu-item-view-all > a::after{display:none !important}
.mob-drawer__foot{
  flex-shrink:0;padding:16px 20px 20px;
  border-top:1px solid var(--line);
  background:var(--cream);
}
.mob-drawer__phone{display:block;font-size:15px;font-weight:700;color:var(--rust);margin-bottom:4px}
.mob-drawer__phone:hover{text-decoration:none;color:var(--rust-2)}
.mob-drawer__hours{font-size:13px;color:var(--muted);line-height:1.5;margin:0 0 14px}
.mob-drawer__links{display:flex;gap:20px;font-size:14px;font-weight:600}
.mob-drawer__links a{color:var(--deep)}
.mob-drawer__links a:hover{color:var(--olive);text-decoration:none}

/* --------------------------------------------------------------------------
   Drawer vs mega panel.

   The drawer prints the same markup as the header nav ? class "menu mob-menu"
   ? so every `.menu > li.mega > .sub-menu` rule from section 4 also matches
   inside the drawer, and those selectors are MORE specific than the plain
   `.mob-menu .sub-menu` resets above. That is what leaked the full-width
   grid panel, its 32px padding, the white background and the gold top border
   into a 320px drawer, and what forced third-level lists permanently open.

   These selectors mirror the mega ones exactly, so they match specificity and
   win on source order. They must stay after section 4.
   -------------------------------------------------------------------------- */

/* Panel shell ? undo everything the desktop mega panel sets */
.mob-menu > li.mega{position:relative}
.mob-menu > li.mega > .sub-menu{
  position:static;left:auto;right:auto;width:auto;min-width:0;
  padding:0;margin:0;background:none;border:0;border-top:0;box-shadow:none;
  columns:unset;grid-template-columns:unset;gap:0;
  display:none;
}

/* Open/close is driven by .is-open only ? never by hover */
.mob-menu > li.mega:hover > .sub-menu{display:none}
.mob-menu > li.mega.is-open > .sub-menu,
.mob-menu > li.mega.is-open:hover > .sub-menu{display:block}

/* Second level: a normal drawer row, not a mega column heading */
.mob-menu > li.mega > .sub-menu > li{margin:0;break-inside:unset;border-bottom:1px solid var(--line-2)}
.mob-menu > li.mega > .sub-menu > li > a{
  display:flex;align-items:center;
  padding:11px 20px 11px 34px;margin:0;border:0;
  font-size:14px;font-weight:700;letter-spacing:0;text-transform:none;
  color:var(--ink);background:var(--mist);
}
.mob-menu > li.mega > .sub-menu > li > a:hover{color:var(--olive);background:var(--mist-b)}
.mob-menu > li.mega > .sub-menu > li.menu-item-view-all > a{color:var(--rust);font-size:13.5px}

/* Third level: collapsed until its parent row is opened */
.mob-menu > li.mega > .sub-menu .sub-menu{display:none;position:static;padding:0;background:var(--cream)}
.mob-menu > li.mega > .sub-menu li.is-open > .sub-menu{display:block}
.mob-menu > li.mega > .sub-menu .sub-menu a{
  padding:9px 20px 9px 48px;font-size:13px;font-weight:500;
  color:var(--rust-2);background:var(--cream);
}
.mob-menu > li.mega > .sub-menu .sub-menu a:hover{color:var(--rust)}

/* --------------------------------------------------------------------------
   Duplicate rows inside sub-menus.

   For ANY item with children the walker prints two elements ? an <a>
   (the desktop hover target) and a .nav__toggle (the drawer row) ? both
   carrying the same title. Top level hides the <a> via
   `.mob-menu > li > a{display:none}`, but that selector only matches depth 0,
   so inside sub-menus both were rendering and every label appeared twice.

   Rather than hide one (which would make the category page unreachable, since
   the walker emits no "View all" item), lay them out as a single row: the
   link takes the width and navigates, the button shrinks to just the chevron
   and only expands.
   -------------------------------------------------------------------------- */
.mob-menu .sub-menu > li.menu-item-has-children,
.mob-menu .sub-menu > li.has-children{display:flex;flex-wrap:wrap;align-items:stretch}

.mob-menu .sub-menu > li.menu-item-has-children > a,
.mob-menu .sub-menu > li.has-children > a{flex:1 1 auto;min-width:0;border-bottom:0}

.mob-menu .sub-menu > li.menu-item-has-children > .nav__toggle,
.mob-menu .sub-menu > li.has-children > .nav__toggle{
  flex:0 0 46px;width:46px;padding:11px 0;
  justify-content:center;border-bottom:0;border-left:1px solid var(--line-2);
  background:var(--mist);
}
/* The button repeats the title for screen readers on desktop; in the drawer
   the adjacent link already provides it, so hide the duplicate text only. */
.mob-menu .sub-menu > li.menu-item-has-children > .nav__toggle .nav__toggle-label,
.mob-menu .sub-menu > li.has-children > .nav__toggle .nav__toggle-label{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
/* Third level drops onto its own row beneath the pair */
.mob-menu .sub-menu > li.menu-item-has-children > .sub-menu,
.mob-menu .sub-menu > li.has-children > .sub-menu{flex:1 0 100%}

/* --------------------------------------------------------------------------
   Current page highlight.

   Selectors are repeated at mega-panel depth because the mega rules in
   section 4 are more specific than a plain `.mob-menu li` selector and would
   otherwise repaint the row back to its normal colours.
   -------------------------------------------------------------------------- */
.mob-menu li.is-current > a,
.mob-menu li.current-menu-item > a,
.mob-menu .sub-menu > li.is-current > a,
.mob-menu > li.mega > .sub-menu > li.is-current > a,
.mob-menu > li.mega > .sub-menu .sub-menu li.is-current > a{
  color:var(--olive);
  font-weight:800;
  background:var(--mist-b);
  box-shadow:inset 3px 0 0 var(--olive);
}

/* Ancestors of the current page ? open, and subtly marked */
.mob-menu li.is-current-ancestor > .nav__toggle{color:var(--olive-d);font-weight:800}
.mob-menu > li.is-current-ancestor > .nav__toggle{background:var(--deep);color:var(--cream)}

/* The drawer must never scroll sideways */
.mob-drawer__body,.mob-menu,.mob-menu .sub-menu{max-width:100%;overflow-x:hidden}



.page-template-default .page-hero .wrap {
    padding-block: 10px;
}
.page-template-default .page-hero h1 {
    margin: 20px 0 10px;
}


/* ==========================================================================
   5. Home
   ========================================================================== */
.hero{position: relative;
    background: center center / cover no-repeat rgb(239, 242, 231);
    background-image: var(--hero-bg-desktop, url(https://shayandcompany.com/wp-content/uploads/2026/08/shayandcompany-banner.webp));
    opacity: 1;
   }
.hero__in{position:relative;padding-block:96px 100px}
.hero__box{max-width:660px;margin-left:auto;text-align:right;background-color: #FFFFFF9C;}
.hero h1{font-size:60px;font-weight:700;line-height:1.02;letter-spacing:-.035em;color:var(--deep);margin:20px 0 0;text-transform: capitalize;}
   .hero .hero-text{ 
   font-size: 20px;
    line-height: 1.55;
    color: rgb(58, 70, 48);
    margin: 20px 0px 0px auto;
    max-width: 570px;
    text-wrap: pretty;
   }
.hero__cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap;justify-content:flex-end}

.creds{background:var(--white);border-bottom:1px solid var(--line)}
.creds__in{
    padding: 15px 30px;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 16px;
}
.cred{display:flex;align-items:center;gap:10px;    padding: 0 10px;}
.cred:hover{text-decoration:none;    background: var(--mist);}
.cred img{width:46px;height:46px;object-fit:contain;flex-shrink:0}
.cred b{display:block;font-size:13px;font-weight:800;color:var(--deep);line-height:1.25}
.cred span{display:block;font-size:11.5px;line-height:1.35;color:var(--muted);margin-top:2px}

.tile{display:block;position:relative;overflow:hidden;background:var(--deep)}
.tile:hover{text-decoration:none}
.tile img{width:100%;height:250px;object-fit:cover;opacity:.82;transition:transform 400ms ease}
.tile:hover img{transform:scale(1.04)}
.tile__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(41,51,31,0) 34%,rgba(41,51,31,.86) 100%)}
.tile__txt{position:absolute;left:0;right:0;bottom:0;padding:18px 18px 20px}
.tile__txt b{display:block;font-size:19px;font-weight:800;color:var(--cream);letter-spacing:-.015em;text-transform: capitalize;}
.tile__txt span{display:block;font-size:13px;font-weight:600;color:var(--mist-b);margin-top:3px}

/* Product card (home + shop) */
.card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);transition:box-shadow var(--t),transform var(--t)}
.card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.card__media{position:relative;background:var(--sand)}
.card__media img{width:100%;aspect-ratio:1/1;object-fit:cover}
.card__flags{position:absolute;top:11px;left:11px;display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.flag{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:5px 9px;color:var(--deep);background:var(--line-2)}
.flag--new{color:var(--cream);background:var(--rust)}
.flag--organic{color:var(--cream);background:var(--olive)}
.flag--best{color:var(--cream);background:var(--rust)}
.flag--soft{color:var(--deep);background:var(--mist-b)}
.flag--gold{color:var(--deep);background:var(--gold-l)}
.card__body{padding:17px 19px 19px;display:flex;flex-direction:column;gap:8px;flex:1}
.card__cat{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0}
.card__title, .card__title a{font-size:17.5px;font-weight:800;line-height:1.25;letter-spacing:-.012em;margin:0}
.card__title a{color:var(--deep)}
.card__title a:hover{color:var(--olive);text-decoration:none}
.card__excerpt {
    font-size: 14px;
    line-height: 1.5;
    color: var(--muted);
    margin: 0;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    overflow: hidden;
    text-wrap: pretty;
    -webkit-box-orient: vertical;
}
.card__rating{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--muted)}
.stars{color:#A8741A;letter-spacing:.06em;font-size:14px}
.card__foot{border-top:1px solid var(--line-2);padding-top:12px;margin-top:4px}
.card__price{display:flex;align-items:baseline;gap:7px}
.card__price small{font-size:13px;font-weight:600;color:var(--muted)}
.card__price b{font-size:27px;font-weight:800;color:var(--deep);line-height:1;letter-spacing:-.028em}
.card__sizes{font-size:13px;color:var(--muted);margin-top:5px}
.card__stock{font-size:13px;font-weight:700;margin-top:4px;color:var(--olive)}
.card__stock--low{color:var(--rust)}
.card__stock--out{color:var(--muted)}
.card--compact .card__title{font-size:16px}
.card--compact .card__body{padding:15px 17px 17px;gap:7px}
.card--compact .card__price b{font-size:19px}

/* Category tiles */
.cat-card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);transition:box-shadow var(--t),transform var(--t)}
.cat-card:hover{box-shadow:var(--shadow);transform:translateY(-2px);text-decoration:none}
.cat-card img{width:100%;height:148px;object-fit:cover}
.cat-card b{display:block;padding:15px 17px 17px;font-size:15.5px;font-weight:800;color:var(--deep);line-height:1.25;letter-spacing:-.01em}
.cat-card span{color:var(--muted);font-weight:600}

/* Newsletter posts strip */
.band-mist{background:var(--mist);border-block:1px solid var(--mist-b);margin-top:68px}
.band-mist .wrap{padding-block:56px}
.post-card{display:flex;gap:16px;background:var(--white);border:1px solid var(--mist-b);padding:16px;transition:box-shadow var(--t)}
.post-card:hover{box-shadow:0 12px 28px rgba(41,51,31,.12);text-decoration:none}
.post-card img{width:104px;height:104px;object-fit:cover;flex-shrink:0}
.post-card time{display:block;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--rust)}
.post-card b{display:block;font-size:16.5px;font-weight:800;color:var(--deep);line-height:1.3;margin-top:5px;letter-spacing:-.012em}
.post-card p{font-size:13.5px;line-height:1.5;color:var(--muted);margin-top:6px}

/* Visit */
.visit{display:grid;grid-template-columns:1fr 1.05fr;gap:52px;align-items:center;padding-block:68px}
.visit__media{position:relative}
.visit__media::before{content:"";position:absolute;inset:-14px 14px 14px -14px;background:var(--mist-b)}
.visit__media img{position:relative;width:100%;height:380px;object-fit:cover}
.visit h2{font-size:38px;font-weight:800;margin:16px 0 0;color:var(--deep);letter-spacing:-.028em;line-height:1.08;    text-transform: capitalize;}
.visit p{font-size:16.5px;line-height:1.65;color:var(--ink-2);margin-top:16px;text-wrap:pretty}
.facts{display:flex;gap:30px;flex-wrap:wrap;margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}
.facts dt{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.facts dd{font-size:15.5px;font-weight:600;color:var(--deep);margin:4px 0 0}

/* Signup band */
.signup{background: var(--olive)}
.signup__in{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding-block:52px}
.signup h2{font-size:32px;font-weight:800;color:var(--cream);letter-spacing:-.024em;margin:0}
.signup p{font-size:16px;color:var(--mist-b);margin-top:8px}
.signup form{display:flex;gap:10px;flex-wrap:wrap}
.signup input[type=email]{flex:1;min-width:240px;font-size:16px;color:var(--deep);background:var(--cream);border:0;padding:17px 20px}
.signup button{font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--deep);background:var(--gold);border:0;padding:17px 32px;white-space:nowrap}
.signup button:hover{background:var(--gold-l)}

/* ==========================================================================
   6. Shop archive
   ========================================================================== */
.tax-hero{background:linear-gradient(150deg,var(--mist) 0%,var(--sand) 52%,var(--cream) 100%);border-bottom:1px solid var(--line)}
.tax-hero__in{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding-block:22px 40px}
.tax-hero h1{font-size:48px;font-weight:700;line-height:1.02;margin:16px 0 0;color:var(--deep);letter-spacing:-.032em}
.tax-hero__media{position:relative}
.tax-hero__media::before{content:"";position:absolute;inset:14px -14px -14px 14px;background:var(--gold)}
.tax-hero__media img{position:relative;width:100%;height:285px;object-fit:cover}
.crumbs{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:15px}
.crumbs a{color:var(--muted);text-transform: uppercase;}
.crumbs [aria-current]{color:var(--olive-d);font-weight:600;text-transform: uppercase;}
.tax-hero__desc p{font-size:16px;line-height:1.65;color:var(--ink-2);text-wrap:pretty;margin-top:12px}
.tax-hero__desc p:first-child{margin-top:0}
.desc-body{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4}
.desc-body.is-open{display:block;-webkit-line-clamp:unset;line-clamp:unset}
.desc-toggle{background:none;border:0;padding:0;margin-top:10px;font-size:14px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--olive);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.desc-toggle:hover{color:var(--deep)}
.about-panel{background:var(--mist);border-bottom:1px solid var(--mist-b)}
.about-panel .wrap{padding-block:34px}
.about-panel h2{font-size:17px;font-weight:800;margin:0 0 9px;color:var(--deep)}
.about-panel p{font-size:14.5px;line-height:1.65;color:var(--ink-2)}

.subcat{display:flex;flex-direction:column;gap:8px;padding:20px 22px;border:1px solid rgba(41,51,31,.09);background:var(--sand);color:var(--deep);transition:transform 140ms ease,box-shadow 140ms ease}
.subcat:hover{transform:translateY(-2px);box-shadow:var(--shadow);text-decoration:none}
.subcat__top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.subcat b{font-size:17.5px;font-weight:800;line-height:1.2;letter-spacing:-.01em}
.subcat i{font-style:normal;font-size:12.5px;font-weight:800;white-space:nowrap;padding:3px 9px;background:#EAE2CE}
.subcat span{font-size:13.5px;line-height:1.45;color:var(--muted)}
.subcat--a{background:var(--olive);color:var(--cream)}
.subcat--a i{background:var(--olive-d);color:var(--cream)}
.subcat--a span{color:#D8E0CB}
.subcat--b{background:var(--mist)}
.subcat--b i{background:var(--mist-b)}
.subcat--b span{color:#5A6149}
.subcat--c{background:var(--tan);color:#45391C}
.subcat--c i{background:#EFD2B0}
.subcat--c span{color:#7A6141}
.subcat--d{background:var(--deep);color:var(--cream)}
.subcat--d i{background:var(--olive);color:var(--cream)}
.subcat--d span{color:#D3DBC5}
.subcat--white{background:var(--white);color:var(--deep);border-color:var(--line)}
.subcat--white i{background:var(--mist);color:var(--deep)}
.subcat--white span{color:var(--muted)}

/* Category icon cards (home page) */
.cat-icon-card{display:flex;align-items:center;gap:12px;background:var(--white);border:1px solid var(--line);padding:12px 14px;transition:box-shadow var(--t),transform var(--t),border-color var(--t)}
.cat-icon-card:hover{box-shadow:var(--shadow);transform:translateY(-2px);border-color:var(--mist-b);text-decoration:none}
.cat-icon-card__icon{width:40px;height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cat-icon-card__text{min-width:0}
.cat-icon-card__text b{display:block;font-size:13px;font-weight:800;color:var(--deep);line-height:1.25;letter-spacing:-.005em}
.cat-icon-card__text span{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}

.toolbar{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;color:var(--ink-2)}
.toolbar select{font-size:14.5px;font-weight:600;color:var(--deep);background:var(--white);border:1.5px solid #C4CBB2;padding:11px 14px}
.count{font-size:14.5px;color:var(--muted);margin-top:3px}
.load-more{display:flex;justify-content:center;padding-top:40px}
.pager{display:flex;justify-content:center;gap:8px;padding:40px 0 0;flex-wrap:wrap}
.pager .page-numbers{padding:12px 18px;font-weight:800;font-size:14px;border:1px solid var(--line);background:var(--white);color:var(--deep)}
.pager .current{background:var(--olive);color:var(--cream);border-color:var(--olive)}

.trust{margin-top:64px;background:linear-gradient(120deg,var(--deep) 0%,var(--olive-d) 58%,var(--olive) 100%);color:#F1EEE4}
.trust .wrap{padding-block:52px}
.trust h2{font-size:32px;font-weight:800;color:var(--cream);letter-spacing:-.022em;margin:0 0 6px}
.trust__lead{font-size:16px;color:var(--mist-b);margin-bottom:32px}
.trust__item{border-top:3px solid var(--gold);padding-top:18px}
.trust__item b,.trust__item .trust__title{display:block;margin:0 0 8px;font-family:inherit;line-height:1.3;font-size:17px;font-weight:800;color:var(--cream);margin-bottom:8px}
.trust__item p{font-size:14.5px;line-height:1.6;color:var(--mist-b);margin-bottom:10px}
.trust__item a{font-size:13.5px;font-weight:700;color:var(--gold-l)}

.faq-band{background:var(--sand)}
.faq-band .wrap-n{padding-block:60px 72px}
.acc{border-top:2px solid var(--deep)}
.acc__item{border-bottom:1px solid #E0D9C8}
.acc__item[open]{background:var(--cream)}
.acc__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:22px;background:none;border:0;padding:21px 16px;text-align:left;font-size:17.5px;font-weight:700;color:var(--deep);font-family:var(--ff)}
.acc__q::after{content:"+";font-size:24px;font-weight:400;color:var(--rust);line-height:1}
.acc__item[open] .acc__q::after{content:"?"}
.acc__a{font-size:15.5px;line-height:1.7;color:var(--ink-2);padding:0 16px 24px;text-wrap:pretty}

.bulk{background:var(--gold)}
.bulk .wrap{display:flex;align-items:center;gap:30px;flex-wrap:wrap;padding-block:40px}
.bulk h2{font-size:27px;font-weight:800;margin:0 0 5px;color:var(--deep);letter-spacing:-.02em}
.bulk p{font-size:15.5px;color:#3A2F13;max-width:620px}
.bulk .btn--primary{background:var(--deep);color:#F1EEE4}
.bulk .btn--ghost{border-color:var(--deep);color:var(--deep)}
.bulk .btn--ghost:hover{background:var(--gold-l)}

/* ==========================================================================
   7. Single product
   ========================================================================== */
.pdp{background:var(--paper)}
/* .pdp .wrap{max-width:1280px} */
.pdp__title{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;padding-top: 15px;padding-bottom: 20px;}
.pdp__title h1{font-size:32px;font-weight:600;line-height:1.08;color:var(--ink);margin:0}
.pdp__subtitle{font-weight: 600;line-height: 1.08;color: var(--ink);}
.pdp__kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);font-weight:600}
.pdp__main{display:grid;grid-template-columns:360px 1fr 440px;gap:36px;align-items:start;}
.gallery__main{background:var(--white);border:1px solid #DDD9D2;border-radius:var(--r-soft);overflow:hidden;position:relative}
.gallery__main img{width:100%;aspect-ratio:1;object-fit:cover}
.gallery__flag{position:absolute;top:16px;left:16px;background:var(--olive);color:var(--paper);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:6px 14px;border-radius:999px}
.gallery__thumbs{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}
.gallery__thumbs button{width:92px;height:92px;border-radius:10px;border:1px solid #DDD9D2;padding:0;overflow:hidden;background:var(--white);opacity:.75}
.gallery__thumbs button[aria-current=true]{border:2px solid var(--olive);opacity:1}
.gallery__thumbs img{width:100%;height:100%;object-fit:cover}
.pdp__short{font-size:16px;line-height:1.6;color:var(--muted);max-width:520px;flex:1;    margin-top: -2px;}
.pdp__meta{display:flex;align-items:center;gap:16px;margin-top:16px;font-size:14px;color:var(--muted)}
.dot-stock{display:flex;align-items:center;gap:6px;color:var(--olive);font-weight:500}
.dot-stock::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--olive)}
.chips{
    margin-top: 16px;
    max-width: 420px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 6px;
}
.chip{background: rgb(200 154 60 / 90%);
    color: var(--deep);
    border: 1px solid rgba(200, 154, 60, .4);font-size:11px;font-weight:600;letter-spacing:.1em;padding:5px 12px;border-radius:999px;text-transform:uppercase;white-space: nowrap;}
.chip:hover{text-decoration:none;background:rgba(200,154,60,.28)}
.card__tags{margin-top:0}
.product .chips::-webkit-scrollbar-thumb {
    background-color: #2F4F13;
    border-radius: 10px;
}
.product .chips::-webkit-scrollbar {
    height: 5px;
    cursor: pointer;
}
.claims{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px 14px;margin-top:24px;max-width:420px}
.claims img{height:80px;width:auto;object-fit:contain}
/* Product Features ? the badge artwork usually carries its own label, so the
   term name is the alt text and feature_text becomes the hover title. */
.claim{display:flex;flex-direction:column;align-items:center;gap:4px;line-height:1}
.claim[title]{cursor:help}
.claim--text{padding:6px 12px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--olive-d);background:rgba(138,155,114,.18);border:1px solid rgba(138,155,114,.5)}
@media (max-width:560px){
  .claims{max-width:none;gap:10px;margin-top: 10px;}
  .claims img{height:62px}
}
.fav{width:44px;height:44px;flex-shrink:0;border:1.5px solid #DDD9D2;border-radius:50%;background:var(--white);display:flex;align-items:center;justify-content:center;padding:0}
.fav:hover{border-color:var(--olive)}
.fav svg{width:18px;height:18px;stroke:var(--olive);stroke-width:2;fill:none}
.fav[aria-pressed=true] svg{fill:var(--olive)}
.fav.is-busy{opacity:.5;pointer-events:none}

/* Favorite toggle on a product card */
.card__fav{position:absolute;top:11px;right:11px;width:34px;height:34px}
.card__fav svg{width:15px;height:15px}

/* Favorites page */
.shay-fav-heading{font-size:20px;font-weight:800;color:var(--deep);letter-spacing:-.01em;margin:0 0 18px;padding-bottom:12px;border-bottom:2px solid var(--deep)}
.shay-fav-list{display:flex;flex-direction:column;gap:14px}
.shay-fav-row{display:flex;align-items:center;gap:18px;border:1px solid var(--line);border-radius:10px;padding:14px 18px;background:var(--white)}
.shay-fav-row--head{border:0;padding:12px 18px 10px;margin-bottom:4px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.shay-fav-row--head .shay-fav-thumb{width:64px}
.shay-fav-thumb{flex:0 0 64px;width:64px;height:64px}
.shay-fav-thumb img{width:64px;height:64px;object-fit:cover;border:1px solid var(--line);border-radius:8px;display:block}
.shay-fav-info{flex:1 1 260px;min-width:0}
.shay-fav-title{font-size:16px;font-weight:800;line-height:1.3;margin-bottom:4px}
.shay-fav-title a{color:inherit;text-decoration:none}
.shay-fav-title a:hover{text-decoration:underline}
.shay-fav-lastbought{font-size:13px;color:var(--muted)}
.shay-fav-lastbought--never{font-style:italic}
.shay-fav-reorder{display:inline-flex;align-items:center;gap:6px;margin-top:6px;border:1px solid var(--gold-l);border-radius:20px;background:var(--sand);color:var(--olive-d);font-size:12px;font-weight:700;padding:4px 12px;cursor:pointer}
.shay-fav-reorder:hover{background:var(--gold-l)}
.shay-fav-reorder.is-busy{opacity:.6;pointer-events:none}
.shay-fav-review{flex:0 0 auto}
.shay-fav-review a{font-size:14px;color:var(--olive-d);text-decoration:underline}
.shay-fav-actions{flex:0 0 auto;display:flex;align-items:center;gap:12px}
.shay-fav-remove{width:18px;height:18px;accent-color:var(--olive);cursor:pointer}
@media (max-width:700px){
  .shay-fav-row{flex-wrap:wrap}
  .shay-fav-review{order:3}
  .shay-fav-actions{order:4;flex:1 1 100%;justify-content:space-between}
  .shay-fav-row--head{display:none}
}

/* Purchased Products page */
.shay-empty{padding:10px 0;color:var(--muted)}
.shay-pp-heading{font-size:20px;font-weight:800;color:var(--deep);letter-spacing:-.01em;margin:0 0 18px;padding-bottom:12px;border-bottom:2px solid var(--deep)}
.shay-pp-list{display:flex;flex-direction:column;gap:16px}
.shay-pp-card{display:flex;align-items:center;gap:18px;border:1px solid var(--line);border-radius:10px;padding:16px 20px;background:var(--white)}
.shay-pp-card--head{border:0;padding:0 20px 10px;margin-bottom:4px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.shay-pp-card--head .shay-pp-thumb{width:70px}
.shay-pp-thumb{flex:0 0 70px;width:70px;height:70px}
.shay-pp-thumb img{width:70px;height:70px;object-fit:cover;border:1px solid var(--line);border-radius:8px;display:block}
.shay-pp-info{flex:1 1 auto;min-width:0}
.shay-pp-title{font-size:17px;font-weight:800;line-height:1.3;margin-bottom:6px}
.shay-pp-title a{color:inherit;text-decoration:none}
.shay-pp-title a:hover{text-decoration:underline}
.shay-pp-variations{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.shay-pp-pill{display:inline-flex;align-items:baseline;gap:6px;background:var(--sand);border:1px solid var(--line);color:var(--olive-d);border-radius:20px;padding:4px 12px;font-size:13px;font-weight:600}
.shay-pp-pill em{font-style:normal;color:var(--muted);font-weight:500;font-size:12px}
.shay-pp-fav{flex-shrink:0}
@media (max-width:600px){
  .shay-pp-card{flex-wrap:wrap;gap:12px}
  .shay-pp-card--head{display:none}
}

.buybox__price{font-size:34px;font-weight:500;color:var(--olive-d); line-height: 1;}
.buybox__price small{font-size:15px;color:var(--muted);font-weight:400}
.buybox__label{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);font-weight:600;margin:20px 0 12px}
.sizes{border:1.5px solid #DDD9D2;border-radius:var(--r-soft);overflow:hidden;background:var(--white)}
.sizes__head,.size{display:grid;grid-template-columns:1fr 80px 90px;gap:10px;padding:11px 16px;align-items:center}
.sizes__head{background:var(--olive);color:var(--paper);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.sizes__head span:not(:first-child){text-align:right}
.sizes__body{max-height:430px;overflow-y:auto}
.size{cursor:pointer;transition:background 120ms ease;background:var(--white);border-top:1px solid #EAE7E2;margin:0}
.sizes__body .size:first-child{border-top:0}
.size:hover{background:var(--paper)}
.size input{position:absolute;opacity:0;pointer-events:none}
.size__name{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:500;line-height:1.8;
    border-bottom: 1px dotted rgb(169, 104, 63);}
.size__name::before{content:"";width:16px;height:16px;border-radius:50%;flex-shrink:0;background:var(--white);border:1.5px solid #C9CBC0}
.size__per{text-align:right;font-size:12px;color:var(--muted)}
.size__price{text-align:right;font-size:13px;font-weight:700;color:var(--rust-2)}
.size:has(input:checked),.size.is-picked{background:#E3E4DD}
.size:has(input:checked) .size__name::before,.size.is-picked .size__name::before{border:5px solid var(--olive)}
.size:has(input:disabled),.size.is-oos{opacity:.55;cursor:not-allowed}
/* The radios are visually hidden, so the row has to carry the focus ring or
   keyboard users arrow through the group blind. */
.size:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:-3px}
.size__price del{display:block;font-size:11px;font-weight:400;color:var(--muted);text-decoration:line-through}
.size__avail{display:block;font-size:11px;font-weight:600;color:var(--rust-2);white-space:nowrap}
.size.is-oos .size__avail{color:var(--muted)}
.buybox__price del{font-size:19px;font-weight:400;color:var(--muted);text-decoration:line-through;margin-left:8px}
.buybox__price del[hidden]{display:none}
.buybox__unavailable{font-size:15px;color:var(--muted);background:#EAE7E2;border:1px solid #DDD9D2;border-radius:var(--r-soft);padding:20px 22px}
.sizes__note{font-size:13px;color:var(--rust-2);margin-top:10px}
.sizes__note a{color:var(--rust-2);}
/* JS appends this to <body> once and only sets top/left on first hover. Without
   an initial offset an absolutely positioned element sits at its static
   position ? after the footer ? which padded the document with a blank strip.
   top/left:0 parks it out of flow; the inline offsets from JS take over. */
.size-tip{position:absolute;top:0;left:0;z-index:9999;width:200px;background:var(--white);border:1px solid #DDD9D2;border-radius:var(--r-soft);box-shadow:0 6px 24px rgba(0,0,0,.12);padding:10px;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .15s ease,visibility 0s linear .15s;display:flex;flex-direction:column;gap:6px}
.size-tip.is-visible{opacity:1;visibility:visible;transition:opacity .15s ease,visibility 0s}
.size-tip img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:4px}
.size-tip span{font-size:12px;font-weight:600;color:var(--deep);text-align:center}
.addon{display:flex;align-items:center;gap:12px;margin-top:14px;padding:14px 16px;border-radius:var(--r-soft);border:1.5px solid #DDD9D2;background:var(--white);cursor:pointer}
/* display:flex above out-ranks the UA [hidden]{display:none}, so the add-on
   would otherwise stay visible on sizes it does not fit. */
.addon[hidden]{display:none}
.addon:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:2px}
.addon:has(input:checked){border-color:var(--olive);background:#E3E4DD}
.addon input{position:absolute;opacity:0}
.addon__box{width:22px;height:22px;flex-shrink:0;border-radius:6px;border:1.5px solid #C9CBC0;background:var(--white);display:flex;align-items:center;justify-content:center}
.addon:has(input:checked) .addon__box{background:var(--olive);border-color:var(--olive)}
.addon__box svg{width:14px;height:14px;stroke:var(--paper);stroke-width:3.5;fill:none;opacity:0}
.addon:has(input:checked) .addon__box svg{opacity:1}
.addon b{display:block;font-size:14px;font-weight:700;color:var(--olive-d)}
.addon span{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.addon em{font-style:normal;font-size:14px;font-weight:700;color:var(--rust-2);white-space:nowrap}
.buybox__actions{display:flex;gap:10px;margin-top:24px;align-items:stretch}
.qty{display:flex;align-items:center; justify-content: space-between;border:1px solid #DDD9D2;border-radius:999px;background:var(--white);flex-basis: 100%;}
.qty button{width:48px;height:52px;border:0;background:none;font-size:20px;color:var(--muted)}
.qty button:hover{color:var(--olive-d)}
/* woocommerce_quantity_input() wraps the field in its own div; dissolve that
   so the input sits directly in the pill's flex row between the steppers. */
.qty .quantity{display:contents}
.qty .quantity .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.qty input{width:40px;text-align:center;font-size:17px;font-weight:500;border:0;background:none;-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qty input:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
/* Sold-individually products get a hidden input and no steppers. */
.qty--fixed{display:none}
.btn-pill {
    flex: 1;
    border-radius: 999px;
    font-size: 12px !important;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 0 10px !important;
    white-space: nowrap;
    border: 1.5px solid transparent;
    min-height: 25px;
}
.btn-pill--solid{background:var(--olive);color:var(--paper)}
.btn-pill--solid:hover{background:var(--olive-d);color:var(--paper);text-decoration:none}
.btn-pill--solid:active{transform:scale(.97)}
.btn-pill--out{background:transparent;color:var(--olive-d);border-color:var(--olive)}
.btn-pill--out:hover{background:#E3E4DD;text-decoration:none}
/* Without this a dead button looks perfectly clickable. */
.btn-pill:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}
.btn-pill:disabled:hover{background:var(--olive)}
.btn-pill--out:disabled:hover{background:transparent}

.tabs{display:flex;gap:8px;border-bottom:1px solid #DDD9D2;flex-wrap:wrap}
.tabs button{padding:14px 22px;font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;margin-bottom:-1px;border-radius:10px 10px 0 0;border:0;background:none;color:var(--muted);border-bottom:2px solid transparent}
.tabs button[aria-selected=true]{color:var(--olive-d);background:#E3E4DD;border-bottom-color:var(--olive)}
.tab-panel{padding-top:32px}
.tab-panel[hidden]{display:none}
.pdp__cols{display:grid;grid-template-columns:1.5fr 1fr;gap:48px}
.desc-card{background:#E3E4DD;border:1px solid #C9CBC0;border-radius:14px;padding:24px}
.desc-card__inner{background:var(--white);border-radius:10px;padding:24px 26px;position:relative;overflow:hidden;font-size:15px;line-height:1.7;color:var(--ink);max-height:330px}
.desc-card__inner p{margin-bottom:16px}
.desc-card__inner p:last-child{margin-bottom:0}
.desc-card__inner::after{content:"";position:absolute;bottom:0;left:0;right:0;height:90px;background:linear-gradient(rgba(255,255,255,0),#fff)}
.desc-card.is-open .desc-card__inner{max-height:none}
.desc-card.is-open .desc-card__inner::after{display:none}
.pill-toggle{margin-top:16px;display:inline-flex;align-items:center;gap:8px;background:var(--olive);color:var(--paper);border:0;border-radius:999px;padding:10px 24px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.pill-toggle:hover{background:var(--olive-d)}
.panel{border:1px solid #C9CBC0;border-radius:var(--r-soft);overflow:hidden;background:var(--white)}
.panel__head{margin:0;    background: var(--olive);
    color: var(--paper);
    font-size: 20px;
    text-transform: capitalize;
    font-weight: 600;
    padding: 12px 20px;}
.panel__body{position:relative;overflow:hidden;max-height:330px}
.panel.is-open .panel__body{max-height:none}
.panel__body::after{content:"";position:absolute;bottom:0;left:0;right:0;height:70px;background:linear-gradient(rgba(255,255,255,0),#fff)}
.panel.is-open .panel__body::after{display:none}
.spec{display:flex;align-items:stretch;border-top:1px solid #DDD9D2;background:var(--white)}
.spec:first-child{border-top:0}
.spec:nth-child(odd){background:#EAE7E2}
.spec dt{width:200px;padding:10px 16px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--olive-d)}
.spec dd{flex:1;padding:10px 16px;font-size:14px;color:var(--ink);margin:0}
.panel__foot{padding:12px 20px;border-top:1px solid #EAE7E2}
.link-toggle{background:none;border:0;color:var(--olive);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:0}
.card-dark{background:var(--olive-d);border-radius:var(--r-soft);padding:24px 26px}
.card-dark h2{font-size:20px;font-weight:700;line-height:1.3;color:var(--paper);margin:0}
.card-dark ul{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:12px 20px}
.card-dark li{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--paper)}
.card-dark li::before{content:"";width:12px;height:14px;flex-shrink:0;background:var(--sage-l);clip-path:polygon(50% 0,100% 62%,80% 100%,20% 100%,0 62%)}
.card-olive{background:var(--olive);border-radius:var(--r-soft);padding:22px 26px;color:#E3E4DD;font-size:14px;line-height:1.6}
.card-olive h2{font-size:20px;font-weight:700;line-height:1.3;color:var(--paper);margin:0 0 10px}
.card-olive strong{color:var(--paper)}
.card-sand{background:#E3E4DD;border:1px solid #C9CBC0;border-radius:var(--r-soft);padding:22px 26px;color:var(--olive-d);font-size:14px;line-height:1.6}
.card-sand h3{font-size:22px;font-weight:600;color:var(--olive-d);margin:0 0 10px}
.faq-list{display:grid;gap:10px;margin-top:24px}
.faq-item{background:var(--white);border:1px solid #DDD9D2;border-radius:var(--r-soft);overflow:hidden}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;cursor:pointer;font-weight:700;font-size:15px;color:var(--olive-d);list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";width:10px;height:10px;border-right:2.5px solid var(--olive);border-bottom:2.5px solid var(--olive);transform:rotate(45deg);transition:transform 180ms ease;flex-shrink:0}
.faq-item[open] summary::after{transform:rotate(225deg)}
.faq-item p{padding:0 20px 18px;font-size:14px;line-height:1.65;color:var(--muted)}
.faq-item__a{padding:0 0 2px;font-size:14px;line-height:1.65;color:var(--muted)}
.faq-item__a p{padding:0 20px 12px}
.faq-item__a p:last-child{padding-bottom:18px}
.faq-item__a ul,.faq-item__a ol{margin:0 0 12px;padding:0 20px 0 40px}
.faq-item__a li+li{margin-top:4px}
.faq-item__a a{color:var(--olive);text-decoration:underline;text-underline-offset:2px}
.docs{display:grid;gap:12px}
.doc{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#EAE7E2;border:1px solid #DDD9D2;border-radius:10px;padding:16px 20px;font-size:15px;color:var(--ink)}
.doc a{font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--olive)}
.empty-note{text-align:center;background:#E3E4DD;border:1px solid #C9CBC0;border-radius:var(--r-soft);padding:48px 32px;margin-top:32px}
.empty-note h3{font-size:26px;color:var(--olive-d);font-weight:400;margin:0}
.empty-note p{color:var(--muted);margin-top:10px}
.empty-note .btn{margin-top:18px}

/* "Your Picks" (buy-again) */
.buy-again-last-ordered{font-size:12.5px;color:var(--muted);margin:8px 0 0;text-align:center}
.related{background:#EAE7E2;border-top:1px solid #DDD9D2}
.related .wrap{padding-block:48px 56px}
.related h2{font-size:32px;font-weight:600;color:var(--olive-d);margin:0}
.card-soft{background:var(--white);border:1px solid #DDD9D2;border-radius:var(--r-soft);overflow:hidden;display:flex;flex-direction:column}
.card-soft:hover{border-color:var(--sage);text-decoration:none}
.card-soft img{width:100%;aspect-ratio:1;object-fit:cover}
.card-soft__body{padding:16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.card-soft__body b,.card-soft__body .card-soft__title{font-size:15px;font-weight:500;line-height:1.35;color:var(--ink);flex:1;margin:0}
.card-soft__body span{font-size:13px;color:var(--muted)}
.card-soft__foot{background:var(--olive);padding:12px 18px;text-align:center;font-size:14px;color:var(--white);font-weight:600;letter-spacing:.08em}

/* ==========================================================================
   8. Blog / pages
   ========================================================================== */
.page-hero{background:var(--mist);border-bottom:1px solid var(--mist-b)}
.page-hero .wrap{padding-block:44px}
.page-hero h1{font-size:44px;font-weight:800;color:var(--deep);letter-spacing:-.028em;line-height:1.08;margin:8px 0 0}
.entry{margin-inline:auto;padding-block:48px 64px;font-size:17px;line-height:1.75;color:var(--ink-2)}
.entry > * + *{margin-top:20px}
.entry h2{font-size:28px;font-weight:800;color:var(--deep);margin-top:36px;letter-spacing:-.02em}
.entry h3{font-size:21px;font-weight:800;color:var(--deep);margin-top:28px}
.entry ul,.entry ol{padding-left:22px}
.entry li+li{margin-top:8px}
/* .entry img{margin-block:12px} */
.entry blockquote{border-left:3px solid var(--gold);padding-left:20px;font-size:19px;color:var(--deep)}
.entry code{background:var(--sand);padding:2px 6px;font-size:.9em}
.meta{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--rust)}
.blog-grid{padding-block:48px 64px}
.comment-list{list-style:none;padding:0}
.comment-list li{border-top:1px solid var(--line);padding-block:20px}

/* ==========================================================================
   9. Footer
   ========================================================================== */
.site-footer{background:var(--night);color:#C4CDB4}
.site-footer .wrap{padding:52px 32px 30px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:44px}
.site-footer img.foot-logo{height:54px;width:auto}
.site-footer p{font-size:14px;line-height:1.65;color:#A8B295;margin-top:12px}
.foot-contact{display:flex;flex-direction:column;gap:7px;margin-top:18px;font-size:14px;color:#C4CDB4}
.foot-contact a{color:var(--gold-l);font-weight:700}
.foot-col b{display:block;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);margin-bottom:14px}
.foot-col ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:9px;font-size:14px}
.foot-col a{color:#C4CDB4}
.foot-col a:hover{color:var(--cream);text-decoration:none}
.foot-bottom{border-top:1px solid #37422A;padding-top:22px;margin-top:30px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;font-size:13px;color:#A8B295}
.foot-bottom a{color:#A8B295}
.foot-bottom nav{display:flex;gap:16px;flex-wrap:wrap}

/* ==========================================================================
   10. WooCommerce shims (only what we actually use)
   ========================================================================== */
.woocommerce-message,.woocommerce-info,.woocommerce-error{list-style:none;margin:0 0 20px;padding:16px 20px;background:var(--mist);border-left:4px solid var(--olive);font-size:15px}
.woocommerce-error, .woocommerce-message{background:#F7E9E4;border-left-color:var(--rust);
    position: relative;
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
    padding-top: 0 !important;
    padding-bottom: 10px !important;
    padding-right: 30px !important;
    padding-left: 40px !important;
    min-height: 60px;
    text-align: start;
    border: none;
    border-radius: var(--wd-brd-radius);
  }
.type-product .woocommerce-message{
    justify-content: space-between;
}
.type-product .woocommerce-message .button {
    padding: 5px 12px;
    font-size: 14px;
}
.woocommerce form .form-row{margin-bottom:14px;display:flex;flex-direction:column;gap:6px}
.woocommerce form .form-row label{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--deep)}
.woocommerce .button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{display:inline-block;background:var(--olive) !important;color:var(--cream) !important;border:0;padding:14px 28px;font-size:14px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;cursor:pointer}
.woocommerce .button.empty{
      background: #bf4f36 !important;
}
.woocommerce .button:hover{background:var(--deep);color:var(--cream);text-decoration:none}
.woocommerce table.shop_table{border:1px solid var(--line);background:var(--white);font-size:15px}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{padding:14px 10px;border-bottom:1px solid var(--line-2);text-align:left}
.woocommerce table.shop_table th{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--deep)}
/* .woocommerce .quantity input{width:70px;padding:5px;text-align:center;border:1px solid #DDD9D2} */
.woo-page{padding-block:40px 64px}
.woocommerce-cart-form__cart-item .quantity .qty{height:40px; width: 55px !important}
.woo-page .wrap{max-width:1280px}
.woocommerce form.login {
    background: #fff;
}
/* ==========================================================================
   10a. Product reviews ? styles WooCommerce's default review markup.
   No template overrides: these rules target the classes Woo already outputs.
   Woo's own stylesheet is dequeued, so the star rating is rebuilt here too.
   ========================================================================== */
.woocommerce-Reviews{background:transparent;border:0;padding:0}
.woocommerce-Reviews-title{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--olive-d);margin:0 0 18px}
.woocommerce-Reviews-title span{font-weight:700}

/* Star rating ? Woo prints text inside a width-% span; this turns it back
   into stars without needing Woo's CSS or its star webfont. */
.star-rating{position:relative;overflow:hidden;height:1.2em;line-height:1.2;width:5.9em;font-size:15px;letter-spacing:.1em;font-family:var(--ff)}
.star-rating::before{content:"?????";position:absolute;top:0;left:0;color:#C9CBC0}
.star-rating span{position:absolute;top:0;left:0;overflow:hidden;padding-top:1.5em}
.star-rating span::before{content:"?????";position:absolute;top:0;left:0;color:var(--gold)}
.star-rating strong.rating,.woocommerce-review__dash{display:none}

/* Review list ? kill the default ordered-list numbering */
.woocommerce-Reviews .commentlist{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.woocommerce-Reviews .commentlist li.review,
.woocommerce-Reviews .commentlist li.comment{list-style:none;margin:0;padding:0;border:0}
.woocommerce-Reviews .comment_container{display:flex;gap:14px;align-items:flex-start;background:var(--white);border:1px solid #DDD9D2;border-radius:var(--r-soft);padding:18px 20px}
.woocommerce-Reviews .comment_container > img.avatar{width:44px;height:44px;border-radius:50%;object-fit:cover;background:#EAE7E2;flex-shrink:0;margin:0}
.woocommerce-Reviews .comment-text{flex:1;min-width:0}
.woocommerce-Reviews .comment-text > .star-rating{margin-bottom:6px}
.woocommerce-Reviews p.meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin:0 0 8px}
.woocommerce-review__author{font-size:15px;font-weight:700;color:var(--olive-d);text-transform:none;letter-spacing:0}
.woocommerce-review__verified{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--olive);background:rgba(138,155,114,.18);border:1px solid rgba(138,155,114,.5);border-radius:999px;padding:3px 9px}
.woocommerce-review__published-date{margin-left:auto;font-size:12.5px;color:var(--muted)}
.woocommerce-Reviews .description{font-size:14.5px;line-height:1.65;color:var(--ink-2)}
.woocommerce-Reviews .description p{margin:0 0 8px}
.woocommerce-Reviews .description p:last-child{margin-bottom:0}
/* Empty state + the "verified owners only" gate that replaces the form */
.woocommerce-noreviews,
.woocommerce-verification-required{font-size:15px;color:var(--muted);background:#EAE7E2;border:1px solid #DDD9D2;border-radius:var(--r-soft);padding:22px 24px;margin:0}
.woocommerce-verification-required{margin-top:20px}
/* With no reviews Woo prints no title, so give the form panel its own space */
#comments:has(.woocommerce-noreviews) + #review_form_wrapper{margin-top:20px}

/* Shown instead of the form when login is required to comment */
#review_form .must-log-in{font-size: 18px; color: var(--muted); line-height: 1.6; margin: 0; text-align: center;}
#review_form .must-log-in a{color:var(--olive);font-weight:700;text-decoration:underline;text-underline-offset:3px}
#review_form .must-log-in a:hover{color:var(--olive-d)}

/* Review form */
#review_form_wrapper{margin-top:28px;background:#E3E4DD;border:1px solid #C9CBC0;border-radius:var(--r-soft);padding:24px}
#review_form .comment-reply-title{display:block;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--olive-d);margin-bottom:16px}
#review_form .comment-reply-title small{font-weight:400;letter-spacing:0;text-transform:none;margin-left:8px}
#review_form .comment-form > p{margin:0 0 16px}
#review_form label{display:block;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--olive-d);margin-bottom:6px}
#review_form .required{color:var(--rust)}
#review_form select,#review_form textarea,#review_form input[type=text],#review_form input[type=email]{width:100%;border:1.5px solid #DDD9D2;border-radius:10px;background:var(--white);padding:12px 14px;font-size:15px;color:var(--ink)}
#review_form select{margin-bottom: 15px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%234F5E3F' d='M6 8 0 2l1.4-1.4L6 5.2 10.6.6 12 2z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
#review_form textarea{min-height:130px;resize:vertical;line-height:1.6}
#review_form select:focus,#review_form textarea:focus,#review_form input:focus{outline:none;border-color:var(--olive)}
#review_form .comment-form-cookies-consent{display:flex;align-items:center;gap:8px}
#review_form .comment-form-cookies-consent label{margin:0;font-size:13px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted)}
#review_form .comment-form-cookies-consent input{width:auto;accent-color:var(--olive)}
#review_form .form-submit{margin:0}
#review_form .submit{display:inline-flex;align-items:center;gap:8px;background:var(--olive);color:var(--paper);border:0;border-radius:999px;padding:14px 32px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;width:auto;transition:background var(--t)}
#review_form .submit:hover{background:var(--olive-d)}

/* Submitting state ? set by the single-submit guard in theme.js.
   The page navigates away on success, so there is nothing to reset.
   NOTE: WordPress renders the review button as <input type="submit">, and
   pseudo-elements do not apply to inputs ? hence the .form-busy overlay
   node rather than a ::before spinner. */
@keyframes shay-spin{to{transform:rotate(360deg)}}

form.is-submitting{position:relative}
form.is-submitting [type=submit]{opacity:.75;cursor:progress}

.form-busy{
  position:absolute;inset:0;z-index:20;
  display:flex;align-items:center;justify-content:center;
  background:rgba(244,242,239,.6);
  border-radius:var(--r-soft);
  cursor:progress;
}
.form-busy__spin{
  width:30px;height:30px;border-radius:50%;
  border:3px solid var(--olive);border-top-color:transparent;
  animation:shay-spin .7s linear infinite;
}
@media (prefers-reduced-motion:reduce){
  .form-busy__spin{animation:none;border-top-color:var(--sage-l)}
}

@media (max-width:560px){
  .woocommerce-Reviews .comment_container{flex-direction:column;gap:10px}
  .woocommerce-review__published-date{margin-left:0;width:100%}
  #review_form .submit{width:100%;justify-content:center}

}

/* ==========================================================================
   11. Responsive
   ========================================================================== */
@media (max-width:1200px){
  .g5{grid-template-columns:repeat(3,1fr)}
  .pdp__main{grid-template-columns:1fr 1fr;gap:14px}
  .pdp__buy{grid-column:1/-1}
  .hero h1{font-size:54px}
  .tax-hero h1{font-size:44px;margin: 0;}
}
@media (max-width:1024px){
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .visit,.tax-hero__in,.signup__in,.pdp__cols{grid-template-columns:1fr;gap:28px}
  .visit{padding-block:44px}
  .pdp__main{grid-template-columns:1fr}
  .menu > li.mega > .sub-menu{grid-template-columns:repeat(3,1fr) 220px}
  .catbar__meta{display:none}
}
@media (max-width:782px){
  .archive .sec{
    padding-block: 20px 0;
  }
  .archive .tax-hero .crumbs, .archive .tax-hero .tax-hero__media, .product .pdp__main .pdp__meta, .product .pdp__main .chips{
    display: none;
  }
  .archive .tax-hero .tax-hero__in{
    padding: 20px;
  }
  .product .pdp__meta{}

  :root{--gut:18px}
  body{font-size:15.5px}
  .hero__in{padding-block:52px 56px}
  .hero{background-image:var(--hero-bg-mobile,var(--hero-bg-desktop,url(https://shayandcompany.com/wp-content/uploads/2026/08/shayandcompany-banner.webp)))}
    .hero__box {
        text-align: left;
        margin-left: 0;
        padding: 25px 10px 10px;
        margin-top: 100px;
    }
  .hero__cta{justify-content:flex-start}
  .hero h1{font-size:38px}
  .hero p{font-size:15px;margin-left:0}
  .h-sec{font-size:26px !important;line-height: normal;}
  .tax-hero h1{font-size:28px}
  .pdp__title{gap: 5px;}
  .pdp__title h1{font-size:22px}
  .visit h2{font-size:28px}
  .g2,.g3,.g4,.g5{grid-template-columns:1fr 1fr}
  .creds__in{overflow-x: scroll}
  .post-card{flex-direction:column}
  .post-card img{width:100%;height:auto;}
  .foot-grid{grid-template-columns:1fr;gap:28px}
  .sizes__head,.size{grid-template-columns:1fr 70px 80px;gap:6px;padding:11px 12px}
  .cat-card img{height:auto;}
  .btn-pill{flex-basis:100%}
  .buybox__actions .qty .quantity input{
      width: 10px;
  }
  .spec{flex-direction:column}
  .spec dt{width:auto;padding-bottom:0}
  .card-dark ul{grid-template-columns:1fr}
  .visit__media img{height:240px}
  .tax-hero__media img{height:210px}
  .band-mist{margin-top:44px}
  .trust{margin-top:44px}
  .bulk p{max-width: 245px;}

  /* mobile header ? logo, search, cart icon. Everything else lives in the drawer. */
  .hdr{gap:10px;padding-block:8px}
  .brand img{height:44px !important}
  .hdr__search{flex:1;min-width:0}
  .searchform{padding:0 10px;max-width:220px}
  .searchform input[type=search]{padding:9px 0;font-size:13.5px}
  .hdr__tools{gap:14px}
  .hdr__support,.tool--account,.tool--fav{display:none}
  .tool--cart{display:none}
  .tool--cart-mobile{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1.5px solid var(--line);border-radius:4px;padding:0;color:var(--deep);position:relative;flex-shrink:0}
  .tool--cart-mobile svg{stroke:var(--deep)}
  .tool--cart-mobile .tool__count{position: absolute;top: 0%;right: 1%;}
  .catbar__all{font-size:13.5px;padding:11px 14px}
  .catbar__link{font-size:13px;padding:11px 12px}
  .nav{display:none}
}
@media (max-width:560px){
  .g4,.g5{grid-template-columns:1fr}
  .g3{grid-template-columns:1fr}
  /* Product cards: compact 2-up grid on mobile */
  #product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px !important;padding-top:18px !important}
  .desc-body:not(.is-open){-webkit-line-clamp:2;line-clamp:2}
  .card__body{padding:10px 11px 12px;gap:6px}
  .card__title,.card__title a{font-size:14px;line-height:1.3;overflow-wrap:anywhere}
  .card__title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  /* .card__excerpt{display:none} */
  .card__foot{padding-top:8px;margin-top:0}
  .card__price{flex-wrap:wrap;gap:2px 5px}
  .card__price small{font-size:11px}
  .card__price b{font-size:20px}
  .card__sizes{display: none;
    font-size:11.5px;line-height:1.35;margin-top:4px;
    /* display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; */
    overflow:hidden;overflow-wrap:anywhere}
  .card__stock{font-size:11.5px;line-height:1.35}
  .card .btn--sm{padding:10px 8px;font-size:11.5px;letter-spacing:.06em}
  .card__flags{top:7px;left:7px}
  .flag{font-size:9px;padding:4px 7px}
  .card__fav{top:7px;right:7px;width:30px;height:30px}
  .hero h1{font-size:32px}
  .tabs button{padding:12px 14px;font-size:12.5px}
  .gallery__thumbs button{width:72px;height:72px}
  .type-product .woocommerce-message{
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-right: 15px !important;
    padding-left: 15px !important;
  }
}

/* ==========================================================================
   12. Animations
   ========================================================================== */

/* Keyframes */
@keyframes shay-fade-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes shay-fade-in{from{opacity:0}to{opacity:1}}
@keyframes shay-rise{from{transform:translateY(14px)}to{transform:translateY(0)}}

/* Hero entrance ? CSS only, plays once on load */
.hero__box .eyebrow{opacity:0;animation:shay-fade-up 0.5s ease forwards;animation-delay:0.05s}
.hero__box h1{animation:shay-rise 0.5s ease forwards}
.hero__box p{opacity:0;animation:shay-fade-up 0.5s ease forwards;animation-delay:0.2s}
.hero__cta{opacity:0;animation:shay-fade-up 0.45s ease forwards;animation-delay:0.3s}

/* Scroll-reveal: content is only hidden when scripts run and the visitor has not asked for less motion,
   so nobody is left with invisible sections. */
@media (scripting:enabled) and (prefers-reduced-motion:no-preference){
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity 0.55s ease,transform 0.55s ease}
[data-reveal].is-visible{opacity:1;transform:translateY(0)}

/* Staggered grid children */
[data-reveal] .cred,[data-reveal] .tile,[data-reveal] .card,[data-reveal] .cat-card,[data-reveal] .post-card,[data-reveal] .subcat,[data-reveal] .trust__item{
  opacity:0;transform:translateY(16px);transition:opacity 0.4s ease,transform 0.4s ease
}
[data-reveal].is-visible .cred,[data-reveal].is-visible .tile,
[data-reveal].is-visible .card,[data-reveal].is-visible .cat-card,
[data-reveal].is-visible .post-card,[data-reveal].is-visible .subcat,
[data-reveal].is-visible .trust__item{opacity:1;transform:translateY(0)}

/* Stagger delays ? up to 8 children */
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(1){transition-delay:0.05s}
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(2){transition-delay:0.12s}
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(3){transition-delay:0.19s}
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(4){transition-delay:0.26s}
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(5){transition-delay:0.33s}
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(6){transition-delay:0.4s}
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(7){transition-delay:0.47s}
[data-reveal].is-visible :is(.cred,.tile,.card,.cat-card,.post-card,.subcat,.trust__item):nth-child(8){transition-delay:0.54s}

/* Individual card-level reveal (archive grid ? each card observed independently) */
.card[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity 0.45s ease,transform 0.45s ease}
.card[data-reveal].is-visible{opacity:1;transform:translateY(0)}
}

/* FAQ accordion items */
.acc__item[data-reveal]{opacity:0;transform:translateY(12px);transition:opacity 0.4s ease,transform 0.4s ease}
.acc__item[data-reveal].is-visible{opacity:1;transform:translateY(0)}

/* Button press feedback */
.btn:active{transform:scale(0.97)}

/* PDP above-fold entrance ? CSS-only, plays once on load */
[data-pdp-crumb]{opacity:0;animation:shay-fade-up 0.4s ease forwards;animation-delay:0.05s}
[data-pdp-title]{opacity:0;animation:shay-fade-up 0.5s ease forwards;animation-delay:0.15s}
[data-pdp-gallery]{opacity:0;transform:translateX(-28px);animation:pdp-slide-left 0.6s ease forwards;animation-delay:0.25s}
[data-pdp-summary]{opacity:0;animation:shay-fade-up 0.55s ease forwards;animation-delay:0.35s}
[data-pdp-buy]{opacity:0;transform:translateX(28px);animation:pdp-slide-right 0.6s ease forwards;animation-delay:0.45s}

@keyframes pdp-slide-left{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:translateX(0)}}
@keyframes pdp-slide-right{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:translateX(0)}}

/* Visit section ? image slides in from left, text from right */
[data-reveal].visit .visit__media{opacity:0;transform:translateX(-24px);transition:opacity 0.6s ease,transform 0.6s ease}
[data-reveal].visit > div:last-child{opacity:0;transform:translateX(24px);transition:opacity 0.6s ease 0.15s,transform 0.6s ease 0.15s}
[data-reveal].is-visible.visit .visit__media,[data-reveal].is-visible.visit > div:last-child{opacity:1;transform:translateX(0)}

/* Signup band ? fade in only, no shift */
[data-reveal].signup > .wrap > *{opacity:0;transform:translateY(14px);transition:opacity 0.45s ease,transform 0.45s ease}
[data-reveal].signup > .wrap > *:last-child{transition-delay:0.12s}
[data-reveal].is-visible.signup > .wrap > *{opacity:1;transform:translateY(0)}

/* Tab panel content reveal ? fires on tab click and on initial load */
@keyframes tab-fade-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
[data-tab-reveal]{opacity:0}
[data-tab-reveal].tab-in{animation:tab-fade-up 0.4s ease forwards}

/* card-soft stagger (related products) */
.card-soft[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity 0.45s ease,transform 0.45s ease}
.card-soft[data-reveal].is-visible{opacity:1;transform:translateY(0)}

/* Respect reduced motion ? kill everything */
@media (prefers-reduced-motion:reduce){
  [data-reveal],[data-reveal] *,.card[data-reveal],.card-soft[data-reveal],.acc__item[data-reveal],
  [data-pdp-crumb],[data-pdp-title],[data-pdp-gallery],[data-pdp-summary],[data-pdp-buy],
  [data-tab-reveal],.hero__box .eyebrow,.hero__box h1,.hero__box p,.hero__cta{
    animation:none!important;transition:none!important;opacity:1!important;transform:none!important
  }
}

/* Print */
@media print{.site-header,.nav,.catbar,.site-footer,.signup,.bulk{display:none}}

/* ==========================================================================
   13. Cart page
   ========================================================================== */

/* Two-column grid: items (left) + sticky order summary (right) */
.shay-cart{display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:start}

/* -- Item rows: thumb | body (grows) | qty | subtotal | remove -- */
.cart-list{list-style:none;margin:0;padding:0; padding-left: 0 !important;box-shadow: 0 2px 12px rgba(41, 51, 31, .06); background: var(--white);    border-radius: 10px 10px 0 0;}
.cart-row{display:flex;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line-2)}
.cart-row:last-child{border-bottom:0}
.cart-row:focus-within{background:var(--cream)}

.cart-row__thumb{flex:0 0 68px}
.cart-row__thumb img{width:68px;height:68px;object-fit:cover;display:block;border-radius:8px;border:1px solid var(--line-2)}

.cart-row__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:3px}
.cart-row__name{font-size:14px;font-weight:700;color:var(--deep);line-height:1.3;margin:0}
.cart-row__name a{color:inherit}
.cart-row__name a:hover{color:var(--olive);text-decoration:none}
.cart-row__variation{font-size:12px;color:var(--muted)}
.cart-row__variation dl,.cart-row__variation dt,.cart-row__variation dd{display:inline;margin:0;padding:0}
.cart-row__variation dt::after{content:": "}
.cart-row__variation dd::after{content:" · "}
.cart-row__variation dd:last-of-type::after{content:""}
.cart-row__price{font-size:12.5px;color:var(--muted);font-weight:500}

.cart-row__qty{flex:0 0 auto}
.woocommerce-cart .qty{height:40px}
.woocommerce-cart .qty button{width:40px;height:100%;font-size:18px}
.woocommerce-cart .qty input.qty{height:36px !important;width:40px !important;text-align:center;min-width:0}

.cart-row__subtotal{flex:0 0 auto;text-align:right;font-size:15px;font-weight:800;color:var(--deep);white-space:nowrap;min-width:68px}

.cart-row__remove{flex:0 0 auto}
.cart-row a.remove {
    width: 25px !important;
    height: 25px !important;
    line-height: 1.4rem !important;
    background: var(--line-2);
    font-size: 20px !important;
    transition: background var(--t), color var(--t);
}
.cart-row a.remove:hover,.cart-row a.remove:focus-visible{background:var(--rust);color:var(--cream)!important;text-decoration:none}

/* Actions row */
.cart-actions{background:var(--sand);border-top:1px solid var(--line);padding:14px 20px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-radius: 0 0 10px 10px;}
.cart-actions .coupon{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cart-actions .coupon .input-text{border:1.5px solid var(--line);background:var(--white);padding:9px 12px;font-size:13.5px;width:180px !important;border-radius:6px;transition:border-color var(--t)}
.cart-actions .coupon .input-text:focus,.cart-actions .coupon .input-text:focus-visible{border-color:var(--olive);outline:none}
/* style the coupon + gift cert buttons consistently */
.cart-actions .button{font-size:13px;font-weight:700;padding:9px 16px;border:1.5px solid var(--olive);border-radius:6px;background:var(--white);color:var(--olive-d);cursor:pointer;transition:background var(--t),color var(--t);white-space:nowrap}
.cart-actions .button:hover{background:var(--mist);text-decoration:none}
.cart-actions__update{margin-left:auto}

/* -- Sidebar / order summary -- */
.shay-cart__sidebar{position:sticky;top:24px}
.shay-totals{background:var(--white);border:1px solid var(--line);border-radius:var(--r-soft);padding:22px 22px 24px;width:100% !important}
.shay-totals h2{font-size:13px;font-weight:800;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.shay-totals .shop_table{border:0;font-size:14.5px}
.shay-totals .shop_table th,.shay-totals .shop_table td{padding:11px 0;border-bottom:1px solid var(--line-2);border-top:0;vertical-align:top}
.shay-totals .shop_table th{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);width:35%}
.shay-totals .shop_table .order-total th,.shay-totals .shop_table .order-total td{border-bottom:0;padding-top:14px}
.shay-totals .shop_table .order-total th{font-size:13px;font-weight:800;color:var(--deep)}
.shay-totals .shop_table .order-total td strong .woocommerce-Price-amount{font-size:24px;font-weight:800;color:var(--deep)}
.shay-totals .woocommerce-shipping-methods{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.shay-totals .woocommerce-shipping-methods li{display:flex;align-items:flex-start;gap:8px;font-size:13px}
.shay-totals .woocommerce-shipping-methods input[type=radio]{accent-color:var(--olive);margin-top:3px;flex-shrink:0}
.shay-totals .woocommerce-shipping-destination{font-size:12px;color:var(--muted);margin:8px 0 0}
.shay-totals .shipping-calculator-button{font-size:12.5px;font-weight:700;color:var(--olive);text-decoration:underline;text-underline-offset:3px;display:inline-block;margin-top:6px}
.shay-totals .shipping-calculator-button:hover{color:var(--deep);text-decoration:none}
.shay-totals .wc-proceed-to-checkout{margin-top:20px}
.shay-totals .checkout-button.button{display:block;width:100%;text-align:center;background:var(--olive) !important;color:var(--cream);padding:16px 24px;font-size:14px !important;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border:0;border-radius:999px;transition:background var(--t);line-height:1}
.shay-totals .checkout-button.button:hover{background:var(--deep);color:var(--cream);text-decoration:none}
.shay-totals .checkout-button.button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

/* -- Empty cart -- */
.cart-empty{padding-block:60px;text-align:center}
.cart-empty .woocommerce-info{border-top-color:var(--olive)}

/* -- Responsive -- */
@media(max-width:1024px){
  .shay-cart{grid-template-columns:1fr;gap:20px}
  .shay-cart__sidebar{position:static}
}
@media(max-width:640px){

  /* Order summary rows were a fixed 35%/65% th/td split — fine at 360px
     sidebar width, but on a phone the label ("Gift Certificate: younus")
     didn't have room and wrapped into the value column below it. Stack
     label above value instead of splitting the row side by side. */
  .shay-totals{padding:18px 16px 20px}
  .shay-totals .shop_table tr{display:flex;flex-direction:column;gap:2px;padding:10px 0;border-bottom:1px solid var(--line-2)}
  .shay-totals .shop_table tr:last-child{border-bottom:0}
  .shay-totals .shop_table th,
  .shay-totals .shop_table td{width:100%;padding:0;border:0}
  .shay-totals .shop_table .order-total{border-bottom:0;padding-top:14px}

  /* The row was still one flex line at phone widths, cramming thumb + name
     + qty stepper + subtotal + remove into ~300px — the name column had
     nowhere near enough room and wrapped illegibly. Switching to a 2-row
     grid gives name+remove their own top line and qty+subtotal their own
     line underneath, with the thumbnail spanning both (grid-area "thumb"
     repeats in both template rows, so one item fills both cells). */
  .cart-row{
    display:grid;
    grid-template-columns:52px 1fr auto;
    grid-template-areas:
      "thumb name   remove"
      "thumb qty    subtotal";
    align-items:center;
    column-gap:10px;
    row-gap:8px;
    padding:12px 14px;
  }
  .cart-row__thumb{grid-area:thumb;align-self:start;flex:none}
  .cart-row__thumb img{width:52px;height:52px}
  .cart-row__body{grid-area:name;min-width:0}
  .cart-row__name{font-size:13px}
  .cart-row__price{font-size:11.5px}
  .cart-row__qty{grid-area:qty;justify-self:start}
  .cart-row__subtotal{grid-area:subtotal;justify-self:end;font-size:14px;min-width:0}
  .cart-row__remove{grid-area:remove;justify-self:end;align-self:start}

  .woocommerce-cart .qty{height:40px}
  .woocommerce-cart .qty button{width:40px;font-size:18px}
  .woocommerce-cart .qty input.qty{width:36px !important;height:36px !important}
  .cart-actions{flex-direction:column;align-items:stretch;padding:12px 14px;gap:8px}
  .cart-actions .coupon{flex-direction:column}
  .cart-actions .coupon .input-text,.cart-actions .button{width:100% !important;text-align:center}
  .cart-actions__update{margin-left:0}
}

/* ==========================================================================
   13a. You May Also Like — Bramble Berry horizontal rows
        image | name + price (grows) | [size picker] | ADD button
   ========================================================================== */

/* Section sits full-width below the two-column grid */
.cart-suggest{margin-top:36px}

/* Section heading — outside the card, prominent */
.cart-suggest__head{margin-bottom:16px}
.cart-suggest__head h2{font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--deep);margin:0;padding-bottom:14px;border-bottom:2px solid var(--deep)}

/* Card = the outer row container */
.cart-suggest__grid{display:flex;flex-direction:column;gap:0;background:var(--white);border:1px solid var(--line);border-radius:var(--r-soft);overflow:hidden;box-shadow:0 2px 12px rgba(41,51,31,.05)}
.cart-suggest__card{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--line-2);background:var(--white);transition:background var(--t)}
.cart-suggest__card:last-child{border-bottom:0}
.cart-suggest__card:hover{background:var(--cream)}

/* Product image — square, no link decoration */
.cart-suggest__card img{flex:0 0 56px;width:56px !important;height:56px !important;object-fit:cover;border-radius:8px;border:1px solid var(--line-2);aspect-ratio:1 !important}

/* Link wraps image + text block */
.cart-suggest__link{display:flex;align-items:center;gap:14px;flex:1 1 auto;min-width:0;color:inherit;text-decoration:none}
.cart-suggest__link:hover b,.cart-suggest__link:focus-visible b{color:var(--olive);text-decoration:underline}

/* Text block */
.cart-suggest__link .card-soft__body{display:flex;flex-direction:column;gap:2px;padding:0;background:none;border:0;min-width:0;flex:1}
.cart-suggest__link .card-soft__body b{font-size:14px;font-weight:700;line-height:1.3;color:var(--deep)}
.cart-suggest__price{font-size:13px;font-weight:600;color:var(--muted)}
.cart-suggest__price .woocommerce-Price-amount{font-size:13px}

/* Controls: size picker + add button */
.cart-suggest__controls{display:flex;align-items:center;gap:10px;flex-shrink:0}
.cart-suggest__variation{padding:7px 10px;border:1.5px solid var(--line);border-radius:6px;background:var(--white);font-size:12.5px;color:var(--ink);width:130px;cursor:pointer;transition:border-color var(--t);margin:0}
.cart-suggest__variation:focus,.cart-suggest__variation:focus-visible{border-color:var(--olive);outline:none}
.cart-suggest__add{padding:9px 18px;border:1.5px solid var(--olive);border-radius:999px;background:var(--white);color:var(--olive-d);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:background var(--t),color var(--t);margin:0}
.cart-suggest__add:hover{background:var(--olive);color:var(--cream)}
.cart-suggest__add:disabled,.cart-suggest__add.is-busy{opacity:.5;cursor:not-allowed}
.cart-suggest__add:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

@media(max-width:640px){
  .cart-suggest{margin-top:24px}
  .cart-suggest__head h2{font-size:18px}

  /* Same problem as .cart-row: thumb + name/price + size picker + Add all
     forced onto one line left almost no room for the product name. Wrap
     the controls onto their own line instead of shrinking everything. */
  .cart-suggest__card{padding:12px 14px;gap:8px;flex-wrap:wrap}
  .cart-suggest__card img{flex:0 0 46px;width:46px !important;height:46px !important}
  .cart-suggest__link{gap:10px;flex-basis:100%}
  .cart-suggest__link .card-soft__body b{font-size:13px}
  .cart-suggest__controls{gap:8px;flex-basis:100%;justify-content:flex-start;margin-left:56px}
  .cart-suggest__variation{width:140px;font-size:12px;padding:6px 8px}
  .cart-suggest__add{padding:8px 14px;font-size:11px}
}

/* ==========================================================================
   14. My Account
   ========================================================================== */

/* -- Login / Register ? two columns -- */
.logged-in.woocommerce-account .woocommerce{ display: flex;}

/* .woocommerce-account .u-columns{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start} */
.woocommerce-account .u-column1,.woocommerce-account .u-column2{background:var(--white);border:1px solid var(--line);padding:32px 36px}
.woocommerce-Address-title h2{
      margin: 0px 0 8px !important;
    padding-bottom: 0px !important;
}
.woocommerce-account .u-column1 h2,.woocommerce-account .u-column2 h2{font-size:20px;font-weight:800;color:var(--deep);letter-spacing:-.01em;margin:0 0 24px;padding-bottom:14px;border-bottom:2px solid var(--deep)}

/* Form rows */
.woocommerce-account .woocommerce-form__label{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.woocommerce-account .woocommerce-form__label-for-checkbox{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;color:var(--ink);text-transform:none;letter-spacing:0;cursor:pointer}
.woocommerce-account input[type=text],
.woocommerce-account input[type=email],
.woocommerce-account input[type=password]{width:100%;border:1.5px solid var(--line);background:var(--white);padding:12px 14px;font-size:15px;color:var(--ink);transition:border-color var(--t)}
.woocommerce-account input[type=text]:focus,
.woocommerce-account input[type=email]:focus,
.woocommerce-account input[type=password]:focus{outline:none;border-color:var(--olive)}

/* Buttons */
.woocommerce-account .woocommerce-form__input-checkbox{accent-color:var(--olive);width:16px;height:16px;flex-shrink:0}
.woocommerce-account .woocommerce-Button,
.woocommerce-account .button{display:block;width:100%;text-align:center;background:var(--olive);color:var(--cream);border:0;padding:15px 24px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background var(--t)}
.woocommerce-account .woocommerce-Button:hover,
.woocommerce-account .button:hover{background:var(--deep);color:var(--cream);text-decoration:none}

/* Lost password link */
.woocommerce-account .woocommerce-LostPassword{margin-top:14px;font-size:13px}
.woocommerce-account .woocommerce-LostPassword a{color:var(--olive);font-weight:600}
.woocommerce-account .woocommerce-LostPassword a:hover{color:var(--deep)}

/* Register note */
.woocommerce-account .woocommerce-privacy-policy-text{font-size:13px;color:var(--muted);margin-bottom:16px;line-height:1.6}

/* -- Logged-in: sidebar + content -- */
.woocommerce-account .woocommerce-MyAccount-navigation{background:var(--white);border:1px solid var(--line);
    flex: 1 0 25%;
    max-width: 25%;
    width: 25%;
    border-inline-end: 1px solid var(--brdcolor-gray-300);}
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;padding:0;margin:0}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a{display:block;padding:13px 20px;font-size:14px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--line-2);transition:background var(--t),color var(--t)}
.woocommerce-orders-table__cell-order-number a{font-weight:700;color:var(--white)}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover{background:var(--mist);color:var(--olive);text-decoration:none}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{background:var(--deep);color:var(--cream);font-weight:700}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child a{border-bottom:0}
.woocommerce-table--order-details th{color:var(--muted);}
.woocommerce-account .woocommerce-MyAccount-content{min-width:0;
    flex: 1 0 75%;
    max-width: 75%;
    width: 75%;
    padding-left: 30px;
    padding-right: 30px;
  }
.woocommerce-order .woocommerce-customer-details .woocommerce-column{
  width: 100% !important;
}
.woocommerce .col2-set::after, .woocommerce .col2-set::before, .woocommerce-page .col2-set::after, .woocommerce-page .col2-set::before{
  display: none;
}
/* Dashboard welcome */
.woocommerce-account .woocommerce-MyAccount-content p{font-size:15px;line-height:1.7;color:var(--ink-2);margin-bottom:20px;font-size:110%;}
.woocommerce-account .woocommerce-MyAccount-content p a{color:var(--olive);font-weight:600}
.woocommerce-account .woocommerce-MyAccount-content p a:hover{color:var(--deep)}

/* Orders table */
.woocommerce-account .woocommerce-orders-table th{background:var(--deep);color:var(--cream);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:12px 16px;border:0}

.woocommerce-account .woocommerce-orders-table tr:last-child td{border-bottom:0}
.woocommerce-account .woocommerce-orders-table tr:hover td{background:var(--cream)}
.woocommerce-account .woocommerce-orders-table .woocommerce-button{display:inline-block;width:auto;padding:8px 18px;font-size:12px; margin-left: 5px; margin-right: 5px;}
.woocommerce-button--next {
    margin-top: 20px;
    max-width: fit-content;
}
/* Address boxes */
.woocommerce-account .woocommerce-Address{background:var(--white);border:1px solid var(--line);padding:24px 26px}
.woocommerce-account .woocommerce-Address-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line-2)}
.woocommerce-account .woocommerce-Address-title h3{font-size:15px;font-weight:800;color:var(--deep);margin:0;text-transform:uppercase;letter-spacing:.08em}
.woocommerce-account .woocommerce-Address-title a{font-size:12px;font-weight:700;color:var(--olive);letter-spacing:.06em;text-transform:uppercase}
.woocommerce-account .woocommerce-Address-title a:hover{color:var(--deep);text-decoration:none}
.woocommerce-account address{font-size:14.5px;line-height:1.75;color:var(--ink-2);font-style:normal}

/* Edit account / address forms */
.woocommerce-account .woocommerce-EditAccountForm .form-row,
.woocommerce-account .woocommerce-address-fields .form-row{margin-bottom:16px;display:flex;flex-direction:column;gap:6px}
.woocommerce-account .woocommerce-EditAccountForm .form-row label,
.woocommerce-account .woocommerce-address-fields .form-row label{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.woocommerce-account .woocommerce-EditAccountForm .button,
.woocommerce-account .woocommerce-address-fields .button{display:inline-block;width:auto;padding:14px 32px}

/* Notices */
.woocommerce-account .woocommerce-message{background:var(--mist);border-left:4px solid var(--olive);padding:14px 18px;font-size:14px;margin-bottom:20px;list-style:none}
.woocommerce-account .woocommerce-error{background:#F7E9E4;border-left-color:var(--rust)}
.woocommerce-orders-table__header {font-weight: 700; color: var(--white) !important;}

/* ==========================================================================
   15. Show-password eye toggle
   ========================================================================== */
.woocommerce-account .password-input,
.woocommerce .password-input{position:relative;display:block}

/* hide the default WooCommerce text/icon */
.show-password-input{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:22px;height:22px;cursor:pointer;background:none;border:0;padding:0;display:flex;align-items:center;justify-content:center;color:var(--muted);transition:color var(--t)}
.show-password-input:hover{color:var(--olive)}


/* eye-off icon when password is visible */
.show-password-input.display-password::after{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E")}

/* ensure password input has right padding so text doesn't overlap the icon */
.woocommerce-account .password-input input[type=password],
.woocommerce-account .password-input input[type=text],
.woocommerce .password-input input[type=password],
.woocommerce .password-input input[type=text]{padding-right:42px}
.woocommerce-MyAccount-content h2{
      margin-top: 0;
}
.woocommerce-MyAccount-content form{background: #fff;
    padding: 10px 22px;
}
.woocommerce-columns--2{
      display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}

.woocommerce-column--billing-address, .woocommerce-column--shipping-address{
    background: var(--white);
    border: 1px solid var(--line);
    padding: 24px 26px;
}

.order-again a{
      width: auto !important;
    color: var(--white) !important; 
    margin-top: 15px;
}

/* Laptop / Desktop - 4 columns */
.products.columns-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
	padding-left: 0;
}
.products.columns-4 img{
	margin-block: 0 !important;
}

.page-id-34168 .wpaloginform{
    background: linear-gradient(120deg, var(--deep) 0%, var(--olive-d) 58%, var(--olive) 100%);
    padding-block: 40px;
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
}
.page-id-34168 .input{
  width: 40%;
}
.page-id-34168 .wpa-login-label {
    color: var(--cream);
    line-height: 2;
    font-size: 1.6rem;
}

.page-id-34168 .wpa-submit{
    width: 40%;
    color: var(--deep);
    background: var(--gold);
    border: 2px solid var(--olive);
    margin-top: 20px;
}

.woocommerce-secureLogin{
      margin: 20px 0;
}

/* Tablet - 2 columns */
@media (max-width: 980px) {
    .products.columns-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* -- Responsive -- */
@media(max-width:782px){
	    .products.columns-4 {
        grid-template-columns: 1fr;
    }

    .page-id-34168 .wpa-login-label {
        font-size: 1.2rem;
        margin-bottom: 12px;
    }

    .page-id-34168 .input, .page-id-34168 .wpa-submit {
        width: 80%;
    }

  .woocommerce-columns--2{grid-template-columns:1fr;gap:16px}
  .woocommerce-account .u-columns{grid-template-columns:1fr}
  .woocommerce-account .u-column1,.woocommerce-account .u-column2{padding:24px 20px}

.woocommerce-account .woocommerce {
    padding-block: 0;
    display: block;
}
.woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content{
    max-width: 100%;
    width: 100%;
    padding: 0 0 10px 0;
    overflow-x: auto;
    margin-top: 20px;
}


  /* Orders table ? stacked cards (same pattern as the cart table) */
  .woocommerce-account .woocommerce-MyAccount-content{overflow-x:visible}
  .woocommerce-account .woocommerce-orders-table{border:0;display:block;width:100%}
  .woocommerce-account .woocommerce-orders-table thead{display:none}
  .woocommerce-account .woocommerce-orders-table tbody,
  .woocommerce-account .woocommerce-orders-table tr,
  .woocommerce-account .woocommerce-orders-table td,
  .woocommerce-account .woocommerce-orders-table th{display:block;width:auto}
  .woocommerce-account .woocommerce-orders-table tr{background:var(--white);border:1px solid var(--line);margin-bottom:14px;padding:4px 0}
  .woocommerce-account .woocommerce-orders-table tr:hover td{background:transparent}
  .woocommerce-account .woocommerce-orders-table td,
  .woocommerce-account .woocommerce-orders-table tbody th{display:flex;flex-wrap:wrap;gap:0;align-items:baseline;
    background:transparent;padding:11px 16px;border:0;border-bottom:1px solid var(--line-2);
    font-size:14px;color:var(--ink);text-align:right}
  .woocommerce-account .woocommerce-orders-table tr td:last-child,
  .woocommerce-account .woocommerce-orders-table tr th:last-child{border-bottom:0}
  /* label left, every value node grouped on the right */
  .woocommerce-account .woocommerce-orders-table td::before,
  .woocommerce-account .woocommerce-orders-table tbody th::before{content:attr(data-title);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;flex:0 0 auto;margin-right:auto;padding-right:14px}
  .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-number a{font-weight:800;color:var(--deep)}
  .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-date,
  .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-status{color:var(--ink-2)}
  .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-total{font-weight:700;color:var(--deep)}
  .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-total .woocommerce-Price-amount{margin-right:4px}
  .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions{flex-wrap:wrap;gap:8px}
  .woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions::before{width:100%;margin-right:0;padding-right:0;margin-bottom:2px}
  .woocommerce-account .woocommerce-orders-table .woocommerce-button{width:100%;text-align:center;margin: 3px 0;padding:11px 18px}

  /* Order details (view order) ? no data-title in core markup, so lay the
     row out as name-left / amount-right instead of labelled cells */
  .woocommerce-account .woocommerce-table--order-details,
  .woocommerce-account .shop_table.order_details{display:block;border:1px solid var(--line);background:var(--white)}
  .woocommerce-account .woocommerce-table--order-details thead{display:none}
  .woocommerce-account .woocommerce-table--order-details tbody,
  .woocommerce-account .woocommerce-table--order-details tfoot{display:block}
  .woocommerce-account .woocommerce-table--order-details tr{display:flex;flex-wrap:nowrap;align-items:flex-start;gap:14px;
    padding:13px 15px;border-bottom:1px solid var(--line-2)}
  .woocommerce-account .woocommerce-table--order-details tfoot tr:last-child{border-bottom:0;background:var(--sand)}
  .woocommerce-account .woocommerce-table--order-details td,
  .woocommerce-account .woocommerce-table--order-details th{display:block;width:auto;padding:0;border:0;font-size:14px;line-height:1.5}
  .woocommerce-account .woocommerce-table--order-details .product-name{flex:1 1 auto;min-width:0;text-align:left;color:var(--ink)}
  .woocommerce-account .woocommerce-table--order-details .product-name a{font-weight:700;color:var(--deep)}
  .woocommerce-account .woocommerce-table--order-details .product-name .wc-item-meta,
  .woocommerce-account .woocommerce-table--order-details .product-name .variation{margin:4px 0 0;padding:0;list-style:none;font-size:12.5px;color:var(--muted)}
  .woocommerce-account .woocommerce-table--order-details .product-quantity{display:inline-block;margin-top:4px;font-size:12.5px;font-weight:700;color:var(--muted)}
  .woocommerce-account .woocommerce-table--order-details .product-total,
  .woocommerce-account .woocommerce-table--order-details tfoot td{flex:0 0 auto;text-align:right;white-space:nowrap;font-weight:700;color:var(--deep)}
  .woocommerce-account .woocommerce-table--order-details tfoot th{flex:1 1 auto;text-align:left;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
  .woocommerce-account .woocommerce-table--order-details tfoot tr:last-child td{font-size:18px;font-weight:800}

  /* Downloads table ? core does emit data-title here */
  .woocommerce-account .woocommerce-table--order-downloads{display:block;border:0}
  .woocommerce-account .woocommerce-table--order-downloads thead{display:none}
  .woocommerce-account .woocommerce-table--order-downloads tbody,
  .woocommerce-account .woocommerce-table--order-downloads tr{display:block;width:auto}
  .woocommerce-account .woocommerce-table--order-downloads tr{background:var(--white);border:1px solid var(--line);margin-bottom:14px}
  .woocommerce-account .woocommerce-table--order-downloads td,
  .woocommerce-account .woocommerce-table--order-downloads th{display:flex;flex-wrap:wrap;gap:0;align-items:baseline;
    width:auto;padding:11px 15px;border:0;border-bottom:1px solid var(--line-2);text-align:right;font-size:14px}
  .woocommerce-account .woocommerce-table--order-downloads tr td:last-child{border-bottom:0}
  .woocommerce-account .woocommerce-table--order-downloads td[data-title]::before{content:attr(data-title);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;flex:0 0 auto;margin-right:auto;padding-right:14px}

  /* Customer details (billing / shipping under the order) */
  .woocommerce-account .woocommerce-customer-details .woocommerce-columns{display:grid;grid-template-columns:1fr;gap:16px}
  .woocommerce-account .woocommerce-customer-details address{border:1px solid var(--line);background:var(--white);padding:16px 15px}

  /* Addresses + forms */
  .woocommerce-account .woocommerce-Addresses{display:grid;grid-template-columns:1fr;gap:16px}
  .woocommerce-account .woocommerce-Address{padding:20px 18px}
  .woocommerce-account .col2-set .col-1,
  .woocommerce-account .col2-set .col-2{width:100%;float:none;margin-bottom:16px}
  .woocommerce-account .woocommerce-EditAccountForm .button,
  .woocommerce-account .woocommerce-address-fields .button{display:block;width:100%}
  .woocommerce-account .woocommerce-pagination ul{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}


  .logged-in.woocommerce-account .woocommerce{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }
}

/* ==========================================================================
   Section 16 ? Certificates checklist
   ========================================================================== */
.cart-certi{border: 1px solid rgba(138, 155, 114, 0.5); border-radius: 12px; overflow: hidden; background: rgb(238, 241, 231);}
.cart-certi h2{    font-size: 20px;
    line-height: 1.3;
    color: var(--paper);
    margin: 0;
    background: var(--olive);
    font-weight: 600;
    padding: 12px 20px;}
.cert-list{display: grid;grid-template-columns: 1fr 1fr;gap: 4px;padding: 14px 16px;}
.cert-list li{display: flex;align-items: center;gap: 8px;font-weight: 500;font-size: 13px;color: rgb(43, 43, 38);line-height: 1.3;}
.cert-list li::before{content:'';flex-shrink:0;width:18px;height:18px;border-radius:50%;background:var(--olive);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='white' d='M13.3 4.3a1 1 0 0 0-1.4 0L6.5 9.6 4.1 7.3a1 1 0 0 0-1.4 1.4l3 3a1 1 0 0 0 1.4 0l6-6a1 1 0 0 0 0-1.4z'/%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 16 16'%3E%3Cpath fill='white' d='M13.3 4.3a1 1 0 0 0-1.4 0L6.5 9.6 4.1 7.3a1 1 0 0 0-1.4 1.4l3 3a1 1 0 0 0 1.4 0l6-6a1 1 0 0 0 0-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}


/* ==========================================================================
   8a. Checkout page  (woocommerce/checkout/form-checkout.php)
   ========================================================================== */

/* -- Layout --------------------------------------------------------------- */
.co-wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut);padding-block:32px 64px}
.co-layout{display:grid;grid-template-columns:1fr 360px;gap:0 40px;align-items:start;padding-top:10px}

/* -- Progress bar ---------------------------------------------------------- */
.co-progress{margin-bottom:28px}
.co-progress__list{list-style:none;padding:0;margin:0;display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.co-progress__item,.co-progress__step{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--muted);padding:6px 0;transition:color var(--t)}
.co-progress__item.is-active,.co-progress__step.is-active{color:var(--deep)}
.co-progress__item.is-done,.co-progress__step.is-done{color:var(--olive)}
.co-progress__num{width:24px;height:24px;border-radius:50%;border:2px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex-shrink:0;transition:background var(--t),color var(--t),border-color var(--t)}
.co-progress__item.is-active .co-progress__num,.co-progress__step.is-active .co-progress__num{background:var(--deep);color:var(--cream);border-color:var(--deep)}
.co-progress__item.is-done .co-progress__num,.co-progress__step.is-done .co-progress__num{background:var(--olive);color:var(--cream);border-color:var(--olive)}
.co-progress__label{white-space:nowrap}
.co-progress__sep{color:var(--line);display:flex;align-items:center;padding:0 4px}

/* -- Step container -------------------------------------------------------- */
.co-step{animation:co-in 240ms ease both;}
.co-step--active{display:block}
@keyframes co-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.co-step{animation:none}}

/* Step heading */
.co-step__title{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:800;color:var(--deep);letter-spacing:-.018em;margin:0 0 22px;outline:none;line-height:1.2}
.co-step__title:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.co-step__num{width:32px;height:32px;border-radius:50%;background:var(--deep);color:var(--cream);font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;line-height:1}

/* Section divider within step */
.co-divider{position:relative;margin:24px 0 20px;text-align:center}
.co-divider span{position:relative;z-index:1;background:var(--cream);padding:0 14px;font-size:14px;font-weight:700;color:var(--muted);letter-spacing:.02em;text-transform:uppercase}
.co-divider::before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:var(--line)}

/* -- WC form fields inside checkout ----------------------------------------
   .co-fields is the class actually used in form-checkout.php for every field
   group (contact info, address, shipping toggle); .co-step__fields is kept
   as an alias so either name works. */
.co-step__fields .woocommerce-billing-fields__field-wrapper,
.co-step__fields .woocommerce-shipping-fields__field-wrapper,
.co-fields .woocommerce-billing-fields__field-wrapper,
.co-fields .woocommerce-shipping-fields__field-wrapper{display:block}

/* Hide WC's own "Additional information" / billing headings — our step
   titles replace them. NOT applied to .woocommerce-shipping-fields > h3:
   that h3 IS the "Ship to a different address?" checkbox toggle
   (id="ship-to-different-address"), restyled — not hidden — below. */
.co-step__fields .woocommerce-billing-fields > h3,
.co-step__fields .woocommerce-additional-fields > h3,
.co-fields .woocommerce-billing-fields > h3,
.co-fields .woocommerce-additional-fields > h3{display:none}

.co-step__fields .form-row,.co-fields .form-row{margin:0 0 14px}
.co-step__fields .form-row label,.co-fields .form-row label{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-bottom:5px}
.co-step__fields .form-row label .optional,.co-fields .form-row label .optional{font-size:10px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted);margin-left:3px}
.co-step__fields .form-row label abbr,.co-fields .form-row label abbr{text-decoration:none;color:var(--rust-2);margin-left:1px}

.co-step__fields .form-row input[type=text],
.co-step__fields .form-row input[type=email],
.co-step__fields .form-row input[type=tel],
.co-step__fields .form-row input[type=number],
.co-step__fields .form-row input[type=password],
.co-step__fields .form-row select,
.co-step__fields .form-row textarea,
.co-fields .form-row input[type=text],
.co-fields .form-row input[type=email],
.co-fields .form-row input[type=tel],
.co-fields .form-row input[type=number],
.co-fields .form-row input[type=password],
.co-fields .form-row select,
.co-fields .form-row textarea{
  width:100%;border:1.5px solid var(--line);background:var(--white);
  padding:11px 13px;font-size:14.5px;font-family:var(--ff);color:var(--ink);
  border-radius:0;appearance:none;-webkit-appearance:none;
  transition:border-color var(--t),box-shadow var(--t);
}
.co-step__fields .form-row input:focus,
.co-step__fields .form-row select:focus,
.co-step__fields .form-row textarea:focus,
.co-fields .form-row input:focus,
.co-fields .form-row select:focus,
.co-fields .form-row textarea:focus{outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(79,94,63,.1)}
.co-step__fields .form-row.woocommerce-invalid input,
.co-step__fields .form-row.woocommerce-invalid select,
.co-fields .form-row.woocommerce-invalid input,
.co-fields .form-row.woocommerce-invalid select{border-color:var(--rust-2)}
.co-step__fields .form-row select,.co-fields .form-row select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%234A4A42' stroke-width='2.5' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:38px}

/* Side-by-side first/last name */
.co-step__fields .form-row-first,.co-step__fields .form-row-last,
.co-fields .form-row-first,.co-fields .form-row-last{width:calc(50% - 8px);display:inline-block;vertical-align:top}
.co-step__fields .form-row-first,.co-fields .form-row-first{margin-right:16px}
.co-step__fields .form-row-wide,.co-fields .form-row-wide{width:100%;display:block}

/* "Ship to different address" toggle — WC sets this ID directly on the h3,
   so a bare #id selector works regardless of the wrapper class around it. */
#ship-to-different-address{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--ink-2);cursor:pointer;padding:12px 0;margin:0;border:none;background:none}
#ship-to-different-address input[type=checkbox]{accent-color:var(--olive);width:16px;height:16px;flex-shrink:0}

/* -- Order Review panel (steps 2+3) ---------------------------------------- */
.co-review{background:var(--white);border:1px solid var(--line);margin-bottom:22px}
.co-review--sm{margin-bottom:18px}
.co-review__row{display:grid;grid-template-columns:72px 1fr auto;align-items:start;gap:10px;padding:11px 16px;border-bottom:1px solid var(--line-2)}
.co-review__row:last-child{border-bottom:0}
.co-review__lbl{font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding-top:2px}
.co-review__val{font-size:14px;color:var(--ink);line-height:1.45}
.co-review__edit{font-size:12.5px;font-weight:700;color:var(--olive);background:none;border:0;padding:0;cursor:pointer;white-space:nowrap;transition:color var(--t)}
.co-review__edit:hover{color:var(--deep)}
.co-review__edit:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* -- Shipping methods section ---------------------------------------------- */
/* form-checkout.php wraps woocommerce_checkout_review_order_table() in
   .co-shipping-methods (there is no #order_review wrapper in this custom
   template), so that is the selector actually used to scope these rules;
   .co-step #order_review is kept as a fallback alias. */
.co-step #order_review .woocommerce-shipping-methods,
.co-shipping-methods .woocommerce-shipping-methods{list-style:none;padding:0;margin:0}
.co-step #order_review .woocommerce-shipping-methods li,
.co-shipping-methods .woocommerce-shipping-methods li{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;padding:12px 0;border-bottom:1px solid var(--line-2)}
.co-step #order_review .woocommerce-shipping-methods li:last-child,
.co-shipping-methods .woocommerce-shipping-methods li:last-child{border-bottom:0}
.co-step #order_review .woocommerce-shipping-methods input[type=radio],
.co-shipping-methods .woocommerce-shipping-methods input[type=radio]{accent-color:var(--olive);width:16px;height:16px;flex-shrink:0;margin-top:2px}
.co-step #order_review .woocommerce-shipping-methods label,
.co-shipping-methods .woocommerce-shipping-methods label{flex:1;font-size:14px;color:var(--ink-2);cursor:pointer}
.co-step #order_review .woocommerce-shipping-methods .woocommerce-Price-amount,
.co-shipping-methods .woocommerce-shipping-methods .woocommerce-Price-amount{font-weight:700;color:var(--deep)}

/* Shipping / Payment / Order Notes sub-headings inside a step — used via
   class="co-section-title" in form-checkout.php. .co-ship-title kept as an
   alias for the same look. */
.co-ship-title,.co-section-title{font-size:17px;font-weight:800;color:var(--deep);letter-spacing:-.012em;margin:24px 0 14px}

/* -- Order Notes ----------------------------------------------------------- */
.co-notes{margin-top:22px}
.co-notes__label{display:block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-bottom:6px}
.co-optional{font-size:10px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted);margin-left:4px}
.co-notes__field,.co-notes-field{width:100%;border:1.5px solid var(--line);background:var(--white);padding:11px 13px;font-size:14.5px;font-family:var(--ff);color:var(--ink);resize:vertical;min-height:90px;transition:border-color var(--t)}
.co-notes__field:focus,.co-notes-field:focus{outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(79,94,63,.1)}

/* -- Step nav ---------------------------------------------------------------
   .co-step-nav (step 2/3) wraps a full-width .co-btn-next plus a centered
   .co-return-wrap link below it — stacked, not the side-by-side .co-nav row.
   .co-return-wrap/.co-return-link are also used standalone in step 1. */
.co-btn-next{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:var(--deep);color:var(--cream);border:0;padding:17px 24px;font-size:14px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;font-family:var(--ff);transition:background var(--t);margin-top:20px}
.co-btn-next:hover{background:var(--olive)}
.co-btn-next:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-btn-next svg{flex-shrink:0}

.co-step-nav{margin-top:20px}
.co-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px;flex-wrap:wrap}
.co-btn-back{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;color:var(--muted);background:none;border:0;padding:0;cursor:pointer;font-family:var(--ff);transition:color var(--t)}
.co-btn-back:hover{color:var(--deep)}
.co-btn-back:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

.co-return-wrap{text-align:center;margin-top:14px}
.co-return-link{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;color:var(--muted);background:none;border:0;padding:0;cursor:pointer;font-family:var(--ff);text-decoration:none;transition:color var(--t)}
.co-return-link:hover{color:var(--deep)}
.co-return-link:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.woocommerce-checkout .entry h2{margin-top:0;     font-size: 18px !important;}
:where(.woocommerce) .select2-container .select2-selection--single .select2-selection__rendered{
      padding-top: 20px !important;
    font-size: medium;
}
/* -- Step 3: Payment section - matches live FunnelKit checkout UI */

/* Secure line */
.co-wrap .co-payment-secure{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);line-height:1.5;margin:0 0 18px}
.co-wrap .co-payment-secure svg{stroke:var(--olive);flex-shrink:0;width:14px;height:14px}

/* Rush Fee row - bordered box above gateway list */
.co-wrap #rush-fee-field{border:1.5px solid var(--line);padding:14px 16px;margin:0 0 14px;background:var(--white)}
.co-wrap #rush-fee-field label{display:flex !important;align-items:flex-start;gap:10px;font-size:14px !important;font-weight:600 !important;color:var(--deep) !important;cursor:pointer;text-transform:none !important;letter-spacing:0 !important;margin:0 !important}
.co-wrap #rush_fee_checkbox{accent-color:var(--olive);width:16px;height:16px;flex-shrink:0;margin:2px 0 0}
.co-wrap #rush-fee-field p{margin:5px 0 0 26px;font-size:13px;color:var(--muted);line-height:1.45}

/* Strip WC default chrome */
.co-wrap .woocommerce-checkout-payment{background:none !important;border:0 !important;padding:0 !important}

/* Gateway list card */
.co-wrap .wc_payment_methods{list-style:none;margin:0 0 14px;padding:0;border:1.5px solid var(--line)}
.co-wrap .wc_payment_method{position:relative;border:0;border-bottom:1px solid var(--line-2);background:var(--white);margin:0;overflow:hidden;transition:background 150ms ease}
.co-wrap .wc_payment_method:last-child{border-bottom:0}
.co-wrap .wc_payment_method:has(input:checked){background:var(--paper)}

/* Radio button — keep before the label, styled natively */
.co-wrap .wc_payment_method > input[type=radio]{
  position:absolute;left:16px;top:50%;transform:translateY(-50%);
  accent-color:var(--olive);width:17px;height:17px;margin:0;cursor:pointer;z-index:1;
}
/* Label row - indent past the radio */
.co-wrap .wc_payment_method > label{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin:0;padding:13px 16px 13px 44px;cursor:pointer;
  font-size:14.5px;font-weight:600;color:var(--deep);
  text-transform:none !important;letter-spacing:0 !important;
}
.co-wrap .wc_payment_method img{height:22px;width:auto;display:inline-block;margin:0 0 0 4px;object-fit:contain;vertical-align:middle}

/* Expanded card fields panel */
.co-wrap .payment_box{
  margin:0;padding:14px 16px;
  background:var(--mist);border-top:1px solid var(--mist-b);
  font-size:14px;color:var(--ink-2);line-height:1.55;clear:both;
}
.co-wrap .payment_box::before,.co-wrap .payment_box::after{display:none}
.co-wrap .payment_box p{margin:0 0 10px}
.co-wrap .payment_box p:last-child{margin:0}

/* Card field rows */
.co-wrap .payment_box .form-row{
  margin:0 0 12px;padding:0;float:none !important;
  width:100% !important;display:block;clear:both;
}
.co-wrap .payment_box label{
  display:block !important;margin:0 0 5px !important;
  font-size:12px !important;font-weight:700 !important;
  letter-spacing:.06em !important;text-transform:uppercase !important;
  color:var(--ink-2) !important;
}
/* Expiry + CVC sit side-by-side */
.co-wrap .payment_box .form-row-first{
  float:left !important;width:calc(50% - 8px) !important;margin-right:14px !important;clear:none !important;
}
.co-wrap .payment_box .form-row-last{
  float:left !important;width:calc(50% - 8px) !important;clear:none !important;
}
/* Clearfix after the two-col row */
.co-wrap .payment_box .form-row-last + *{clear:both}
/* Card inputs */
.co-wrap .payment_box input[type=text],
.co-wrap .payment_box input[type=tel],
.co-wrap .payment_box input[type=number],
.co-wrap .payment_box input[type=password]{
  display:block;width:100%;min-height:44px;margin:0;
  border:1.5px solid var(--line);background:var(--white);
  padding:10px 12px;font-size:15px;font-family:var(--ff);color:var(--ink);
  transition:border-color 150ms ease,box-shadow 150ms ease;
}
.co-wrap .payment_box input:focus{
  outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(79,94,63,.12);
}

/* Privacy policy text */
.co-wrap .woocommerce-privacy-policy-text{
  margin:14px 0 10px;font-size:13px;color:var(--muted);line-height:1.6;
}
.co-wrap .woocommerce-privacy-policy-text a{color:var(--olive);font-weight:600}

/* Terms checkbox */
.co-wrap .woocommerce-terms-and-conditions-wrapper{
  margin:0 0 14px;padding-top:14px;border-top:1px solid var(--line-2);
}
.co-wrap .woocommerce-terms-and-conditions-wrapper .woocommerce-form__label{
  display:flex !important;align-items:flex-start;gap:9px;margin:0 !important;cursor:pointer;
  font-size:13.5px !important;font-weight:400 !important;color:var(--ink-2) !important;
  line-height:1.5;text-transform:none !important;letter-spacing:0 !important;
}
.co-wrap .woocommerce-terms-and-conditions-wrapper input[type=checkbox]{
  accent-color:var(--olive);width:16px;height:16px;flex-shrink:0;margin:2px 0 0;
}
.co-wrap .woocommerce-terms-and-conditions-wrapper a{color:var(--rust);font-weight:700;text-decoration:none}
.co-wrap .woocommerce-terms-and-conditions-wrapper a:hover{text-decoration:underline}

/* Place Order button — olive, lock icon */
.co-wrap #place_order{
  display:flex !important;align-items:center;justify-content:center;gap:9px;width:100%;
  background:var(--olive);color:var(--cream);border:0;
  padding:18px 24px;font-size:16px;font-weight:800;letter-spacing:.02em;
  text-transform:none;font-family:var(--ff);cursor:pointer;
  transition:background 150ms ease;margin-top:0;
}
.co-wrap #place_order:hover{background:var(--deep);color:var(--cream)}
.co-wrap #place_order:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-wrap #place_order::before{
  content:"";width:14px;height:16px;flex-shrink:0;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%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 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Return to Step 2 link */
.co-wrap .co-return-wrap{text-align:center;margin-top:12px}
.co-wrap .co-return-link{
  background:none;border:0;padding:4px 8px;cursor:pointer;font-family:var(--ff);
  font-size:14px;font-weight:600;color:var(--rust);
  text-decoration:none;transition:color 150ms ease;
}
.co-wrap .co-return-link:hover{color:var(--rust-2);text-decoration:underline}
.co-wrap .co-return-link:focus-visible{outline:3px solid var(--gold);outline-offset:2px}


/* -- Sidebar -----------------------------------------------------------------
   form-checkout.php uses .co-cart-box (not .co-cart) for the card container
   and .co-cart-items (not .co-cart__items); both names are aliased below. */
.co-sidebar{position:static}
.co-cart,.co-cart-box{background:var(--white);border:1px solid var(--line)}

.co-cart__head,.co-cart-box__head{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--line-2)}
.co-cart__badge,.co-cart-box__badge{background:var(--deep);color:var(--cream);font-size:11px;font-weight:800;border-radius:999px;padding:2px 8px}

.co-cart__items,.co-cart-items{border-bottom:1px solid var(--line-2)}
.co-item{display:flex;align-items:flex-start;gap:11px;padding:12px 18px}
.co-item+.co-item{border-top:1px solid var(--line-2)}
.co-item__thumb{position:relative;flex-shrink:0}
.co-item__img{width:56px;height:56px;object-fit:cover;display:block;border:1px solid var(--line-2)}
.co-item__qty{position:absolute;top:-7px;right:-7px;background:var(--ink);color:var(--cream);font-size:10px;font-weight:800;border-radius:999px;width:18px;height:18px;display:flex;align-items:center;justify-content:center}
.co-item__info{flex:1;min-width:0}
.co-item__name{display:block;font-size:13px;font-weight:700;color:var(--deep);line-height:1.3;margin-bottom:2px}
.co-item__var{display:block;font-size:11.5px;color:var(--muted)}
.co-item__price{font-size:13.5px;font-weight:700;color:var(--deep);white-space:nowrap;flex-shrink:0}

/* Gift certificate — form-checkout.php uses __trigger/__form/__apply
   (rather than __toggle/__panel/__btn); aliased below. */
.co-gc{border-bottom:1px solid var(--line-2)}
.co-gc__toggle,.co-gc__trigger{display:flex;align-items:center;gap:7px;width:100%;padding:12px 18px;background:none;border:0;font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer;font-family:var(--ff);text-align:left;transition:color var(--t)}
.co-gc__toggle:hover,.co-gc__trigger:hover{color:var(--olive)}
.co-gc__toggle:focus-visible,.co-gc__trigger:focus-visible{outline:3px solid var(--gold);outline-offset:-2px}
.co-gc__chev{margin-left:auto;flex-shrink:0;transition:transform var(--t)}
.co-gc__toggle[aria-expanded=true] .co-gc__chev,.co-gc__trigger[aria-expanded=true] .co-gc__chev{transform:rotate(180deg)}
.co-gc__panel,.co-gc__form{padding:10px 18px 14px}
.co-gc__row{display:flex;gap:8px;flex-wrap:wrap}
.co-gc__input{flex:1;border:1.5px solid var(--line);padding:9px 11px;font-size:13.5px;font-family:var(--ff);color:var(--ink);transition:border-color var(--t);background:var(--white)}
.co-gc__input:focus{outline:none;border-color:var(--olive)}
.co-gc__btn,.co-gc__apply{flex-shrink:0;background:var(--olive);color:var(--cream);border:0;padding:9px 16px;font-size:12.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;font-family:var(--ff);transition:background var(--t)}
.co-gc__btn:hover,.co-gc__apply:hover{background:var(--deep)}
.co-gc__btn:focus-visible,.co-gc__apply:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-gc__msg{font-size:12px;color:var(--muted);margin-top:6px}

/* Personalized "your available gift certificates" buttons — injected into
   #co-gc-form by shay_show_user_specific_coupons() in functions.php */
.co-gc__user-list{padding:0 0 10px;font-size:12px;color:var(--ink-2)}
.co-gc__user-list strong{display:block;margin-bottom:6px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--deep)}
.co-gc__user-btn{margin:0 6px 6px 0;padding:6px 10px;border:1.5px solid var(--line);background:var(--white);color:var(--ink-2);font-size:12px;font-family:var(--ff);cursor:pointer;transition:border-color var(--t),color var(--t)}
.co-gc__user-btn:hover{border-color:var(--olive);color:var(--olive)}

/* Totals */
.co-totals{padding:12px 18px;border-bottom:1px solid var(--line-2)}
.co-totals__row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:13.5px;color:var(--ink-2);padding:4px 0}
.co-totals__row--off{color:var(--olive)}
.co-totals__row--total{padding-top:10px;margin-top:6px;border-top:2px solid var(--deep)}
.co-totals__row--total span:first-child{font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--deep)}
.co-totals__row--total span:last-child{font-size:20px;font-weight:800;color:var(--deep);letter-spacing:-.02em}

/* Fee notice — form-checkout.php uses .co-fee-notice(__close) */
.co-fee,.co-fee-notice{position:relative;background:#EBF4FC;border-left:3px solid #4A9CC7;padding:11px 36px 11px 14px;margin:12px 0;font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.co-fee p,.co-fee-notice p{margin:4px 0 0}
.co-fee strong,.co-fee-notice strong{display:block;font-size:12.5px;color:var(--deep)}
.co-fee__close,.co-fee-notice__close{position:absolute;top:8px;right:8px;background:none;border:0;padding:2px;cursor:pointer;color:var(--muted);line-height:1;display:flex}
.co-fee__close:hover,.co-fee-notice__close:hover{color:var(--deep)}
.co-fee__close:focus-visible,.co-fee-notice__close:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* Trust */
.co-trust{list-style:none;padding:12px 18px;margin:0;display:flex;flex-direction:column;gap:7px}
.co-trust li{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.co-trust li svg{stroke:var(--olive);flex-shrink:0}

/* -- WC notices ------------------------------------------------------------ */
.woocommerce-NoticeGroup,.woocommerce-NoticeGroup-checkout{margin-bottom:18px}
.woocommerce-error{list-style:none;padding:13px 15px;margin:0 0 18px;background:#FFF0F0;border-left:3px solid var(--rust-2);font-size:13px;color:var(--rust)}
.woocommerce-error li{margin:0}
.woocommerce-message{padding:12px 15px;margin:0 0 14px;background:var(--mist);border-left:3px solid var(--olive);font-size:13px;color:var(--ink-2)}
.woocommerce-info{padding:12px 15px;margin:0 0 14px;background:#EBF4FC;border-left:3px solid #4A9CC7;font-size:13px;color:var(--ink-2)}
.woocommerce-message .button{
    padding: 10px 20px;
    border-radius: 7px;
}
/* -- Responsive ------------------------------------------------------------- */
@media(max-width:1024px){
  .co-layout{grid-template-columns:1fr;gap:28px}
  /* Ordering is handled in section 8a-2, where the aside becomes
     display:contents so summary and fee notice can be placed separately. */
}
@media(max-width:640px){
  .co-step__fields .form-row-first,.co-step__fields .form-row-last,
  .co-fields .form-row-first,.co-fields .form-row-last{width:100%;display:block;margin-right:0}
  .co-nav{flex-direction:column-reverse;align-items:stretch}
  .co-btn-next,.co-nav .co-btn-next{width:100%;justify-content:center}
  .co-btn-back{justify-content:center}
  .co-progress__label{display:none}
}
/* ==========================================================================
   8a-2. Checkout — rules for the markup form-checkout.php actually outputs
   (.co-page / .co-card / .co-grid / .co-cart-item / .co-gift-cert).

   Section 8a above was written against an older markup revision and most of
   its selectors no longer match. This block comes after it deliberately, so
   it wins on equal specificity. Selectors are prefixed with .co-page where
   they must out-rank WooCommerce's own layout CSS (which is still enqueued
   on checkout) and the theme's generic ".woocommerce form .form-row" rules.
   ========================================================================== */

/* Step visibility — the template toggles .co-step--hidden from JS. Without
   this rule every step renders at once, stacked down the page. */
.co-step--hidden{display:none}

/* -- Page shell ------------------------------------------------------------ */
.co-page{background:var(--cream);padding-bottom:8px}
.co-header{background:var(--white);border-bottom:1px solid var(--line)}
.co-header__in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:18px}
.co-header__logo{display:block;line-height:0}
.co-header__logo img{height:100px !important;width:auto}
.co-header__ssl{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--rust);white-space:nowrap}
.co-header__ssl svg{stroke:var(--rust);flex-shrink:0}

/* -- Progress bar ---------------------------------------------------------- */
.co-progress{background:var(--white);border-bottom:1px solid var(--line);margin-bottom:0}
.co-progress__in{padding-block:13px}
.co-progress__list{display:flex;align-items:center;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}

/* -- Cards ----------------------------------------------------------------- */
.co-card{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:24px 26px;margin-bottom:18px}
.co-card__title {
    font-size: 19px !important;
    font-weight: 800;
    color: var(--deep);
    letter-spacing: -.015em;
    margin: 0 0 12px !important;
    outline: none;
    line-height: 1.2;
}
.co-card__title:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

/* -- Field grid (Step 1) ---------------------------------------------------
   Two columns; .co-col-2 (set per field in the template) spans both.
   .woocommerce-shipping-fields__field-wrapper is WC's own container for the "ship to a different
   address" fields and is laid out the same way. */
.co-page .co-grid,
.co-page .woocommerce-shipping-fields__field-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.co-page .co-grid > .form-row,
.co-page .woocommerce-shipping-fields__field-wrapper > .form-row{
  position:relative;display:block;float:none;width:auto;margin:0;padding:0;
}
.co-page .co-grid > .form-row.co-col-2,
.co-page .woocommerce-shipping-fields__field-wrapper > .form-row-wide{grid-column:1 / -1}

/* Address field order and column spans, driven off the field IDs WooCommerce
   always emits (#billing_city_field, #shipping_city_field, …).

   Doing it here rather than only in the template is deliberate: when the block
   is rendered by WooCommerce's own form-shipping.php the fields arrive in WC's
   order and every one of them carries .form-row-wide, so they stack full width.
   Grid `order` re-sequences them visually whichever template rendered them, and
   the ID selectors out-rank the .form-row-wide rule above so the paired rows
   drop back to a single column. Matches the live layout:
   Company / Street / Apartment (full), then City + ZIP, then Country + State. */
.co-page .co-grid > #billing_company_field,
.co-page .woocommerce-shipping-fields__field-wrapper > #shipping_company_field{order:1;grid-column:1 / -1}

.co-page .co-grid > #billing_address_1_field,
.co-page .woocommerce-shipping-fields__field-wrapper > #shipping_address_1_field{order:2;grid-column:1 / -1}

.co-page .co-grid > #billing_address_2_field,
.co-page .woocommerce-shipping-fields__field-wrapper > #shipping_address_2_field{order:3;grid-column:1 / -1}

.co-page .co-grid > #billing_city_field,
.co-page .woocommerce-shipping-fields__field-wrapper > #shipping_city_field{order:4;grid-column:auto}

.co-page .co-grid > #billing_postcode_field,
.co-page .woocommerce-shipping-fields__field-wrapper > #shipping_postcode_field{order:5;grid-column:auto}

.co-page .co-grid > #billing_country_field,
.co-page .woocommerce-shipping-fields__field-wrapper > #shipping_country_field{order:6;grid-column:auto}

.co-page .co-grid > #billing_state_field,
.co-page .woocommerce-shipping-fields__field-wrapper > #shipping_state_field{order:7;grid-column:auto}

/* Floating label sitting inside the field box */
.co-page .co-grid > .form-row > label,
.co-page .woocommerce-shipping-fields__field-wrapper > .form-row > label{
  position:absolute;top:8px;left:14px;z-index:2;
  margin:0;padding:0;max-width:calc(100% - 28px);
  font-size:11px;font-weight:600;letter-spacing:.01em;text-transform:none;
  color:var(--muted);line-height:1;pointer-events:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.co-page .co-grid > .form-row > label abbr[title],
.co-page .woocommerce-shipping-fields__field-wrapper > .form-row > label abbr[title]{
  border:0;text-decoration:none;color:var(--rust-2);
}
/* WC hides some labels (e.g. address line 2) for screen readers only. The
   live design shows them, so re-reveal them in place as floating labels. */
.co-page .co-grid > .form-row > label.screen-reader-text,
.co-page .woocommerce-shipping-fields__field-wrapper > .form-row > label.screen-reader-text{
  position:absolute!important;width:auto!important;height:auto!important;
  clip:auto!important;clip-path:none!important;overflow:visible!important;
  white-space:nowrap!important;margin:0!important;top:8px;left:14px;
}
.co-page .co-grid .woocommerce-input-wrapper,
.co-page .woocommerce-shipping-fields__field-wrapper .woocommerce-input-wrapper{display:block;width:100%}

/* Field boxes. The .co-step in the selector is deliberate: WooCommerce's own
   stylesheet is still enqueued on checkout and carries
   ".woocommerce form .form-row input.input-text", which out-ranks a plain
   three-class selector and was leaving these inputs at their default height
   (the value then collided with the floating label). */
.co-page .co-step .co-grid input:not([type=checkbox]):not([type=radio]),
.co-page .co-step .co-grid select,
.co-page .co-step .co-grid textarea,
.co-page .co-step .woocommerce-shipping-fields__field-wrapper input:not([type=checkbox]):not([type=radio]),
.co-page .co-step .woocommerce-shipping-fields__field-wrapper select,
.co-page .co-step .woocommerce-shipping-fields__field-wrapper textarea{
  width:100%;min-height:52px;margin:0;box-shadow:none;
  border:1.5px solid var(--line);border-radius:8px;background:var(--white);
  padding:22px 14px 7px;font-size:15px;font-family:var(--ff);color:var(--ink);
  line-height:1.3;appearance:none;-webkit-appearance:none;
  transition:border-color var(--t),box-shadow var(--t);
}
.co-page .co-step .co-grid input:focus,
.co-page .co-step .co-grid select:focus,
.co-page .co-step .co-grid textarea:focus,
.co-page .co-step .woocommerce-shipping-fields__field-wrapper input:focus,
.co-page .co-step .woocommerce-shipping-fields__field-wrapper select:focus,
.co-page .co-step .woocommerce-shipping-fields__field-wrapper textarea:focus{
  outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(79,94,63,.12);
}
/* Selects: padding is declared longhand and the height is left to grow from
   min-height on purpose. Given an explicit height, Chrome centres a <select>'s
   selected-option text vertically and disregards an asymmetric padding split,
   which pushed the value back up into the floating label. */
.co-page .co-step .co-grid > .form-row select,
.co-page .co-step .woocommerce-shipping-fields__field-wrapper > .form-row select{
  cursor:pointer;
  height:auto;min-height:52px;line-height:1.3;
  padding-top:22px;
  padding-right:40px;
  padding-bottom:7px;
  padding-left:14px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%234A4A42' stroke-width='2.5' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
}
/* -- Field validation ------------------------------------------------------
   Applied by the step-advance check in form-checkout.php, and by WooCommerce's
   own checkout.js, which uses the same .woocommerce-invalid class. */
.co-page .co-step .form-row.woocommerce-invalid input,
.co-page .co-step .form-row.woocommerce-invalid select,
.co-page .co-step .form-row.woocommerce-invalid textarea{
  border-color:var(--rust-2);
}
.co-page .co-step .form-row.woocommerce-invalid input:focus,
.co-page .co-step .form-row.woocommerce-invalid select:focus,
.co-page .co-step .form-row.woocommerce-invalid textarea:focus{
  border-color:var(--rust-2);box-shadow:0 0 0 3px rgba(169,104,63,.14);
}
/* The floating label turns red with the box, as on live. */
.co-page .co-step .form-row.woocommerce-invalid > label{color:var(--rust-2)}

/* Message under the field. */
.co-field-error{
  display:block;margin:5px 0 0;
  font-size:13px;font-weight:600;line-height:1.4;color:var(--rust);
}

/* Green tick styling WooCommerce adds on a valid field would fight the
   floating label, so it is neutralised. */
.co-page .co-step .form-row.woocommerce-validated input,
.co-page .co-step .form-row.woocommerce-validated select{border-color:var(--line)}
.co-page .co-grid ::placeholder,
.co-page .woocommerce-shipping-fields__field-wrapper ::placeholder{color:var(--muted);opacity:.75}

/* -- "Ship to a different address?" toggle --------------------------------- */
.co-page .woocommerce-shipping-fields{margin-top:16px;padding-top:16px;border-top:1px solid var(--line-2)}
.co-page #ship-to-different-address{margin:0;padding:0;font-size:14px;background:none;border:0}
.co-page #ship-to-different-address label{
  display:flex;align-items:center;gap:9px;margin:0;cursor:pointer;
  font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-2);
}
.co-page #ship-to-different-address input[type=checkbox]{
  accent-color:var(--olive);width:17px;height:17px;flex-shrink:0;margin:0;
}

/* -- Primary "Next Step" button -------------------------------------------- */
.co-page .co-next-btn{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  background:var(--olive);color:var(--cream);border:0;border-radius:8px;
  padding:18px 26px;font-size:14.5px;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;font-family:var(--ff);cursor:pointer;
  transition:background var(--t);
}
.co-page .co-next-btn:hover{background:var(--deep);color:var(--cream);text-decoration:none}
.co-page .co-next-btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-page .co-next-btn svg{flex-shrink:0}

/* -- Step 2: Order Preview ------------------------------------------------- */
.co-page .co-preview{border:1px solid var(--line);border-radius:8px;overflow:hidden}
.co-page .co-preview__row{
  display:grid;grid-template-columns:120px 1fr auto;align-items:start;gap:14px;
  padding:14px 18px;border-bottom:1px solid var(--line-2);
}
.co-page .co-preview__row:last-child{border-bottom:0}
.co-page .co-preview__label{font-size:14px;font-weight:600;color:var(--ink-2)}
.co-page .co-preview__val{font-size:14px;color:var(--ink);line-height:1.5;word-break:break-word}
.co-page .co-preview__change{
  background:none;border:0;padding:0;cursor:pointer;font-family:var(--ff);
  font-size:14px;font-weight:600;color:var(--rust);white-space:nowrap;
  transition:color var(--t);
}
.co-page .co-preview__change:hover{color:var(--rust-2);text-decoration:underline}
.co-page .co-preview__change:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* -- Step 2: Shipping methods ----------------------------------------------
   The markup here is WooCommerce's own (wc_cart_totals_shipping_html), so it
   arrives as a table row containing ul#shipping_method. The table shell is
   flattened and the list restyled into the card layout. */
.co-page .co-ship-table{width:100%;border-collapse:collapse;border:0;margin:0;background:none}
.co-page .co-ship-table tbody,
.co-page .co-ship-table tr{display:block;width:100%;border:0;background:none}
.co-page .co-ship-table td{display:block;width:100%;padding:0;border:0;background:none}
/* The package heading ("Shipping"); the card title already says it. */
.co-page .co-ship-table th{display:none}

.co-page .woocommerce-shipping-methods{
  list-style:none;margin:0;padding:0;
  border:1px solid var(--line);border-radius:8px;overflow:hidden;
}
.co-page .woocommerce-shipping-methods li{
  display:grid;grid-template-columns:auto 1fr;align-items:start;gap:12px;
  margin:0;padding:14px 18px;border-bottom:1px solid var(--line-2);
  font-size:14px;color:var(--ink);line-height:1.45;
}
.co-page .woocommerce-shipping-methods li:last-child{border-bottom:0}
.co-page .woocommerce-shipping-methods li:hover{background:var(--paper)}
.co-page .woocommerce-shipping-methods input[type=radio]{
  accent-color:var(--olive);width:17px;height:17px;margin:2px 0 0;cursor:pointer;
}
.co-page .woocommerce-shipping-methods label{
  margin:0;cursor:pointer;display:block;
  font-size:14px;font-weight:600;color:var(--deep);line-height:1.45;
  text-transform:none;letter-spacing:0;
}
.co-page .woocommerce-shipping-methods label .woocommerce-Price-amount{font-weight:700;color:var(--deep)}
/* "Est delivery : …", printed by the carrier plugin on
   woocommerce_after_shipping_rate — it sits after the label inside the li. */
.co-page .woocommerce-shipping-methods li > *:not(input):not(label){
  grid-column:2;margin:3px 0 0;font-size:12.5px;font-weight:400;color:var(--muted);line-height:1.45;
}

/* Address is collected in step 1, so WC's destination line and its calculator
   are redundant here. */
.co-page .woocommerce-shipping-destination,
.co-page .woocommerce-shipping-calculator{display:none}

.co-page .co-ship__none{
  font-size:14px;color:var(--ink-2);background:var(--mist);border:1px solid var(--mist-b);
  border-radius:8px;padding:14px 16px;margin:0;line-height:1.55;
}

/* -- Step 2: Order notes --------------------------------------------------- */
.co-page .co-notes{position:relative;display:block}
.co-page .co-notes__label{
  position:absolute;top:9px;left:14px;z-index:2;margin:0;padding:0;
  font-size:11px;font-weight:600;letter-spacing:.01em;text-transform:none;
  color:var(--muted);line-height:1;pointer-events:none;
}
.co-page .co-notes__field{
  width:100%;margin:0;display:block;box-shadow:none;
  border:1.5px solid var(--line);border-radius:8px;background:var(--white);
  padding:26px 14px 10px;font-size:15px;font-family:var(--ff);color:var(--ink);
  line-height:1.5;min-height:110px;resize:vertical;
  transition:border-color var(--t),box-shadow var(--t);
}
.co-page .co-notes__field:focus{
  outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(79,94,63,.12);
}

/* -- Step 3: Payment -------------------------------------------------------
   Markup is WooCommerce's checkout/payment.php, rendered by
   woocommerce_checkout_payment(). */
.co-page .co-payment-secure{
  margin:-10px 0 18px;font-size:14px;color:var(--muted);line-height:1.5;
}

.co-page .woocommerce-checkout-payment{background:0 !important;}

/* Rush-fee row and any other block a plugin adds above the gateways */
.co-page .woocommerce-checkout-payment > p:not(.form-row):not(.woocommerce-privacy-policy-text){
  margin:0 0 14px;font-size:14px;color:var(--ink-2);line-height:1.5;
}

.co-page #add_payment_method #payment ul.payment_methods, .co-page .woocommerce-cart #payment ul.payment_methods, .co-page .woocommerce-checkout #payment ul.payment_methods{
    padding: 0;
    text-align: left;
    margin: 0;
    border: 1px solid #ddd;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    list-style-type: none;
    line-height: 1.5;
    font-size: 14px;
}

.co-page #add_payment_method #payment ul.payment_methods li, .co-page .woocommerce-cart #payment ul.payment_methods li, .co-page .woocommerce-checkout #payment ul.payment_methods li {
    clear: both;
    border: none;
    border-bottom: 1px solid #ddd;
    padding: 11px;
    line-height: 2;
    text-align: left;
    margin: 0;
    font-weight: 400;
}

body .woocommerce-checkout #payment ul.payment_methods label {
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    padding-bottom: 0;
    margin-bottom: 0;
    padding-top: 0;
    margin-left: 0;
    background: 0 0 !important;
}

body #payment li.wc_payment_method input.input-radio{
  -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 14px;
    border: 1px solid #b4b9be;
    background: #fff;
    color: #555;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    height: 16px;
    width: 16px;
    min-width: 16px;
    transition: .05s border-color ease-in-out;
}
.paypal-button-container{
  max-width: 100% !important; 
}

body #payment li.wc_payment_method input.input-radio:checked{
    border: 5px solid var(--olive);
}

body .wfacp_main_form.woocommerce #wfacp_checkout_form #payment ul li label img {
    border-radius: 3px;
    margin-right: 12px;
    margin-inline-start: 5px;
    margin-inline-end: 5px;
    max-height: 30px;
}

body #add_payment_method #payment div.payment_box, body .woocommerce-cart #payment div.payment_box, body .woocommerce-checkout #payment div.payment_box {
    background-color: #fafafa;
    position: relative;
    box-sizing: border-box;
    padding: 1em;
    margin: 1em -11px -11px -11px;
    font-size: .92em;
    border-radius: 2px;
    line-height: 1.5;
    color: #515151;
    width: auto;
    border-top: 1px solid #ddd;
}
#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before{
  display: none !important;
}
#add_payment_method #payment div.payment_box .wc-credit-card-form, .woocommerce-cart #payment div.payment_box .wc-credit-card-form, .woocommerce-checkout #payment div.payment_box .wc-credit-card-form, #add_payment_method #payment div.payment_box .form-row, .woocommerce-cart #payment div.payment_box .form-row, .woocommerce-checkout #payment div.payment_box .form-row{
  margin: 0 !important;
}
#add_payment_method #payment ul.payment_methods li img, .woocommerce-cart #payment ul.payment_methods li img, .woocommerce-checkout #payment ul.payment_methods li img{
    display: inline !important;
}

 .woocommerce-checkout #payment div.payment_box p {
    margin-bottom: 0;
    color: #494949;
    font-size: 14px;
}

/* Privacy + terms */
.co-page .woocommerce-privacy-policy-text{
  margin:14px 0;font-size:13px;color:var(--muted);line-height:1.6;
}
.co-page .woocommerce-privacy-policy-text a{color:var(--olive);text-decoration:underline}
.co-page .woocommerce-terms-and-conditions-wrapper{margin:0 0 16px}
.co-page .woocommerce-terms-and-conditions-wrapper .form-row{margin:0;padding:0}
.co-page .woocommerce-terms-and-conditions-wrapper label{
  display:flex;align-items:flex-start;gap:10px;margin:0;cursor:pointer;
  font-size:14px;font-weight:400;color:var(--ink-2);line-height:1.5;
  text-transform:none;letter-spacing:0;
}
.co-page .woocommerce-terms-and-conditions-wrapper input[type=checkbox]{
  accent-color:var(--olive);width:17px;height:17px;flex-shrink:0;margin:2px 0 0;
}
.co-page .woocommerce-terms-and-conditions-wrapper a{color:var(--rust);font-weight:600}

/* Place Order */
.co-page #place_order{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  background:var(--olive);color:var(--cream);border:0;border-radius:8px;
  padding:18px 26px;font-size:16px;font-weight:800;letter-spacing:.02em;
  text-transform:none;font-family:var(--ff);cursor:pointer;
  transition:background var(--t);
}
.co-page #place_order:hover{background:var(--deep);color:var(--cream)}
.co-page #place_order:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-page #place_order::before{
  content:"";width:15px;height:17px;flex-shrink:0;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%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 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* -- Step 2/3: back link under the primary button -------------------------- */
.co-back-wrap{text-align:center;margin-top:14px}
/* Rendered as a <button> in steps 2/3 and as an <a> to the cart in step 1. */
.co-back-link{
  display:inline-block;background:none;border:0;padding:4px 8px;cursor:pointer;
  font-family:var(--ff);text-decoration:none;
  font-size:14px;font-weight:600;color:var(--rust);transition:color var(--t);
}
.co-back-link:hover{color:var(--rust-2);text-decoration:underline}
.co-back-link:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* -- Sidebar: cart card ---------------------------------------------------- */
.co-cart-box{background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.co-cart-box__title{
  display:flex;align-items:center;gap:9px;margin:0;padding:15px 18px;
  font-size:16px;font-weight:800;color:var(--deep);letter-spacing:-.01em;
  border-bottom:1px solid var(--line-2);
}
.co-cart-box__count{
  background:var(--deep);color:var(--cream);font-size:11px;font-weight:800;
  border-radius:999px;padding:2px 8px;line-height:1.6;
}
.co-cart-items{padding:2px 0}
.co-cart-item{display:flex;align-items:flex-start;gap:11px;padding:11px 18px}
.co-cart-item + .co-cart-item{border-top:1px solid var(--line-2)}
.co-cart-item__media{position:relative;flex-shrink:0}
.co-cart-item__img{
  width:56px;height:56px;object-fit:cover;display:block;
  border:1px solid var(--line-2);border-radius:6px;
}
.co-cart-item__qty{
  position:absolute;top:-7px;right:-7px;min-width:18px;height:18px;padding:0 5px;
  background:var(--ink);color:var(--cream);font-size:10px;font-weight:800;
  border-radius:999px;display:flex;align-items:center;justify-content:center;line-height:1;
}
.co-cart-item__info{flex:1;min-width:0}
.co-cart-item__name{display:block;font-size:13px;font-weight:700;color:var(--deep);line-height:1.35}
.co-cart-item__var{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.co-cart-item__price{font-size:13.5px;font-weight:700;color:var(--deep);white-space:nowrap;flex-shrink:0}

/* -- Sidebar: gift certificate --------------------------------------------- */
.co-gift-cert{border-top:1px solid var(--line-2)}
.co-gift-cert__toggle{
  display:flex;align-items:center;gap:8px;width:100%;padding:13px 18px;
  background:none;border:0;font-family:var(--ff);text-align:left;cursor:pointer;
  font-size:13px;font-weight:600;color:var(--ink-2);transition:color var(--t);
}
.co-gift-cert__toggle:hover{color:var(--olive)}
.co-gift-cert__toggle:focus-visible{outline:3px solid var(--gold);outline-offset:-2px}
.co-gift-cert__toggle svg{flex-shrink:0}
.co-gift-cert__chev{margin-left:auto;transition:transform var(--t)}
.co-gift-cert__toggle[aria-expanded=true] .co-gift-cert__chev{transform:rotate(180deg)}
.co-gift-cert__form{padding:0 18px 14px}
.co-gift-cert__row{display:flex;gap:8px}
.co-gift-cert__input{
  flex:1;min-width:0;border:1.5px solid var(--line);border-radius:6px;
  padding:10px 12px;font-size:13.5px;font-family:var(--ff);color:var(--ink);background:var(--white);
}
.co-gift-cert__input:focus{outline:none;border-color:var(--olive)}
.co-gift-cert__apply{
  flex-shrink:0;background:var(--olive);color:var(--cream);border:0;border-radius:6px;
  padding:10px 16px;font-size:12.5px;font-weight:800;letter-spacing:.05em;
  text-transform:uppercase;font-family:var(--ff);cursor:pointer;transition:background var(--t);
}
.co-gift-cert__apply:hover{background:var(--deep)}
.co-gift-cert__msg{font-size:12px;color:var(--muted);margin-top:6px}

/* Personalised codes injected by shay_show_user_specific_coupons() into
   #co-gift-cert-form, so they appear only when the panel is opened. */
.co-gift-cert .co-gc__user-list{padding:0 0 12px;font-size:12px;color:var(--ink-2)}
.co-gift-cert .co-gc__user-list strong{
  display:block;margin-bottom:8px;font-size:13px;font-weight:800;
  letter-spacing:0;text-transform:none;color:var(--deep);
}
.co-gift-cert .co-gc__user-btn{
  margin:0 6px 6px 0;padding:7px 12px;border:1.5px solid var(--line);border-radius:6px;
  background:var(--paper);color:var(--ink-2);font-size:11.5px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;font-family:var(--ff);cursor:pointer;
  transition:border-color var(--t),color var(--t),background var(--t);
}
.co-gift-cert .co-gc__user-btn:hover{border-color:var(--olive);color:var(--olive);background:var(--mist)}

/* Cart row actions — favourite + remove, as on live */
.co-cart-item__actions{display:flex;flex-direction:column;align-items:center;gap:7px;flex-shrink:0}
.co-cart-item__fav.fav{
  width:26px;height:26px;border:0;border-radius:50%;background:none;padding:0;
  display:flex;align-items:center;justify-content:center;
}
.co-cart-item__fav.fav svg{width:15px;height:15px}
.co-cart-item__fav.fav:hover{background:var(--mist)}
.co-cart-item__remove{
  display:flex;align-items:center;justify-content:center;width:22px;height:22px;
  border-radius:50%;color:var(--muted);background:none;line-height:1;
  transition:background var(--t),color var(--t);
}
.co-cart-item__remove:hover{background:var(--line-2);color:var(--rust);text-decoration:none}

/* -- Sidebar: totals / fee notice / trust ---------------------------------- */
.co-totals{border-top:1px solid var(--line-2)}
.co-totals__row--discount{color:var(--olive)}
.co-trust{padding:12px 18px;display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line-2)}
.co-trust__item{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.co-trust__item svg{stroke:var(--olive);flex-shrink:0}

/* -- Checkout footer ------------------------------------------------------- */
.co-footer{border-top:1px solid var(--line);margin-top:32px;background:var(--white)}
.co-footer__in{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-block:18px;font-size:12.5px;color:var(--muted);
}
.co-footer__in nav{display:flex;gap:18px;flex-wrap:wrap}
.co-footer__in a{color:var(--muted)}
.co-footer__in a:hover{color:var(--olive);text-decoration:none}

/* -- Layout placement -------------------------------------------------------
   Explicit rows: notices above the form in column 1, sidebar spanning both in
   column 2. Auto-placement would otherwise push the sidebar down a row once
   #co-notices became a grid item. */
.co-page .co-layout{grid-template-rows:auto 1fr}
.co-page .co-layout > #co-notices{grid-column:1;grid-row:1}
.co-page .co-layout > .co-form-col{grid-column:1;grid-row:2;min-width:0}
.co-page .co-layout > .co-sidebar{grid-column:2;grid-row:1 / span 2}
/* Collapse the gap this would otherwise leave when there is nothing to show. */
#co-notices:empty{display:none}

/* -- Payment processing fee notice ------------------------------------------
   Sits inside the sidebar, directly beneath the cart card. */
.co-sidebar > .co-fee-notice{
  margin:16px 0 0;padding:15px 40px 15px 16px;
  border-radius:8px;font-size:13px;line-height:1.55;
}
.co-sidebar > .co-fee-notice strong{font-size:13.5px;margin-bottom:2px}
.co-sidebar > .co-fee-notice .co-fee-notice__close{top:11px;right:11px}

/* -- Collapsible order summary (mobile only) --------------------------------
   Desktop keeps the summary as a permanent sidebar, so the bar is hidden and
   the body is a plain block. */
.co-summary-toggle{display:none}

/* -- Step 1: "you already have an account" prompt --------------------------
   Shown under the email field once the address typed matches an existing
   account. Full width inside .co-grid via the co-col-2 class it is given. */
.co-page .co-acct-notice{
  grid-column:1 / -1;  /* the .co-col-2 span rule is scoped to .form-row */
  display:flex;align-items:center;gap:11px;
  padding:13px 15px;border-radius:8px;
  background:var(--mist,#EEF2F7);border:1px solid var(--line-2);
  font-size:13.5px;color:var(--ink-2);line-height:1.4;
}
/* display:flex above would otherwise beat the hidden attribute. */
.co-page .co-acct-notice[hidden]{display:none}
.co-page .co-acct-notice__icon{flex-shrink:0;color:var(--muted)}
.co-page .co-acct-notice__text{flex:1;min-width:0}
.co-page .co-acct-notice__btn{
  flex-shrink:0;background:var(--white);color:var(--deep);
  border:1.5px solid var(--line);border-radius:6px;
  padding:9px 18px;font-family:var(--ff);font-size:12px;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;cursor:pointer;
  transition:background var(--t),border-color var(--t),color var(--t);
}
.co-page .co-acct-notice__btn:hover{background:var(--olive);border-color:var(--olive);color:var(--cream)}
.co-page .co-acct-notice__btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* -- Step 1: "Create an account?" -------------------------------------------
   WooCommerce's registration block, rendered inside the contact grid. The
   username/password rows need the floating-label treatment undone: their
   labels sit above the field the normal way, so the tall top padding the grid
   inputs carry would leave a gap. */
.co-page .co-grid > .woocommerce-account-fields{grid-column:1 / -1;margin:0}
.co-page .co-grid > .woocommerce-account-fields > .create-account{
  display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px;
}
.co-page .co-grid > .woocommerce-account-fields .form-row{margin:0;padding:0;float:none;width:auto}
.co-page .co-grid > .woocommerce-account-fields .clear{display:none}
.co-page .co-grid > .woocommerce-account-fields p.create-account{display:block}
.co-page .co-grid > .woocommerce-account-fields p.create-account label{
  display:flex;align-items:center;gap:9px;margin:0;cursor:pointer;
  font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-2);
}
.co-page .co-grid > .woocommerce-account-fields input[type=checkbox]{
  accent-color:var(--olive);width:17px;height:17px;flex-shrink:0;margin:0;
}
/* Account fields keep a normal stacked label, so cancel the floating-label
   padding the grid inputs use. */
.co-page .co-step .co-grid > .woocommerce-account-fields .create-account label{
  display:block;margin:0 0 5px;
  font-size:11px;font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--muted);
}
.co-page .co-step .co-grid > .woocommerce-account-fields .create-account input{
  padding:11px 14px;
}

/* -- Google Places suggestions ---------------------------------------------
   .pac-container is appended to <body> by the Maps API, so it sits outside
   .co-page and cannot be scoped to it. The class is Google's own and unique
   to this widget, so the unscoped selectors are safe. */
.pac-container{
  z-index:100000;  /* above WooCommerce's own overlays */
  margin-top:2px;border:1.5px solid var(--line);border-radius:8px;
  background:var(--white);box-shadow:0 10px 26px rgba(41,51,31,.14);
  font-family:var(--ff);
}
.pac-container:after{display:none}  /* Google's "powered by" strip */
.pac-item{
  padding:10px 14px;border-top:1px solid var(--line-2);cursor:pointer;
  font-size:13.5px;color:var(--muted);line-height:1.4;
}
.pac-item:first-child{border-top:0}
.pac-item:hover,.pac-item-selected{background:var(--mist)}
.pac-item-query{font-size:14px;font-weight:600;color:var(--deep);margin-right:5px}
.pac-matched{font-weight:800}
.pac-icon{display:none}

/* -- Sidebar: quantity stepper --------------------------------------------
   Scoped to .co-page so it does not inherit the site-wide .qty pill sizing,
   which is built for the product page and far too tall for a cart row. */
.co-page .co-qty{
  display:inline-flex;align-items:center;margin-top:7px;
  border:1px solid var(--line);border-radius:6px;background:var(--white);
  transition:opacity var(--t);
}
.co-page .co-qty.is-busy{opacity:.45;pointer-events:none}
.co-page .co-qty__btn{
  width:26px;height:26px;padding:0;border:0;background:none;cursor:pointer;
  font-family:var(--ff);font-size:15px;line-height:1;color:var(--muted);
  display:flex;align-items:center;justify-content:center;transition:color var(--t);
}
.co-page .co-qty__btn:hover{color:var(--olive-d)}
.co-page .co-qty__btn:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:6px}
.co-page .co-qty__input{
  width:32px;height:26px;padding:0;text-align:center;
  border:0;border-left:1px solid var(--line-2);border-right:1px solid var(--line-2);
  background:none;font-family:var(--ff);font-size:12.5px;font-weight:700;color:var(--deep);
  -moz-appearance:textfield;
}
.co-page .co-qty__input::-webkit-outer-spin-button,
.co-page .co-qty__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.co-page .co-qty__input:focus{outline:none;background:var(--mist-a,#F6F4F0)}


/* -- Responsive ------------------------------------------------------------ */
@media(max-width:1024px){
  .co-summary-toggle{
    display:flex;align-items:center;gap:10px;width:100%;
    margin:0;padding:15px 18px;cursor:pointer;
    background:var(--white);border:1px solid var(--line);border-radius:12px;
    font-family:var(--ff);font-size:15px;font-weight:700;color:var(--deep);
    text-align:left;transition:border-color var(--t);
  }
  .co-summary-toggle:hover{border-color:var(--mist-b)}
  .co-summary-toggle:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
  .co-summary-toggle svg{flex-shrink:0;stroke:var(--olive)}
  .co-summary-toggle__chev{transition:transform var(--t)}
  .co-summary-toggle[aria-expanded=true] .co-summary-toggle__chev{transform:rotate(180deg)}
  .co-summary-toggle__total{
    margin-left:auto;font-size:16px;font-weight:800;color:var(--deep);white-space:nowrap;
  }
  .co-summary-toggle__total .woocommerce-Price-amount{font-weight:800}

  /* Collapsed until the bar is tapped */
  .co-summary-body{display:none}
  .co-summary-body.is-open{display:block;}
  .co-summary-body.is-open #co-cart-heading{display:none}
  .co-summary-body.is-open .co-cart-box{border-radius: 0 0 12px 12px;}
  .co-summary-toggle[aria-expanded=true] {border-bottom: 0;border-radius: 12px 12px 0 0;}

  /* Single column here. display:contents dissolves the <aside> so its two
     children become grid items in their own right, which is what lets the
     summary sit above the form while the fee notice drops below it — they
     cannot be split apart while the aside is a single grid item. */
  .co-page .co-layout > .co-sidebar{display:contents}
  .co-page .co-layout > *,
  .co-page .co-layout > .co-sidebar > *{grid-column:1;grid-row:auto}

  .co-page .co-layout > #co-notices{order:-3}          /* errors first          */
  .co-page .co-layout > .co-sidebar > #co-summary{order:-2}  /* then the summary */
  .co-page .co-layout > .co-form-col{order:0}          /* then the form         */
  .co-page .co-layout > .co-sidebar > .co-fee-notice{order:99;margin-top:20px}
}

@media(max-width:640px){
  .co-page :is(.co-grid,.woocommerce-shipping-fields__field-wrapper){grid-template-columns:1fr}
  .co-card{padding:20px 18px;border-radius:10px}
  .co-header__in{padding-block:14px}
  .co-header__logo img{height:46px}
  .co-footer__in{justify-content:center;text-align:center}

  /* Order Preview: label above value, Change on its own line */
  .co-page .co-preview__row{grid-template-columns:1fr auto;gap:4px 12px;padding:13px 15px}
  .co-page .co-preview__label{grid-column:1;font-size:12px;color:var(--muted)}
  .co-page .co-preview__change{grid-column:2;grid-row:1}
  .co-page .co-preview__val{grid-column:1 / -1}

  /* Shipping rates: price drops under the label rather than squeezing it */
  .co-page .woocommerce-shipping-methods li{padding:13px 15px;gap:10px}

  /* Gateway rows wrap their card-brand icons instead of overflowing */
  .co-page .wc_payment_method > label{padding:13px 15px;gap:8px}
  .co-page .wc_payment_method > input[type=radio]{margin-left:15px}
  .co-page .wc_payment_method .payment_box{padding:14px 15px}
  .co-page #place_order{font-size:15px;padding:17px 20px}

  .co-page .co-next-btn{padding:17px 20px;font-size:13.5px;letter-spacing:.07em}

  /* Account prompt: the Login button drops under the message rather than
     squeezing it to two words per line */
  .co-page .co-acct-notice__text{flex:1 1 100%;order:2}
  .co-page .co-acct-notice__btn{order:3;margin-left:auto}
}

/* ==========================================================================
   8a-3. Thank you / order received  (woocommerce/checkout/thankyou.php)
   ========================================================================== */

.ty-layout{display:grid;grid-template-columns:1fr 420px;gap:26px;align-items:start}
.ty-layout--solo{grid-template-columns:1fr;max-width:720px}

/* -- Heading ---------------------------------------------------------------- */
.ty-head{display:flex;align-items:flex-start;gap:16px;margin-bottom:22px}
.ty-head__icon{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;color:var(--olive);
}
/* The failed-payment icon is the only one drawn with <line> elements. */
.ty-head__icon:has(line){color:var(--rust)}
.ty-head__num{display:block;font-size:14px;color:var(--muted);line-height:1.4}
.ty-head__title{
  margin:2px 0 0;font-size:30px;font-weight:800;letter-spacing:-.025em;
  color:var(--deep);line-height:1.15;
}

/* -- Cards ------------------------------------------------------------------ */
.ty-card{
  background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:24px 26px;margin-bottom:18px;
}
.ty-card:last-child{margin-bottom:0}
.ty-card__title{
  margin:0 0 10px;font-size:20px;font-weight:800;letter-spacing:-.018em;
  color:var(--deep);line-height:1.2;
}
.ty-card__lead{font-size:15px;line-height:1.6;color:var(--ink-2);margin:0}
.ty-card__lead strong{color:var(--deep);font-weight:700}
.ty-card--failed{border-color:var(--rust-2);border-left-width:3px}

/* Gateway instructions (BACS / ACH bank details) keep WooCommerce's markup,
   so the headings and lists it prints are normalised rather than rebuilt. */
.ty-card--gateway h2,.ty-card--gateway h3{
  margin:0 0 10px;font-size:17px;font-weight:800;color:var(--deep);letter-spacing:-.012em;
}
.ty-card--gateway h2:not(:first-child),.ty-card--gateway h3:not(:first-child){margin-top:18px}
.ty-card--gateway p{font-size:14.5px;line-height:1.6;color:var(--ink-2);margin:0 0 10px}
.ty-card--gateway ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ty-card--gateway li{font-size:14.5px;color:var(--ink-2)}
.ty-card--gateway li strong{color:var(--deep)}

/* -- Customer details ------------------------------------------------------- */
.ty-details{display:grid;grid-template-columns:1fr 1fr;gap:22px 26px;margin-top:16px}
.ty-detail__label{
  margin:0 0 5px;font-size:14px;font-weight:800;color:var(--deep);letter-spacing:-.005em;
}
.ty-detail__val{
  margin:0;font-size:14.5px;line-height:1.6;color:var(--ink-2);
  font-style:normal;word-break:break-word;
}

/* -- Order summary ---------------------------------------------------------- */
.ty-order{padding:22px 24px}
.ty-items{margin-top:16px}
.ty-item{display:flex;align-items:flex-start;gap:13px;padding:12px 0}
.ty-item + .ty-item{border-top:1px solid var(--line-2)}
.ty-item__media{position:relative;flex-shrink:0}
.ty-item__img{
  width:58px;height:58px;object-fit:cover;display:block;
  border:1px solid var(--line-2);border-radius:8px;background:var(--paper);
}
.ty-item__img--empty{display:block}
.ty-item__qty{
  position:absolute;top:-8px;left:-8px;min-width:20px;height:20px;padding:0 6px;
  background:var(--muted);color:var(--white);font-size:11px;font-weight:800;
  border-radius:999px;display:flex;align-items:center;justify-content:center;line-height:1;
}
.ty-item__info{flex:1;min-width:0}
.ty-item__name{display:block;font-size:14px;font-weight:600;color:var(--deep);line-height:1.35}
.ty-item__meta,.ty-item__info .wc-item-meta{
  display:block;margin:3px 0 0;padding:0;list-style:none;
  font-size:13px;color:var(--muted);line-height:1.5;
}
.ty-item__info .wc-item-meta p,.ty-item__info .wc-item-meta strong{display:inline;margin:0;font-weight:400}
.ty-item__price{font-size:14px;font-weight:700;color:var(--deep);white-space:nowrap;flex-shrink:0}

.ty-totals{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.ty-totals__row{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:5px 0;font-size:14.5px;color:var(--ink-2);
}
.ty-totals__row span:last-child{text-align:right;color:var(--deep);font-weight:600}
.ty-totals__row small{display:block;font-size:12px;font-weight:400;color:var(--muted)}
.ty-totals__row--total{
  margin-top:10px;padding-top:14px;border-top:1px solid var(--line);
}
.ty-totals__row--total span:first-child{font-size:17px;font-weight:800;color:var(--deep)}
.ty-totals__row--total span:last-child{font-size:20px;font-weight:800;color:var(--deep);letter-spacing:-.02em}

/* -- Buttons + downloads ---------------------------------------------------- */
.ty-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 0}
.ty-btn{
  display:inline-block;background:var(--olive);color:var(--cream);
  border:1.5px solid var(--olive);border-radius:8px;padding:13px 24px;
  font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  transition:background var(--t),color var(--t);
}
.ty-btn:hover{background:var(--deep);border-color:var(--deep);color:var(--cream);text-decoration:none}
.ty-btn--ghost{background:transparent;color:var(--deep)}
.ty-btn--ghost:hover{background:var(--mist);border-color:var(--olive);color:var(--deep)}

.ty-card--downloads table{width:100%;font-size:14px}
.ty-card--downloads th,.ty-card--downloads td{padding:10px 8px;border-bottom:1px solid var(--line-2);text-align:left}

.ty-back{text-align:center;margin-top:6px}
.ty-back a{font-size:14px;font-weight:600;color:var(--rust)}
.ty-back a:hover{color:var(--rust-2);text-decoration:underline}

/* -- Responsive ------------------------------------------------------------- */
@media(max-width:1024px){
  /* Summary first on small screens: it is what the customer checks. */
  .ty-layout{grid-template-columns:1fr;gap:18px}
}
@media(max-width:640px){
  .ty-card,.ty-order{padding:20px 18px;border-radius:10px}
  .ty-head{gap:12px;margin-bottom:18px}
  .ty-head__icon{width:36px;height:36px}
  .ty-head__title{font-size:24px}
  .ty-details{grid-template-columns:1fr;gap:18px}
  .ty-actions .ty-btn{flex:1 1 100%;text-align:center}
  .desc-card__inner{padding: 24px 15px;}
  .desc-card{padding: 15px;}
}



/* Shop archive subcategories: round initials scroller (mobile only) */
.subcat .subcat__initial,.subcat .subcat__label{display:none}
@media (max-width:767px){
  .subcat-row{display:flex !important;flex-wrap:nowrap;overflow-x:auto;gap:14px !important;        padding: 5px 2px 10px;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scrollbar-width:none}
  .subcat-row::-webkit-scrollbar{display:none}
    .subcat-row .subcat {
        flex: 0 0 auto;
        width: 70px;
        align-items: center;
        text-align: center;
        gap: 8px;
        padding: 0;
        border: 0;
        background: none !important;
        box-shadow: none;
        scroll-snap-align: start;
    }
  .subcat-row .subcat:hover{transform:none;box-shadow:none}
  .subcat-row .subcat__top,.subcat-row .subcat > span:not(.subcat__initial):not(.subcat__label){display:none}
  .subcat-row .subcat .subcat__initial{        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: var(--olive);
        color: var(--cream);
        font-size: 22px;
        font-weight: 800;
        line-height: 1;
        border: 1px solid rgba(41, 51, 31, .09);}
  .subcat-row .subcat--b .subcat__initial{background:var(--mist);color:var(--deep)}
  .subcat-row .subcat--c .subcat__initial{background:var(--tan);color:#45391C}
  .subcat-row .subcat--d .subcat__initial{background:var(--deep);color:var(--cream)}
  .subcat-row .subcat .subcat__label{display:block;font-size:12px;font-weight:700;line-height:1.25;color:var(--deep)}
  .subcat-row--no-names .subcat .subcat__label{display:none}
}

/* ==========================================================================
   Added-to-cart sheet (product page AJAX add to cart)
   Bottom sheet on phones / app WebView, centred card on larger screens.
   ========================================================================== */
.atc{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center}
.atc[hidden]{display:none}
.atc__overlay{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.atc__panel{position:relative;width:100%;max-width:520px;background:var(--cream);border-radius:18px 18px 0 0;padding:22px 20px calc(20px + env(safe-area-inset-bottom));box-shadow:0 -8px 32px rgba(0,0,0,.18);animation:atc-up .22s ease-out}
.atc__x{position:absolute;top:8px;right:8px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:0;color:var(--ink-2);border-radius:50%}
.atc__x:hover{background:var(--mist)}
.atc__ok{display:flex;align-items:center;gap:8px;margin:0 44px 14px 0;font-size:18px;font-weight:800;color:var(--olive)}
.atc__item{display:flex;gap:14px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}
.atc__img{width:72px;height:72px;object-fit:cover;border-radius:8px;background:var(--mist);flex:none}
.atc__info{display:flex;flex-direction:column;gap:3px;min-width:0}
.atc__name{font-size:15px;line-height:1.3;color:var(--deep);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.atc__meta{font-size:13.5px;color:var(--muted)}
.atc__sub{margin:14px 0;font-size:16px;color:var(--ink)}
.atc__sub b{color:var(--deep)}
.atc__actions{display:flex;flex-direction:column;gap:10px}
.atc__btn{display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:999px;font-size:14px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border:2px solid var(--olive);text-decoration:none}
.atc__btn:hover{text-decoration:none}
.atc__btn--main{background:var(--olive);color:var(--cream)}
.atc__btn--main:hover{background:var(--deep);color:var(--cream)}
.atc__btn--alt{background:transparent;color:var(--olive-d)}
.atc__btn--alt:hover{background:var(--mist-b)}
.atc__more{min-height:44px;background:transparent;border:0;color:var(--olive-d);font-size:14px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.atc :is(a,button):focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.buybox__msg{margin:0 0 12px;padding:10px 14px;border-left:4px solid var(--rust);background:#FBEFE7;color:#5B2F14;font-size:14.5px;font-weight:600}
.buybox__msg[hidden]{display:none}
@keyframes atc-up{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@media (min-width:641px){
  .atc{align-items:flex-start;padding-top:96px}
  .atc__panel{border-radius:14px}
}

/* Cart: quantities update by themselves; the button is the no-JS fallback. */
html.cart-auto .cart-actions button.cart-actions__update{display:none!important}
.woocommerce-cart-form[aria-busy="true"] .cart-row__subtotal{opacity:.5;transition:opacity .15s}

/* The cart's live region takes focus after each AJAX action so screen readers announce it.
   WordPress' block-library CSS reveals any focused .screen-reader-text as a floating box
   (top-left), which duplicated the on-page notice. Keep it hidden when focused. */
#shay-cart-live,#shay-cart-live:focus{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;border:0!important;background:none!important;box-shadow:none!important;outline:0!important;white-space:nowrap!important}

/* Cart: messages sit in the page above the list, stay until the next action or until dismissed. */
.cart-notices{display:none;position:relative;margin:0 0 16px}
.cart-notices.is-open{display:block}
.cart-notices .woocommerce-message,.cart-notices .woocommerce-error,.cart-notices .woocommerce-info{margin:0;padding-right:56px}
.cart-notices__close{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:44px;height:44px;border:0;background:none;color:inherit;cursor:pointer;border-radius:50%}
.cart-notices__close::before{content:"\00d7";font-size:26px;line-height:1}
.cart-notices__close:hover{background:rgba(0,0,0,.06)}
.cart-notices a{text-decoration:underline;font-weight:700}

/* Cart: the line that replaces a removed item ("... was removed. Undo"). */
.cart-row--removed{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 20px;background:var(--sand);border-top:1px solid var(--line-2);list-style:none}
.cart-row--removed:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.cart-removed__msg{margin:0;font-size:15px;color:var(--deep)}
.cart-removed__undo{min-height:44px;min-width:44px;padding:8px 14px;border:0;background:none;color:var(--olive-d);font-weight:700;font-size:15px;text-decoration:underline;cursor:pointer}
.cart-removed__undo:disabled{opacity:.5;cursor:default;text-decoration:none}
.cart-empty .cart-row--removed{border:1px solid var(--line-2);border-radius:10px;margin-bottom:16px}

/* Cart: rows, suggestions and totals change in place instead of being redrawn. */
@keyframes cartIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes cartFlash{from{background-color:#F3EFD8}to{background-color:transparent}}
.cart-row.is-new,.cart-row--removed.is-new,.cart-suggest__card.is-new{animation:cartIn .25s ease-out}
.cart-row.is-leaving,.cart-suggest__card.is-leaving,.cart-suggest.is-leaving,.cart-row--removed.is-leaving{opacity:0;transform:translateX(10px);transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.shay-cart__sidebar.is-updated .cart_totals{animation:cartFlash .8s ease-out}
@media (prefers-reduced-motion:reduce){.cart-row.is-leaving,.cart-suggest__card.is-leaving{transition:none}.cart-row.is-new,.cart-row--removed.is-new,.cart-suggest__card.is-new,.shay-cart__sidebar.is-updated .cart_totals{animation:none}}

/* Cart: Amazon-style delete. A red panel slides over the row, then it folds away. */
.cart-row.is-removing{position:relative;overflow:hidden}
.cart-row.is-removing::after{content:"Delete";position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-end;padding-right:28px;background:#C0392B;color:#fff;font-weight:800;font-size:15px;letter-spacing:.06em;text-transform:uppercase;animation:cartDelete .18s ease-out forwards}
.cart-row.is-collapsing,.cart-row--removed.is-collapsing{overflow:hidden;padding-top:0!important;padding-bottom:0!important;border-width:0!important;transition:height .22s ease,padding .22s ease,opacity .22s ease;opacity:.6}
@keyframes cartDelete{from{transform:translateX(100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.cart-row.is-removing::after{animation:none}.cart-row.is-collapsing{transition:none}}

/* Category page: crawlable pagination (hidden by script while Load more is available) */
.shop-pager{display:flex;justify-content:center;padding-top:32px}
.shop-pager[hidden]{display:none}
.shop-pager ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.shop-pager a,.shop-pager span.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 14px;border:1.5px solid #C4CBB2;border-radius:8px;color:var(--deep);font-weight:600;text-decoration:none}
.shop-pager .current{background:var(--olive-d);border-color:var(--olive-d);color:#fff}
.shop-pager a:focus-visible,.toolbar select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* Category page: styles moved out of the template */
.tax-hero__desc{margin-top:18px;max-width:545px}
.toolbar label{width:85px}
.subcat-row{gap:16px}
.shop-grid{gap:22px;padding-top:26px}
.load-more .btn{padding:15px 48px}
.trust__grid{gap:26px}
.h-sec--lg{font-size:32px}
.h-sub--gap{margin-bottom:22px}
.bulk__cta{display:flex;gap:11px;flex-wrap:wrap}
.card__cta{margin-top:10px}

/* Tap targets: at least 44px on the controls people press */
.btn--sm,.desc-toggle,.toolbar select{min-height:44px}
.desc-toggle{display:inline-flex;align-items:center}
.card__fav{width:44px;height:44px}
.card__fav svg{width:18px;height:18px}
.crumbs a{display:inline-flex;align-items:center;min-height:32px}
@media (max-width:640px){.card__fav{top:7px;right:7px;width:44px;height:44px}}

/* Product page: product FAQ title (was an inline-styled div) */
.pdp__faq-title{margin:0;font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--olive-d);font-weight:700}

/* ==========================================================================
   Checkout: returning / new customer choice, progress, summary extras
   (template-parts/checkout/account-choice.php)
   ========================================================================== */
.co-choice{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:26px;margin-bottom:18px}
.co-choice[hidden],.co-choice__grid[hidden],.co-choice__bar[hidden]{display:none}
.co-choice:has(.co-choice__bar:not([hidden])){padding:6px 20px}
.co-choice__grid{display:grid;grid-template-columns:1fr 44px 1fr;gap:0 24px;align-items:stretch}
.co-choice__card{display:flex;flex-direction:column;gap:12px;min-width:0}
.co-choice__title{margin:0;font-size:20px;font-weight:800;line-height:1.2;letter-spacing:-.015em;color:var(--deep);outline:none}
.co-choice__title:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.co-choice__lead{margin:0;font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.co-choice__or{position:relative;display:flex;align-items:center;justify-content:center}
.co-choice__or::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:var(--line)}
.co-choice__or span{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:50%;background:var(--white);font-size:12px;font-weight:800;color:var(--muted)}

.co-choice__btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:48px;padding:0 22px;border:2px solid var(--olive);border-radius:8px;font:800 14px/1 var(--ff);letter-spacing:.07em;text-transform:uppercase;cursor:pointer;transition:background var(--t),color var(--t),border-color var(--t)}
.co-choice__btn:focus-visible,.co-choice__link:focus-visible,.co-login__forgot:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-choice__btn--primary{background:var(--olive);color:var(--cream)}
.co-choice__btn--primary:hover{background:var(--deep);border-color:var(--deep)}
.co-choice__btn--guest,.co-choice__btn--login-open{background:var(--white);color:var(--olive-d)}
.co-choice__btn--guest:hover,.co-choice__btn--login-open:hover{background:var(--mist)}
.co-choice__btn--login-open{display:none}
.co-choice__card--new .co-choice__btn--guest{margin-top:auto}

.co-choice__perks-title{margin:2px 0 -4px;font-size:13px;font-weight:700;color:var(--ink-2)}
.co-choice__perks{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:14px;color:var(--ink-2)}
.co-choice__perks li{display:flex;align-items:center;gap:9px}
.co-choice__perks li::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;background:var(--olive);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='white' d='M13.3 4.3a1 1 0 0 0-1.4 0L6.5 9.6 4.1 7.3a1 1 0 0 0-1.4 1.4l3.1 3.1a1 1 0 0 0 1.4 0l6.1-6.1a1 1 0 0 0 0-1.4z'/%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 16 16'%3E%3Cpath fill='white' d='M13.3 4.3a1 1 0 0 0-1.4 0L6.5 9.6 4.1 7.3a1 1 0 0 0-1.4 1.4l3.1 3.1a1 1 0 0 0 1.4 0l6.1-6.1a1 1 0 0 0 0-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}
.co-choice__alt{margin:0;text-align:center;font-size:14px;color:var(--ink-2)}
.co-choice__link{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;background:none;border:0;font:700 14px var(--ff);color:var(--olive-d);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.co-choice__link:hover{color:var(--deep)}

.co-choice__bar{display:flex;align-items:center;justify-content:space-between;gap:12px}
.co-choice__bar-msg{margin:0;font-size:14.5px;font-weight:600;color:var(--ink-2)}

.co-login .co-field{margin:0 0 12px}
.co-login .co-field label{display:block;margin:0 0 5px;font-size:12px;font-weight:700;color:var(--ink-2)}
.co-login .co-field label .required{color:var(--rust)}
.co-page .co-login .co-field input[type=text],.co-page .co-login .co-field input[type=password]{width:100%;min-height:50px;margin:0;padding:12px 14px;border:1.5px solid var(--line);border-radius:8px;background:var(--white);box-shadow:none;font:15px var(--ff);color:var(--ink)}
.co-page .co-login .co-field input:focus{outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(79,94,63,.18)}
.co-login .password-input{position:relative;display:block}
.co-page .co-login .password-input input{padding-right:52px}
.co-login .show-password-input{width:44px;height:44px;right:2px}
.co-login .show-password-input:focus-visible{outline:3px solid var(--gold);outline-offset:-3px;border-radius:6px}
.co-login__meta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.co-login__meta label{display:flex;align-items:center;gap:9px;min-height:44px;font-size:14px;font-weight:600;color:var(--ink-2);cursor:pointer}
.co-login__meta input[type=checkbox]{accent-color:var(--olive);width:17px;height:17px;margin:0}
.co-login__forgot{display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:700;color:var(--olive-d);text-decoration:underline;text-underline-offset:3px}
.co-page .co-choice form.login{margin:0;padding:0;border:0;border-radius:0;background:none}
.co-login .woocommerce-secureLogin{margin:12px 0 0;font-size:14px}

/* Progress */
.co-progress__list{justify-content:center;gap:4px}
.co-progress__label{white-space:nowrap}

/* Sidebar */
.co-cart-box{position:relative}
.co-cart-box__edit{position:absolute;top:6px;right:12px;display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font-size:14px;font-weight:700;color:var(--olive-d);text-decoration:underline;text-underline-offset:3px}
.co-cart-box__edit:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-totals__later{color:var(--muted);font-size:13.5px}

/* Tablet and below: stack the two choices */
@media (max-width:1099px){
  .co-choice__grid{grid-template-columns:1fr;gap:18px 0}
  .co-choice__or{height:24px}
  .co-choice__or::before{top:50%;bottom:auto;left:0;right:0;width:auto;height:1px}
}

/* Phones: keep the login form folded away, make "Continue as guest" the main action */
@media (max-width:640px){
  .co-choice{padding:20px 18px}
  .co-choice__btn--login-open{display:inline-flex}
  .co-choice:not(.is-login-open) .co-login-panel{display:none}
  .co-choice__btn--guest{background:var(--olive);color:var(--cream)}
  .co-choice__btn--guest:hover{background:var(--deep);border-color:var(--deep);color:var(--cream)}
  .co-progress__item{font-size:12px;gap:5px}
  .co-progress__sep{padding:0}
  .co-cart-box__edit{right:8px}
}
@media (prefers-reduced-motion:reduce){.co-choice__btn{transition:none}}

/* Progress labels stay visible on phones (smaller), secure-link spacing */
@media (max-width:640px){.co-progress__label{display:inline!important;font-size:12px}}
.co-page .co-login .woocommerce-secureLogin{margin:10px 0 0;text-align:center}
.co-page .co-login .woocommerce-secureLogin a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font-size:14px;font-weight:700;color:var(--olive-d);text-decoration:underline;text-underline-offset:3px}

@media (max-width:640px){
  .co-progress__list{flex-wrap:nowrap;justify-content:space-between;gap:2px}
  .co-progress__item{gap:5px;white-space:nowrap}
  .co-progress__num{width:22px;height:22px;font-size:11px}
  .co-progress__label{font-size:11.5px!important}
  .co-progress__sep{display:none}
}

@media (max-width:360px){
  .co-progress__item:not(.is-active) .co-progress__num{display:none}
  .co-progress__label{font-size:11px!important}
}

/* Checkout step 2: waiting for shipping options */
.co-ship-table .co-rates-wait td{display:flex;align-items:center;gap:10px;padding:16px 4px;font-size:14.5px;color:var(--ink-2)}
.co-rates-spin{flex:none;width:18px;height:18px;border:2.5px solid var(--line);border-top-color:var(--olive);border-radius:50%;animation:co-spin .8s linear infinite}
@keyframes co-spin{to{transform:rotate(360deg)}}
.co-rates-error td{color:var(--rust)}
.co-rates-retry{min-height:44px;padding:0 10px;background:none;border:0;font:700 14px var(--ff);color:var(--olive-d);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.co-rates-retry:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.co-page .co-next-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
@media (prefers-reduced-motion:reduce){.co-rates-spin{animation:none;border-top-color:var(--olive);border-right-color:var(--olive)}}

/* ==========================================================================
   Checkout choice: compact layout on the soft green panel from the design
   reference (overrides the first pass above)
   ========================================================================== */
.co-choice{background:#F3F5EC;border:1px solid #DDE3D0;border-radius:12px;padding:20px 24px;margin-bottom:16px}
.co-choice:has(.co-choice__bar:not([hidden])){padding:4px 18px}
.co-choice__grid{grid-template-columns:1fr 40px 1fr;gap:0 20px}
.co-choice__card{gap:8px}
.co-choice__head{display:flex;align-items:flex-start;gap:12px;margin-bottom:2px}
.co-choice__icon{flex:none;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#E4E9D8;color:var(--olive-d)}
.co-choice__title{font-size:19px}
.co-choice__lead{margin:2px 0 0;font-size:14px;line-height:1.4}
.co-choice__or span{width:36px;height:36px;background:#F3F5EC;border-color:#DDE3D0}
.co-choice__or::before{background:#DDE3D0}

/* returning customer: tighter form */
.co-login .co-field{margin:0 0 8px}
.co-login .co-field label{margin:0 0 3px;font-size:12px}
.co-page .co-login .co-field input[type=text],.co-page .co-login .co-field input[type=password]{min-height:44px;padding:9px 14px}
.co-login .show-password-input{width:44px;height:44px}
.co-login__meta{margin:0 0 8px}
.co-login__meta label,.co-login__forgot{min-height:40px}
.co-choice__btn{min-height:46px}
.co-page .co-login .woocommerce-secureLogin{margin:2px 0 0}
.co-page .co-login .woocommerce-secureLogin a{min-height:40px}

/* new customer: benefits in two columns, one tidy block */
.co-choice__perks-title{margin:0}
.co-choice__perks{grid-template-columns:1fr 1fr;gap:4px 14px;font-size:13.5px}
.co-choice__perks li{align-items:flex-start;line-height:1.3}
.co-choice__perks li::before{margin-top:1px}
.co-choice__card--new .co-choice__btn--guest{margin-top:auto}
.co-choice__alt{margin:0}
.co-choice__link{min-height:40px}

/* tablet and phone */
@media (max-width:1099px){
  .co-choice__grid{gap:14px 0}
  .co-choice__or{height:20px}
}
@media (max-width:640px){
  .co-choice{padding:16px 14px}
  .co-choice__head{gap:10px}
  .co-choice__icon{width:40px;height:40px}
  .co-choice__perks{grid-template-columns:1fr}
}
@media (max-width:1180px) and (min-width:1100px){
  .co-choice__perks{grid-template-columns:1fr}
}

/* single-column benefits (no awkward wrapping); stack the two cards below 1100px.
   Placed last so it wins over the grid definition above. */
.co-choice__perks{grid-template-columns:1fr;gap:3px}
@media (max-width:1099px){
  .co-choice__grid{grid-template-columns:1fr;gap:14px 0}
  .co-choice__or{height:20px}
  .co-choice__or::before{top:50%;bottom:auto;left:0;right:0;width:auto;height:1px}
  .co-choice__card--new .co-choice__btn--guest{margin-top:4px}
}

/* ==========================================================================
   One corner radius for every button  (--btn-r)
   Home and category were square, the product page and cart used pills, the
   cart's Apply / Empty buttons 3px and checkout 8px. All action buttons now
   share one value; change it here to restyle them all. Left as they are on
   purpose: round icon buttons (heart, remove x, badges), tag chips, tabs and
   cards.
   ========================================================================== */
:root{--btn-r:8px}

.btn,
.btn-pill,
.pill-toggle,
.signup button,
.signup input[type=email],
.wpcf7-submit,
#review_form .submit,
.woocommerce-button,
.woocommerce .button,
.cart-actions .button,
.cart-actions a.empty,
.shay-totals .checkout-button,
.shay-totals .checkout-button.button,
.cart-suggest__add,
.atc__btn,
.co-next-btn,
.co-page .co-next-btn,
.co-choice__btn,
.co-acct-notice__btn,
.co-page .co-acct-notice__btn,
.co-gift-cert__apply,
.co-page #place_order,
.co-wrap #place_order,
#place_order{border-radius:var(--btn-r)}

/* quantity steppers sit beside these buttons, so they share the radius */
.qty,
.co-page .co-qty{border-radius:var(--btn-r)}

/* WooCommerce's own stylesheet sets 3px on these with higher specificity */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button{border-radius:var(--btn-r)}

/* same selectors, one class more, so they win whichever stylesheet loads last */
.woocommerce a.button.button,
.woocommerce button.button.button,
.woocommerce input.button.button,
.woocommerce #respond input#submit.button,
.woocommerce-page a.button.button,
.woocommerce-page button.button.button,
.woocommerce-page input.button.button{border-radius:var(--btn-r)}

.co-ship-error{margin:12px 0 0}