/** Shopify CDN: Minification failed

Line 275:4 Unexpected "#3d-viewer-container"

**/
media-gallery.starapps ul.product__media-list li[id$="-viewer"] { width: 100%; }
  li[id$="-viewer"] iframe { display:block; width:100%; height:100%; border:0; }
  .product__info-container>*+*{
    margin: 0;
  }

  variant-selects[id*="variant-selects-template"]  fieldset,
  variant-selects[id*="variant-selects-template"] div.olvr-step[style="display:none"] fieldset,
  .gpo-options-group .gpo-element,
  .gpo-group__childs .gpo-element,
  variant-king-combined-listing fieldset legend .swatch-label
  /* variant-selects fieldset legend.form__label */
  {
    opacity: 0;
    height: 1px;
    width: 1px;
  }
  variant-king-combined-listing fieldset legend .swatch-label,
  variant-selects fieldset legend.form__label{
    font-size: 0;
  }
  .product__info-container{
      display: flex;
      flex-direction: column;
      position: relative;
      justify-content: flex-end;
      width: 100%;
      padding-bottom: 20px;
      min-height: 240px;
      height: 100%;
      max-height: 240px;
      /* CLS FIX: */
      
  }

  @media screen and (min-width: 750px) {
    .product__info-container{
      /* Info band raised 240 -> 288px (matches the grid row in main-product).
         The base rule caps this at max-height:240px; Step 1's collection + style
         swatches reached that cap and collided with the pinned "Diamond Shape"
         nav pill. The extra 48px drops the pinned pill clear of the swatches. */
      min-height: 288px;
      max-height: 288px;
      display: grid;
      justify-content: unset;
      /* Anchor the step content (heading + options) to the TOP of the info
         band. Was align-items:end; in practice the rows already packed
         at the top, so this just makes that explicit and deterministic now
         that the nav below is taken out of flow. */
      align-items: start;
      align-content: start;   /* pack rows at the top; don't stretch them */
      position: relative;     /* positioning context for the pinned nav */
    }

    /* ---- Pinned step nav ------------------------------------------------
       Keep the Prev/Next pill row at a CONSTANT height near the bottom of
       the info band instead of letting it ride down with the options above
       it. Previously the nav sat in normal flow after the options, so tall
       steps (Step 1 collection swatches, Step 5 engraving field) pushed it
       down — into the summary bar on Step 1, and to an inconsistent height
       on Step 5. Pinning it here means the gap between the step heading and
       the nav is identical on every step; any per-step height difference is
       absorbed as whitespace above the nav. 20px == the band's own bottom
       padding, i.e. the same spot the "good" middle steps already used. */
    .product__info-container > .product-steps-nav{
      position: absolute;
      left: 0;
      right: 0;
      /* Dropped from 20px so the pill clears the tall Step 1 swatch row.
         Applies to every step (they all shift down by the same amount, so
         the heading-to-nav gap stays constant). This is the single knob:
         lower value = pill lower / closer to the summary bar. */
      bottom: 4px;
      margin-inline: auto;    /* keep the centered max-content pill row */
      /* The step content (.olvr-step) carries z-index:999999, so where the
         Step 1 swatches overlap the pill they'd otherwise capture the click.
         Sit the nav just above it so the pill is always clickable, even if a
         few px of overlap remain. */
      z-index: 1000000;
    }
  }

  .gpo-group__wrapper .gpo-group__childs{
    display: block;
  }

  .gpo-group__wrapper .gpo-group__childs .show-addon-for-input{
    max-width: 300px;
    margin: 0 auto;
  }

  variant-selects[id*="variant-selects-template"]  .product-step fieldset,
  variant-selects[id*="variant-selects-template"]  .olvr-step fieldset,
  .olvr-step .gpo-options-group .gpo-element,
  .gpo-group__childs .olvr-step  .gpo-element,
  variant-selects fieldset .olvr-step[style="display:block"] legend.form__label
  {
    opacity: 1;
    height: auto;
    width: auto;
  }

  /* variant-king-combined-listing .swatch-single fieldset > div{
    line-height: 0;
    height: 1px;
  } */


  variant-king-combined-listing .swatches{
    margin-top: 0;
  }

  .product-form__submit {
    pointer-events: none;
    height: 1px;
    width: 1px;
    padding: 0;
    margin: 0;
    font-size: 0;
    min-height: auto;
    border: 0;
    background: none;
    visibility: hidden;
  }

  slider-component:not(.thumbnail-slider){
    margin: 0 auto;
  }

  .product__info-wrapper{
    padding-left: 0;
  }

  .product-step,
  .olvr-step {
    display: none;
  }
  .product-step.active {
    display: block;
  }

  /* .with-gallery__section:before{
    content: none;
  } */
  .product-steps-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: max-content;
    margin: 0 auto;
    gap: 12px;
    /* order: -1; */
    /* CLS FIX: */
    min-height: 50px;
  }

  .product-steps-indicator > div{
    font-size: 14px;
    text-transform: none;
    font-weight: inherit;
  }

  .product-steps-nav button {
    background: none; border: none; font-size: 16px; font-weight: 600;
    padding: 8px; transition: opacity 0.2s; color: #000;
    cursor: pointer;
    background: #000;
    color: #fff;
    height: 35px;
    min-width: 35px;
    border-radius: 25px;
    padding: 0px 9px;
    transition: transform .5s ease-in-out;
    font-family: "Inter", sans-serif;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
  }

  .product-steps-nav button.enabled { opacity: 1; }
  .product-steps-nav button:disabled { opacity: 0.3; cursor: not-allowed; }

  .product-steps-nav .olvr-final-submit{
    background-color: #a48b70;
  }


  /* OLVR tooltip — warm card, opens ABOVE the icon.
     Desktop: hover. Mobile: tap (toggles .is-open via JS). */
  .tooltip-icon {
    position: relative;
    display: inline-flex;
    cursor: pointer;
  }

  .tooltip-icon::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%) translateY(6px);
    width: max-content;
    max-width: 300px;
    background: #faf7f2 !important;
    border: 0.5px solid #e4d8c5;
    border-left: 2px solid #c9a96e;
    border-radius: 8px;
    box-shadow: 0 8px 28px rgba(120, 95, 55, 0.16);
    padding: 14px 16px;
    font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
    font-size: 13.5px;
    font-weight: 400;
    line-height: 1.6;
    color: #5a5048 !important;
    text-align: left;
    white-space: normal;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: 1000000;
  }

  @media screen and (min-width: 750px) {
    .tooltip-icon:hover::after {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
    }
  }

  @media screen and (max-width: 749px) {
    .tooltip-icon.is-open::after {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
    }
    .tooltip-icon::after {
      max-width: 240px;
      font-size: 13px;
      padding: 12px 14px;
    }
  }

  #step-next svg,
  #step-prev svg{
    position: relative;
    /* top: 2px */
  }

  @media screen and (min-width: 750px) {
    #step-next svg,
    #step-prev svg{
      /* top: 2px */
    }
  }


  .product__info-wrapper .product__info-container .price{
    display: none;
  }


  @media screen and (min-width: 750px) {
    .product__info-wrapper {
      /* min-height: 260px */
    }

    #3d-viewer-container {
      position: relative; 
    }

    .disable-mobile-3d-scroll {
      position: absolute;
      right: 30%;
      bottom: 40px;
      top: auto;
      z-index: 2;
    }

    .disable-mobile-3d-scroll span.text {
      display: none;
    }

    .disable-mobile-3d-scroll img {
      max-width: 30px;
    }

    .gpo-canvas-container {
      display: none;
    }

    

  }
  

  @media screen and (max-width: 749px) {
    /* Full-area tap target stays — it captures the tap to unlock rotation.
       But it's invisible; only the small corner badge shows. */
    .disable-mobile-3d-scroll {
        position: absolute;
        bottom: 0;
        right: 0;
        z-index: 2;
        pointer-events: none;
        display: block;
    }

    /* The visible cue: a small frosted circle tucked in the bottom-right */
    .disable-mobile-3d-scroll > span {
        position: absolute;
        bottom: 16px;
        right: 16px;
        background: rgba(255, 255, 255, 0.7);
        -webkit-backdrop-filter: blur(6px);
        backdrop-filter: blur(6px);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
        width: 40px;
        height: 40px;
        padding: 0;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .disable-mobile-3d-scroll span img {
        height: 22px;
        opacity: 0.75;
    }

    .disable-mobile-3d-scroll.active {
        position: static;
        display: none;
    }
}
   @media screen and (max-width: 480px) {
    product-info{
      /* height: 100vh; */
    }
  }
.product__info-container .product-steps-nav{
  opacity: 0;
  visibility: hidden;
}
.product__info-container > .olvr-step ~ .product-steps-nav {
  opacity: 1;
  visibility: visible;
}
.product__info-wrapper .gpo-app,
.product__info-wrapper .gpo-group,
body .product__info-container .product-form, 
body .product__info-container .product__description,
body .product__info-container .icon-with-text{
  margin-top: 0;
  margin-bottom: 0;
}
.gpo-input-wrap{
  margin-bottom: 20px;
}


/* @font-face {
  font-family: "Garamond";
  src: url({{ 'Garamond.woff2' | asset_url }}) format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Monotype Corsiva";
  src: url({{ 'MTCORSIVA.woff2' | asset_url }}) format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Gotham";
  src: url({{ 'GothaProBol.woff2' | asset_url }}) format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
} */

/**/
/* Classic */
.gpo-options-group:has(#radio-2_1:checked) 
  [data-element-id="text-1"] input {
    font-weight: 300;
    font-family: "Garamond Custom", serif;
}

/* Modern */
.gpo-options-group:has(#radio-2_2:checked) 
  [data-element-id="text-1"] input {
    font-weight: 400;
    font-family: "Helvetica Custom", sans-serif;
}

/* Script */
.gpo-options-group:has(#radio-2_3:checked) 
  [data-element-id="text-1"] input {
    font-style: italic;
    font-weight: 500;
    font-family: "Corsiva Custom", cursive;
}

/* Bold */
.gpo-options-group:has(#radio-2_4:checked) 
  [data-element-id="text-1"] input {
    font-family: "Gotham Custom", sans-serif;
    font-weight: 700;
}
/**/

button#step-prev:not([disabled]):hover {
    transform: translateX(-3px)
}
button#step-next:hover {
    transform: translateX(3px)
}

.product__summary-block {
  height: 120px;
  display: block!important;
  background: #000;
  box-shadow: 43vw 0 0 0 #000, -43vw 0 0 0 #000;

  margin-top: auto;
}

@media screen and (max-width: 480px) {
  .product__summary-block {
    height: 100px;
  } 
}



.olvr-summary-block {
    min-height: 120px;
    background: #000;
    color: #fff;
    padding: 16px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 999999;
    font-family: inherit;
    width: 100%;
    box-shadow: 42vw 0 0 0 #000, -42vw 0 0 0 #000;
}

/* Relocated shipping + Shop Pay installments (moved here from the price block by product-steps.js) */
.olvr-summary-block .product__tax,
.olvr-summary-block form.installment {
  margin: 4px 0 0;
  padding: 0;
  font-size: 13px;
  line-height: 1.4;
  opacity: 0.9;
  color: #fff;
}

.olvr-summary-block .product__tax,
.olvr-summary-block .product__tax *,
.olvr-summary-block form.installment,
.olvr-summary-block form.installment * {
  color: #fff !important;
}

.olvr-summary-block .product__tax a,
.olvr-summary-block form.installment a {
  text-decoration: underline;
}

@media screen and (max-width: 480px) {
  .olvr-summary-block {
    height: auto;
    padding: 11px 0px;
  } 
}

.header.is-product-page {
  padding-top: 0;
  padding-bottom: 0;
}

.header.is-product-page .header__heading-logo-wrapper img:first-child {
  max-height: 70px;
}

@media screen and (max-width: 480px) {
  .header.is-product-page .header__heading-logo-wrapper {
    display: flex;
    gap: 5px;
  }
  .header.is-product-page .header__heading-logo-wrapper img:first-child {
    max-height: 45px;
  }
}

.olvr-step {
    position: relative;
    z-index: 999999;
}

.swatch-options-wrapper.swatch-options-wrapper__center-stone .swatch-button:first-child .variant-label,
.swatch-options-wrapper.swatch-options-wrapper__hidden-stone .swatch-button:first-child .variant-label{
  padding-left: 0!important;
} 


/* Show More Styles */
.gpo-oos--show .gpo-hidden-size {
  display: none !important;
}

.gpo-oos--show.gpo-expanded .gpo-hidden-size {
  display: inline-flex !important;
}

.gpo-show-more-btn {
  background: none;
  cursor: pointer;
  font-size: 14px;
  width: auto;
  padding: 0 0 3px;
  height: auto;
  border: none;
  margin: 0;
  border-radius: 0;
  display: flex;
  align-items: end;
  gap: 3px;
  transition: all 0.2s;
  font-family: Inter, serif;
}

.gpo-show-more-count {
  opacity: 0.7;
  font-size: 12px;
}

/* Summary Block Styles */
.olvr-summary-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.olvr-summary-title {
  font-weight: 700;
  font-size: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.olvr-summary-options {
  font-size: 14px;
  opacity: 0.9;
  font-weight: 300;
}

.olvr-summary-price {
  font-size: 16px;
  font-weight: 200;
}

.olvr-summary-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}

@media screen and (max-width: 480px) {
  .olvr-summary-title {
    font-size: 14px;
  }

  .olvr-summary-options {
    font-size: 13px;
  }

  .olvr-summary-price {
    font-size: 14px;
    font-weight: 300;
  }
}

.olvr-share-btn {
  background: none;
  border: none;
  color: #fff;
  cursor: pointer;
  padding: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'Inter', serif;
  font-weight: 500;
}

@media screen and (max-width: 480px) {
  .olvr-share-btn {
    flex-direction: column-reverse;
    gap: 6px;
  }
}

.olvr-share-btn svg {
  width: 20px;
  height: 20px;
}

.olvr-sold-out-label {
  background: #dc2626;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  text-transform: uppercase;
}

.variant-option-title {
  pointer-events: auto;
}

.variant-option-title * {
  pointer-events: none;
}

.variant-option-title .tooltip,
.variant-option-title [class*="tooltip"] {
  pointer-events: auto;
}

/**/

  .ring-details-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: 0;
  border-top: 0.5px solid rgba(0, 0, 0, 0.15);
  color: #000;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  white-space: nowrap;
  /* Visually separate from the thumbnail strip above */
  margin-top: 12px;
  padding: 12px 4px 4px;
  letter-spacing: 0.02em;
  transition: opacity 0.2s ease;
}

.ring-details-btn:hover {
  opacity: 0.6;
}

.ring-details-btn svg {
  transition: transform 0.3s ease;
}

.ring-details-btn:hover svg {
  transform: translateX(4px);
}

@media screen and (max-width: 480px) {
  .ring-details-btn svg {
    transform: translateX(4px) rotate(90deg);
    transition: unset;
  }
  .ring-details-btn:hover svg {
    transform: translateX(4px) rotate(90deg);
  }
}

@media screen and (max-width: 749px) {
  .ring-details-btn {
    display: none !important;
  }
}

  .modal-product-description {
    display: none;
    position: absolute;
    z-index: 10000;
    right: 0;
    top: 0;
    height: 100%;
    overflow: auto;
    animation: fadeIn 0.3s ease;
    width: 320px;
  }

  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  .modal-product-description.active {
    display: block;
  }

  .modal-content {
    background-color: #f5f5f5;
    padding: 40px 25px 40px 55px;
    height: 100%;
    border-radius: 20px;
  }

  .modal-close {
    position: absolute;
    left: 20px;
    top: 20px;
    border: none;
    background: none;
    cursor: pointer;
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease;
  }

  .modal-close:hover {
    transform: rotate(90deg);
  }

  .modal-close svg {
    color: #000;
  }

  .modal-body {
    color: #000;
    line-height: 1.6;
  }

  .modal-body h3 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
  }

  .modal-body p {
    margin-bottom: 15px;
    font-size: 14px;
  }

  .mobile-only {
    display: none;
  }

  @media (max-width: 768px) {
    .modal-product-description {
      display: none !important;
    }

    .modal-description.mobile-only {
      display: block;
      padding: 20px 30px;
      margin-top: 20px;
      margin-bottom: 30px;
      background-color: #eeeef3;
      height: 100%;
      border-radius: 10px;
    }
  }

/* =====================================================
   Ring builder — Inter font enforcement
   Forces 'Inter' across every wizard step's UI: labels,
   option swatches, GPO inputs, nav buttons (Prev/Next),
   and the bottom summary block.
   The engraving live-preview rules above (Classic /
   Modern / Script / Bold, ~lines 309-335) keep their
   bespoke fonts because their :has() selectors carry
   higher specificity than this declaration.
   ===================================================== */
.product__info-container,
.product__info-container *,
.product-steps-nav,
.product-steps-nav *,
.olvr-summary-block,
.olvr-summary-block * {
  font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
}

.olvr-step-count {
  display: inline;
  font-size: 13px;
  font-weight: 400;
  color: #999;
  margin-left: 8px;
  letter-spacing: 0.02em;
  font-family: 'Inter', sans-serif;
  white-space: nowrap;
}

/* Step 1: the header (.swatch-option-name) is a flex container holding
   the title text + info tooltip. Force it to stay on one line so the
   counter sits beside the text instead of wrapping below. */
.olvr-step .swatch-option-name {
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
}
/* =====================================================
   Ring builder — mobile: don't clip the step heading
   On mobile the info band keeps the base rule's 240px cap
   and bottom-anchoring (justify-content: flex-end). On the
   two tall steps — Step 1 (Collections + Styles rows) and
   Step 5 (font tabs + engraving input) — the content is
   taller than 240px, so the overflow spills off the TOP of
   the band and the heading ("Choose ring collection…",
   "Add engraving") disappears up behind the thumbnail strip.
   Lifting the cap lets those steps grow downward to fit, so
   the heading always sits just below the thumbnails. Shorter
   steps (2–4) are under 240px and are unaffected.
   ===================================================== */
@media screen and (max-width: 749px) {
  .product__info-container {
    max-height: none;

    /* Collapse the band's artificial empty space. The base rule's
       min-height:240 + bottom-anchoring dumped leftover height as gaps
       (above the heading AND between the last option and the nav) on the
       shorter steps. Sizing to content and top-anchoring makes the heading
       hug the thumbnails and removes those forced gaps; the two knobs below
       then trim what's left. */
    min-height: 0;
    justify-content: flex-start;

    /* Gap B (part 1): trim the space below the nav, before the summary. */
    padding-bottom: 8px;
  }

  /* Gap A — pull the Next-step CTA up toward the option set above it.
     Negative margin is source-agnostic: it claws back the whitespace no
     matter which option element is contributing it. Knob: the -30px — ease
     toward -20 if Step 5's engraving field feels tight, push toward -45 for
     tighter. */
  .product__info-container > .product-steps-nav {
    margin-top: -30px;
  }

  /* Gap B (part 2): tighten the gap between the CTA and the black summary
     banner. Works with the reduced padding-bottom above. Knob: -12px. */
  .product__summary-block {
    margin-top: -12px;
  }

  /* Thumbnails ~25% smaller (~77px → ~58px) to reclaim strip height.
     Best-effort against Dawn's slider thumbnail item; !important so it wins
     over the gallery's own sizing. If they DON'T shrink, the strip is being
     sized by the StarApps gallery under different class names — send
     component-media-gallery.css (or the class off one thumbnail in inspector)
     and I'll target it exactly. Knob: 58px. */
  .product__media-wrapper .thumbnail-list__item {
    width: 58px !important;
    max-width: 58px !important;
    flex: 0 0 58px !important;
  }

  /* Center the (now narrower) thumbnail strip instead of letting it sit
     left-aligned with empty space on the right. */
  .product__media-wrapper .thumbnail-list {
    justify-content: center !important;
  }
}