/* ============================================================
   SINCERE AFRICA — brand tokens
   Adapted from the Lola Baej child theme (Afefe Creative).
   Design locked 2026-11-08: Host Grotesk only (self-hosted, see
   assets/css/sa.css), no accent colour. Components live in sa.css.
   ============================================================ */
:root {
	--sa-accent: #1A1A1A;
	--sa-font-body: 'Host Grotesk', system-ui, sans-serif;
	--sa-font-display: 'Host Grotesk', system-ui, sans-serif;
}

/* ============================================================
   Sincere Africa — Konte Child Theme Overrides
   Brand: Fjalla One (headings) + Jost 300 (body/nav)
   Colors: #111 text | var(--sa-accent) accent | #F5F3EF footer bg
   ============================================================ */

/* === BASE TYPOGRAPHY === */
body {
  font-family: var(--sa-font-body);
  font-weight: 300;
  color: #111;
  font-size: 14px;
  line-height: 1.7;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--sa-font-display);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #111;
}

p, li, span, td, th, label, input, textarea, select {
  font-family: var(--sa-font-body);
  font-weight: 300;
}

a { color: #111; text-decoration: none; }
a:hover { color: var(--sa-accent); }

/* === TOPBAR === */
.site-topbar,
.topbar {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  background: #fff;
  border-bottom: 1px solid #E8E8E8;
  color: #111;
}
.site-topbar a, .topbar a { color: #111; }

/* === ELEMENTOR CONTAINERS — ensure CSS custom props are applied === */
.e-con {
  min-height: var(--min-height, auto);
  flex-direction: var(--flex-direction, row);
}

/* === PAGE & POST TITLES — override Konte's Kirki injection === */
h1.entry-title,
.entry-title,
.page-title,
.woocommerce-page .entry-title {
  font-family: var(--sa-font-display) !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  font-size: 28px !important;
  line-height: 1.2 !important;
}

/* === HEADER — always solid white, never transparent === */
.site-header,
#masthead,
.header-main,
.site-header .header-main {
  background: #fff !important;
  border-bottom: 1px solid #E8E8E8 !important;
}
/* Sticky state stays white */
.site-header.is-sticky,
.site-header.sticky,
.admin-bar .site-header.is-sticky,
.site-header.fixed {
  background: #fff !important;
  box-shadow: 0 1px 6px rgba(0,0,0,0.06) !important;
}
/* Kill transparent classes in all states */
.site-header.header--transparent .header-main,
.site-header.is-transparent .header-main {
  background: #fff !important;
}

/* === HOMEPAGE GAP FIX — hide Konte's auto-rendered page title === */
/* Konte renders <header class="entry-header"><h1>Home</h1></header>
   above Elementor content on all pages. Hide it on the homepage. */
.home .entry-header,
.page-id-4 .entry-header {
  display: none !important;
}
/* Also remove any container/wrapper padding above Elementor content on homepage */
.home .site-content-container,
.home #primary.content-area,
.home .site-main,
.home #post-4 {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.home .entry-content {
  margin: 0 !important;
  padding: 0 !important;
}

/* === NAVIGATION === */
/* Tighten list item spacing — Konte adds margin between li by default */
.konte-nav > li,
.konte-nav--primary > li,
.menu-primary .menu > li,
.header-main .menu > li {
  margin: 0 !important;
  padding: 0 !important;
}

.konte-nav > li > a,
.konte-nav--primary > li > a,
.menu-primary .menu > li > a,
nav.primary-navigation a,
.header-main .menu > li > a {
  font-family: var(--sa-font-body);
  font-weight: 300;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #111;
  padding: 0 8px !important;
  white-space: nowrap;
}
.konte-nav > li > a:hover,
.konte-nav--primary > li > a:hover,
.menu-primary .menu > li > a:hover,
nav.primary-navigation a:hover {
  color: var(--sa-accent);
}

/* Dropdown menus */
.konte-nav .sub-menu,
.menu-primary .sub-menu {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  background: #fff;
  border: 1px solid #E8E8E8;
  box-shadow: none;
}
.konte-nav .sub-menu a,
.menu-primary .sub-menu a {
  font-family: var(--sa-font-body);
  font-weight: 300;
  font-size: 12px;
  color: #111;
  letter-spacing: 1px;
}

/* Header icons (search, cart, account) */
.header-main .header-icons a,
.header-main .header-icon,
.header-main .cart-icon,
.konte-header-icon {
  color: #111;
}
.header-main .header-icons a:hover,
.konte-header-icon:hover { color: var(--sa-accent); }

/* === LOGO === */
.site-logo img,
.header-main .site-logo img,
.site-branding .logo img,
.site-branding .logo .logo-dark,
.site-branding .logo .logo-light {
  max-height: 52px;
  width: auto;
  display: block;
}

/* === WOOCOMMERCE PRODUCT GRID === */

/* Image aspect ratio */
.woocommerce ul.products li.product a.woocommerce-loop-product__link img,
.woocommerce ul.products li.product img {
  aspect-ratio: 3 / 4;
  object-fit: cover;
  width: 100%;
  display: block;
}

/* Hide ratings in grid */
.woocommerce ul.products li.product .star-rating,
.woocommerce ul.products li.product .woocommerce-loop-product__rating,
.products .star-rating { display: none !important; }

/* Hide add-to-cart button in grid */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button,
.products li.product .product-buttons,
.products li.product .loop-product-buttons { display: none !important; }

/* Hide sale / new / featured badges */
span.onsale,
.product-badge,
.konte-badge,
.woocommerce span.onsale { display: none !important; }

/* Product title in grid */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.products li.product h2 {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  text-transform: none;
  letter-spacing: 0;
  color: #111;
  margin-top: 10px;
  padding: 0;
}

/* Price in grid */
.woocommerce ul.products li.product .price,
.products li.product .price {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  color: #111;
  margin-top: 4px;
}
.woocommerce ul.products li.product .price del { opacity: 0.4; }

/* Grid gap */
.woocommerce ul.products {
  gap: 40px 20px;
}

/* === BUTTONS (global WooCommerce) === */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input[type="submit"],
.woocommerce #respond input#submit,
.woocommerce button[type="submit"] {
  background: #111 !important;
  color: #fff !important;
  font-family: var(--sa-font-body) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 2.5px !important;
  border-radius: 0 !important;
  border: none !important;
  padding: 14px 28px !important;
  transition: background 0.2s ease !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input[type="submit"]:hover,
.woocommerce #respond input#submit:hover {
  background: var(--sa-accent) !important;
  color: #fff !important;
}

/* Add to Cart — single product */
.single_add_to_cart_button,
.woocommerce div.product form.cart .single_add_to_cart_button {
  width: 100% !important;
  padding: 18px 28px !important;
  margin-top: 16px !important;
  font-size: 11px !important;
  letter-spacing: 3px !important;
}
.single_add_to_cart_button:hover {
  background: var(--sa-accent) !important;
}

/* === SINGLE PRODUCT PAGE — EDITORIAL LAYOUT === */

/* Grid-based two-column product layout */
.single-product .product-top,
.single-product .konte-product-top {
  display: grid !important;
  grid-template-columns: 55% 45% !important;
  gap: 0 !important;
  align-items: start !important;
  min-height: 100vh !important;
}

/* Gallery fills left column — sticky, with thumbnail strip on left (VB style) */
.woocommerce div.product .woocommerce-product-gallery {
  float: none !important;
  position: sticky !important;
  top: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding-top: 60px !important;
}
/* Vertical thumbnail strip — far left of gallery column */
.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 66px !important;
  flex-shrink: 0 !important;
  order: -1 !important;
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
}
.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs li {
  width: 66px !important;
  height: 83px !important;
  margin: 0 !important;
  list-style: none !important;
}
.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs img {
  width: 66px !important;
  height: 83px !important;
  object-fit: cover !important;
  object-position: top center !important;
  cursor: pointer !important;
  opacity: 0.4 !important;
  transition: opacity 0.2s ease !important;
  display: block !important;
  height: 83px !important;
}
.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs li.flex-active img,
.woocommerce div.product .woocommerce-product-gallery ol.flex-control-thumbs img:hover {
  opacity: 1 !important;
}
/* Main image area fills remaining width */
.woocommerce div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
.woocommerce div.product .woocommerce-product-gallery .flex-viewport {
  flex: 1 !important;
  min-width: 0 !important;
  height: auto !important;
  max-height: none !important;
}
/* Product images — portrait 3:4 ratio */
.woocommerce div.product .woocommerce-product-gallery img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  object-fit: cover !important;
  object-position: top center !important;
  display: block !important;
}

/* Summary panel — right column with padding, natural page scroll */
.woocommerce div.product .summary.entry-summary {
  width: 100% !important;
  float: none !important;
  padding: 60px 56px 80px !important;
  box-sizing: border-box !important;
  overflow-y: visible !important;
}

/* Product title */
.product_title.entry-title {
  font-family: var(--sa-font-display);
  font-size: 28px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #111;
  margin-bottom: 16px;
  line-height: 1.15;
  text-align: left !important;
}

/* Price */
.woocommerce div.product .price {
  font-family: var(--sa-font-body);
  font-size: 18px;
  font-weight: 300;
  color: #111;
  margin-bottom: 32px;
  letter-spacing: 0.5px;
  border-bottom: 1px solid #E8E8E8;
  padding-bottom: 28px;
}

/* Short description */
.woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-product-details__short-description {
  font-family: var(--sa-font-body);
  font-size: 13px;
  font-weight: 300;
  line-height: 1.8;
  color: #666;
  margin-bottom: 28px;
}

/* ── Variation / sizes — stacked layout ── */
.woocommerce div.product form.cart .variations {
  display: block !important;
  width: 100% !important;
  border: none !important;
  margin-bottom: 24px !important;
}
.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations tr {
  display: block !important;
}
.woocommerce div.product form.cart .variations th.label,
.woocommerce div.product form.cart .variations td.value {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
}

/* Variation label row — label left, Size Guide link right */
.woocommerce div.product form.cart .variations th.label {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
}
.woocommerce div.product .variations label,
.woocommerce div.product form.variations_form .label label {
  font-family: var(--sa-font-body) !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 2.5px !important;
  color: #111 !important;
  display: inline !important;
  margin-bottom: 0 !important;
}
/* "Size Guide" link beside SIZES label */
.sa-size-guide-link {
  font-family: var(--sa-font-body);
  font-size: 10px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #999;
  text-decoration: underline;
  cursor: pointer;
  white-space: nowrap;
}
.sa-size-guide-link:hover { color: #111; }

/* Size dropdown — styled native select */
.woocommerce div.product .variations td.value select {
  display: block !important;
  width: 100% !important;
  font-family: var(--sa-font-body) !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: #111 !important;
  background: #fff !important;
  border: 1px solid #D0D0D0 !important;
  border-radius: 0 !important;
  padding: 12px 16px !important;
  margin-top: 10px !important;
  margin-bottom: 4px !important;
  appearance: auto !important;
  -webkit-appearance: auto !important;
  cursor: pointer !important;
}

/* Reset link */
.woocommerce div.product .reset_variations {
  font-family: var(--sa-font-body);
  font-size: 10px;
  color: #999;
  text-decoration: underline;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-top: 8px;
  display: inline-block;
}

/* ── Quantity + Add to Cart row ── */
.woocommerce div.product form.cart {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
}
.woocommerce div.product form.cart .variations {
  flex: 0 0 100%;
}
.woocommerce div.product form.cart .single_variation_wrap {
  flex: 0 0 100%;
}
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
  display: flex !important;
  gap: 12px !important;
  width: 100% !important;
  margin-top: 20px !important;
}
.woocommerce div.product form.cart .quantity {
  flex: 0 0 100px;
  border: 1px solid #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
}
.woocommerce div.product form.cart .single_add_to_cart_button {
  flex: 1;
  width: auto !important;
  padding: 16px 24px !important;
  margin-top: 0 !important;
  font-size: 11px !important;
  letter-spacing: 3px !important;
  background: #111 !important;
  color: #fff !important;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover {
  background: var(--sa-accent) !important;
}

/* Hide clutter */
.woocommerce div.product .product_meta { display: none !important; }
.tinvwl_add_to_wishlist_button,
.add-to-wishlist,
.yith-wcwl-add-to-wishlist,
.woocommerce div.product .woocommerce-wishlist-button { display: none !important; }

/* Sticky add-to-cart bar — force hide (Konte's real class is .sticky-cart-form;
   on mobile its scroll/resize toggling causes the page to jump while scrolling) */
.konte-product-sticky-bar,
.konte-sticky-add-to-cart,
.product-sticky,
.sticky-cart-form,
.sticky-add-to-cart { display: none !important; }

/* === PRODUCT ACCORDION — in right summary column, VB-style === */
/* Tabs stay inside .summary.entry-summary (JS no longer moves them) */
.single-product .woocommerce-tabs {
  margin-top: 28px;
}
.single-product .woocommerce-tabs ul.tabs { display: none !important; }

/* Each panel = one accordion row */
.single-product .woocommerce-tabs .woocommerce-Tabs-panel {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid #E0E0E0 !important;
}
.single-product .woocommerce-tabs .woocommerce-Tabs-panel:first-of-type {
  border-top: 1px solid #E0E0E0 !important;
}
/* Size guide tab: hidden in accordion — shows only via drawer */
.single-product .woocommerce-tabs #tab-size_guide {
  display: none !important;
}

/* Accordion header (injected by JS) */
.single-product .sa-acc-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 0;
  cursor: pointer;
  user-select: none;
  font-family: var(--sa-font-body);
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: #111;
  transition: color 0.15s;
}
.single-product .sa-acc-header:hover { color: #777; }
.single-product .sa-acc-icon {
  font-size: 20px;
  font-weight: 200;
  line-height: 1;
  flex-shrink: 0;
  margin-left: 16px;
}

/* Accordion collapsible content */
.single-product .sa-acc-content {
  padding: 0 0 24px;
}
.single-product .sa-acc-content p,
.single-product .sa-acc-content td,
.single-product .sa-acc-content li {
  font-family: var(--sa-font-body);
  font-size: 13px;
  font-weight: 300;
  line-height: 1.85;
  color: #555;
}
.single-product .sa-acc-content table {
  width: 100%;
  border-collapse: collapse;
}
.single-product .sa-acc-content th {
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #111;
  padding: 6px 0;
  border-bottom: 1px solid #E0E0E0;
  text-align: left;
}
.single-product .sa-acc-content td {
  padding: 8px 0;
  border-bottom: 1px solid #F0F0F0;
}
.single-product .sa-acc-content img {
  max-width: 100%;
  height: auto;
  display: block;
  margin-top: 8px;
}

/* Hide Konte's slide-in panel chrome */
.single-product .woocommerce-tabs .button-close,
.single-product .woocommerce-tabs .panel-header { display: none !important; }
.single-product .woocommerce-tabs .panel-content {
  position: static !important;
  padding: 0 !important;
  overflow: visible !important;
  height: auto !important;
  top: auto !important;
  bottom: auto !important;
}

/* === SIZE GUIDE SLIDE-IN DRAWER === */
.sa-sg-drawer {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
}
.sa-sg-drawer.open { display: block; }
.sa-sg-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.25);
}
.sa-sg-panel {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 520px;
  max-width: 92vw;
  background: #fff;
  padding: 52px 44px 60px;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform 0.36s cubic-bezier(0.4,0,0.2,1);
  box-sizing: border-box;
}
.sa-sg-drawer.open .sa-sg-panel {
  transform: none;
}
.sa-sg-close {
  position: absolute;
  top: 18px; right: 20px;
  background: none;
  border: none;
  font-size: 22px;
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
  color: #111;
  padding: 4px 8px;
}
.sa-sg-close:hover { color: var(--sa-accent); }
.sa-sg-title {
  font-family: var(--sa-font-display);
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: #111;
  margin: 0 0 28px;
}
.sa-sg-panel img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Product tabs */
.woocommerce-tabs ul.tabs {
  border-bottom: 1px solid #E8E8E8;
  padding: 0;
  margin-bottom: 0;
}
.woocommerce-tabs ul.tabs li {
  border: none;
  background: none;
  border-radius: 0;
}
.woocommerce-tabs ul.tabs li a {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #999;
  padding: 12px 16px;
}
.woocommerce-tabs ul.tabs li.active a {
  color: #111;
  border-bottom: 2px solid #111;
  background: none;
}
.woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce-tabs .panel {
  font-family: var(--sa-font-body);
  font-size: 13px;
  font-weight: 300;
  line-height: 1.8;
  color: #555;
  padding: 24px 0;
}

/* === SHOP ARCHIVE / CATEGORY PAGE === */
.woocommerce-products-header__title,
.page-header-title h1,
.page-header .page-title {
  font-family: var(--sa-font-display);
  font-size: 28px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #111;
}

/* Toolbar (sort/filter bar) */
.woocommerce-ordering select,
.shop-toolbar select {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  border: 1px solid #E8E8E8;
  border-radius: 0;
}
.woocommerce-result-count {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  color: #999;
}

/* Load more button */
.woocommerce .konte-loadmore-button,
.woocommerce .loadmore {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  background: transparent;
  color: #111;
  border: 1px solid #111;
  padding: 14px 40px;
  display: block;
  margin: 40px auto;
  cursor: pointer;
  transition: all 0.2s ease;
}
.woocommerce .konte-loadmore-button:hover,
.woocommerce .loadmore:hover {
  background: #111;
  color: #fff;
}

/* === FOOTER === */
.site-footer,
#colophon {
  background: #F5F3EF !important;
  border-top: 1px solid #E8E8E8;
}

.site-footer,
.site-footer p,
.site-footer li,
.site-footer span,
.site-footer a,
.footer-widgets,
.footer-widgets p,
.footer-widgets li,
.footer-widgets a {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  color: #111;
  line-height: 1.8;
}

.site-footer a:hover,
.footer-widgets a:hover { color: var(--sa-accent); }

.footer-widgets .widget-title,
.footer-widget-title,
.site-footer .widget-title {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #111;
  margin-bottom: 16px;
  border: none;
}
.footer-widgets .widget-title::after,
.site-footer .widget-title::after { display: none; }

.site-footer .footer-main,
.footer-main {
  background: #F5F3EF;
  padding: 20px 0;
  border-top: 1px solid #E8E8E8;
}

.footer-copyright,
.site-footer .copyright {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 300;
  color: #999;
  letter-spacing: 0.5px;
}

/* === NEWSLETTER (footer) === */
.newsletter-form input[type="email"],
.footer-newsletter input[type="email"] {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  border: 1px solid #E8E8E8;
  border-radius: 0;
  padding: 10px 14px;
  background: #fff;
  color: #111;
}
.newsletter-form button,
.footer-newsletter button {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 2px;
  text-transform: uppercase;
  background: #111;
  color: #fff;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
}
.newsletter-form button:hover,
.footer-newsletter button:hover { background: var(--sa-accent); }

/* === CART PAGE === */
.woocommerce-cart table.cart td,
.woocommerce-cart table.cart th {
  font-family: var(--sa-font-body);
  font-size: 13px;
  font-weight: 300;
}
.woocommerce-cart table.cart .product-name a { color: #111; }
.woocommerce-cart .cart_totals h2 {
  font-family: var(--sa-font-display);
  font-size: 16px;
  text-transform: uppercase;
}

/* === CHECKOUT === */
.woocommerce-checkout h3 {
  font-family: var(--sa-font-display);
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.woocommerce-checkout label {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #111;
}
.woocommerce-checkout input,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
  font-family: var(--sa-font-body);
  font-size: 13px;
  font-weight: 300;
  border: 1px solid #E8E8E8;
  border-radius: 0;
}

/* === CONTENT PAGE TITLES — breathing room below header, tight to body === */
body.page:not(.home):not(.woocommerce-checkout):not(.woocommerce-cart):not(.woocommerce-account) .entry-header {
  padding-top: 64px !important;
  padding-bottom: 0 !important;
  margin-bottom: 24px !important;
}
body.page:not(.home):not(.woocommerce-checkout):not(.woocommerce-cart):not(.woocommerce-account) .entry-header .entry-title {
  margin-bottom: 0 !important;
}
body.page:not(.home):not(.woocommerce-checkout):not(.woocommerce-cart):not(.woocommerce-account) .entry-content {
  margin-top: 0 !important;
}

/* === ABOUT PAGE — Shop the Collection button hover (brand accent) === */
.sa-about-btn {
  transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease !important;
}
.sa-about-btn:hover {
  background: var(--sa-accent) !important;
  border-color: var(--sa-accent) !important;
  color: #fff !important;
}

/* === CONTACT FORM 7 — on-brand minimal styling === */
.wpcf7-form p { margin: 0 0 18px; }
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea {
  font-family: var(--sa-font-body);
  font-size: 13px;
  font-weight: 300;
  color: #111;
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid #D0D0D0;
  border-radius: 0;
  padding: 11px 0;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.2s;
}
.wpcf7-form input::placeholder,
.wpcf7-form textarea::placeholder {
  color: #999;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-size: 11px;
}
.wpcf7-form input:focus,
.wpcf7-form textarea:focus { border-bottom-color: #111; }
.wpcf7-form textarea { min-height: 120px; resize: vertical; }
.wpcf7-form input[type="submit"] {
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 3px;
  background: #111;
  color: #fff;
  border: none;
  border-radius: 0;
  padding: 16px 44px;
  margin-top: 10px;
  cursor: pointer;
  transition: background 0.2s;
}
.wpcf7-form input[type="submit"]:hover { background: var(--sa-accent); }
.wpcf7-response-output {
  font-family: var(--sa-font-body);
  font-size: 12px;
  font-weight: 300;
  margin: 16px 0 0 !important;
}

/* === SEARCH RESULTS === */
.search-results .woocommerce-loop-product__title { font-size: 12px; }

/* === 404 PAGE === */
.error-404 .page-title {
  font-family: var(--sa-font-display);
  font-size: 80px;
  color: #E8E8E8;
  margin-bottom: 0;
}
.error-404 h2 { font-size: 20px; }

/* === BREADCRUMBS — hide (includes Rank Math) === */
.woocommerce-breadcrumb,
.konte-breadcrumb,
.breadcrumbs,
.breadcrumbs__crumbs,
.breadcrumb-trail,
.page-header .breadcrumb,
nav.breadcrumbs,
nav.rank-math-breadcrumb,
.rank-math-breadcrumb { display: none !important; }

/* === SHOP PAGE HEADER — compact spacing === */
.woocommerce-products-header {
  padding: 24px 0 16px !important;
  margin-bottom: 0 !important;
}
.woocommerce-products-header__container {
  padding-bottom: 0 !important;
}
.woocommerce-products-header__title.page-title {
  font-size: 13px !important;
  letter-spacing: 3px !important;
  margin: 0 !important;
}

/* === SHOP CATEGORY TILES — 3-column full-width grid === */
/* Override Konte/WC fixed px widths with a proper grid */
.woocommerce ul.products.product-categories {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}
/* Konte's clearfix ::before becomes a grid item — kill it */
.woocommerce ul.products.product-categories::before,
.woocommerce ul.products.product-categories::after {
  display: none !important;
  content: none !important;
}
.woocommerce ul.products.product-categories li.product-category {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.woocommerce ul.products.product-categories li.product-category img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 5 !important;
  object-fit: cover !important;
  object-position: top center !important;
  display: block !important;
}

/* === SHOP CATEGORY TILES — overlay + label === */
/* Position anchor as overlay context */
.woocommerce ul.products li.product-category a {
  position: relative;
  display: block;
  overflow: hidden;
}
/* Dark gradient behind label */
.woocommerce ul.products li.product-category a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 55%;
  background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, transparent 100%);
  pointer-events: none;
  z-index: 1;
}
/* Category title — white, left-bottom */
.woocommerce ul.products li.product-category .woocommerce-loop-category__title {
  position: absolute !important;
  bottom: 24px !important;
  left: 24px !important;
  color: #fff !important;
  font-family: var(--sa-font-display) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  text-shadow: none !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}
/* Hide "(9)" product count */
.woocommerce ul.products li.product-category mark.count {
  display: none !important;
}

/* === SHOP FILTER BAR — hide Konte's "You're looking for" bar === */
.konte-products-filter,
.woocommerce-product-search,
.products-quick-search,
.products-quick-search-form,
.konte-filter-widget-area,
.products-filter-toggle,
.catalog-toolbar-filter { display: none !important; }

/* === PRODUCT PAGE — force white background === */
.single-product .konte-product-summary,
.single-product .product-summary,
.single-product .woocommerce-product-gallery + .summary,
.single-product .summary.entry-summary,
.single-product div.product .summary,
.single-product .product {
  background: #fff !important;
  color: #111 !important;
}

/* Override Konte's color extraction feature on single product */
.single-product .product-top,
.single-product .konte-product-top,
.single-product .product-top-wrapper {
  background: #fff !important;
}

/* Product info text color override */
.single-product .summary .product_title,
.single-product .summary .price,
.single-product .summary .woocommerce-product-details__short-description,
.single-product .summary .variations label,
.single-product .summary .stock {
  color: #111 !important;
}

/* === PAGE TRANSITIONS (remove Konte's defaults) === */
.konte-page-transition { display: none !important; }

/* === MOBILE === */
@media (max-width: 767px) {
  .sa-collection-tiles { grid-template-columns: 1fr; }
  .sa-tile { aspect-ratio: 3 / 4; }

  .woocommerce div.product {
    display: block;
  }

  .sa-faq-wrap { padding: 48px 16px; }
}

/* Konte Elementor container padding overrides for FAQ section */
.elementor-element[data-id="sa0004"].e-con {
  padding-bottom: 40px !important;
}

@media (max-width: 480px) {
  .site-logo img,
  .site-branding .logo img { max-height: 36px; }
}

/* === HERO — remove gap below header === */
.site-content,
.site-content > .content-area,
#content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.elementor-section:first-child,
.e-con:first-child {
  margin-top: 0 !important;
}
/* Remove any padding Konte adds above page content */
.page-template-default .site-main,
.page-template-elementor_canvas .site-main,
.site-main {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* === CHECKOUT PAGE === */
.woocommerce-checkout .site-main,
.woocommerce-cart .site-main {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 40px 80px;
  box-sizing: border-box;
}
/* Pull the entry-header (CHECKOUT heading) tight to the form */
.woocommerce-checkout .entry-header {
  padding: 32px 0 24px !important;
  margin: 0 !important;
}
.woocommerce-checkout .entry-header .entry-title {
  margin-bottom: 0 !important;
}

/* Page title — single clean centered heading */
.woocommerce-checkout .woocommerce-products-header__title,
.woocommerce-cart .page-title,
.checkout-page-header h1,
h1.entry-title {
  font-family: var(--sa-font-display);
  font-size: 13px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 3px;
  text-align: center;
  margin-bottom: 48px;
  color: #111;
}

/* Hide Elementor duplicate "Checkout" heading inside WC content */
.woocommerce-checkout .elementor-heading-title { display: none !important; }

/* Hide WC login / coupon / message notices on checkout */
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message { display: none !important; }

/* Remove phantom margin from collapsed login/coupon divs */
.woocommerce-checkout .checkout-login,
.woocommerce-checkout .checkout-coupon { display: none !important; }

/* Remove extra top margin on entry-content on checkout */
.woocommerce-checkout .entry-content { margin-top: 0 !important; }

/* Two-column checkout layout */
.woocommerce-checkout #customer_details {
  width: 56% !important;
  float: left !important;
  padding-right: 40px !important;
  box-sizing: border-box !important;
}
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
  width: 40% !important;
  float: right !important;
  box-sizing: border-box !important;
}
/* Sticky order summary */
.woocommerce-checkout #order_review {
  position: sticky !important;
  top: 100px !important;
}
/* Clearfix */
.woocommerce-checkout form.checkout::after {
  content: '';
  display: table;
  clear: both;
}
.woocommerce-checkout #order_review_heading {
  font-family: var(--sa-font-display);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: #111;
  margin-bottom: 16px;
}

/* Section headings */
.woocommerce-checkout h3#ship-to-different-address,
.woocommerce-checkout h3,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > h3 {
  font-family: var(--sa-font-display);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: #111;
  margin-bottom: 24px;
  padding-bottom: 12px;
  border-bottom: 1px solid #E8E8E8;
}

/* Form rows */
.woocommerce-checkout .form-row {
  margin-bottom: 20px !important;
}
.woocommerce-checkout .form-row label {
  font-family: var(--sa-font-body) !important;
  font-size: 9px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: #999 !important;
  margin-bottom: 6px !important;
  display: block !important;
}
/* The Konte theme sets .form-row to display:flex, which lines the label up
   beside the input and squishes the half-width first/last name inputs. Force
   block flow so the label sits on top and the input goes full-width, uniformly. */
.woocommerce-checkout .form-row { display: block !important; }
.woocommerce-checkout .form-row .woocommerce-input-wrapper { display: block !important; width: 100% !important; }
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
  font-family: var(--sa-font-body) !important;
  font-size: 13px !important;
  font-weight: 300 !important;
  color: #111 !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #D0D0D0 !important;
  border-radius: 0 !important;
  padding: 10px 0 !important;
  width: 100% !important;
  box-shadow: none !important;
  outline: none !important;
  transition: border-color 0.2s !important;
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
  border-bottom-color: #111 !important;
  box-shadow: none !important;
}
/* Keep the hidden native Country/State selects (replaced by Select2) truly
   hidden — the width:100% above was stretching them off-screen and causing a
   ~37px horizontal overflow / side-scroll on mobile checkout. */
.woocommerce-checkout select.select2-hidden-accessible {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

/* Order summary table */
.woocommerce-checkout table.shop_table {
  border: none !important;
  width: 100% !important;
  font-family: var(--sa-font-body) !important;
}
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
  font-family: var(--sa-font-body) !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  padding: 12px 0 !important;
  border-top: 1px solid #F0F0F0 !important;
  border-left: none !important;
  border-right: none !important;
  color: #111 !important;
}
.woocommerce-checkout table.shop_table thead th {
  font-size: 9px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: #999 !important;
  border-top: none !important;
  border-bottom: 1px solid #E8E8E8 !important;
  padding-bottom: 12px !important;
}
.woocommerce-checkout table.shop_table .order-total td,
.woocommerce-checkout table.shop_table .order-total th {
  font-size: 14px !important;
  font-weight: 400 !important;
  border-top: 2px solid #111 !important;
  border-bottom: none !important;
  padding-top: 16px !important;
}

/* Payment section */
.woocommerce-checkout #payment {
  background: #F9F9F7 !important;
  border-radius: 0 !important;
  padding: 24px !important;
  margin-top: 24px !important;
}
.woocommerce-checkout #payment ul.payment_methods li label {
  font-family: var(--sa-font-body) !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  color: #111 !important;
}
.woocommerce-checkout #payment .payment_method_description,
.woocommerce-checkout #payment .payment_box {
  font-family: var(--sa-font-body) !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  color: #777 !important;
}

/* Place order button */
.woocommerce-checkout #payment #place_order {
  font-family: var(--sa-font-body) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 3px !important;
  background: #111 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
  width: 100% !important;
  padding: 18px !important;
  margin-top: 16px !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
}
.woocommerce-checkout #payment #place_order:hover {
  background: var(--sa-accent) !important;
}

/* Cart page table */
.woocommerce-cart table.cart {
  border: none !important;
  width: 100% !important;
}
.woocommerce-cart table.cart th,
.woocommerce-cart table.cart td {
  font-family: var(--sa-font-body) !important;
  font-size: 13px !important;
  font-weight: 300 !important;
  padding: 20px 12px !important;
  border: none !important;
  border-bottom: 1px solid #F0F0F0 !important;
  vertical-align: middle !important;
}
.woocommerce-cart table.cart thead th {
  font-size: 9px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: #999 !important;
  padding-top: 0 !important;
  border-bottom: 1px solid #E8E8E8 !important;
}
.woocommerce-cart table.cart .product-name a {
  font-size: 13px !important;
  font-weight: 300 !important;
  color: #111 !important;
}
.woocommerce-cart .cart_totals {
  float: right;
  width: 38%;
}
.woocommerce-cart .cart_totals h2 {
  font-family: var(--sa-font-display);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  margin-bottom: 20px;
}
.woocommerce-cart .cart_totals table {
  border: none !important;
  width: 100% !important;
}
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
  font-family: var(--sa-font-body) !important;
  font-size: 13px !important;
  font-weight: 300 !important;
  padding: 12px 0 !important;
  border: none !important;
  border-bottom: 1px solid #F0F0F0 !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  font-family: var(--sa-font-body) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 3px !important;
  background: #111 !important;
  color: #fff !important;
  border-radius: 0 !important;
  padding: 18px 24px !important;
  display: block !important;
  text-align: center !important;
  margin-top: 16px !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  background: var(--sa-accent) !important;
}

/* Empty cart */
.woocommerce-cart .cart-empty,
.woocommerce-cart .return-to-shop {
  text-align: center;
  font-family: var(--sa-font-body);
  font-size: 13px;
  font-weight: 300;
  color: #777;
}
.woocommerce-cart .return-to-shop .button {
  margin-top: 20px;
  font-size: 10px;
  letter-spacing: 2.5px;
}

/* ============================================================
   MOBILE OVERRIDES — must come AFTER all desktop float/width
   rules above so source order wins the !important tie.
   ============================================================ */
@media (max-width: 767px) {

  /* ── FOOTER — clean 2-column layout ──
     Logo + info full width on top, then SHOP | INFO side by side */
  .site-footer .footer-widgets .footer-widgets-area {
    width: 100% !important;
    float: none !important;
    margin-bottom: 28px !important;
  }
  .site-footer .footer-widgets .footer-widgets-area-1 {
    margin-bottom: 36px !important;
  }
  .site-footer .footer-widgets .footer-widgets-area-2,
  .site-footer .footer-widgets .footer-widgets-area-3 {
    width: 50% !important;
    float: left !important;
    margin-bottom: 0 !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
  }
  .site-footer .footer-widgets .footer-container .row::after {
    content: '';
    display: table;
    clear: both;
  }

  /* ── CHECKOUT — stack columns, kill desktop floats ── */
  .woocommerce-checkout .site-main {
    padding: 0 18px 60px !important;
    max-width: 100% !important;
  }
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout #order_review_heading,
  .woocommerce-checkout #order_review {
    width: 100% !important;
    float: none !important;
    padding-right: 0 !important;
    position: static !important;
    top: auto !important;
  }
  .woocommerce-checkout #order_review_heading { margin-top: 40px !important; }
  .woocommerce-checkout .woocommerce-billing-fields > h3,
  .woocommerce-checkout #customer_details h3 {
    font-size: 16px !important;
    letter-spacing: 1.5px !important;
  }
  .woocommerce-checkout #payment { padding: 18px !important; }

  /* ── CART — stack totals full width, buttons full width ── */
  .woocommerce-cart .site-main { padding: 0 18px 60px !important; }
  .woocommerce-cart .cart_totals {
    float: none !important;
    width: 100% !important;
    margin-top: 36px !important;
  }
  .woocommerce-cart table.cart th,
  .woocommerce-cart table.cart td {
    padding: 14px 6px !important;
  }
  .woocommerce-cart .actions .coupon {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    float: none !important;
    width: 100% !important;
    margin-bottom: 16px !important;
  }
  .woocommerce-cart .actions .coupon input.input-text {
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .woocommerce-cart .actions .button,
  .woocommerce-cart .actions .coupon .button {
    width: 100% !important;
    float: none !important;
    margin: 0 0 10px !important;
    letter-spacing: 2px !important;
    box-sizing: border-box !important;
  }
  .woocommerce-cart .cart_totals h2 { letter-spacing: 1.5px !important; }
  .woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    letter-spacing: 2px !important;
    padding: 16px !important;
  }

  /* ── PRODUCT PAGE — kill sticky gallery on mobile (fixes scroll glitch) ──
     The desktop VB-style sticky gallery overlaps the summary while scrolling
     on small screens. Make it flow normally with the page. */
  .woocommerce div.product .woocommerce-product-gallery {
    position: static !important;
    top: auto !important;
    /* Override the JS-set inline pixel height. On iOS Safari the address bar
       collapsing/expanding on scroll fires resize events that make the gallery
       script recompute its height, shoving the text below up and down. Letting
       height follow the image (auto) removes that recompute-driven jump. */
    height: auto !important;
  }
  .woocommerce div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
  .woocommerce div.product .woocommerce-product-gallery .flex-viewport {
    height: auto !important;
  }
  /* More breathing room between gallery image and title; ease the heavy
     side padding so the text isn't cramped on a phone. */
  .woocommerce div.product .summary.entry-summary {
    padding: 80px 24px 60px !important;
  }
  .single-product .product_title.entry-title {
    margin-bottom: 14px !important;
  }

  /* ── PRODUCT ARCHIVE / SHOP — clean 2-per-row grid ──
     Scoped to archive + shop so it never touches the homepage carousel */
  .archive.woocommerce ul.products:not(.product-categories),
  .woocommerce-shop ul.products:not(.product-categories) {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px 12px !important;
    width: 100% !important;
  }
  .archive.woocommerce ul.products:not(.product-categories) li.product,
  .woocommerce-shop ul.products:not(.product-categories) li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
  }

  /* ── SHOP CATEGORY TILES — 2 columns, no clipped labels ── */
  .woocommerce ul.products.product-categories {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  .woocommerce ul.products.product-categories li.product-category img {
    height: auto !important;
    aspect-ratio: 4 / 5 !important;
  }
  .woocommerce ul.products li.product-category .woocommerce-loop-category__title {
    font-size: 11px !important;
    letter-spacing: 1px !important;
    left: 14px !important;
    right: 14px !important;
    bottom: 16px !important;
    white-space: normal !important;
    line-height: 1.3 !important;
  }
}

/* ============================================================
   CHECKOUT — clean shipping row + payment section
   ============================================================ */
/* Multiple shipping methods: clean, left-aligned, selectable radio list */
.woocommerce-checkout .woocommerce-shipping-totals th { vertical-align: top !important; padding-top: 14px !important; }
.woocommerce-checkout .woocommerce-shipping-totals td { text-align: left !important; padding-left: 18px !important; }
.woocommerce-checkout #shipping_method {
  margin: 0 !important; padding: 0 !important; list-style: none !important;
  display: flex !important; flex-direction: column !important; gap: 11px !important;
}
.woocommerce-checkout #shipping_method li {
  list-style: none !important; margin: 0 !important; padding: 0 !important;
  display: flex !important; align-items: flex-start !important; gap: 9px !important; line-height: 1.4 !important;
}
.woocommerce-checkout #shipping_method li input[type="radio"] {
  display: inline-block !important; -webkit-appearance: auto !important; appearance: auto !important;
  flex: 0 0 auto !important; width: 15px !important; height: 15px !important;
  margin: 2px 0 0 0 !important; accent-color: var(--sa-accent) !important; cursor: pointer !important; opacity: 1 !important; position: static !important;
}
.woocommerce-checkout #shipping_method label,
.woocommerce-checkout #shipping_method li label {
  font-family: var(--sa-font-body) !important;
  font-size: 13px !important;
  font-weight: 300 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: #444 !important;
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  flex: 1 1 auto !important;
}
.woocommerce-checkout #shipping_method li input[type="radio"]:checked + label { color: #111 !important; font-weight: 400 !important; }
.woocommerce-checkout #shipping_method label .woocommerce-Price-amount { font-weight: 500 !important; white-space: nowrap !important; }
.woocommerce-checkout #shipping_method label::before,
.woocommerce-checkout #shipping_method label::after { display: none !important; content: none !important; }

/* Payment section: lighter, cleaner */
.woocommerce-checkout #payment { background: #FAFAF9 !important; padding: 22px !important; }
.woocommerce-checkout #payment ul.payment_methods {
  border: none !important;
  padding: 0 !important;
  margin: 0 0 6px !important;
  list-style: none !important;
}
.woocommerce-checkout #payment ul.payment_methods li { list-style: none !important; margin: 0 !important; }
.woocommerce-checkout #payment .payment_box { background: transparent !important; padding: 6px 0 0 !important; }
.woocommerce-checkout #payment .payment_box::before { display: none !important; }
.woocommerce-checkout #payment .wc-terms-and-conditions { margin: 14px 0 0 !important; }

/* ============================================================
   FOOTER — "Made with 💙 by Afefe Creative" credit
   Whole phrase is the link. Right-aligned on desktop/tablet,
   stacked under the copyright on mobile. No underline; hover = colour.
   ============================================================ */
.sa-credit {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 1px;
  color: inherit;
  opacity: 0.7;
  text-decoration: none;
  transition: color 0.2s ease, opacity 0.2s ease;
}
.sa-credit:hover { color: #4338F0; opacity: 1; }
.sa-credit .sa-heart { font-style: normal; }
@media (max-width: 767px) {
  .sa-credit { font-size: 11px; margin-top: 6px; }
}
/* Desktop + tablet: push the credit to the right of the copyright line.
   padding-right keeps it clear of the fixed WhatsApp chat button. */
@media (min-width: 768px) {
  .footer-main .copyright {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    gap: 16px;
    padding-right: 110px;
  }
  .footer-main .sa-credit { margin-top: 0 !important; }
}

/* ============================================================
   CART — clear, always-visible "Enter coupon code" box
   (input is always shown, labelled, and prominent)

   NOTE: the coupon field is currently switched OFF via
   SA_COUPON_FIELD in functions.php, so WooCommerce renders no
   coupon markup and every rule below is inert. It is kept intact
   so flipping that switch back to true restores the styled boxes
   on both cart and checkout with no further work.
   ============================================================ */
.woocommerce-cart .actions .coupon {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  float: none !important;
  width: 100% !important;
  max-width: 480px;
  box-sizing: border-box !important;
  margin: 0 0 24px !important;
  padding: 18px 20px !important;
  border: 1px solid #E3E1DD !important;
  border-radius: 4px;
  background: #FAFAF9 !important;
}
.woocommerce-cart .actions .coupon .sa-coupon-heading {
  display: block;
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #1A1A2E;
  margin-bottom: 10px;
}
.woocommerce-cart .actions .coupon input#coupon_code {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 13px 14px !important;
  margin: 0 0 10px !important;
  border: 1px solid #C9C6C1 !important;
  border-radius: 3px !important;
  background: #fff !important;
  font-family: var(--sa-font-body) !important;
  font-size: 14px !important;
  letter-spacing: 0.5px !important;
}
.woocommerce-cart .actions .coupon input#coupon_code::placeholder { color: #9a978f; opacity: 1; }
.woocommerce-cart .actions .coupon input#coupon_code:focus { border-color: #1A1A2E !important; outline: none !important; }
.woocommerce-cart .actions .coupon button[name="apply_coupon"] {
  display: block !important;
  position: static !important;
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 13px 18px !important;
  letter-spacing: 2px !important;
}

/* Cart/Checkout page title — add breathing room below the site header */
.woocommerce-cart .entry-header,
.woocommerce-checkout .entry-header {
  padding-top: 44px !important;
}
@media (max-width: 767px) {
  .woocommerce-cart .entry-header,
  .woocommerce-checkout .entry-header { padding-top: 32px !important; }
}

/* ============================================================
   CHECKOUT — clean, always-visible coupon box (matches the cart)
   ============================================================ */
.woocommerce-checkout .checkout-coupon { display: block !important; margin: 0 0 28px !important; }
.woocommerce-checkout .checkout-coupon .woocommerce-form-coupon-toggle { display: none !important; }
.woocommerce-checkout form.checkout_coupon {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 480px;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  border: 1px solid #E3E1DD !important;
  border-radius: 4px;
  background: #FAFAF9 !important;
}
.woocommerce-checkout form.checkout_coupon > p:not(.form-row) { display: none !important; } /* hide default description */
.woocommerce-checkout form.checkout_coupon .sa-coupon-heading {
  display: block;
  font-family: var(--sa-font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #1A1A2E;
  margin-bottom: 10px;
}
.woocommerce-checkout form.checkout_coupon .form-row {
  float: none !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
}
.woocommerce-checkout form.checkout_coupon .form-row-last { margin-bottom: 0 !important; }
.woocommerce-checkout form.checkout_coupon input#coupon_code {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 13px 14px !important;
  margin: 0 !important;
  border: 1px solid #C9C6C1 !important;
  border-radius: 3px !important;
  background: #fff !important;
  font-family: var(--sa-font-body) !important;
  font-size: 14px !important;
  letter-spacing: 0.5px !important;
}
.woocommerce-checkout form.checkout_coupon input#coupon_code::placeholder { color: #9a978f; opacity: 1; }
.woocommerce-checkout form.checkout_coupon input#coupon_code:focus { border-color: #1A1A2E !important; outline: none !important; }
.woocommerce-checkout form.checkout_coupon button[name="apply_coupon"] {
  display: block !important;
  position: static !important;
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 13px 18px !important;
  letter-spacing: 2px !important;
}
.woocommerce-checkout form.checkout_coupon .clear { display: none !important; }
/* Once a coupon is already applied, hide the checkout coupon box (the applied
   coupon still shows in the order summary with a remove link).
   Note: woocommerce-checkout is a <body> class, so both classes sit on body. */
body.sa-has-coupon.woocommerce-checkout .checkout-coupon { display: none !important; }

/* ============================================================
   SINGLE PRODUCT — top-align the gallery with the product title.
   Konte vertically centres the gallery against the summary
   (align-self:center + -150px margin), which sinks the image when
   the summary column is tall (custom size fields, long content). */
.single-product .product-gallery-summary { align-items: flex-start !important; }
.single-product .product-gallery-summary .woocommerce-product-gallery {
  align-self: flex-start !important;
  margin-top: 0 !important;
}
/* Title text starts on the same line as the main image's top edge
   (summary pad 60px == the gallery's main-image offset; drop the h1's own 30px) */
.single-product .summary .product_title { margin-top: 0 !important; }
/* Konte's JS vertically centres the thumbnail strip beside the main image
   (translateY(-Npx)), which pushed the first thumbs under the header once the
   gallery became top-aligned. Untransformed, the strip naturally starts level
   with the main image. Scoped to the side-by-side layout only. */
@media (min-width: 768px) {
  .single-product .woocommerce-product-gallery .flex-control-thumbs { transform: none !important; }
}

/* ============================================================
   SHOP/CATEGORY GRID — fix left-packed rows on tablet.
   Konte sizes cards at exact fractions (25%, 33.33%) while the flex
   grid also has a 20px column-gap, so every row overflows and the
   last card wraps, leaving rows left-packed with an empty slot.
   Size cards to account for the gaps. */
.post-type-archive-product ul.products.columns-2 > li.product,
.tax-product_cat ul.products.columns-2 > li.product,
.search ul.products.columns-2 > li.product { width: calc(50% - 10px) !important; }
.post-type-archive-product ul.products.columns-3 > li.product,
.tax-product_cat ul.products.columns-3 > li.product,
.search ul.products.columns-3 > li.product { width: calc(33.3333% - 13.34px) !important; }
.post-type-archive-product ul.products.columns-4 > li.product,
.tax-product_cat ul.products.columns-4 > li.product,
.search ul.products.columns-4 > li.product { width: calc(25% - 15px) !important; }
.post-type-archive-product ul.products.columns-5 > li.product,
.tax-product_cat ul.products.columns-5 > li.product,
.search ul.products.columns-5 > li.product { width: calc(20% - 16px) !important; }

/* Cart hides the meta labels (dt) by default — show them so a line
   reads "Size: UK 10" instead of a bare "UK 10". */
.woocommerce-cart .cart_item dl.variation dt { display: inline-block; margin: 0 2px 0 0; font-weight: 400; }
.woocommerce-cart .cart_item dl.variation dd { margin: 0 10px 0 0; }
.woocommerce-cart .cart_item dl.variation dd p { display: inline; }

/* ============================================================
   OUT OF STOCK tag on product cards
   ============================================================ */
.woocommerce ul.products li.product .sa-oos {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 3;
  display: inline-block;
  padding: 6px 11px;
  font-family: var(--sa-font-body);
  font-size: 9px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #1A1A2E;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(3px);
  border-radius: 2px;
  box-shadow: 0 1px 6px rgba(26, 26, 46, 0.10);
  pointer-events: none;
}
/* let the photo recede slightly so the tag reads without shouting */
.woocommerce ul.products li.product.outofstock .product-thumbnail img { opacity: 0.88; }
@media (max-width: 767px) {
  .woocommerce ul.products li.product .sa-oos {
    top: 9px; left: 9px; padding: 5px 8px; font-size: 8px; letter-spacing: 1.5px;
  }
}