/** Shopify CDN: Minification failed

Line 122:17 Expected identifier but found whitespace
Line 122:19 Unexpected "{"
Line 122:22 Expected ":"

**/
/* ===== Payment terms (shop app) ===== */
.installments {
  display: block !important;
  border: 1px solid #f0eeeb !important;
  padding: 2px 4px !important;
  margin-top: 2px !important;
  text-align: center !important;
  font-size: 14px !important;
}



/* ===== COPYRIGHT CONTENT ===== */
.copyright__content {
  text-transform: uppercase;
}


/* ===== Prevent bullet point from showing on meta fields with list type ===== */
ul, ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
li {
  list-style: none;
}

/* ===== Meta field lists, remove inset and bullet point. Insert , ===== */
.metafield-single_line_text_field-array {
    list-style: none !important; /* Remove bullets */
    padding-left: 0 !important; /* Override any padding */
    margin: 0; /* Remove extra margins */
    margin-block-end: 0em !important;
}
.metafield-single_line_text_field {
    display: inline;
}
.metafield-single_line_text_field::after {
  content: ", ";
}

.metafield-single_line_text_field:last-child::after {
  content: "";
}



/* ===== BREADCRUMBS ===== */
.breadcrumbs {
  margin: 1.5rem 0 2rem;
  font-size: 0.6rem;
  color: grey;
}

.breadcrumbs ol {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.breadcrumbs li {
  display: inline-flex;
  align-items: center;
}

.breadcrumbs a {
  color: rgba(var(--color-foreground), 0.85);
  text-decoration: none;
  text-transform: uppercase; /* Makes links uppercase */
  letter-spacing: 0.06rem;   /* Adds clean spacing for uppercase text */
}

.breadcrumbs a:hover {
  text-decoration: underline;
  color: black;
}

/* Separator using Dawn's inline flex alignment */
.breadcrumbs li:not(:last-child)::after {  
  content: "/";             /* Changed from › to / */
  display: inline-block;
  padding: 0 0.5rem;
  speak: none;
  font-size: 0.6rem;         /* Scaled down slightly to match the text size better */
  color: grey; /* Slightly softer color for a clean look */
}

/* Active page styling - unclickable styling */
.breadcrumbs [aria-current="page"] {
  color: grey;
  font-weight: 500;
  text-transform: uppercase; /* Makes the active final item uppercase */
  letter-spacing: 0.05rem;   /* Matches the link spacing */
}



/* ===== Product image rollover second image ===== */
.rollover-wrap {
    position: relative;
    height: 0;
    z-index: 2;
    pointer-events: none;
}
.rollover-img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: auto;
    aspect-ratio: {{ p.featured_media.preview_image.aspect_ratio | default: 1 }};
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.3s ease;
}
product-card:hover .rollover-img,
.product-card:hover .rollover-img {
    opacity: 1;
}



/* ===== Editorial block, prevents spaces at top and bottom of image on mobile when using imahe height full screen ===== */
@media screen and (max-width: 749px) {
  .media-block__media {
    height: auto !important;
  }
}







/* ===== Seperator line (artist and type used in card product) ===== */
.word-separator {
  margin: 0 5px; /* Equal spacing on both sides */
  border-left: 1px solid dimgray; /* Dim grey vertical line */ /*height: 1.6em;*/ /* Matches text height */
  height: 0.9em; /* Matches text height */
  display: inline-block;
  vertical-align: middle;
} /*Seperator line (artist and type used on product page)*/
.word-separator-less-margin {
  margin: 0 5px; /* Equal spacing on both sides */
  border-left: 1px solid lightgray; /* Light grey vertical line */
  height: 1.6em; /* Matches text height */
  display: inline-block;
  vertical-align: middle;
}



/* ===== Container styling for dimensions on product page ===== */
.product-custom-dimensions {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;         /* spacing between lines */
}

/* Each line as flex to vertically center text and icon */
.product-dim-line {
  display: flex;           /* flex container for text + icon */
  align-items: center;     /* vertically center text and icon */
  margin: 0;
}

/* Info icon styling (circle, centered 'i', aligned with text) */
.info-icon {
  position: relative;      /* fixes tooltip positioning */
  display: flex;           /* flex to center the 'i' perfectly */
  align-items: center;     
  justify-content: center; 
  width: 18px;                    
  height: 18px;
  border-radius: 50%;             
  background-color: #f9fafb;      /* light gray background */
  color: #111827;                 /* dark text */
  font-size: 11px;
  line-height: 1;                  
  text-align: center;
  cursor: pointer;
  border: 1px solid #d1d5db;     
  font-weight: normal;            
  margin-left: 6px;               
}

/* Tooltip styling (larger text, generous padding, no wrap on desktop) */
.info-tooltip {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  bottom: 130%;                 
  left: 50%;
  transform: translateX(-50%);
  background-color: #f9fafb;    
  color: #111827;               
  text-align: center;            /* center-align text */
  border-radius: 8px;
  padding: 14px 20px;           /* generous padding for readability */
  font-weight: 400;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  white-space: nowrap;          /* no wrapping on desktop */
  max-width: 200px;             /* prevent tooltip from getting too wide */
  transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
  z-index: 10;
}

/* Tooltip arrow (matches tooltip background) */
.info-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;                  
  left: 50%;
  margin-left: -6px;          
  border-width: 6px;
  border-style: solid;
  border-color: #f9fafb transparent transparent transparent;
}

/* Show tooltip on hover or focus with subtle upward motion */
.info-icon:hover .info-tooltip,
.info-icon:focus .info-tooltip {
  visibility: visible;
  opacity: 1;
  transform: translateX(-50%) translateY(-4px); /* subtle motion */
}

/* Responsive adjustments: allow wrapping and keep center alignment on small screens */
@media screen and (max-width: 400px) {
  .info-tooltip {
    /*white-space: normal;*/           /* allow wrapping only on small screens */
    /*text-align: center;*/            /* keep text centered when wrapping */
    max-width: 140px;
    padding: 12px 14px;
  }
}



/* ===== Inventory text on product page ===== */
.product__inventory {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}



/* ===== Product features on product page ===== */
.product-features {
}
.product-features-label {
  display: inline-block; /* Ensures proper spacing */
  font-size: 0.7rem;
  padding: 0.4rem 1.2rem;
  margin-right: 10px; /* Consistent spacing */
  margin-top: 5px;
  margin-bottom: 5px;
  vertical-align: middle; /* Aligns them properly */
  text-align: center;
  text-transform: uppercase;
  background-color: rgba(240, 240, 240, 1);
  color: black;
  overflow-wrap: break-word; /* Ensures proper text breaking */
  word-break: break-word; /* Fallback */
} /* Removes unnecessary left margin on the first label */
.product-features-label:first-child {
  margin-left: 0;
}
