:root {
	--display-font-family: Lalezar;
	--body-font-family: Hind;

	--font-size: 16px

	--logo-padding: 0px;
	--logo-height: 250px;

	--header-width: 1366px;
	--header-border-position: bottom;
	--header-border-size: 0;
	--header-bg-color: 59 47 36;
	--header-border-color: 42 42 40;

	--brand-color: 59 47 36;
	--brand-color-inverted: 245 240 230;

	--background-color: 255 15 ;
	--text-color: 61 61 61;
	--link-color: 44 95 63;

	--action-color: 139 105 20;
	--action-color-inverted: 245 240 230;

	--announcement-bar-bg-color: 44 95 63;
	--announcement-bar-text-color: 245 240 230;
	--announcement-bar-link-color: 245 240 230;

	--main-navigation-bg-color: 59 47 36;
	--main-navigation-link-color: 245 240 230;
	--main-navigation-link-color-hover: 139 105 20;
	--main-navigation-link-bg-color: 59 47 36;
	--main-navigation-link-font-size: 20px;
	--main-navigation-link-alignment: center;

	--auxiliary-bg-color: 42 42 40;
	--auxiliary-border-color: 59 47 36;
	--auxiliary-link-color: 245 240 230;

	--order-status-bg-color: 245 240 230;
	--order-status-color: 59 47 36;

	--store-menu-bg_color: 245 240 230;
	--store-menu-color: 59 47 36;

	--footer-bg-color: 42 42 40;
	--footer-color: 245 240 230;
	--footer-link-color: 139 105 20;
}

/*Custom Styles*/
/* ============================================================
   Oahu Meats — GrazeCart Theme Upgrade 2026-05-09
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,ital,wght@9..144,0,500;9..144,0,600;9..144,0,700;9..144,1,400&family=Inter:wght@400;500;600;700&display=swap');

/* --- Brand tokens ----------------------------------------- */
:root {
  --brand_color:          #6B2A2A;
  --brand_color_inverted: #F5EFE3;
  --background_color:     #F5EFE3;
  --text_color:           #3B2F24;
  --link_color:           #6B2A2A;
  --om-maroon:            #6B2A2A;
  --om-maroon-deep:       #4A1C1C;
  --om-tan:               #C9A878;
  --om-tan-light:         #E4D2AE;
  --om-linen:             #F5EFE3;
  --om-linen-warm:        #F1E8D6;
  --om-earth:             #3B2F24;
  --om-earth-soft:        #5C4A3A;
  --om-coral:             #C5563D;
  --om-rock:              #1F1B17;
}

/* --- Typography ------------------------------------------- */
body, p, label, .paragraph, button, input, select, textarea {
  font-family: "Inter", -apple-system, sans-serif;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,legend {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 600;
  letter-spacing: -0.01em;
}
a { color: var(--om-maroon); }
a:hover { color: var(--om-maroon-deep); text-decoration: none; }

/* --- Announcement bar ------------------------------------- */
.announcement_bar {
  background-color: #4A1C1C !important;
  color: #E4D2AE !important;
  font-size: 13px;
  letter-spacing: 0.04em;
}
.announcement_bar a { color: #E4D2AE !important; }

/* --- Header ----------------------------------------------- */
.siteHeader {
  background-color: #3B2F24 !important;
  border-bottom: 3px solid #6B2A2A !important;
}
.logo { padding: 10px 0 !important; }
.logo__img { max-height: 72px !important; }
@media (max-width: 414px) { .logo__img { max-height: 50px !important; } }

/* --- Navigation ------------------------------------------- */
.mainNavigation, .mobileNav { background-color: #3B2F24 !important; }
.mainNavigation__list > li > a {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #E4D2AE !important;
  background-color: #3B2F24 !important;
}
.mainNavigation__list > li > a:hover { color: #C9A878 !important; background-color: #3B2F24 !important; }
.mobileNav > li > a { color: #E4D2AE !important; background-color: #3B2F24 !important; }
.mobileNav > li > a:hover, .mobileNav > li > a:focus { color: #C9A878 !important; background-color: #4A1C1C !important; }

/* --- Order status bar ------------------------------------- */
.orderStatusBar { background-color: #F1E8D6 !important; border-bottom: 1px solid rgba(107,42,42,0.15) !important; }
.orderStatus__container, .orderStatus__mobileToggle { color: #3B2F24 !important; }
.orderStatus__container a, .orderStatus__mobileToggle a { color: #6B2A2A !important; font-weight: 600; border-bottom-color: transparent !important; }

/* --- Page background -------------------------------------- */
body { background-color: #F5EFE3 !important; }

/* --- Collection / category tabs --------------------------- */
.storeIndex__sideBarList--style2 { background-color: #F5EFE3 !important; border: none !important; }
.storeIndex__sideBarList--style2 > li > a {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #5C4A3A !important;
  border-color: rgba(107,42,42,0.1) !important;
  padding: 13px 20px !important;
  transition: all 0.15s;
}
.storeIndex__sideBarList--style2 > li > a:hover,
.storeIndex__sideBarList--style2 > li > a.active {
  color: #6B2A2A !important;
  background-color: rgba(107,42,42,0.06) !important;
  border-left: 3px solid #6B2A2A !important;
}
.storeSearch__input--style2 {
  border: 1px solid rgba(107,42,42,0.2) !important;
  background: #F5EFE3 !important;
  border-radius: 2px !important;
}
.storeSearch__input--style2:focus { border-color: #6B2A2A !important; outline: none !important; }
.storeSearch__button--style2 { color: #6B2A2A !important; }

/* --- Product cards ---------------------------------------- */
.storeIndex__productsListingContainer section.tw-flex {
  background: #F5EFE3 !important;
  border: 1px solid rgba(107,42,42,0.14) !important;
  border-radius: 0 !important;
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s !important;
}
.storeIndex__productsListingContainer section.tw-flex:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 48px -20px rgba(75,28,28,0.4) !important;
}
.storeIndex__productsListingContainer section.tw-flex img {
  transition: transform 0.3s !important;
}
.storeIndex__productsListingContainer section.tw-flex:hover img {
  transform: scale(1.03) !important;
}
.storeIndex__productsListingContainer section.tw-flex .tw-p-4,
.storeIndex__productsListingContainer section.tw-flex [class*="tw-p-"] {
  background: #F5EFE3 !important;
}
.storeIndex__productsListingContainer section.tw-flex h2,
.storeIndex__productsListingContainer section.tw-flex h3 {
  font-family: "Fraunces", Georgia, serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #3B2F24 !important;
  line-height: 1.2 !important;
}
.storeIndex__productsListingContainer section.tw-flex p {
  font-size: 13px !important;
  color: #5C4A3A !important;
  line-height: 1.5 !important;
}
.storeIndex__productsListingContainer section.tw-flex .tw-text-lg,
.storeIndex__productsListingContainer section.tw-flex [class*="price"],
.storeIndex__productsListingContainer section.tw-flex strong {
  font-family: "Fraunces", Georgia, serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #6B2A2A !important;
}

/* --- Buttons ---------------------------------------------- */
.btn-brand, .btn-default, .btn-primary,
.btn-danger, .btn-action, .cta {
  background-color: #6B2A2A !important;
  border-color: #4A1C1C !important;
  color: #F5EFE3 !important;
  font-family: "Inter", sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
}
.btn-brand:hover, .btn-default:hover, .btn-primary:hover,
.btn-danger:hover, .btn-action:hover, .cta:hover {
  background-color: #4A1C1C !important;
  border-color: #4A1C1C !important;
  color: #F5EFE3 !important;
}
.storeIndex__productsListingContainer section.tw-flex button {
  background-color: #6B2A2A !important;
  border-color: #4A1C1C !important;
  color: #F5EFE3 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  transition: background 0.2s !important;
}
.storeIndex__productsListingContainer section.tw-flex button:hover {
  background-color: #4A1C1C !important;
}

/* --- Footer ----------------------------------------------- */
.siteFooter {
  background-color: #1F1B17 !important;
  color: #E4D2AE !important;
  border-top: 4px solid #6B2A2A !important;
}
.siteFooter h1,.siteFooter h2,.siteFooter h3,.siteFooter h4,.siteFooter h5,.siteFooter h6 {
  color: #F5EFE3 !important;
  font-size: 13px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
}
.siteFooter p, .siteFooter li { color: rgba(228,210,174,0.75) !important; }
.siteFooter a { color: rgba(228,210,174,0.75) !important; }
.siteFooter a:hover { color: #C5563D !important; }
.backToTopLink__container { background-color: rgba(255,255,255,0.04) !important; border-top: 1px solid rgba(228,210,174,0.15) !important; }
.backToTopLink__container a { color: #C9A878 !important; font-size: 12px !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; }

/* --- TikTok icon (FA 5.8.1 polyfill) ---------------------- */
.fab.fa-tiktok::before { content: ""; }
.fab.fa-tiktok {
  display: inline-block; width: 1em; height: 1em; background: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M448 209.91a210.06 210.06 0 01-122.77-39.25v178.72A162.55 162.55 0 11185 188.31V278.2a74.62 74.62 0 1052.23 71.18V0l88 0a121.18 121.18 0 001.86 22.17A122.18 122.18 0 00381 102.39a121.43 121.43 0 0067 20.14z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M448 209.91a210.06 210.06 0 01-122.77-39.25v178.72A162.55 162.55 0 11185 188.31V278.2a74.62 74.62 0 1052.23 71.18V0l88 0a121.18 121.18 0 001.86 22.17A122.18 122.18 0 00381 102.39a121.43 121.43 0 0067 20.14z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  vertical-align: -0.125em;
}
