/** Shopify CDN: Minification failed

Line 135:2 Expected ":"
Line 137:2 Expected ":"
Line 138:2 Expected ":"
Line 139:2 Expected ":"
Line 140:2 Expected ":"
Line 143:2 Expected ":"
Line 146:2 Expected ":"
Line 147:2 Expected ":"
Line 148:2 Expected ":"
Line 149:2 Expected ":"

**/
/* Styling the Main Product Title */
.product__title {
  font-size: 27px !important;
  font-weight: bold !important;
  color: #58595b !important;
  margin-bottom: 0px !important;
} 

/* Adjusting the Category Line */
.product-category {
  font-size: 1.4rem;
  font-weight: 400;
  opacity: 0.7;
  margin-top: -2px !important; 
  margin-bottom: 5px;
} 

/* Reduces the structural space (gap) between all blocks */
#main-product .product__info-container {
  gap: 5px !important; 
} 

/* Forces all text and buttons in the product column to align left */
#main-product .product-information {
  text-align: left !important;
} 

/* Specific fix for elements that remain centered */
#main-product .product-form__buttons,
#main-product .price {
  justify-content: flex-start !important;
} 

/* Custom Price Styling and Tax Note Spacing */
.product-price-custom {
  font-weight: bold !important;
  font-size: 21px;
  margin-top: 10px !important;
  margin-bottom: 20px !important;
} 

/* Styling the Tax Note */
.tax-note-custom {
  font-size: 13px !important;
  font-weight: 400 !important;
  opacity: 0.7; 
  margin-top: -30px !important;
  margin-bottom: 10px !important;
}

/* --- VARIANT PICKER, SIZE CHART, AND SPACE FIXES (UNIFIED) --- */

/* 1. Combined rules for the variant picker container (Fixes space and link reference) */
.product__info-container .product-form__input {
  position: relative; /* Essential for positioning the link */
  display: block;
  padding-top: 0 !important; 
  margin-top: 0 !important; 
  margin-bottom: 5px !important; /* Reduced space below variants */
}

/* 2. Positioning the SIZE CHART link (Moves it next to the SIZE label) */
.product__info-container .size-chart-link {
  position: absolute;
  top: -55px; /* Use the calculated value for alignment */
  right: 0;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  z-index: 10;
}

/* 3. Aggressively pull the Quantity block up to eliminate the gap */
.product-information .quantity {
    margin-top: -30px !important; /* Forces the block to move upward by 30 pixels */
}

/* 4. Aggressively reduce space above the Quantity selector block (backup rule) */
#main-product .product-information > .shopify-block:nth-of-type(4) {
    padding-top: 0 !important;
}
/* --- New Quantity Dropdown Styling (Inline Layout) --- */

/* 1. Target the main wrapper and set it to Flexbox for horizontal alignment */
.quantity-wrapper {
    display: flex; 
    align-items: center; /* Vertically center the label and the dropdown */
    gap: 10px; /* Space between the "Quantity" text and the dropdown box */
    /* Remove unnecessary top/bottom margin from the wrapper itself */
    margin: 5px 0 10px 0; 
}

/* 2. Style the label to ensure it's displayed inline and correctly formatted */
.quantity-wrapper .form__label {
    display: block; 
    margin-bottom: 0; /* Remove bottom margin which causes spacing */
    font-weight: bold; 
    text-transform: uppercase;
    font-size: 14px;
}

/* --- New Quantity Dropdown Styling (Inline Layout) --- */

/* 1. Target the main wrapper and set it to Flexbox for horizontal alignment */
.quantity-wrapper {
    display: flex !important; 
    align-items: center !important; /* Vertically center the label and the dropdown */
    gap: 10px !important; /* Space between the "Quantity" text and the dropdown box */
    max-width: 150px !important; /* Limits the entire block's width */
    height: 40px !important;
    margin: 5px 0 15px 0 !important;
    
    /* Aggressively remove outer borders, shadows, and outlines */
    border: none !important;
    box-shadow: none !important;
    outline: none !important; 
}

/* 2. Target the inner container (.select) - AGGRESSIVELY REMOVE CONFLICTING SHADOW/BORDER */
.quantity-wrapper .select {
    /* Enforce size - REDUCED BY 10PX FROM 70PX TO 60PX */
    width: 60px !important; 
    max-width: 60px !important;
    min-width: 60px !important;
    height: 40px !important; 
    
    /* Apply rounded corners (for clipping/masking) */
    border-radius: 8px !important; 
    
    /* CRITICAL FIXES: ENSURE NO BORDER, SHADOW, OR OUTLINE */
    border: none !important; 
    box-shadow: none !important; 
    outline: none !important; 
    box-shadow: 0 0 0 transparent !important; 
    
    overflow: hidden !important; 
}

/* 3. Target the actual <select> element (.quantity-select) for final look */
.quantity-wrapper .select__select.quantity-select {
    width: 100% !important; /* Make it fill the container */  
    height: 40px !important; 
    
    /* Apply rounded corners directly to the select element */
    border-radius: 8px !important; 
    
    /* Set the required VISIBLE border */
    border: 2px solid #c7c7c7 !important; 
    
    /* Ensure no residual shadows or outlines */
    box-shadow: none !important;
    outline: none !important; 
    
    /* Padding for text alignment */
    padding: 8px 12px !important;
}
/* 3. Target the actual <select> element (.quantity-select) for final look and size */
.quantity-wrapper .select__select.quantity-select {
    /* ... existing size and padding styles ... */
    
    /* ADD NEW FONT STYLES HERE */
    font-size: 14px !important;       /* Example: New font size */
    color: #333333 !important;        /* Example: Dark gray color */
    font-weight: 600 !important;      /* Example: Bold weight */
    
    /* ... existing border/radius styles ... */
}

/* 4. Ensure the label is styled correctly */
.quantity-wrapper .form__label {
    display: block !important; 
    margin-bottom: 0 !important;
    font-weight: bold !important; 
    text-transform: uppercase !important;
    font-size: 14px !important;
}

/* 5. NEW RULE: Target the FOCUS state to remove any blue/theme shadow when clicked */
.quantity-wrapper .select:focus, 
.quantity-wrapper .select__select.quantity-select:focus {
    box-shadow: none !important;
    outline: none !important;
}

/* 6. FINAL FIX: REMOVE PSEUDO-ELEMENT SHADOW/BORDER (Common Shopify Issue) */
/* Targets the common ::after/::before elements on the wrapper and removes their content/display */
.quantity-wrapper .select::after,
.quantity-wrapper .select::before {
    display: none !important;
    content: none !important;
    box-shadow: none !important;
}

/* --- CUSTOM OVERRIDES: ROUNDED CORNERS --- */

/* Main Product Image Container */
.product__media-container .media { 
    border-radius: 20px !important; 
    overflow: hidden;
}

/* Thumbnail Containers and Images */
.product__media-list .product__media-item,
.product__media-list .product__media-item img {
    border-radius: 16px !important;
    overflow: hidden;
}

/* --- THUMBNAIL NAVIGATION BUTTONS (Targeted Fix) --- */

.slider-button {
    /* Set a fixed size and make it round */
    width: 30px !important; 
    height: 30px !important;
    border-radius: 50% !important; 
    
    /* Make it visible and centered */
    background-color: #ffffff !important; 
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); 
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    
    /* Ensure it has space (adjust margin as needed) */
    margin: 5px auto !important;
    
    /* Ensure z-index is high enough to be clickable */
    z-index: 10;
}
.slider-button svg {
    /* Set the color of the arrow icon (Change to your brand color if desired) */
    color: #000000 !important; 
    fill: currentColor !important; /* Ensures the SVG fills with the chosen color */
    
    /* Make the arrow icon bigger */
    width: 14px !important;
    height: 14px !important;
}

/* --- COMPLETE CTA BUTTON STYLING (ADD TO CART) --- */

.product-form__submit,
.button {
    /* 1. APPEARANCE & SHAPE (Only padding/spacing) */
    padding: 15px 30px !important; 
    border: none !important; /* Ensures the theme's border does not interfere */

    /* 2. COLOR */
    background-color: #E25601 !important; /* Set your desired background color (Deep Blue example) */
    color: #FFFFFF !important;             /* Set the text color for contrast (White text example) */

    /* 3. TYPOGRAPHY */
    text-transform: uppercase !important; /* FORCES TEXT TO FULL CAPS */
    font-size: 18px !important; /* Adjust this value (e.g., 16px for larger text) */
    font-weight: 600 !important; /* Sets the text weight (e.g., 600 for semi-bold) */

    /* Ensures the transition is smooth on click/hover */
    transition: background-color 0.3s ease;
}

/* Optional: Button hover state for interaction feedback */
.product-form__submit:hover,
.button:hover {
    /* Slightly darkens the button on hover */
    background-color: #bb4700 !important; 
}

/* --- ULTIMATE COLLAPSIBLE ROW STYLING FIX --- */

/* Targets the main container of the collapsible row for rounding and border */
/* Includes common classes used in many themes for this element */
.accordion__item,
.collapsible-row__item,
details { 
    /* Spacing and Border */
    margin-bottom: 10px !important; 
    border: 1px solid #e0e0e0 !important; /* Adds a soft border for definition */
    
    /* Rounded corners to match your theme aesthetic */
    border-radius: 8px !important; 
    overflow: hidden;
}

/* Styles the header/title button of the row (the text inside the button) */
.accordion__button,
.collapsible-row__button {
    /* Ensures the title text is visible and styled */
    text-transform: uppercase !important; /* FORCES TEXT TO FULL CAPS */
    font-size: 15px !important;
    font-weight: 500 !important;
    
    /* Adds padding and ensures the button is a visible block */
    padding: 15px !important; 
    display: block !important; 
}
/* Custom fix to remove extra lines on product page collapsible rows */
.accordion__item {
  border-top: none !important;
  border-bottom: none !important;
}

/* Optional: If the line is a very faint box-shadow/line around the whole section,
   add this as well. */
.accordion {
  border: none !important;
  box-shadow: none !important;
}
/* FIX: Force icon and text to display on the same line after liquid edit */
.summary_title {
  display: flex !important;
  align-items: center !important; /* Vertically centers the icon and text */
}

/* Ensure the heading text element is also aligned */
.accordion_title {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* REMOVE these width-related rules from your CSS file: */
.add-to-cart-aligned {
  width: 100% !important; 
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.free-shipping-banner {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* FINAL ATTEMPT: Force Height Increase via High-Priority Line-Height */
.free-shipping-banner span {
  /* Increase the vertical space between the text line */
  line-height: 2.5 !important; 
  /* Note: 2.5 is a very large value, which should visibly force the container open. */
}

/* Target all possible navigation elements */
.header nav *,
.header__inline-menu *,
.menu-drawer__navigation *,
header-menu * {
  border: none !important;
  outline: none !important;
}
/* Target everything in the header */
.header *,
.header button,
.header summary,
.header a,
.header [role="button"] {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}
[id*="featured_collection_njX47P"] .slider-button{margin:5px 50px!important}

.trust-badges-container{
  max-width:440px!important;
  width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
}
.trust-badges-container{
  border:1px solid #ddd!important;
}
.trust-badge::after{
  display:none!important;
}
.trust-badge:hover{
  transform:none!important;
  color:inherit!important;
}
.trust-badge:hover svg{
  fill:#555!important;
}

