/** Shopify CDN: Minification failed

Line 646:0 Unexpected "}"

**/

/* Completely hide Dawn's native quick-add modals to save memory and prevent conflicts */
.block__main-collection-grid quick-add-modal,
.block__main-collection-grid .quick-add-modal {
  display: none !important;
}

/* Custom Modal Base Styles */
#cb-custom-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(10, 22, 40, 0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  z-index: 999999998;
  opacity: 0;
  pointer-events: none;
  display: none;
  transition: opacity 0.3s ease;
}

#cb-custom-modal-overlay.cb-is-visible {
  display: block;
  opacity: 1;
  pointer-events: auto;
}

#cb-custom-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  width: 90vw;
  max-width: 1350px;
  height: 80vh;
  max-height: 90vh;
  background: var(--cb-paper, #ffffff);
  border-radius: 24px;
  z-index: 999999999;
  opacity: 0;
  pointer-events: none;
  display: none;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 20px 40px rgba(0,0,0,0.2);
  flex-direction: column;
  overflow: hidden;
}

.cb-modal-content {
  height: 100%;
}



#cb-custom-modal.cb-is-visible {
  display: flex;
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, -50%) scale(1);
}

.cb-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: transform 0.2s ease;
  padding: 0;
}

.cb-modal-close:hover {
  transform: scale(1.1);
}

.cb-modal-close svg {
  width: 36px;
  height: 36px;
}

.cb-modal-close circle {
  fill: #0a1628;
}

.cb-modal-close line {
  stroke: #ffffff;
}

.cb-modal-body {
  position: relative;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.cb-loading-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  border: 3px solid rgba(10, 22, 40, 0.1);
  border-top-color: #0a1628;
  border-radius: 50%;
  animation: cb-spin 1s linear infinite;
  z-index: 5;
}

/* On mobile, .cb-modal-body can collapse to height:auto with no content,
   so give it a minimum height while loading */
.cb-modal-body.cb-loading {
  min-height: 85vh;
}

@keyframes cb-spin {
  to { transform: rotate(360deg); }
}

@media screen and (max-width: 749px) {
  #cb-custom-modal {
    top: auto;
    bottom: 0;
    left: 0;
    transform: translateY(100%);
    width: 100vw;
    height: auto;
    border-radius: 24px 24px 0 0;
    max-height: 92vh;
  }
  #cb-custom-modal.cb-is-visible {
    display: flex;
    transform: translateY(0);
  }
  .cb-modal-body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    max-height: 92vh;
  }
}

/* =============================================================
   OceanBox — Curated Boxes Collection Premium Cards
   Targets Dawn's standard card-product classes
   Scoped to .block__main-collection-grid (the product grid wrapper)
   ============================================================= */

.block__main-collection-grid {
  --cb-ink: #0a1628;
  --cb-ink-soft: #2d4a6b;
  --cb-cream: #faf7f2;
  --cb-paper: #ffffff;
  --cb-sand: #ede6d9;
  --cb-line: rgba(10, 22, 40, 0.08);
  --cb-line-strong: rgba(10, 22, 40, 0.16);
  --cb-muted: #6d7278;
  --cb-coral: #E6740E;
  --cb-coral-dark: #cc650b;
  --cb-gold: #c9a961;

  --cb-display: "Fraunces", Georgia, "Times New Roman", serif;
  --cb-body: var(--font-body-family, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);

  background: var(--cb-cream) !important;
}

/* =============================================================
   GRID LAYOUT
   ============================================================= */
.block__main-collection-grid .product-grid {
  gap: 24px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

/* =============================================================
   CARD WRAPPER
   ============================================================= */
.block__main-collection-grid .card-wrapper {
  position: relative;
}

/* =============================================================
   CARD — main container
   ============================================================= */
.block__main-collection-grid .card,
.block__main-collection-grid .card--standard,
.block__main-collection-grid .card--card {
  background: var(--cb-paper) !important;
  border: 1px solid var(--cb-line) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: none !important;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.4s ease, box-shadow 0.4s ease !important;
}

@media (hover: hover) {
  .block__main-collection-grid .card:hover {
    transform: translateY(-6px) !important;
    border-color: var(--cb-line-strong) !important;
    box-shadow: 0 28px 56px rgba(10, 22, 40, 0.1) !important;
  }
}

/* Card inner — remove Dawn's default border/padding */
.block__main-collection-grid .card__inner {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 !important;
}

/* =============================================================
   CARD IMAGE
   ============================================================= */
.block__main-collection-grid .card__media {
  overflow: hidden !important;
  border-radius: 0 !important;
  margin: 0 !important;
  background: var(--cb-sand) !important;
}

.block__main-collection-grid .card__media .media {
  overflow: hidden !important;
}

.block__main-collection-grid .card__media img {
  object-fit: cover !important;
}

@media (hover: hover) {
  .block__main-collection-grid .card__media img {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
  }

  .block__main-collection-grid .card:hover .card__media img {
    transform: scale(1.04) !important;
  }
}

/* =============================================================
   CARD CONTENT
   ============================================================= */
.block__main-collection-grid .card__content {
  padding: 22px 22px 24px !important;
  background: var(--cb-paper) !important;
}

.block__main-collection-grid .card__information {
  padding: 0 !important;
  margin: 0 !important;
}

/* Badge / vendor — hide if not needed */
.block__main-collection-grid .card__badge {
  top: 14px !important;
  left: 14px !important;
  right: auto !important;
}

.block__main-collection-grid .card__badge .badge {
  background: var(--cb-ink) !important;
  color: var(--cb-paper) !important;
  border: none !important;
  border-radius: 100px !important;
  padding: 6px 14px !important;
  font-family: var(--cb-body) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
}

/* =============================================================
   PRODUCT TITLE — Fraunces
   ============================================================= */
.block__main-collection-grid .card__heading,
.block__main-collection-grid .card__heading a {
  font-family: var(--cb-display) !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  color: var(--cb-ink) !important;
  text-decoration: none !important;
  text-transform: none !important;
  margin: 0 0 8px !important;
}

.block__main-collection-grid .card__heading a:hover {
  color: var(--cb-ink-soft) !important;
}

/* Subtitle / vendor if shown */
.block__main-collection-grid .card .caption-with-letter-spacing {
  font-family: var(--cb-body) !important;
  font-size: 12px !important;
  color: var(--cb-muted) !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  margin-bottom: 6px !important;
}

/* =============================================================
   PRICE
   ============================================================= */
.block__main-collection-grid .price {
  margin: 10px 0 0 !important;
  padding: 0 !important;
}

.block__main-collection-grid .price-item,
.block__main-collection-grid .price-item--regular {
  font-family: var(--cb-display) !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  color: var(--cb-ink) !important;
  letter-spacing: -0.01em !important;
}

/* Compare-at / sale price */
.block__main-collection-grid .price--on-sale .price-item--regular {
  font-size: 16px !important;
  color: var(--cb-muted) !important;
  text-decoration: line-through !important;
  font-weight: 400 !important;
}

.block__main-collection-grid .price--on-sale .price-item--sale {
  font-family: var(--cb-display) !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  color: var(--cb-coral) !important;
}

/* "From" prefix */
.block__main-collection-grid .price .price__prefix {
  font-family: var(--cb-body) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--cb-muted) !important;
}

/* Unit price */
.block__main-collection-grid .unit-price {
  font-family: var(--cb-body) !important;
  font-size: 11px !important;
  color: var(--cb-muted) !important;
  margin-top: 4px !important;
}

/* =============================================================
   QUICK ADD BUTTON
   ============================================================= */
.block__main-collection-grid .quick-add {
  margin: 18px 0 0 !important;
  padding-top: 18px !important;
  border-top: 1px dashed var(--cb-line) !important;
}


.block__main-collection-grid .quick-add__submit {
  background: transparent !important;
  border: 1.5px solid var(--cb-ink) !important;
  border-radius: 100px !important;
  padding: 13px 20px !important;
  font-family: var(--cb-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: var(--cb-ink) !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-transform: none !important;
  box-shadow: none !important;
  min-height: 0 !important;
  height: auto !important;
}

.product-form__submit span,
.quick-add__submit.block__choose-option-btn {
  color: inherit !important;
}

.block__main-collection-grid .quick-add__submit:hover,
.block__main-collection-grid .quick-add button[type="submit"]:hover,
.block__main-collection-grid .card .button:hover {
  background: var(--cb-ink) !important;
  color: var(--cb-paper) !important;
  border-color: var(--cb-ink) !important;
}

.block_subscription-options {
  flex-direction: column !important;
}

@media (min-width: 750px) {
  .block_subscription-options>* {
    width: 100% !important;
  }
}

@media (min-width: 990px) {
  .product-grid .card-wrapper {
    padding: 0px !important;
  }
}

/* Loading spinner in button */
.block__main-collection-grid .quick-add .loading__spinner {
  color: var(--cb-ink) !important;
}

/* =============================================================
   PROMOTION BANNER (grid inline image)
   ============================================================= */
.block__main-collection-grid .block__promotion-banner .block__banner-main {
  border-radius: 16px !important;
  overflow: hidden !important;
}

/* =============================================================
   SORT / FILTER BAR
   ============================================================= */
.block__main-collection-grid .facets-wrapper {
  margin-bottom: 24px !important;
}

.block__main-collection-grid .facet-filters__sort,
.block__main-collection-grid select.select__select {
  font-family: var(--cb-body) !important;
  font-size: 13px !important;
  color: var(--cb-ink) !important;
  border: 1px solid var(--cb-line-strong) !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  background: var(--cb-paper) !important;
}

/* =============================================================
   PAGINATION
   ============================================================= */
.block__main-collection-grid .pagination .pagination__item a,
.block__main-collection-grid .pagination .pagination__item span {
  font-family: var(--cb-body) !important;
  font-size: 14px !important;
  color: var(--cb-ink-soft) !important;
  border-radius: 8px !important;
}

.block__main-collection-grid .pagination .pagination__item--current span {
  background: var(--cb-ink) !important;
  color: var(--cb-paper) !important;
}

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 990px) {
  .block__main-collection-grid .product-grid {
    gap: 14px !important;
  }

  .block__main-collection-grid .card__content {
    padding: 16px 16px 18px !important;
  }

  .block__main-collection-grid .card__heading,
  .block__main-collection-grid .card__heading a {
    font-size: 17px !important;
  }

  .block__main-collection-grid .price-item,
  .block__main-collection-grid .price-item--regular {
    font-size: 20px !important;
  }

  .block__main-collection-grid .quick-add {
    margin-top: 14px !important;
    padding-top: 14px !important;
  }
}

@media (max-width: 560px) {

  .block__main-collection-grid .card__heading,
  .block__main-collection-grid .card__heading a {
    font-size: 15px !important;
    line-height: 1.25 !important;
  }

  .block__main-collection-grid .price-item,
  .block__main-collection-grid .price-item--regular {
    font-size: 18px !important;
  }

  .block__main-collection-grid .card__content {
    padding: 14px 14px 16px !important;
  }

  .block__main-collection-grid .quick-add__submit,
  .block__main-collection-grid .quick-add button[type="submit"] {
    padding: 11px 16px !important;
    font-size: 12px !important;
  }
}

/* =============================================================
   CARD ADD TO CART BUTTON — unified style for curated boxes
   ============================================================= */

/* The add-to-bundle wrapper: outline style at all sizes */
.block__main-collection-grid .block__add-to-bundle {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 !important;
  background-color: transparent !important;
  border-radius: 100px !important;
  box-sizing: border-box !important;
}

/* The submit button itself — matches BYOB .ob-add-btn exactly */
.block__main-collection-grid .block__add-to-bundle .quick-add__submit,
.block__main-collection-grid .block__add-to-bundle .product-form__submit {
  display: flex !important;
  width: 100% !important;
  height: 46px !important;
  padding: 0 18px !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 1.5px solid var(--cb-ink, #0a1628) !important;
  border-radius: 100px !important;
  font-family: var(--cb-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: var(--cb-ink, #0a1628) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 0 !important;
  min-width: 0 !important;
  order: 1 !important;
  text-transform: none !important;
}

/* Button text — force ink color */
.block__main-collection-grid .block__add-to-bundle .quick-add__submit span,
.block__main-collection-grid .block__add-to-bundle .product-form__submit span {
  color: var(--cb-ink, #0a1628) !important;
  font-weight: 600 !important;
}

/* Hover: fill ink, text white — same as BYOB */
@media (hover: hover) {
  .block__main-collection-grid .block__add-to-bundle .quick-add__submit:hover,
  .block__main-collection-grid .block__add-to-bundle .product-form__submit:hover {
    background: var(--cb-ink, #0a1628) !important;
    background-color: var(--cb-ink, #0a1628) !important;
    color: #ffffff !important;
  }

  .block__main-collection-grid .block__add-to-bundle .quick-add__submit:hover span,
  .block__main-collection-grid .block__add-to-bundle .product-form__submit:hover span {
    color: #ffffff !important;
  }
}

/* Quantity input — outline style */
.block__main-collection-grid .block__add-to-bundle .block__quantity-input {
  border: 1.5px solid var(--cb-ink, #0a1628) !important;
  border-radius: 100px !important;
  background: transparent !important;
  background-color: transparent !important;
  padding: 10px 14px !important;
  max-width: 100px !important;
  order: 2 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.block__main-collection-grid .block__add-to-bundle .block__quantity-input .quantity_box {
  background: transparent !important;
  border: none !important;
  text-align: center !important;
  width: 24px !important;
  color: var(--cb-ink, #0a1628) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

.block__main-collection-grid .block__add-to-bundle .block__quantity-input a {
  color: var(--cb-ink, #0a1628) !important;
}

.block__main-collection-grid .block__add-to-bundle .block__quantity-input svg path {
  stroke: var(--cb-ink, #0a1628) !important;
}

/* =============================================================
   MOBILE GRID — force full-width single column
   ============================================================= */
@media (max-width: 749px) {
  .block__main-collection-grid .product-grid {
    grid-template-columns: 1fr !important;
    display: grid !important;
  }

  .block__main-collection-grid .grid__item {
    width: 100% !important;
    max-width: 100% !important;
  }

  .block__main-collection-grid .collection {
    padding: 0 16px !important;
  }
  }
}

/* Fix double-tap: remove Dawn's full-card link overlay.
   These invisible ::after pseudo-elements cover the entire card and intercept
   the first tap as a hover event on touch devices. */
.block__main-collection-grid .card__heading a::after,
.block__main-collection-grid .card--standard.card--text a::after,
.block__main-collection-grid .card--card .card__heading a::after {
  content: none !important;
  display: none !important;
}

/* Eliminate 300ms tap delay on all interactive elements */
.block__main-collection-grid .product__quick-view,
.block__main-collection-grid .product__quick-view button,
.block__main-collection-grid .product__quick-view modal-opener,
.block__main-collection-grid .quick-add,
.block__main-collection-grid .quick-add__submit,
.block__main-collection-grid .block__add-to-bundle,
.block__main-collection-grid .swiper-button-col {
  touch-action: manipulation !important;
}

/* Ensure all interactive elements are tappable on first touch */
.block__main-collection-grid .quick-add,
.block__main-collection-grid .quick-add__submit,
.block__main-collection-grid .block__add-to-bundle,
.block__main-collection-grid .card__content,
.block__main-collection-grid .swiper-button-col,
.block__main-collection-grid .product__quick-view,
.block__main-collection-grid .product__quick-view modal-opener,
.block__main-collection-grid .product__quick-view button {
  position: relative !important;
  z-index: 2 !important;
}

/* Fix mobile double-tap by disabling the hover state that hides the main image on touch devices */
@media (hover: none) {
  .block__main-collection-grid .product-card-wrapper .card__media:hover .media {
    opacity: 1 !important;
    visibility: visible !important;
  }
  .block__main-collection-grid .product-card-wrapper .card__media:hover .block__card-media-hover {
    opacity: 0 !important;
    visibility: hidden !important;
  }
}

/* Override Dawn's small-hide/medium-hide on curated boxes page
   so subscription options + prices always show (Dawn hides at <990px on collections) */
.block__main-collection-grid .block__card-product-recharge.small-hide,
.block__main-collection-grid .block__card-product-recharge.medium-hide,
.block__main-collection-grid .block__price.small-hide,
.block__main-collection-grid .block__price.medium-hide {
  display: block !important;
}

/* ==========================================================================
   SECTION: Multi-Select Filter Bar
   Replicates BYOB filter-tab aesthetic for the curated-boxes collection.
   Scoped to .block__main-collection-grid
   ========================================================================== */

/* Grid wrapper – position context & cream backdrop (matches BYOB pattern) */
.block__main-collection-grid {
  position: relative !important;
  background: var(--cb-cream) !important;
  z-index: 90 !important;
}

/* Filter strip */
.block__main-collection-grid .cb-filters {
  padding: 32px 0 32px !important;
  background: var(--cb-cream) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 95 !important;
  margin-bottom: 0 !important;
}

/* Inner flex row */
.block__main-collection-grid .cb-filters__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid var(--cb-line) !important;
}

/* Scrollable tab row */
.block__main-collection-grid .cb-filters__tabs {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  flex: 1 !important;
  -ms-overflow-style: none !important;
}

.block__main-collection-grid .cb-filters__tabs::-webkit-scrollbar {
  display: none !important;
}

/* Individual filter pill */
.block__main-collection-grid .cb-filter-tab {
  display: inline-flex !important;
  align-items: center !important;
  padding: 11px 20px !important;
  background: transparent !important;
  border: 1px solid var(--cb-line-strong) !important;
  border-radius: 100px !important;
  font-family: var(--cb-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--cb-ink-soft) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.25s ease !important;
  flex: 0 0 auto !important;
  line-height: 1 !important;
  text-decoration: none !important;
  letter-spacing: 0 !important;
}

.block__main-collection-grid .cb-filter-tab:hover {
  border-color: var(--cb-ink) !important;
  color: var(--cb-ink) !important;
}

.block__main-collection-grid .cb-filter-tab.active {
  background: var(--cb-ink) !important;
  border-color: var(--cb-ink) !important;
  color: var(--cb-paper) !important;
  font-weight: 600 !important;
}


/* ==========================================================================
   SECTION: Premium Quick-View Modal — Clean DOM Layout
   Our JS extracts images + info and builds .cb-layout > .cb-gallery + .cb-info
   ========================================================================== */

/* ---- 50/50 Layout Container -------------------------------------------- */
.cb-layout {
  display: flex;
  flex-direction: row;
  height: 100%;
  overflow: hidden;
}

/* ---- Gallery (left column) --------------------------------------------- */
.cb-gallery {
  flex: 0 0 48%;
  max-width: 48%;
  height: 100%;
  position: relative;
  /*background: #f5f1eb;*/
  border-radius: 24px 0 0 24px;
  overflow: hidden;
}

/* Slides — only active one is visible */
.cb-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.cb-slide.cb-slide-active {
  opacity: 1;
  pointer-events: auto;
  position: relative;
}

.cb-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ---- Arrows ------------------------------------------------------------ */
.cb-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--cb-paper, #ffffff);
  color: #0a1628;
  border: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  transition: transform 0.2s ease;
  padding: 0;
  opacity: 0.9;
}

.cb-arrow-prev { left: 16px; }
.cb-arrow-next { right: 16px; }

.cb-arrow:hover {
  transform: translateY(-50%) scale(1.1);
}

.cb-arrow svg {
  width: 14px;
  height: 14px;
  stroke: #0a1628;
  stroke-width: 2;
  fill: none;
}

/* ---- Dots -------------------------------------------------------------- */
.cb-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  position: absolute;
  bottom: 10%;
  left: 0;
  right: 0;
  z-index: 20;
}

.cb-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.45);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.cb-dot.cb-dot-active {
  background: #000000;
  transform: scale(1.35);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
}

/* ---- Info (right column) ----------------------------------------------- */
.cb-info {
  flex: 1 1 52%;
  max-width: 52%;
  height: 100%;
  padding: 36px 32px;
  overflow-y: auto;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}

/* Remove Dawn's grid classes that fight our flexbox */
.cb-info .grid,
.cb-info .grid--1-col,
.cb-info .grid--2-col-tablet {
  display: block !important;
  grid-template-columns: none !important;
}

/* Remove Dawn's page-width padding */
.cb-info .page-width {
  padding: 0 !important;
  max-width: none !important;
}

/* ---- Typography inside modal ------------------------------------------- */
#cb-custom-modal h1,
#cb-custom-modal .product__title h1 {
  font-family: var(--cb-display, "Fraunces", Georgia, serif) !important;
  font-weight: 500 !important;
  font-size: 28px !important;
  color: #0a1628 !important;
  line-height: 1.2 !important;
  margin: 0 0 8px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Show h1, hide Dawn's duplicate link title */
#cb-custom-modal .product__title > h1 { display: block !important; }
#cb-custom-modal .product__title > a { display: none !important; }

/* HR separator */
#cb-custom-modal hr {
  display: block !important;
  border: none !important;
  border-top: 1px dashed rgba(10, 22, 40, 0.08) !important;
  margin: 12px 0 !important;
}

/* Price */
#cb-custom-modal .price__regular .price-item--regular,
#cb-custom-modal .price .price-item {
  font-family: var(--cb-display, "Fraunces", Georgia, serif) !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  color: #0a1628 !important;
}

#cb-custom-modal .price--on-sale .price-item--sale {
  color: #E6740E !important;
  font-family: var(--cb-display, "Fraunces", Georgia, serif) !important;
  font-size: 28px !important;
  font-weight: 500 !important;
}

#cb-custom-modal .price--on-sale .price-item--regular {
  text-decoration: line-through !important;
  color: #6d7278 !important;
  font-size: 20px !important;
}

/* ---- Subscribe & Save -------------------------------------------------- */
#cb-custom-modal input[type="radio"] {
  accent-color: #0a1628 !important;
}

#cb-custom-modal .delivery-frequency-option,
#cb-custom-modal [class*="frequency"] button,
#cb-custom-modal [class*="frequency"] label {
  border-radius: 100px !important;
  border: 1px solid rgba(10, 22, 40, 0.16) !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #2d4a6b !important;
  background: transparent !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
}

#cb-custom-modal .delivery-frequency-option:hover,
#cb-custom-modal [class*="frequency"] button:hover,
#cb-custom-modal [class*="frequency"] label:hover {
  border-color: #0a1628 !important;
  color: #0a1628 !important;
}

#cb-custom-modal .delivery-frequency-option.active,
#cb-custom-modal .delivery-frequency-option.selected,
#cb-custom-modal [class*="frequency"] button.active,
#cb-custom-modal [class*="frequency"] label.active,
#cb-custom-modal [class*="frequency"] input:checked + label {
  background: #0a1628 !important;
  border-color: #0a1628 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* ---- Add to Cart button ------------------------------------------------ */
#cb-custom-modal .product-form__submit,
#cb-custom-modal .product-form__submit.button,
#cb-custom-modal .product-form__submit.button--primary,
#cb-custom-modal .product-form__submit.button--secondary,
#cb-custom-modal button[name="add"],
#cb-custom-modal .product-form__buttons .button {
  display: flex !important;
  width: 100% !important;
  height: 46px !important;
  padding: 0 18px !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 1.5px solid #0a1628 !important;
  border-radius: 100px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: #0a1628 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 0 !important;
  text-transform: none !important;
  min-height: 0 !important;
  box-shadow: none !important;
  --alpha-button-background: 0 !important;
  --color-button: none !important;
}

#cb-custom-modal .product-form__submit::before,
#cb-custom-modal .product-form__submit::after,
#cb-custom-modal .product-form__buttons .button::before,
#cb-custom-modal .product-form__buttons .button::after {
  content: none !important;
  display: none !important;
}

#cb-custom-modal .product-form__submit span {
  color: #0a1628 !important;
  font-weight: 600 !important;
  position: relative !important;
  z-index: 2 !important;
}

@media (hover: hover) {
  #cb-custom-modal .product-form__submit:hover,
  #cb-custom-modal .product-form__submit.button:hover,
  #cb-custom-modal button[name="add"]:hover,
  #cb-custom-modal .product-form__buttons .button:hover {
    background: #0a1628 !important;
    background-color: #0a1628 !important;
    border-color: #0a1628 !important;
    color: #ffffff !important;
  }

  #cb-custom-modal .product-form__submit:hover span {
    color: #ffffff !important;
  }
}

/* Hide dynamic checkout / Shop Pay */
#cb-custom-modal .shopify-payment-button {
  display: none !important;
}

/* ---- Mobile (≤749px) — bottom-sheet, stacked layout -------------------- */
@media screen and (max-width: 749px) {
  .cb-layout {
    flex-direction: column;
    height: 85vh;
    overflow: visible;
  }

  .cb-gallery {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    height: 100vw;
    min-height: 240px;
    border-radius: 24px 24px 0 0;
  }
  .cb-slide img {
    object-fit: cover;
  }

  .cb-info {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    height: auto;
    padding: 20px 16px 40px;
    overflow-y: visible;
  }

  #cb-custom-modal h1,
  #cb-custom-modal .product__title h1 {
    font-size: 22px !important;
  }

  #cb-custom-modal .price__regular .price-item--regular,
  #cb-custom-modal .price .price-item,
  #cb-custom-modal .price--on-sale .price-item--sale {
    font-size: 22px !important;
  }

  .cb-arrow {
    width: 34px;
    height: 34px;
  }

  .cb-arrow-prev { left: 8px; }
  .cb-arrow-next { right: 8px; }
}

/* ---- Tablet (750–900px) — stacked ---- */
@media screen and (max-width: 900px) and (min-width: 750px) {
  .cb-layout {
    flex-direction: column;
    height: auto;
    overflow-y: auto;
  }

  .cb-gallery {
    flex: none;
    width: 100%;
    max-width: 100%;
    max-height: 50vh;
    border-radius: 24px 24px 0 0;
  }

  .cb-info {
    flex: none;
    width: 100%;
    max-width: 100%;
    padding: 24px 20px;
    height: auto;
    overflow-y: visible;
  }
}

/* ---- Elements to hide inside modal ------------------------------------- */
#cb-custom-modal .quick-add-hidden,
#cb-custom-modal .product__description,
#cb-custom-modal .product__text.caption-with-letter-spacing,
#cb-custom-modal .icon-with-text,
#cb-custom-modal .block__list-slider,
#cb-custom-modal .accordion,
#cb-custom-modal .product__accordion {
  display: none !important;
}

/* ---- View Full Details link -------------------------------------------- */
.cb-view-details {
  display: block;
  text-align: center;
  padding: 14px 24px;
  margin-top: 20px;
  font-family: var(--font-body-family, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #0a1628;
  text-decoration: none;
  border: 1.5px solid #0a1628;
  border-radius: 100px;
  transition: all 0.25s ease;
  box-shadow: none;
  text-transform: none;
}

.cb-view-details:hover {
  background: #0a1628;
  color: #ffffff;
}
