/** Shopify CDN: Minification failed

Line 440:9 Expected identifier but found whitespace
Line 440:15 Unexpected "!"
Line 972:0 Expected "}" to go with "{"

**/
.clubhouse-calendar {
  padding: 80px 16px;
}

.clubhouse-calendar__wrap {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}

.clubhouse-calendar__heading {
  font-size: 28px;
  margin-bottom: 48px;
}

.clubhouse-calendar__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.clubhouse-calendar__item {
  border-bottom: 1px solid rgba(0,0,0,0.12);
  padding: 40px 0;
}

.clubhouse-calendar__date {
  font-size: 12px;
  letter-spacing: 0.14em;
  opacity: 0.6;
  margin-bottom: 12px;
}

.clubhouse-calendar__title {
  font-size: 20px;
  margin-bottom: 12px;
}

.clubhouse-calendar__meta {
  font-size: 14px;
  line-height: 1.6;
  opacity: 0.75;
  margin-bottom: 20px;
}

.clubhouse-calendar__price {
  font-size: 14px;
  opacity: 0.9;
}

.clubhouse-calendar__link {
  text-decoration: none;
  color: inherit;
}
/* ===============================
   Tea-at-Shiloh calm refinements
   =============================== */

/* Softer hierarchy */
.clubhouse-calendar__title {
  font-weight: 400;
}

.clubhouse-calendar__meta {
  opacity: 0.65;
}

.clubhouse-calendar__price {
  opacity: 0.75;
  margin-top: 8px;
}

/* More breathing room */
.clubhouse-calendar__item {
  padding: 56px 0;
}

/* Softer dividers */
.clubhouse-calendar__item {
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

/* Editorial date treatment */
.clubhouse-calendar__date {
  font-size: 11px;
  letter-spacing: 0.18em;
  opacity: 0.55;
  margin-bottom: 14px;
}
/* Tea-like calendar row layout */
.clubhouse-calendar__wrap{
  max-width: 860px;
  margin: 0 auto;
  padding: 60px 16px;
}

.clubhouse-calendar__list{
  list-style: none;
  margin: 0;
  padding: 0;
}

.clubhouse-calendar__item{
  border-bottom: 1px solid rgba(0,0,0,0.10);
  padding: 34px 0;
}

.clubhouse-calendar__link{
  text-decoration: none;
  color: inherit;
}

.clubhouse-calendar__row{
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 28px;
  align-items: center;
}

.clubhouse-calendar__date{
  text-align: center;
  line-height: 1;
}

.clubhouse-calendar__dow,
.clubhouse-calendar__mon{
  font-size: 11px;
  letter-spacing: 0.18em;
  opacity: 0.55;
}

.clubhouse-calendar__day{
  font-size: 32px;
  line-height: 1;
  margin: 6px 0;
  opacity: 0.85;
}

.clubhouse-calendar__main{
  text-align: left;
}

.clubhouse-calendar__time{
  font-size: 12px;
  letter-spacing: 0.12em;
  opacity: 0.55;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.clubhouse-calendar__title{
  font-weight: 400;
  font-size: 20px;
  line-height: 1.3;
  margin-bottom: 10px;
}

.clubhouse-calendar__meta{
  font-size: 14px;
  line-height: 1.6;
  opacity: 0.65;
}

.clubhouse-calendar__price{
  white-space: nowrap;
  opacity: 0.75;
  text-align: right;
}

/* Mobile: stack gently */
@media (max-width: 700px){
  .clubhouse-calendar__row{
    grid-template-columns: 1fr;
    gap: 12px;
    text-align: center;
  }
  .clubhouse-calendar__main{
    text-align: center;
  }
  .clubhouse-calendar__price{
    text-align: center;
  }
}
.clubhouse-calendar__item {
  position: relative;
}

.clubhouse-calendar__item::after {
  content: "";
  display: block;
  width: 72%;
  margin: 40px auto 0;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.clubhouse-calendar__heading {
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0.04em;
  opacity: 0.75;
  margin-bottom: 72px;
}
.clubhouse-calendar__heading {
  text-transform: lowercase;
}
.clubhouse-calendar__date {
  transform: translateX(-6px);
}
.clubhouse-calendar__title {
  letter-spacing: 0.01em;
}
.clubhouse-calendar__title {
  font-weight: 450;
}
.clubhouse-calendar__price {
  padding-left: 12px;
}
.clubhouse-calendar__price {
  font-size: 15px;
}
.clubhouse-calendar__time {
  opacity: 0.45;
}
.clubhouse-calendar__item {
  padding: 42px 0;
}
@media (max-width: 700px) {
  .clubhouse-calendar__item::after {
    width: 90%;
  }

  .clubhouse-calendar__title {
    font-size: 18px;
  }

  .clubhouse-calendar__price {
    margin-top: 8px;
  }
}
.clubhouse-calendar__item {
  opacity: 0.95;
}
.clubhouse-calendar__link:hover {
  text-decoration: none;
}
.clubhouse-calendar__item::after {
  background: linear-gradient(
    to right,
    transparent,
    rgba(0,0,0,0.12),
    transparent
  );
  border: none;
  height: 1px;
}
.clubhouse-calendar__price {
  transform: translateY(2px);
}
.clubhouse-calendar__title {
  color: rgba(0,0,0,0.85);
}
.clubhouse-calendar__item {
  margin-bottom: 8px;
}
.clubhouse-calendar__date {
  opacity: 0.8;
}
.clubhouse-calendar {
  background-color: #f4e9e6;
}
.clubhouse-calendar__date {
  color: rgba(0, 0, 0, 0.45);
}
.clubhouse-calendar__item::after {
  opacity: 0.25;
  max-width: 620px;
  margin: 0 auto;
}
.clubhouse-calendar__price {
  color: rgba(0, 0, 0, 0.55);
  font-weight: 400;
}
.clubhouse-calendar__heading {
  letter-spacing: 0.04em;
}
@media (max-width: 768px) {
  .clubhouse-calendar__item {
    padding: 32px 0;
  }
}
/* FORCE: warm details card on product page */
body.template-product .clubhouse-details-card,
body.template-product div.clubhouse-details-card,
body.template-product .clubhouse-details-card.bg-scheme-background {
  background-color: #f4e9e6 !important;
  background: #f4e9e6 !important;
}
body.template-product {
  --color-scheme-background: 244 233 230 !important;
}
/* Match clubhouse details card to page background */
.clubhouse-details-card {
  background: #f4e9e6 !important;
  border: none !important;
  box-shadow: none !important;
  padding: 16px 18px !important;
}
/* Calm the product info column */
body.template-product .product__info-wrapper,
body.template-product .product__info-container {
  max-width: 560px;
}

body.template-product .product__info-container > * {
  margin-bottom: 22px;
}

/* Softer title + price */
body.template-product .product__title,
body.template-product .product__title h1 {
  letter-spacing: 0.01em;
  line-height: 1.05;
}

body.template-product .price {
  opacity: 0.85;
}
/* Hide extra checkout noise on product pages */
body.template-product .shopify-payment-button,
body.template-product .product__tax,
body.template-product .shopify-installments,
body.template-product .product__payment_terms {
  display: none !important;
}
/* Tea-at-Shiloh style: less card, more layout */
.clubhouse-details-card {
  background: #f4e9e6 !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 18px 0 !important;
  margin-top: 18px !important;
}

/* Add a soft divider line above the details (like Tea at Shiloh) */
.clubhouse-details-card:before {
  content: "";
  display: block;
  height: 1px;
  background: rgba(0,0,0,0.12);
  margin-bottom: 16px;
}
/* Quiet label typography */
.clubhouse-details-card .clubhouse-details-grid,
.clubhouse-details-card .clubhouse-details {
  gap: 14px;
}

.clubhouse-details-card .label,
.clubhouse-details-card .caption,
.clubhouse-details-card .clubhouse-details-label,
.clubhouse-details-card small {
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.72rem;
  opacity: 0.65;
}
/* Calm body text inside details */
.clubhouse-details-card p,
.clubhouse-details-card div,
.clubhouse-details-card span {
  line-height: 1.55;
}
/* More grounded primary button */
body.template-product .product-form__submit {
  border-radius: 0 !important;
  border: 1px solid rgba(0,0,0,0.25) !important;
  background: transparent !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
/* ========== Tea-at-Shiloh polish for product pages ========== */

/* 1) Give the text column more room (your current max-w-md is too narrow) */
body.template-product .product__info-wrapper,
body.template-product .product__info-container,
body.template-product .product-block-area.max-w-md {
  max-width: 40rem !important; /* was 28rem */
}

/* 2) Calm the vertical rhythm */
body.template-product .product-block-area {
  gap: 26px !important; /* was ~18px */
}

/* 3) Reduce “Shopify noise” */
body.template-product .product__tax,
body.template-product .product__payment_terms,
body.template-product .shopify-installments,
body.template-product .shopify-payment-button,
body.template-product .shopify-payment-button__more-options {
  display: none !important;
}

/* 4) Make the main button feel more like “Reserve” (quiet + intentional) */
body.template-product .product-form__submit,
body.template-product button[name="add"] {
  border-radius
body.template-product .product__info-container,
body.template-product .product__info-container * {
  color: rgba(47, 42, 37, 0.78) !important;
}
/* Remove unwanted outline around "shop" menu item */
header button,
header a {
  outline: none !important;
  box-shadow: none !important;
}

/* Specifically target focus states */
header button:focus,
header button:focus-visible,
header a:focus,
header a:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* Remove any border coming from focus wrappers */
header .no-js-focus-wrapper,
header .no-js-focus-wrapper:focus-within {
  outline: none !important;
  box-shadow: none !important;
  border: none !impor
header *::before,
header *::after {
  outline: none !important;
}
/* Remove the “boxed” styling around the Shop dropdown trigger */
header details,
header details > summary,
header details > summary::before,
header details > summary::after {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}

/* Extra: if the theme uses a classed menu item */
header .header__menu-item,
header .menu__item,
header .nav__item {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}
/* Kill any lingering “pill” wrapper around the first nav item */
header nav * {
  box-shadow: none !important;
}

header nav .border,
header nav [class*="border"],
header nav [class*="rounded"],
header nav [class*="ring"] {
  border: none !important;
  box-shadow: none !important;
}
/* Remove the weird pill/outline behind the first nav item ("shop +") */
header nav ul > li:first-child,
header nav ul > li:first-child > a,
header nav ul > li:first-child > details,
header nav ul > li:first-child > details > summary,
header nav ul > li:first-child > button,
header nav ul > li:first-child .no-js-focus-wrapper,
header nav ul > li:first-child .no-js-focus-wrapper > button {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}

/* If the pill is drawn using a pseudo-element */
header nav ul > li:first-child::before,
header nav ul > li:first-child::after,
header nav ul > li:first-child > *::before,
header nav ul > li:first-child > *::after {
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
/* Remove the rounded “pill” behind the mobile menu (hamburger) button */
header button[aria-controls^="menu"] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  border-radius: 0 !important;
}

/* Some themes put the pill on a wrapper around the button */
header button[aria-controls^="menu"]::before,
header button[aria-controls^="menu"]::after,
header button[aria-controls^="menu"] *::before,
header button[aria-controls^="menu"] *::after {
  content: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* If the pill is on the button’s immediate parent container */
header button[aria-controls^="menu"] {
  padding: 0.5rem 0.25rem !important; /* keeps it easy to tap */
}
header button[aria-controls^="menu"]:focus,
header button[aria-controls^="menu"]:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
header button[aria-controls^="menu"] {
  position: relative;
}
header button[aria-controls^="menu"] {
  background-clip: padding-box !important;
}
header button[aria-controls^="menu"] {
  border-color: transparent !important;
}
header button[aria-controls^="menu"] {
  box-shadow: none !important;
}

/* parent cleanup */
header button[aria-controls^="menu"] {
  -webkit-tap-highlight-color: transparent !important;
}
header button[aria-controls^="menu"] {
  text-decoration: none !important;
}
/* Remove the “boxed” border around the first header nav item ("shop +") */
header nav ul > li:first-child,
header .header__inline-menu ul > li:first-child,
header .menu-drawer__menu-item:first-child {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* If the border is actually on the link itself */
header nav ul > li:first-child > a,
header .header__inline-menu ul > li:first-child > a {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
/* Kill vertical gridlines only on the first menu item cell */
header nav ul > li:first-child {
  border-left-width: 0 !important;
  border-right-width: 0 !important;
}
/* PRODUCT PAGE — add calm Shiloh-like framing + balance */
@media (min-width: 990px) {
  /* Page background + some overall breathing room */
  body:has(.product-media-container):has(.product-content-container) #MainContent {
    background: #f4e9e6 !important;
    padding-top: 48px;
    padding-bottom: 80px;
  }

  /* Create a “frame” around the left media so it doesn’t feel like it’s bleeding */
  body:has(.product-media-container):has(.product-content-container) .product-media-container {
    background: #f4e9e6 !important;
    padding: 56px 48px;           /* BIG difference */
    box-sizing: border-box;
    align-self: center;
  }

  /* Keep the actual image neatly contained */
  body:has(.product-media-container):has(.product-content-container) .product-media-container img,
  body:has(.product-media-container):has(.product-content-container) .product-media-container .media {
    border-radius: 12px;
    overflow: hidden;
  }

  /* More space between image column and text column */
  body:has(.product-media-container):has(.product-content-container) main > .grid {
    column-gap: 64px !important;
  }

  /* Calm the right column: narrower, centered, more like an editorial layout */
  body:has(.product-media-container):has(.product-content-container) .product-content-container {
    padding: 56px 48px;
    align-self: center;
  }

  body:has(.product-media-container):has(.product-content-container) .product-block-area {
    max-width: 34rem;             /* tighten text line length */
    margin-left: auto;
    margin-right: auto;
  }

  /* Optional: soften the Add to cart row so it feels less “UI-heavy” */
  body:has(.product-media-container):has(.product-content-container) .shopify-payment-button,
  body:has(.product-media-container):has(.product-content-container) .product-form {
    margin-top: 20px;
  }
}
/* =========
   PRODUCT PAGE — FORCE MEDIA TO FEEL FRAMED / NOT BLEED
   ========= */
@media (min-width: 990px) {

  /* 1) Make sure the overall page has breathing room */
  body:has(.product-media-container):has(.product-content-container) #MainContent {
    background: #f4e9e6 !important;
    padding: 48px 0 80px !important;
  }

  /* 2) Add a real “frame” around ANY likely media wrapper */
  body:has(.product-media-container):has(.product-content-container) .p
/* =========================================================
   1) KILL THE “SHOP” / MENU DRAWER BORDERS + OUTLINES
   ========================================================= */

/* The little “shop” outline box is the menu trigger’s wrapper border */
header .no-js-focus-container,
header .no-js-focus-container * {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* When the drawer is open, remove all the divider borders inside it */
#menu,
#menu * {
  outline: none !important;
  box-shadow: none !important;
}

#menu .border-gridline,
#menu .border-b-gridline,
#menu .border-y-gridline,
#menu .border-t-gridline {
  border: 0 !important;
}

/* If your “shop by size” is an accordion/summary/button, this catches it too */
#menu button,
#menu summary,
#menu [role="button"] {
  border: 0 !important;
}

/* Sometimes the divider is coming from the drawer container itself */
header .menu-drawer,
header .menu-drawer * {
  border-color: transparent !important;
}


/* =========================================================
   2) MAKE PRODUCT MEDIA FEEL “CALM” (CENTERED + PADDING)
   ========================================================= */

/* Give the whole product grid more breathing room */
body:has(.product-media-container):has(.product-content-container) main {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: clamp(18px, 3vw, 56px);
}

/* Add a soft “frame” around the media column so it doesn’t bleed */
body:has(.product-media-container) .product-media-container {
  padding: clamp(18px, 2.5vw, 48px) !important;
  background: #f4e9e6 !important;
}

/* Center the media itself so it feels intentional */
body:has(.product-media-container) .product-media-container > * {
  max-width: 760px;
  margin-inline: auto;
}

/* Prevent any inner wrapper from spilling visually */
body:has(.product-media-container) .product-media-container .image-with-placeholder,
body:has(.product-media-container) .product-media-container li {
  border-radius: 14px;
  overflow: hidden;
}

/* This is the key: stop “cropping/bleeding”, keep the whole image visible */
body:has(.product-media-container) .product-media-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* Optional: add some separation between image and text column */
body:has(.product-content-container) .product-content-container {
  padding-left: clamp(18px, 2.5vw, 56px);
}
/* =========================================
   Shiloh-like calm product layout
   (global – paste into Assets/clubhouse.css)
   ========================================= */

/* 1) Give the whole product page more breathing room + center it */
main .product-section,
main .product {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(20px, 4vw, 56px);
  padding-right: clamp(20px, 4vw, 56px);
}

/* 2) Add generous gap between image and text */
.product-section,
.product {
  column-gap: clamp(32px, 6vw, 96px) !important;
}

/* 3) Make the media area feel framed (this stops the “bleed” feeling) */
.product-media-container {
  padding: clamp(18px, 2.5vw, 36px) !important;
  background: #f4e9e6 !important; /* your page color */
}

/* 4) Ensure the image stays contained and calm */
.product-media-container img,
.product-media-container video,
.product-media-container svg,
.product-media-container picture img {
  object-fit: contain !important;
  height: auto !important;
}

/* 5) Keep the right column (text) from feeling too wide */
.product-content-container {
  max-width: 32rem;           /* ~512px like Shiloh’s calm column */
  margin-left: auto;
  margin-right: auto;
}

/* 6) Optional: soften the “Add to cart” area spacing */
.product-content-container .product-block-area {
  gap: 22px !important;
}
/* ==============================
   HARD RESET: calm Shiloh layout
   ============================== */

/* 1. Constrain the entire product grid */
main .product,
main .product-section {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: clamp(24px, 5vw, 72px) !important;
}

/* 2. Force generous space between image + text */
main .product {
  column-gap: clamp(40px, 8vw, 120px) !important;
}

/* 3. CENTER + FRAME the IMAGE COLUMN ITSELF */
.product-media-container,
.product__media,
.product-media {
  max-width: 520px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: clamp(20px, 3vw, 40px) !important;
  background: #f4e9e6 !important;
}

/* 4. Stop image bleed completely */
.product-media-container img,
.product__media img,
.product-media img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  display: block;
}

/* 5. Calm the text column */
.product-content-container,
.product__info-wrapper {
  max-width: 34rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 6. Remove any sneaky borders */
.product-media-container,
.product__media,
.product-media {
  borde
/* Gentle space between image and content */
.product__media-wrapper {
  margin-right: 64px;
}

@media (max-width: 900px) {
  .product__media-wrapper {
    margin-right: 0;
    margin-bottom: 48px;
  }
}
/* Center the product layout and add breathing room */
.product,
.product-section,
.product__info-wrapper {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 40px;
  padding-right: 40px;
}
/* Calm, framed product images (Shiloh-style) */
.product-media-container,
.product__media-wrapper,
.product__media {
  padding: 48px;
  box-sizing: border-box;
  background: transparent;
}
/* Remove product grid borders (all products, all types) */
.border-b-gridline,
.border-gridline-color {
  border: none !important;
}
/* ===== CALM, CENTERED SHILOH-STYLE PRODUCT LAYOUT ===== */

/* Constrain entire product section */
.shopify-section:has(.ct-media-container) {
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

/* Balance the two columns */
.ct-media-container {
  max-width: 460px;
}

.product-content-container {
  max-width: 520px;
}

/* Center image inside its column */
.ct-media-container {
  display: flex;
  justify-content: center;
}

/* Add breathing room around image */
.ct-media-container img {
  padding: 24px;
  box-sizing: border-box;
}

/* Kill grid/border noise */
.border-b-gridline,
.border-gridline,
[class*="gridline"] {
  border: none !important;
}
/* ===== SHILOH-STYLE PRODUCT PAGE BALANCE ===== */

/* Center the entire product section */
.shopify-section {
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

/* Balance columns */
.ct-media-container {
  max-width: 460px;
  margin-left: auto;
  margin-right: auto;
}

.product-content-container {
  max-width: 520px;
}

/* Calm image presentation */
.ct-media-container img {
  display: block;
  margin: 0 auto;
  padding: 32px;
  box-sizing: border-box;
}

/* Remove visual grid/border noise */
.border-b-gridline,
.border-gridline,
[class*="gridline"] {
  border: none !important;
}
/* === STC: Shiloh-style spacing + kill gridline borders (TEST MARKER) === */
/* If you don't see this comment in DevTools > Sources > base.bundle.css, you're editing the wrong file/theme. */

/* 1) Remove the stray “gridline” borders showing up around menus / product / sections */
.border-b-gridline,
.border-gridline,
.border-gridline-color,
[class*="gridline"] {
  border: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

/* 2) Calm centered layout on product pages */
@media (min-width: 990px) {
  /* overall page container (your theme uses ct-media-container / product-content-container) */
  .ct-media-container,
  .product-content-container {
    max-width: 520px;         /* adjust: 480–620 */
    margin-left: auto;
    margin-right: auto;
  }

  /* give the whole product section breathing room */
  .product-section,
  .product {
    column-gap: clamp(32px, 5vw, 96px) !important;
    align-items: start;
  }
}

/* 3) Stop “image bleeding” and make it feel framed */
.ct-media-container {
  padding: clamp(16px, 3vw, 40px);
  box-sizing: border-box;
}

.ct-media-container img,
.ct-media-container picture,
.ct-media-container video,
.ct-media-container .media {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;   /* prevents weird cropping/bleed */
}

/* Optional: if something is forcing full-bleed */
.ct-media-container,
.product__media-wrapper,
.product-media-container {
  overflow: hidden;
}
