/** Shopify CDN: Minification failed
Line 2960:0 Unexpected "<"
Line 2967:2 Unexpected "<"
Line 9722:8 Expected identifier but found whitespace
Line 9722:10 Unexpected "{"
Line 9722:19 Expected ":"
Line 10231:25 Unexpected "{"
Line 10231:34 Expected ":"
Line 10237:25 Unexpected "{"
Line 10237:34 Expected ":"
Line 10246:25 Unexpected "{"
... and 68 more hidden warnings
**/
/* ==========================================================================
MERGED GLOBAL STYLESHEET
==========================================================================
Source order:
1. Base stylesheet.css
2. TolyUpdates.css integrated after base stylesheet to preserve override
cascade and existing behavior.
Hygiene approach:
- All CSS from both files is preserved.
- The base stylesheet remains first.
- TolyUpdates remains after the base stylesheet because it is an override
layer and previously depended on loading later.
- TolyUpdates is grouped as the project override layer, with its existing
purpose-based sections and viewport-specific rules preserved.
- No selectors, properties, values, or media-query rules have been deleted.
========================================================================== */
/*
* Testament Shopify theme
* Copyright 2024, We are Underground
* www.weareunderground.com
*/
/* ==========================================================================
CODE HYGIENE PASS - ORGANIZED GLOBAL STYLESHEET
==========================================================================
Purpose:
- Preserve all existing selectors, declarations, and behavior.
- Add clearer section structure for maintenance.
- Prepare the stylesheet for future desktop-specific expansion.
Responsive consolidation:
- Existing mobile/tablet max-width rules using 739px, 740px, and 749px
have been normalized to the shared mobile/tablet breakpoint of 980px.
- Existing explicit tablet ranges and desktop min-width rules are preserved.
- Third-party/library internals are left intact unless already using the
project breakpoint.
Notes:
- Duplicate declarations and repeated selectors are intentionally preserved.
- Cascade-sensitive ordering has not been manually inverted or simplified.
========================================================================== */
*,
*:before,
*:after {
box-sizing: border-box;
}
* {
margin: 0;
}
@media (pointer: coarse) {
*:focus {
outline: none;
}
}
/* ==========================================================================
FOUNDATION: RESET, BOX MODEL, AND GRID SYSTEM
========================================================================== */
/* --------------------------------------------------------------------------
CSS grid
-------------------------------------------------------------------------- */
.grid__wrapper {
margin: 0 auto;
padding-left: 3%;
padding-right: 3%;
max-width: 92%;
display: grid;
grid-column-gap: 1rem;
grid-row-gap: 1rem;
grid-template-columns: repeat(12, 1fr);
grid-template-rows: auto;
font-size: var(--font-size);
}
.grid__wrapper-nest {
display: grid !important;
}
.grid__wrapper.aflow {
grid-auto-flow: dense;
}
.grid__wrapper.narrow {
padding-left: 7%;
padding-right: 7%;
}
.grid__wrapper.full {
padding-left: 1.25%;
padding-right: 1.25%;
max-width: unset;
width: 100%;
}
.grid__wrapper.edge {
padding-left: 0;
padding-right: 0;
margin-left: 0;
margin-right: 0;
width: 100%;
max-width: unset;
}
@media (min-width: 980px) {
.grid__wrapper--five-columns {
grid-template-columns: repeat(5, 1fr);
}
}
.grid__wrapper > .first {
order: 1;
}
.grid__wrapper > .last {
order: 2;
}
/* --------------------------------------------------------------------------
5 column grid
-------------------------------------------------------------------------- */
@media screen and (min-width: 741px) {
.grid__wrapper.five--columns {
grid-template-columns: repeat(5, 1fr);
}
}
.span-1 {
width: 8.3333333%;
}
.span-2 {
width: 16.666666%;
}
.span-3 {
width: 25%;
}
.span-4 {
width: 33.333333%;
}
.span-5 {
width: 41.666666%;
}
.span-6 {
width: 50%;
}
.span-7 {
width: 58.333333%;
}
.span-8 {
width: 66.666666%;
}
.span-9 {
width: 75%;
}
.span-10 {
width: 83.33333%;
}
.span-11 {
width: 91.666667%;
}
.span-12 {
width: 100%;
}
/* --------------------------------------------------------------------------
Grid Row Template
-------------------------------------------------------------------------- */
.grid__wrapper.gtr1 {
grid-template-rows: 1fr;
}
.grid__wrapper.gtr2 {
grid-template-rows: 1fr 1fr;
}
.grid__wrapper.gtr3 {
grid-template-rows: 1fr 1fr 1fr;
}
.grid__wrapper.gtr4 {
grid-template-rows: 1fr 1fr 1fr 1fr;
}
.gr1 { grid-row: 1; }
.gr2 { grid-row: 2; }
.gr3 { grid-row: 3; }
.gr4 { grid-row: 4; }
/* --------------------------------------------------------------------------
Grid Gap
-------------------------------------------------------------------------- */
.cg0 { grid-column-gap: 0 !important; }
.cg1 { grid-column-gap: 6px; }
.cg2 { grid-column-gap: 9px; }
.cg3 { grid-column-gap: 12px; }
.cg4 { grid-column-gap: 15px; }
.cg5 { grid-column-gap: 18px; }
.cg6 { grid-column-gap: 21px; }
.cg7 { grid-column-gap: 24px; }
.cg8 { grid-column-gap: 27px; }
.cg9 { grid-column-gap: 30px; }
.grid__wrapper.rg0, .rg0 { grid-row-gap: 0; }
.rg1 { grid-row-gap: 6px; }
.rg2 { grid-row-gap: 9px; }
.rg3 { grid-row-gap: 12px; }
.rg4 { grid-row-gap: 15px; }
.rg5 { grid-row-gap: 18px; }
.rg6 { grid-row-gap: 21px; }
.rg7 { grid-row-gap: 24px; }
.rg8 { grid-row-gap: 27px; }
.rg9 { grid-row-gap: 30px; }
/* --------------------------------------------------------------------------
Align Text
-------------------------------------------------------------------------- */
.a-left { text-align: left; }
.a-right { text-align: right; }
.a-center { text-align: center; }
@media screen and (max-width: 980px) {
.m-center { text-align: center; }
}
/* --------------------------------------------------------------------------
Align Self
-------------------------------------------------------------------------- */
.v-start { align-self: start; vertical-align: top; }
.v-center { align-self: center; vertical-align: middle; }
.v-end { align-self: end; vertical-align: bottom; }
.v-stretch { align-self: stretch; }
.vi-center { display: inline; vertical-align: middle; }
.vib-center { display: inline-block; vertical-align: middle; }
/* --------------------------------------------------------------------------
Justify Self
-------------------------------------------------------------------------- */
.h-start { justify-self: start; }
.h-center { justify-self: center; }
.h-end { justify-self: end; }
.h-stretch { justify-self: stretch; }
/* --------------------------------------------------------------------------
Place Self
-------------------------------------------------------------------------- */
.vh-start { place-self: start; }
.vv-center { place-self: center; }
.vh-end { place-self: end; }
.vh-stretch { place-self: stretch; }
.absolute-center {
position: absolute;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
}
/* --------------------------------------------------------------------------
Align content
-------------------------------------------------------------------------- */
.ac-center { align-content: center; }
.ac-start { align-content: start; }
.ac-end { align-content: end; }
@supports (display: grid) {
/* --------------------------------------------------------------------------
Grid Columns
-------------------------------------------------------------------------- */
.span-1 { grid-column: 1; width: 100%; }
.span-2 { grid-column: 1 / 3; width: 100%; }
.span-3 { grid-column: 1 / 4; width: 100%; }
.span-4, .span-third { grid-column: 1 / 5; width: 100%; }
.span-5 { grid-column: 1 / 6; width: 100%; }
.span-6 { grid-column: 1 / 7; width: 100%; }
.span-7 { grid-column: 1 / 8; width: 100%; }
.span-8 { grid-column: 1 / 9; width: 100%; }
.span-9 { grid-column: 1 / 10; width: 100%; }
.span-10 { grid-column: 1 / 11; width: 100%; }
.span-11 { grid-column: 1 / 12; width: 100%; }
.span-12 { grid-column: 1 / 13; width: 100%; }
.span-6.first { grid-column: 1 / 7; width: 100%; }
.span-6.last { grid-column: 7 / 13; width: 100%; }
.span-8.first { grid-column: 1 / 9; width: 100%; }
.span-4.last { grid-column: 9 / 13; width: 100%; }
.span-4.first { grid-column: 1 / 5; width: 100%; }
.span-8.last { grid-column: 5 / 13; width: 100%; }
.span-9.first { grid-column: 1 / 10; width: 100%; }
.span-3.last { grid-column: 10 / 13; width: 100%; }
.span-3.first { grid-column: 1 / 4; width: 100%; }
.span-9.last { grid-column: 4 / 13; width: 100%; }
/* --------------------------------------------------------------------------
Grid Auto Columns
-------------------------------------------------------------------------- */
.span-1.auto { grid-column: auto / span 1; width: 100%; }
.span-2.auto { grid-column: auto / span 2; width: 100%; }
.span-3.auto { grid-column: auto / span 3; width: 100%; }
.span-4.auto, .span-third.auto { grid-column: auto / span 4; width: 100%; }
.span-5.auto { grid-column: auto / span 5; width: 100%; }
.span-6.auto { grid-column: auto / span 6; width: 100%; }
.span-7.auto { grid-column: auto / span 7; width: 100%; }
.span-8.auto { grid-column: auto / span 8; width: 100%; }
.span-9.auto { grid-column: auto / span 9; width: 100%; }
.span-10.auto { grid-column: auto / span 10; width: 100%; }
.span-11.auto { grid-column: auto / span 11; width: 100%; }
.span-12.auto { grid-column: auto / span 12; width: 100%; }
/* --------------------------------------------------------------------------
Grid Push Columns
-------------------------------------------------------------------------- */
.span-1.push-1 { grid-column: 2 / 3; width: 100%; }
.span-1.push-2 { grid-column: 3 / 4; width: 100%; }
.span-1.push-3 { grid-column: 4 / 5; width: 100%; }
.span-1.push-4 { grid-column: 5 / 6; width: 100%; }
.span-1.push-5 { grid-column: 6 / 7; width: 100%; }
.span-1.push-6 { grid-column: 7 / 8; width: 100%; }
.span-1.push-7 { grid-column: 8 / 9; width: 100%; }
.span-1.push-8 { grid-column: 9 / 10; width: 100%; }
.span-1.push-9 { grid-column: 10 / 11; width: 100%; }
.span-1.push-10 { grid-column: 11 / 12; width: 100%; }
.span-1.push-11 { grid-column: 12 / 13; width: 100%; }
.span-2.push-1 { grid-column: 2 / 4; width: 100%; }
.span-2.push-2 { grid-column: 3 / 5; width: 100%; }
.span-2.push-3 { grid-column: 4 / 6; width: 100%; }
.span-2.push-4 { grid-column: 5 / 7; width: 100%; }
.span-2.push-5 { grid-column: 6 / 8; width: 100%; }
.span-2.push-6 { grid-column: 7 / 9; width: 100%; }
.span-2.push-7 { grid-column: 8 / 10; width: 100%; }
.span-2.push-8 { grid-column: 9 / 11; width: 100%; }
.span-2.push-9 { grid-column: 10 / 12; width: 100%; }
.span-2.push-10 { grid-column: 11 / 13; width: 100%; }
.span-3.push-1 { grid-column: 2 / 5; width: 100%; }
.span-3.push-2 { grid-column: 3 / 6; width: 100%; }
.span-3.push-3 { grid-column: 4 / 7; width: 100%; }
.span-3.push-4 { grid-column: 5 / 8; width: 100%; }
.span-3.push-5 { grid-column: 6 / 9; width: 100%; }
.span-3.push-6 { grid-column: 7 / 10; width: 100%; }
.span-3.push-7 { grid-column: 8 / 11; width: 100%; }
.span-3.push-8 { grid-column: 9 / 12; width: 100%; }
.span-3.push-9 { grid-column: 10 / 13; width: 100%; }
.span-4.push-1 { grid-column: 2 / 6; width: 100%; }
.span-4.push-2 { grid-column: 3 / 7; width: 100%; }
.span-4.push-3 { grid-column: 4 / 8; width: 100%; }
.span-4.push-4 { grid-column: 5 / 9; width: 100%; }
.span-4.push-5 { grid-column: 6 / 10; width: 100%; }
.span-4.push-6 { grid-column: 7 / 11; width: 100%; }
.span-4.push-7 { grid-column: 8 / 12; width: 100%; }
.span-4.push-8 { grid-column: 9 / 13; width: 100%; }
.span-5.push-1 { grid-column: 2 / 7; width: 100%; }
.span-5.push-2 { grid-column: 3 / 8; width: 100%; }
.span-5.push-3 { grid-column: 4 / 9; width: 100%; }
.span-5.push-4 { grid-column: 5 / 10; width: 100%; }
.span-5.push-5 { grid-column: 6 / 11; width: 100%; }
.span-5.push-6 { grid-column: 7 / 12; width: 100%; }
.span-5.push-7 { grid-column: 8 / 13; width: 100%; }
.span-6.push-1 { grid-column: 2 / 8; width: 100%; }
.span-6.push-2 { grid-column: 3 / 9; width: 100%; }
.span-6.push-3 { grid-column: 4 / 10; width: 100%; }
.span-6.push-4 { grid-column: 5 / 11; width: 100%; }
.span-6.push-5 { grid-column: 6 / 12; width: 100%; }
.span-6.push-6 { grid-column: 7 / 13; width: 100%; }
.span-7.push-1 { grid-column: 2 / 9; width: 100%; }
.span-7.push-2 { grid-column: 3 / 10; width: 100%; }
.span-7.push-3 { grid-column: 4 / 11; width: 100%; }
.span-7.push-4 { grid-column: 5 / 12; width: 100%; }
.span-7.push-5 { grid-column: 6 / 13; width: 100%; }
.span-8.push-1 { grid-column: 2 / 10; width: 100%; }
.span-8.push-2 { grid-column: 3 / 11; width: 100%; }
.span-8.push-3 { grid-column: 4 / 12; width: 100%; }
.span-8.push-4 { grid-column: 5 / 13; width: 100%; }
.span-9.push-1 { grid-column: 2 / 11; width: 100%; }
.span-9.push-2 { grid-column: 3 / 12; width: 100%; }
.span-9.push-3 { grid-column: 4 / 13; width: 100%; }
.span-10.push-1 { grid-column: 2 / 12; width: 100%; }
.span-10.push-2 { grid-column: 3 / 13; width: 100%; }
.span-11.push-1 { grid-column: 2 / 13; width: 100%; }
@media (min-width: 981px){
.desktop-hide {
display: none !important;
}
}
/* --------------------------------------------------------------------------
Mobile Grid Columns
-------------------------------------------------------------------------- */
@media (max-width: 980px) {
.sm-span-1.auto { grid-column: auto / span 1 !important; width: 100%; }
.sm-span-2.auto { grid-column: auto / span 2 !important; width: 100%; }
.sm-span-3.auto { grid-column: auto / span 3 !important; width: 100%; }
.sm-span-4.auto, .sm-span-third.auto { grid-column: auto / span 4 !important; width: 100%; }
.sm-span-5.auto { grid-column: auto / span 5 !important; width: 100%; }
.sm-span-6.auto { grid-column: auto / span 6 !important; width: 100%; }
.sm-span-7.auto { grid-column: auto / span 7 !important; width: 100%; }
.sm-span-8.auto { grid-column: auto / span 8 !important; width: 100%; }
.sm-span-9.auto { grid-column: auto / span 9 !important; width: 100%; }
.sm-span-10.auto { grid-column: auto / span 10 !important; width: 100%; }
.sm-span-11.auto { grid-column: auto / span 11 !important; width: 100%; }
.sm-span-12.auto { grid-column: auto / span 12 !important; width: 100%; }
.sm-cg0 { grid-column-gap: 0; }
.sm-cg1 { grid-column-gap: 6px; }
.sm-cg2 { grid-column-gap: 9px; }
.sm-cg3 { grid-column-gap: 12px; }
.sm-cg4 { grid-column-gap: 15px; }
.sm-cg5 { grid-column-gap: 18px; }
.sm-cg6 { grid-column-gap: 21px; }
.sm-cg7 { grid-column-gap: 24px; }
.sm-cg8 { grid-column-gap: 27px; }
.sm-cg9 { grid-column-gap: 30px; }
.sm-rg0 { grid-row-gap: 0; }
.sm-rg1 { grid-row-gap: 6px; }
.sm-rg2 { grid-row-gap: 9px; }
.sm-rg3 { grid-row-gap: 12px; }
.sm-rg4 { grid-row-gap: 15px; }
.sm-rg5 { grid-row-gap: 18px; }
.sm-rg6 { grid-row-gap: 21px; }
.sm-rg7 { grid-row-gap: 24px; }
.sm-rg8 { grid-row-gap: 27px; }
.sm-rg9 { grid-row-gap: 30px; }
.mobile-hide,
.sm-hide {
display: none !important;
}
/* --------------------------------------------------------------------------
Align Text
-------------------------------------------------------------------------- */
.sm-a-left { text-align: left; }
.sm-a-right { text-align: right; }
.sm-a-center { text-align: center; }
/* --------------------------------------------------------------------------
Align Self
-------------------------------------------------------------------------- */
.sm-v-start { align-self: start; vertical-align: top; }
.sm-v-center { align-self: center; vertical-align: middle; }
.sm-v-end { align-self: end; vertical-align: bottom; }
.sm-v-stretch { align-self: stretch; }
/* --------------------------------------------------------------------------
Justify Self
-------------------------------------------------------------------------- */
.sm-h-start { justify-self: start; }
.sm-h-center { justify-self: center; }
.sm-h-end { justify-self: end; }
.sm-h-stretch { justify-self: stretch; }
/* --------------------------------------------------------------------------
Place Self
-------------------------------------------------------------------------- */
.sm-vh-start { place-self: start; }
.sm-vv-center { place-self: center; }
.sm-vh-end { place-self: end; }
.sm-vh-stretch { place-self: stretch; }
}
/* --------------------------------------------------------------------------
Tablet Grid
-------------------------------------------------------------------------- */
@media (min-width: 740px) and (max-width: 980px) {
.md-span-12.auto { grid-column: auto / span 12 !important; width: 100%; }
.md-span-1.auto { grid-column: auto / span 1 !important; width: 100%; }
.md-span-2.auto { grid-column: auto / span 2 !important; width: 100%; }
.md-span-3.auto { grid-column: auto / span 3 !important; width: 100%; }
.md-span-4.auto, .md-span-third.auto { grid-column: auto / span 4 !important; width: 100%; }
.md-span-5.auto { grid-column: auto / span 5 !important; width: 100%; }
.md-span-6.auto { grid-column: auto / span 6 !important; width: 100%; }
.md-span-7.auto { grid-column: auto / span 7 !important; width: 100%; }
.md-span-8.auto { grid-column: auto / span 8 !important; width: 100%; }
.md-span-9.auto { grid-column: auto / span 9 !important; width: 100%; }
.md-span-10.auto { grid-column: auto / span 10 !important; width: 100%; }
.md-span-11.auto { grid-column: auto / span 11 !important; width: 100%; }
.md-span-12.auto { grid-column: auto / span 12 !important; width: 100%; }
.md-span-12.auto { grid-column: auto / span 12 !important; width: 100%; }
.md-cg0 { grid-column-gap: 0; }
.md-cg1 { grid-column-gap: 6px; }
.md-cg2 { grid-column-gap: 9px; }
.md-cg3 { grid-column-gap: 12px; }
.md-cg4 { grid-column-gap: 15px; }
.md-cg5 { grid-column-gap: 18px; }
.md-cg6 { grid-column-gap: 21px; }
.md-cg7 { grid-column-gap: 24px; }
.md-cg8 { grid-column-gap: 27px; }
.md-cg9 { grid-column-gap: 30px; }
.md-rg0 { grid-row-gap: 0; }
.md-rg1 { grid-row-gap: 6px; }
.md-rg2 { grid-row-gap: 9px; }
.md-rg3 { grid-row-gap: 12px; }
.md-rg4 { grid-row-gap: 15px; }
.md-rg5 { grid-row-gap: 18px; }
.md-rg6 { grid-row-gap: 21px; }
.md-rg7 { grid-row-gap: 24px; }
.md-rg8 { grid-row-gap: 27px; }
.md-rg9 { grid-row-gap: 30px; }
.tablet-hide {
display: none !important;
}
/* --------------------------------------------------------------------------
Align Text
-------------------------------------------------------------------------- */
.md-a-left { text-align: left; }
.md-a-right { text-align: right; }
.md-a-center { text-align: center; }
/* --------------------------------------------------------------------------
Align Self
-------------------------------------------------------------------------- */
.md-v-start { align-self: start; vertical-align: top; }
.md-v-center { align-self: center; vertical-align: middle; }
.md-v-end { align-self: end; vertical-align: bottom; }
.md-v-stretch { align-self: stretch; }
/* --------------------------------------------------------------------------
Justify Self
-------------------------------------------------------------------------- */
.md-h-start { justify-self: start; }
.md-h-center { justify-self: center; }
.md-h-end { justify-self: end; }
.md-h-stretch { justify-self: stretch; }
/* --------------------------------------------------------------------------
Place Self
-------------------------------------------------------------------------- */
.md-vh-start { place-self: start; }
.md-vv-center { place-self: center; }
.md-vh-end { place-self: end; }
.md-vh-stretch { place-self: stretch; }
}
/* --------------------------------------------------------------------------
Mobile & Tablet Grid
-------------------------------------------------------------------------- */
@media (max-width: 980px) {
.dv-span-12.auto { grid-column: auto / span 12 !important; width: 100%; }
.dv-span-1.auto { grid-column: auto / span 1 !important; width: 100%; }
.dv-span-2.auto { grid-column: auto / span 2 !important; width: 100%; }
.dv-span-3.auto { grid-column: auto / span 3 !important; width: 100%; }
.dv-span-4.auto, .md-span-third.auto { grid-column: auto / span 4 !important; width: 100%; }
.dv-span-5.auto { grid-column: auto / span 5 !important; width: 100%; }
.dv-span-6.auto { grid-column: auto / span 6 !important; width: 100%; }
.dv-span-7.auto { grid-column: auto / span 7 !important; width: 100%; }
.dv-span-8.auto { grid-column: auto / span 8 !important; width: 100%; }
.dv-span-9.auto { grid-column: auto / span 9 !important; width: 100%; }
.dv-span-10.auto { grid-column: auto / span 10 !important; width: 100%; }
.dv-span-11.auto { grid-column: auto / span 11 !important; width: 100%; }
.dv-span-12.auto { grid-column: auto / span 12 !important; width: 100%; }
.dv-cg0 { grid-column-gap: 0; }
.dv-cg1 { grid-column-gap: 6px; }
.dv-cg2 { grid-column-gap: 9px; }
.dv-cg3 { grid-column-gap: 12px; }
.dv-cg4 { grid-column-gap: 15px; }
.dv-cg5 { grid-column-gap: 18px; }
.dv-cg6 { grid-column-gap: 21px; }
.dv-cg7 { grid-column-gap: 24px; }
.dv-cg8 { grid-column-gap: 27px; }
.dv-cg9 { grid-column-gap: 30px; }
.dv-rg0 { grid-row-gap: 0; }
.dv-rg1 { grid-row-gap: 6px; }
.dv-rg2 { grid-row-gap: 9px; }
.dv-rg3 { grid-row-gap: 12px; }
.dv-rg4 { grid-row-gap: 15px; }
.dv-rg5 { grid-row-gap: 18px; }
.dv-rg6 { grid-row-gap: 21px; }
.dv-rg7 { grid-row-gap: 24px; }
.dv-rg8 { grid-row-gap: 27px; }
.dv-rg9 { grid-row-gap: 30px; }
.device-hide {
display: none !important;
}
/* --------------------------------------------------------------------------
Align Text
-------------------------------------------------------------------------- */
.dv-a-left { text-align: left; }
.dv-a-right { text-align: right; }
.dv-a-center { text-align: center; }
/* --------------------------------------------------------------------------
Align Self
-------------------------------------------------------------------------- */
.dv-v-start { align-self: start; vertical-align: top; }
.dv-v-center { align-self: center; vertical-align: middle; }
.dv-v-end { align-self: end; vertical-align: bottom; }
.dv-v-stretch { align-self: stretch; }
/* --------------------------------------------------------------------------
Justify Self
-------------------------------------------------------------------------- */
.dv-h-start { justify-self: start; }
.dv-h-center { justify-self: center; }
.dv-h-end { justify-self: end; }
.dv-h-stretch { justify-self: stretch; }
/* --------------------------------------------------------------------------
Place Self
-------------------------------------------------------------------------- */
.dv-vh-start { place-self: start; }
.dv-vv-center { place-self: center; }
.dv-vh-end { place-self: end; }
.dv-vh-stretch { place-self: stretch; }
}
}
/* ==========================================================================
UTILITY CLASSES: SPACING, WIDTH, AND INLINE LAYOUT
========================================================================== */
/* --------------------------------------------------------------------------
Margin
-------------------------------------------------------------------------- */
.m0 { margin: 0 !important; }
.mt0 { margin-top: 0 !important; }
.mr0 { margin-right: 0 !important; }
.mb0 { margin-bottom: 0 !important; }
.ml0 { margin-left: 0 !important; }
.mx0 { margin-left: 0 !important; margin-right: 0 !important; }
.my0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.mb30 { margin-bottom: 30px !important; }
.m-auto { margin: auto !important; }
.mt-auto { margin-top: auto !important; }
.mr-auto { margin-right: auto !important; }
.mb-auto { margin-bottom: auto !important; }
.ml-auto { margin-left: auto !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }
.my-auto { margin-top: auto !important; margin-bottom: auto !important; }
/* --------------------------------------------------------------------------
Padding
-------------------------------------------------------------------------- */
.p0 { padding: 0 !important; }
.pt0 { padding-top: 0 !important; }
.pr0 { padding-right: 0 !important; }
.pb0 { padding-bottom: 0 !important; }
.pl0 { padding-left: 0 !important; }
.px0 { padding-left: 0 !important; padding-right: 0 !important; }
.py0 { padding-top: 0 !important; padding-bottom: 0 !important; }
@media (min-width: 741px) and (max-width: 980px) {
.md-m0 { margin: 0 !important; }
.md-mt0 { margin-top: 0 !important; }
.md-mr0 { margin-right: 0 !important; }
.md-mb0 { margin-bottom: 0 !important; }
.md-ml0 { margin-left: 0 !important; }
.md-mx0 { margin-left: 0 !important; margin-right: 0 !important; }
.md-my0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.md-m-auto { margin: auto !important; }
.md-mt-auto { margin-top: auto !important; }
.md-mr-auto { margin-right: auto !important; }
.md-mb-auto { margin-bottom: auto !important; }
.md-ml-auto { margin-left: auto !important; }
.md-mx-auto { margin-left: auto !important; margin-right: auto !important; }
.md-my-auto { margin-top: auto !important; margin-bottom: auto !important; }
/* --------------------------------------------------------------------------
Padding
-------------------------------------------------------------------------- */
.md-p0 { padding: 0 !important; }
.md-pt0 { padding-top: 0 !important; }
.md-pr0 { padding-right: 0 !important; }
.md-pb0 { padding-bottom: 0 !important; }
.md-pl0 { padding-left: 0 !important; }
.md-px0 { padding-left: 0 !important; padding-right: 0 !important; }
.md-py0 { padding-top: 0 !important; padding-bottom: 0 !important; }
}
@media (max-width: 980px) {
.sm-m0 { margin: 0 !important; }
.sm-mr0 { margin-right: 0 !important; }
.sm-mb0 { margin-bottom: 0 !important; }
.sm-ml0 { margin-left: 0 !important; }
.sm-mx0 { margin-left: 0 !important; margin-right: 0 !important; }
.sm-my0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.sm-m-auto { margin: auto; }
.sm-mt-auto { margin-top: auto; }
.sm-mr-auto { margin-right: auto; }
.sm-mb-auto { margin-bottom: auto; }
.sm-ml-auto { margin-left: auto; }
.sm-mx-auto { margin-left: auto; margin-right: auto; }
.sm-my-auto { margin-top: auto; margin-bottom: auto; }
/* --------------------------------------------------------------------------
Padding
-------------------------------------------------------------------------- */
.sm-p0 { padding: 0; }
.sm-pt0 { padding-top: 0; }
.sm-pr0 { padding-right: 0; }
.sm-pb0 { padding-bottom: 0; }
.sm-pl0 { padding-left: 0; }
.sm-px0 { padding-left: 0; padding-right: 0; }
.sm-py0 { padding-top: 0; padding-bottom: 0; }
}
@media (max-width: 980px) {
.dv-m0 { margin: 0; }
.dv-mt0 { margin-top: 0; }
.dv-mr0 { margin-right: 0; }
.dv-mb0 { margin-bottom: 0; }
.dv-ml0 { margin-left: 0; }
.dv-mx0 { margin-left: 0; margin-right: 0; }
.dv-my0 { margin-top: 0; margin-bottom: 0; }
.dv-m-auto { margin: auto; }
.dv-mt-auto { margin-top: auto; }
.dv-mr-auto { margin-right: auto; }
.dv-mb-auto { margin-bottom: auto; }
.dv-ml-auto { margin-left: auto; }
.dv-mx-auto { margin-left: auto; margin-right: auto; }
.dv-my-auto { margin-top: auto; margin-bottom: auto; }
/* --------------------------------------------------------------------------
Padding
-------------------------------------------------------------------------- */
.dv-p0 { padding: 0; }
.dv-pt0 { padding-top: 0; }
.dv-pr0 { padding-right: 0; }
.dv-pb0 { padding-bottom: 0; }
.dv-pl0 { padding-left: 0; }
.dv-px0 { padding-left: 0; padding-right: 0; }
.dv-py0 { padding-top: 0; padding-bottom: 0; }
}
/* --------------------------------------------------------------------------
Width
-------------------------------------------------------------------------- */
.w100 { width: 100% !important; }
.w75 { width: 75% !important; }
.w50 { width: 50% !important; }
.w25 { width: 25% !important; }
/* --------------------------------------------------------------------------
Quick Inline Grid
-------------------------------------------------------------------------- */
.inline__wrapper {
list-style: none;
width: 100%;
}
.inline__wrapper > * {
width: auto;
margin: 0;
display: inline-block;
padding-left: 5px;
padding-right: 5px;
}
/* ==========================================================================
BASE DOCUMENT STRUCTURE
========================================================================== */
html,
body {
height: 100%;
box-sizing: border-box !important;
scroll-behavior: smooth;
}
*, *:before, *:after {
box-sizing: inherit;
}
body {
color: var(--text-color);
background: var(--background);
font-size: var(--font-size);
font-family: var(--main-family);
font-weight: 700 !important;
font-style: var(--main-style);
letter-spacing: var(--main-spacing);
line-height: 1.6em;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased; /* --------------------------------------------------------------------------
For Chrome and Safari
-------------------------------------------------------------------------- */
-moz-osx-font-smoothing: grayscale; /* --------------------------------------------------------------------------
For Firefox
-------------------------------------------------------------------------- */
text-rendering: optimizeSpeed;
/* --------------------------------------------------------------------------
Without this, the body has excess horizontal scroll when the menu is open
-------------------------------------------------------------------------- */
overflow-x: hidden;
}
body .slideout-panel {
background: var(--background);
}
/* ==========================================================================
TYPOGRAPHY AND CONTENT DEFAULTS
========================================================================== */
/* --------------------------------------------------------------------------
Typography
-------------------------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5 {
color: var(--text-color);
font-family:var(--heading-family);
font-weight: 900 !important;
font-style: var(--heading-style);
margin-top: 0;
margin-bottom: 0px;
line-height: normal;
-webkit-font-smoothing: antialiased;
letter-spacing: var(--heading-spacing);
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a {
font-weight: inherit;
color: var(--text-color) !important;
}
h1, .h1 {
font-size: var(--h1-size);
}
h2, .h2 {
font-size: 18px;
}
h3, .h3 {
font-size: var(--h3-size);
}
h4, .h4 {
font-size: calc(var(--font-size) + 2px);
}
h5, .h5 {
font-size: calc(var(--font-size) + 1px);
}
h1,
h2,
h3,
h4,
h5,
p,
dl,
hr,
ol,
ul,
pre,
table,
address,
fieldset {
margin-bottom: 0px;
}
p {
font-size: var(--font-size);
margin-bottom: 10px;
}
strong {
font-weight: bold;
}
em {
font-style: italic;
}
pre {
font-family: "Courier New", Courier, monospace;
font-size: 13px;
font-weight: bold;
}
.text-left {
text-align: left;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.inline-block-auto {
display: inline-block;
width: auto;
}
a {
text-decoration: none;
color: var(--text-color);
}
a:hover {
color: var(--text-color);
}
a:visited {
color:var(--text-color);
}
dt {
font-weight: bold;
}
ol {
padding: 0;
margin-left: 0;
margin-bottom: 20px;
text-indent: 0;
list-style-position: inside;
}
ul {
padding: 0;
margin: 0 0 20px 0;
list-style: disc inside;
}
blockquote {
font-family: Georgia, "Times New Roman", Times, sans-serif;
font-size: 18px;
line-height: 24px;
font-style: italic;
padding-left: 35px;
color: #999;
margin: 20px 0;
}
hr {
background: var(--dotted-color);
border: none;
color: var(--dotted-color);
display: block;
height: 1px;
margin-top: 20px;
width: 100%;
}
/* ==========================================================================
IMAGES, RATIOS, AND IMAGE EFFECTS
========================================================================== */
/* --------------------------------------------------------------------------
Images
-------------------------------------------------------------------------- */
img {
height: auto;
width: 100%;
max-width: 100%;
border: 0;
}
.box-ratio {
display: block;
height: 0;
width: 100%;
overflow: hidden;
background-color: var(--background);
}
.box-ratio img {
background-color: var(--background);
}
/* --------------------------------------------------------------------------
Image aspect ratios
-------------------------------------------------------------------------- */
.image_natural .box-ratio,
.image_square .box-ratio,
.image_landscape .box-ratio,
.image_portrait .box-ratio {
width: 100%;
position: relative;
margin-left: auto;
margin-right: auto;
background-color: transparent;
}
.image_square .box-ratio {
padding-bottom: 100% !important;
}
.image_landscape .box-ratio {
padding-bottom: 75% !important;
}
.image_portrait .box-ratio {
padding-bottom: 150% !important;
}
.box-ratio .placeholder-svg {
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.image_natural .box-ratio img,
.image_square .box-ratio img,
.image_landscape .box-ratio img,
.image_portrait .box-ratio img {
object-fit: cover;
height: 100%;
width: 100%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
/* --------------------------------------------------------------------------
Image zoom effect
-------------------------------------------------------------------------- */
.theme-image-effect .article-content img,
.theme-image-effect .textWithImage__column-image img,
.theme-image-effect .imageText__column-image img,
.theme-image-effect .collection__list-item img,
.theme-image-effect .gallery__item img {
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: -webkit-transform 7s cubic-bezier(0.25, 0.5, 0.8, 0.65);
transition: -webkit-transform 7s cubic-bezier(0.25, 0.5, 0.8, 0.65);
transition: transform 7s cubic-bezier(0.25, 0.5, 0.8, 0.65);
transition: transform 7s cubic-bezier(0.25, 0.5, 0.8, 0.65);
-webkit-transform: 7s cubic-bezier(0.25, 0.5, 0.8, 0.65);
}
.theme-image-effect .article-content:hover img,
.theme-image-effect .textWithImage__column-image:hover img,
.theme-image-effect .imageText__column-image:hover img,
.theme-image-effect .collection__list-item:hover img,
.theme-image-effect .gallery__item:hover img {
-webkit-transform: scale(1.0);
transform: scale(1.0);
}
/* ==========================================================================
GENERAL HELPERS AND ACCESSIBILITY UTILITIES
========================================================================== */
/* --------------------------------------------------------------------------
Helpers
-------------------------------------------------------------------------- */
.clear:not(.color) {
clear: both;
display: block;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.hide {
display: none;
}
.right {
float: right;
}
.left {
float: left;
}
.center {
text-align: center;
}
.mb0 {
margin-bottom: 0;
}
.first {
clear: left;
}
.visually-hidden {
position: absolute !important;
overflow: hidden;
clip: rect(0 0 0 0);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
}
.visually-hidden--inline {
margin: 0;
height: 1em;
}
.visually-hidden--static {
position: static !important;
}
.hr-or {
border: none;
border-top: 1px solid var(--dotted-color);
width: 14.375rem;
margin: 1.5625rem auto;
overflow: visible;
margin: 16px 0;
width: 100%;
}
.hr-or:after {
content: attr(data-content);
position: relative;
top: -10px;
left: 50%;
transform: translateX(-50%);
width: 2.5rem;
font-weight: 500;
background-color: var(--background);
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
letter-spacing: .2px;
text-align: center;
display: inline-block;
}
.display-none { display: none !important;}
.or-divider {
position: relative;
font-size: var(--font-size);
font-weight: bold;
text-transform: uppercase;
line-height: 1.6;
}
.or-divider span:before {
content: "";
background: var(--dotted-color);
height: 1px;
width: 40%;
position: absolute;
left: 0;
top: 50%;
}
.or-divider span:after {
content: "";
background: var(--dotted-color);
height: 1px;
width: 40%;
position: absolute;
right: 0;
top: 50%;
}
.note {
padding: 20px;
border: 1px solid var(--dotted-color);
margin-bottom: 20px;
}
.note .underline {
text-decoration: underline;
}
/* ==========================================================================
NO-JAVASCRIPT FALLBACKS
========================================================================== */
/* --------------------------------------------------------------------------
No Js
-------------------------------------------------------------------------- */
.js-focus-hidden:focus {
outline: none;
}
.no-js .box-ratio {
display: none;
}
.no-js #slider .carousel-cell {
opacity: 1 !important;
visibility: visible;
}
.no-js #slider .carousel-cell img {
margin-bottom: 20px;
}
.no-js .zoom_btn,
.no-js .swatches__container,
.no-js .no-js-hidden {
display: none;
}
.no-js .product__variants-single-option-label,
.no-js .vantage-accordion .product-accordion-content {
display: block !important;
}
.no-js #AddToCartForm .product__variants-select {
display: block !important;
}
.no-js #AddToCartForm .product__variants-select select {
float: unset;
min-width: 240px;
}
.no-js .shifter-navigation {
display: none;
}
.no-js #shopify-section-mobile-navigation {
display: none;
}
.no-js [data-aos^=fade][data-aos^=fade] {
opacity: 1 !important;
}
.no-js [data-aos^=fade][data-aos^=fade] {
transform: unset;
}
.no-js [data-aos] {
pointer-events: unset !important;
}
.no-js .loading-wrapper {
display: none !important;
}
/* --------------------------------------------------------------------------
No Js Cart
-------------------------------------------------------------------------- */
.cart-type--no_js_cart .ajax-cart__item-remove--no-js,
.no-js .ajax-cart__item-remove--no-js {
display: block !important;
position: absolute;
top: 10px;
right: 10px;
}
.cart-type--no_js_cart .ajax-cart__item-remove--js,
.no-js .ajax-cart__item-remove--js {
display: none;
}
.cart-type--no_js_cart .ajax-cart__qty-control--down,
.cart-type--no_js_cart .ajax-cart__qty-control--up,
.no-js .ajax-cart__qty-control--down,
.no-js .ajax-cart__qty-control--up {
display: none;
}
.cart-type--no_js_cart .ajax-cart__item-quantity,
.no-js .ajax-cart__item-quantity {
text-align: center !important;
}
.cart-type--no_js_cart .ajax-cart__qty-input--no-js,
.no-js .ajax-cart__qty-input--no-js {
max-width: 90px;
margin: 0;
}
.cart-type--no_js_cart .ajax-cart__item-update--no-js,
.no-js .ajax-cart__item-update--no-js {
display: block !important;
margin-top: 8px;
text-decoration: underline;
font-size: 13px;
text-align: center;
margin-left: auto;
margin-right: auto;
}
.no-js .ajax-cart__accordion--shipping-calc {
display: none;
}
.cart-type--no_js_cart .ajax-cart__form-wrapper--nojs,
.no-js .ajax-cart__accordion .accordion-content {
display: block !important;
}
.no-js .loading-wrapper,
.cart-type--no_js_cart .loading-wrapper {
display: none;
}
/* ==========================================================================
BUTTONS AND INTERACTIVE ELEMENTS
========================================================================== */
/* --------------------------------------------------------------------------
Buttons
-------------------------------------------------------------------------- */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
width: 100%;
max-width: 100%;
background: var(--button-color);
color: var(--button-text);
font-family: var(--main-family);
font-weight: var(--main-weight);
font-style: var(--main-style);
font-size: var(--font-size);
letter-spacing: var(--main-spacing);
text-decoration: none;
border: none;
-webkit-transition: background .5s ease,color .5s ease;
-moz-transition: background .5s ease,color .5s ease;
-o-transition: background .5s ease,color .5s ease;
transition: background .5s ease,color .5s ease;
-webkit-appearance: none;
appearance: none;
display: inline-block;
cursor: pointer;
margin-bottom: 15px;
line-height: 1em;
height: 50px;
}
/* Swatches should not inherit global button spacing */
.devCollectionCardSwatch {
margin-bottom: 6px;
}
.theme-buttons-curved .button,
.theme-buttons-curved button,
.theme-buttons-curved input[type="submit"],
.theme-buttons-curved input[type="reset"],
.theme-buttons-curved input[type="button"] {
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
color: var(--button-text);
background: var(--button-hover);
}
button.button-as-link,
a.button-as-link,
input.button-as-link {
border: none;
background: none;
color: var(--text-color);
text-decoration: underline;
font-size: var(--font-size);
height: auto;
display: inline-block;
width: auto;
}
button.button-as-link:hover,
a.button-as-link:hover,
input.button-as-link:hover {
background: none;
color: var(--text-color);
}
.secondary-button {
background: var(--secondary-button-color) !important;
color: var(--secondary-button-text) !important;
}
.secondary-button:hover {
color: var(--secondary-button-text) !important;
background: var(--secondary-button-hover) !important;
}
/* --------------------------------------------------------------------------
Fix for odd Mozilla border & padding issues
-------------------------------------------------------------------------- */
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
.btn,
.content-btn,
.rte .btn,
.rte .content {
font-family: var(--main-family);
font-weight: var(--main-weight);
font-style: var(--main-style);
font-size: var(--font-size);
letter-spacing: var(--main-spacing);
text-decoration: none;
-webkit-transition: background .5s ease,color .5s ease;
-moz-transition: background .5s ease,color .5s ease;
-o-transition: background .5s ease,color .5s ease;
transition: background .5s ease,color .5s ease;
-webkit-appearance: none;
appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
line-height: 1em;
height: 50px;
padding: 0 20px;
background: var(--button-color);
color: var(--button-text);
border: 0px solid var(--button-color);
}
.theme-buttons-curved .btn,
.theme-buttons-curved .content-btn {
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.btn:visited,
.content-btn:visited,
.rte .btn:visited,
.rte .content:visited {
color: var(--button-text);
}
.btn:hover,
.content-btn:hover,
.rte .btn:hover,
.rte .content:hover {
color: var(--button-color);
background: var(--button-text);
}
:focus, .focus-visible {
outline: var(--keyboard-focus-color) var(--keyboard-focus-border-style) calc(var(--keyboard-focus-border-weight) * 1px) !important;
outline-offset: calc(var(--keyboard-focus-border-weight) * -1px) !important;
}
/* ==========================================================================
FORMS AND INPUTS
========================================================================== */
/* --------------------------------------------------------------------------
Forms
-------------------------------------------------------------------------- */
form {
margin-bottom: 0;
}
fieldset {
margin-bottom: 20px;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="file"],
input[type="phone"],
textarea,
select {
border: 1px solid #ccc;
height: 50px;
outline: none;
font-family: var(--main-family);
font-weight: var(--main-weight);
font-style: var(--main-style);
font-size: var(--font-size);
color: var(--text-color);
margin: 0;
width: 100%;
max-width: 100%;
display: block;
margin-bottom: 20px;
background: var(--background);
box-sizing: border-box;
letter-spacing: var(--main-spacing);
}
select {
padding: 0 9px;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus {
color: #444;
-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
box-shadow: 0 0 3px rgba(0,0,0,.2);
}
label,
legend {
display: block;
font-weight: bold;
margin-bottom: 5px;
}
input[type="checkbox"] {
display: inline;
}
label span,
legend span {
font-weight: normal;
}
::-webkit-input-placeholder { /* --------------------------------------------------------------------------
WebKit browsers
-------------------------------------------------------------------------- */
color: #aaa;
}
:-moz-placeholder { /* --------------------------------------------------------------------------
Mozilla Firefox 4 to 18
-------------------------------------------------------------------------- */
color: #aaa;
}
::-moz-placeholder { /* --------------------------------------------------------------------------
Mozilla Firefox 19+
-------------------------------------------------------------------------- */
color: #aaa;
}
:-ms-input-placeholder { /* --------------------------------------------------------------------------
Internet Explorer 10+
-------------------------------------------------------------------------- */
color: #aaa;
}
input[type=text],
input[type=password],
input[type=email],
input[type=url],
input[type=number] {
width: 100%;
font-family: var(--main-family);
font-weight: var(--main-weight);
font-style: var(--main-style);
font-size: var(--font-size);
color: var(--text-color);
border: 1px solid var(--dotted-color);
height: 50px;
margin: 0px;
margin-bottom: 20px;
max-width: 100%;
text-indent: 10px;
outline: none;
-webkit-appearance: none;
-webkit-border-radius: 0;
}
textarea {
width: 100%;
background: #fff;
border: 1px solid var(--dotted-color);
height: 135px;
margin: 0 0 20px 0;
max-width: 100%;
padding: 10px;
outline: none;
-webkit-appearance: none;
-webkit-border-radius: 0;
min-height: 60px;
min-width: 300px;
letter-spacing: var(--main-spacing);
}
.notice {
border: 3px dashed var(--dotted-color);
padding: 10px;
background: var(--background);
margin: 20px 0;
}
.errorForm.feedback {
background: mistyrose;
padding: 15px 0 5px;
text-align: center;
font-weight: 600;
color: firebrick;
margin: 0 1.1%;
}
input.required-error,
textarea.required-error {
outline: 1px solid var(--error-color);
}
/* ==========================================================================
EMBEDS, VIDEO, AND RESPONSIVE MEDIA
========================================================================== */
/* --------------------------------------------------------------------------
Iframe & Responsive video
-------------------------------------------------------------------------- */
iframe {
width: 100%;
}
.videoWrapper {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
max-width: 100%;
}
.videoWrapper iframe, .videoWrapper object, .videoWrapper embed, .videoWrapper video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* ==========================================================================
ANIMATIONS AND LOADING STATES
========================================================================== */
/* --------------------------------------------------------------------------
Theme animations
-------------------------------------------------------------------------- */
.global__section{animation:fadeIn;animation-duration:3s}.loading-wrapper{width:100%;height:100%;position:fixed;background:var(--background);z-index:200;margin:0 auto;text-align:center;opacity:0.9;left:0;top:0}.loading-ripple{display:inline-block;width:80px;height:80px;top:50%;position:absolute;transform:translate(-50%,-50%);left:50%}.loading-ripple div{position:absolute;border:4px solid var(--dotted-color);opacity:1;border-radius:50%;animation:loadingRipple 1s cubic-bezier(0,0.2,0.8,1) infinite}.loading-ripple div:nth-child(2){animation-delay:-.5s}@keyframes loadingRipple{0%{top:36px;left:36px;width:0;height:0;opacity:1}100%{top:0;left:0;width:72px;height:72px;opacity:0}}
/* --------------------------------------------------------------------------
CSS Animate
-------------------------------------------------------------------------- */
.animate-hide,.animate-show{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes pulse{0%,100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}}@keyframes pulse{0%,100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}
/* ==========================================================================
THEME ONBOARDING AND PLACEHOLDER STATES
========================================================================== */
/* --------------------------------------------------------------------------
onboarding styles for new theme install
-------------------------------------------------------------------------- */
.onboard {
background: #ddd! important;
border: 1px solid #ccc;
}
.image-with-text-overlay .onboard {
text-align: center;
}
.image-with-text-overlay .onboard svg {
fill: #d0d0d0;
height: 430px;
}
.gallery__item .onboard .placeholder-svg,
.ci.onboard .placeholder-svg, .onboard svg,
.slideshow__slide-onboard .placeholder-svg,
.onboard-slide svg, .article-image .placeholder-svg {
fill: rgba(28,29,29,0.2);
background-color: transparent;
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
}
.no-blocks .desktop-12 {
font-size: 15px;
text-align: center;
padding: 20px 0;
border: 1px dashed #eee;
background: #f7f7f7;
margin-top: 20px;
margin-bottom: 50px;
font-weight: normal;
}
.content-onboard {
width: 80%;
text-align: center;
margin: 0 auto;
}
.panel:before {
content: '';
display: block;
background-color: rgba(0,0,0,0);
transition: background-color 0.5s ease-in-out;
}
/* ==========================================================================
RICH TEXT AND TABBED CONTENT
========================================================================== */
/* --------------------------------------------------------------------------
Rich text editor
-------------------------------------------------------------------------- */
.rte a {
text-decoration: underline;
}
.rte img {
width: auto;
}
.rte ul {
list-style-position: outside;
margin-left: 20px;
}
/* --------------------------------------------------------------------------
Tabbed Content
-------------------------------------------------------------------------- */
.tabbed__content-section {
padding: 40px 0;
background: var(--background);
color: var(--text-color);
}
.rte-tab > input,
.rte-tab section > div {
display: none;
}
.rte-tab {
width: 100%;
max-width: 100%;
margin: 0 auto;
}
.rte-tab ul {
list-style: none;
margin: 0;
padding: 0;
}
.rte-tab ul.tabbed {
display: flex;
flex-direction: row;
column-gap: 20px;
flex-wrap: wrap;
border-bottom: 1px solid var(--dotted-color);
}
.rte-tab ul li label {
background: transparent;
cursor: pointer;
position: relative;
font-weight: var(--main-weight);
margin-bottom: 0;
padding: 10px 5px;
}
.rte-tab section {
clear: both;
}
.rte-tab section div {
padding: 20px 0;
width: 100%;
line-height: 1.5em;
letter-spacing: var(--main-spacing);
}
.rte-tab section div h2 {
margin: 0;
color: var(--text-color);
}
.rte-tab .tabbed-block.rte ul {
list-style: disc;
list-style-position: outside;
margin-bottom: 15px !important;
}
.rte-tab .tabbed-block.rte ul li {
margin-left: 20px;
}
/* ==========================================================================
GLOBAL SECTION STRUCTURE
========================================================================== */
/* --------------------------------------------------------------------------
Sections
-------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------
Prevent margin collapse
-------------------------------------------------------------------------- */
.shopify-section {
display: flex;
flex-direction: column;
}
.global__section {
padding-top: 0;
padding-bottom: 0;
margin-top: calc(var(--section-margins) / 2);
margin-bottom: calc(var(--section-margins) / 2);
width: 100%;
}
.global__section.padded__section {
margin-top: 0;
margin-bottom: 0;
padding-top: calc(var(--section-margins) / 2);
padding-bottom: calc(var(--section-margins) / 2);
}
.main__section {
position: relative;
z-index: 0;
}
body:not(.template-index) .main__section {
margin-top: calc(var(--section-margins) / 2);
margin-bottom: calc(var(--section-margins) / 2);
}
/* --------------------------------------------------------------------------
Section titles
-------------------------------------------------------------------------- */
.section-title {
position: relative;
text-align: center;
margin-bottom: 25px;
}
.section-title.lines h1,
.section-title.lines h2,
.section-title.lines h3 {
display: inline-block;
padding: 8px 23px;
margin: 0;
background-color: var(--background);
position: relative;
z-index: 1;
}
.section-title.lines:after {
content: '';
width: 100%;
display: inline-block;
border-bottom: 1px solid var(--dotted-color);
position: absolute;
left: 0;
top: 50%;
z-index: 0;
}
.section-title.btm_border:after {
content: "";
border-bottom: 2px solid var(--dotted-color);
width: 80px;
height: 0;
position: absolute;
top: 95%;
left: calc(50% - 40px);
}
/* ==========================================================================
SLIDEOUTS, DRAWERS, AND OVERLAYS
========================================================================== */
/* --------------------------------------------------------------------------
CSS Slideouts
-------------------------------------------------------------------------- */
.slideout {
list-style: none;
background: var(--background);
width: 550px;
height: auto;
position: fixed;
top: 0;
bottom: 0;
left: unset;
right: unset;
z-index: 31;
overflow-y: auto;
overflow-x: hidden;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;
}
/* --------------------------------------------------------------------------
Popover Slideout
-------------------------------------------------------------------------- */
.slideout {
/* ---- --slideout-background: var(--background, white);*/
/* ---- --slideout-border-color: var(--dotted-color, #888);*/
--slideout-width: 550px;
--slideout-transition-duration: 0.2s;
--slideout-backdrop: rgba(0,0,0,0.5);
/* ---- background: var(--slideout-background, --background);*/
/* ---- width: var(--slideout-width);*/
border: 0;
opacity: 0;
padding: 0;
display: none;
}
/* --------------------------------------------------------------------------
If no prefers reduced motion
-------------------------------------------------------------------------- */
@media screen and (prefers-reduced-motion: no-preference) {
.slideout {
transition-property: display opacity;
transition-duration: 0.2s;
transition-behavior: allow-discrete;
}
.slideout {
transition-duration: var(--slideout-transition-duration);
}
}
.slideout__drawer-right {
transform: translateX(550px);
right: 0;
}
.slideout__drawer-right {
display: none;
opacity: 0;
}
.slideout__drawer-right:popover-open {
transform: translateX(0);
display: block;
opacity: 1;
@starting-style {
transform: translateX(var(--slideout-width));
}
}
.no-popover .slideout__drawer-right {
transform: translateX(var(--slideout-width));
}
.no-popover .slideout__drawer-right.\:popover-open {
transform: translateX(0);
}
.slideout__drawer-left {
transform: translateX(-550px);
left: 0;
}
.slideout__drawer-left {
display: none;
opacity: 0;
}
.slideout__drawer-left:popover-open {
transform: translateX(0);
display: block;
opacity: 1;
@starting-style {
transform: translateX(calc(calc(var(--slideout-width) * -1)));
}
}
.no-popover .slideout__drawer-left {
transform: translateX(calc(calc(var(--slideout-width) * -1)));
}
.no-popover .slideout__drawer-left.\:popover-open {
transform: translateX(0);
}
@media (max-width: 980px) {
.slideout {
width: 350px;
}
.slideout__drawer-right {
transform: translateX(350px);
right: 0;
}
.slideout__drawer-left {
transform: translateX(-350px);
left: 0;
}
}
.slideout-left--open .slideout--active.slideout__drawer-left {
transform: translateX(0);
}
.slideout-right--open .slideout--active.slideout__drawer-right {
transform: translateX(0);
}
.slideout-left--open,
.slideout-right--open {
overflow: hidden;
}
.slideout-left--open .js-slideout-overlay,
.slideout-right--open .js-slideout-overlay,
.modal--open .js-modal-overlay {
opacity: 0.8;
visibility: visible;
}
.slideout__trigger--open {
z-index: 2;
margin-bottom: 0;
cursor: pointer;
}
.slideout__trigger--open .slideout__trigger-mobile-menu i,
.slideout__trigger--open .slideout__trigger-password i {
font-size: 20px;
text-align: left;
}
.slideout__trigger--close {
position: fixed;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
top: 10px;
right: 10px;
padding: 0;
margin-bottom: 0;
color: black;
background: unset;
}
.slideout__trigger--close button {
background: transparent;
height: 100%;
line-height: 0;
margin: 0;
display: block;
padding: 0;
width: 100%;
}
#slideout-ajax-cart .slideout__trigger--close {
position: unset;
}
.slideout__trigger--open .slideout__trigger-drawer-sidebar,
.slideout__trigger--open .slideout__trigger-mobile-menu,
.slideout__trigger--open .slideout__trigger-store-availability,
.slideout__trigger--open .slideout__trigger-password {
background: unset;
margin-bottom: 0;
}
.slideout__trigger-drawer-sidebar:hover,
.slideout__trigger-mobile-menu:hover,
.slideout__trigger-store-availability:hover,
.slideout__trigger-password:hover,
.slideout__trigger-ajax-cart:hover,
.slideout__trigger-quickview:hover,
.slideout__trigger-general-modal:hover {
background: unset;
}
.slideout__trigger--open .slideout__trigger-store-availability,
.slideout__trigger--open .slideout__trigger-password {
color: var(--text-color);
height: auto;
text-align: left;
text-decoration: underline;
margin: 0;
padding: 0;
}
.slideout__trigger-password,
.slideout__trigger-ajax-cart,
.slideout__trigger-quickview,
.slideout__trigger-drawer-sidebar,
.slideout__trigger-general-modal {
display: inline-block;
width: auto;
height: 30px;
line-height: 30px;
}
.slideout__trigger--open .slideout__trigger-store-availability:hover,
.slideout__trigger--open .slideout__trigger-password:hover {
opacity: 0.8;
}
.slideout__trigger-store-availability .icn-close:before,
.slideout__trigger-store-availability .icn-close:after,
.slideout__trigger-password .icn-close:before,
.slideout__trigger-password .icn-close:after,
.slideout__trigger-drawer-sidebar .icn-close:before,
.slideout__trigger-drawer-sidebar .icn-close:after,
.slideout__trigger-ajax-cart .icn-close:before,
.slideout__trigger-quickview .icn-close:before,
.slideout__trigger-ajax-cart .icn-close:after,
.slideout__trigger-quickview .icn-close:after,
.slideout__trigger-general-modal .icn-close:before,
.slideout__trigger-general-modal .icn-close:after {
border-color: var(--text-color);
}
.modal__general-modal__wrapper {
padding: 60px !important;
}
.slideout-left--closed .slideout__drawer-left,
.slideout-right--closed .slideout__drawer-right {
visibility: hidden;
opacity: 0;
-webkit-animation:slideoutFadeout 0.6s linear;
}
.slideout-left--open .slideout__drawer-left,
.slideout-right--open .slideout__drawer-right {
visibility: visible;
opacity: 1;
-webkit-animation:slideoutFadein 0.6s linear;
}
@-webkit-keyframes slideoutFadeout {
0%{opacity:1;visibility:visible;}
99%{opacity:0;}
100%{opacity:0;visibility: hidden;}
}
@-webkit-keyframes slideoutFadein {
0%{opacity:0;visibility:visible;}
100%{opacity:1;}
}
/* ==========================================================================
ICONS AND SMALL UI ELEMENTS
========================================================================== */
/* --------------------------------------------------------------------------
Custom Icons
-------------------------------------------------------------------------- */
.icn-close {
width: 20px;
height: 20px;
position: relative;
}
.icn-close:after {
content: '';
height: 20px;
border-left: 1px solid #fff;
position: absolute;
transform: rotate(45deg);
left: 8px;
}
.icn-close:before {
content: '';
height: 20px;
border-left: 1px solid #fff;
position: absolute;
transform: rotate(-45deg);
left: 8px;
}
/* ==========================================================================
SOCIAL, SKIP LINKS, AND GLOBAL MICRO-COMPONENTS
========================================================================== */
/* --------------------------------------------------------------------------
Social Icons
-------------------------------------------------------------------------- */
.social-icons__list {
list-style: none;
margin: 0;
}
.social-icons__list li {
display: inline-block;
}
.social-icons__list li a {
display: inline-block;
padding: 0 5px;
width: auto;
height: 48px;
line-height: 48px !important;
}
/* --------------------------------------------------------------------------
Skip link
-------------------------------------------------------------------------- */
.skip-link {
display: inline-block;
width: max-content;
line-height: 50px;
padding: 0 20px;
background-color: var(--button-color);
color: var(--button-text);
}
.skip-link:focus {
z-index: 9999;
position: inherit;
overflow: auto;
width: auto;
height: auto;
clip: auto;
background-color: var(--button-color);
color: var(--button-text);
}
/* ==========================================================================
CAPTIONS, BREADCRUMBS, PAGE TITLES, AND SELECTS
========================================================================== */
/* --------------------------------------------------------------------------
Section captions
-------------------------------------------------------------------------- */
.section--caption h1,
.section--caption h2,
.section--caption h3,
.section--caption h4,
.section--caption p,
.section--caption .btn,
.section--caption span.subheading {
margin-bottom: var(--section-caption-space);
}
.section--caption .rte > * {
line-height: 1.4;
}
.section--caption:last-child,
.section--caption .rte p:last-child {
margin-bottom: 0;
}
.section--caption .rte {
margin-bottom: var(--section-caption-space);
position: relative;
z-index: 1;
}
.section--caption span.subheading {
font-size: calc(var(--font-size) + 1px);
color: var(--text-color);
display: block;
}
.section--caption .btn {
font-size: var(--font-size-reset);
}
/* --------------------------------------------------------------------------
Breadcrumbs
-------------------------------------------------------------------------- */
#breadcrumb,
#breadcrumb a {
font-size: 13px;
}
#breadcrumb {
margin-top: 20px;
margin-bottom:20px;
text-align: center;
}
/* --------------------------------------------------------------------------
Page titles
-------------------------------------------------------------------------- */
h1.page-title {
margin-bottom: 40px;
text-align: center;
}
/* --------------------------------------------------------------------------
Global styled selects
-------------------------------------------------------------------------- */
.styled-select {
border: 1px solid #ddd;
border-radius: 1px;
-webkit-appearance: none;
-moz-appearance: none;
padding-left: 12px;
font-size: var(--font-size);
height: 48px;
line-height: 46px;
min-width: 165px;
margin-bottom: 10px;
background: var(--select-arrow-bg) no-repeat right #fff;
}
.styled-select::-ms-expand {
display: none;
}
/* --------------------------------------------------------------------------
Scrollbar Styles
-------------------------------------------------------------------------- */
.modal__container ::-webkit-scrollbar ,
.slideout ::-webkit-scrollbar {
width: 3px;
height: 3px;
}
.modal__container ::-webkit-scrollbar-button,
.slideout ::-webkit-scrollbar-button {
width: 0px;
height: 0px;
}
.modal__container ::-webkit-scrollbar-thumb ,
.slideout ::-webkit-scrollbar-thumb {
background: var(--text-color);
border: 0px none #ffffff;
border-radius: 50px;
}
.modal__container ::-webkit-scrollbar-thumb:hover,
.slideout ::-webkit-scrollbar-thumb:hover {
background: #ffffff;
}
.modal__container ::-webkit-scrollbar-thumb:active,
.slideout ::-webkit-scrollbar-thumb:active {
background: #000000;
}
.modal__container ::-webkit-scrollbar-track,
.slideout ::-webkit-scrollbar-track {
background: var(--dotted-color);
border: 0px none #ffffff;
border-radius: 50px;
}
.modal__container ::-webkit-scrollbar-track:hover,
.slideout ::-webkit-scrollbar-track:hover {
background: var(--dotted-color);
}
.modal__container ::-webkit-scrollbar-track:active,
.slideout ::-webkit-scrollbar-track:active {
background: #333333;
}
.modal__container ::-webkit-scrollbar-corner,
.slideout ::-webkit-scrollbar-corner {
background: transparent;
}
.drawer-sidebar {
padding: 0.5rem 1rem 1rem 1rem;
}
.sidebar--drawer_content {
margin-top: 10px;
padding: 25px;
}
/* ==========================================================================
MODALS AND POPOVERS
========================================================================== */
/* --------------------------------------------------------------------------
Modal Styles
-------------------------------------------------------------------------- */
.modal__container {
display: none;
opacity: 0;
position: absolute;
z-index: 30;
left: 50%;
top: 50%;
border: 0;
transform: translate(-50%, -50%);
webkit-transition: opacity 1.2s ease-in-out;
transition: opacity 1.2s ease-in-out;
padding: 0;
position: revert;
transition: unset;
}
.modal__inner-wrapper {
width: unset;
}
@media screen and (prefers-reduced-motion: no-preference) {
.modal__container {
transition-property: display opacity;
transition-duration: 0.2s;
transition-behavior: allow-discrete;
transition-timing-function: ease-in-out;
}
.modal__container:popover-open {
display: block;
opacity: 1;
@starting-style {
opacity: 0;
}
}
.modal__container.\:popover-open {
display: block;
opacity: 1;
}
}
.modal__container::backdrop {
background: rgba(0, 0, 0, 0.6);
}
.modal__inner-content-container {
max-height: 560px;
overflow-y: auto;
padding-right: 5px;
margin: 10px;
}
/* --------------------------------------------------------------------------
Modal Content/Box
-------------------------------------------------------------------------- */
.modal__inner-wrapper {
background-color: var(--background);
padding: 20px;
border: 1px solid #888;
max-height: 800px;
overflow-y: hidden;
position: relative;
}
@media (max-width: 980px) {
.modal__inner-wrapper {
max-height: unset;
overflow-y: unset;
}
}
.modal__inner-wrapper .loading-wrapper {
height: 100%;
}
@media (min-width: 980px) {
.modal__inner-wrapper,
.modal__container {
width: 880px;
}
}
@media (min-width: 740px) and (max-width: 979px) {
.modal__inner-wrapper,
.modal__container {
width: 90%;
}
}
@media (max-width: 980px) {
.modal__inner-wrapper,
.modal__container {
width: 100%;
}
.modal__inner-wrapper {
max-height: unset;
padding: 50px 10px 20px 10px !important;
}
}
.modal__container.modal--active {
display: block;
opacity: 1;
}
/* ==========================================================================
THIRD-PARTY LIBRARIES: PHOTOSWIPE, FLICKITY, AND POLICY HELPERS
========================================================================== */
/* --------------------------------------------------------------------------
PhotoSwipe
-------------------------------------------------------------------------- */
.pswp,.pswp__bg,.pswp__scroll-wrap{height:100%;width:100%}.pswp__container,.pswp__item,.pswp__zoom-wrap{right:0;bottom:0;top:0;left:0;position:absolute}.pswp__bg,.pswp__img--placeholder--blank{background:#fff}.pswp__button--arrow--left:hover,.pswp__button--arrow--right:hover,.pswp__button:focus,.pswp__button:hover{background-color:var(--direction-hover)}.pswp,.pswp__bg,.pswp__button,.pswp__container,.pswp__error-msg,.pswp__img,.pswp__item,.pswp__preloader,.pswp__scroll-wrap,.pswp__zoom-wrap{position:absolute}.pswp,.pswp__bg,.pswp__container,.pswp__img--placeholder,.pswp__zoom-wrap{-webkit-backface-visibility:hidden}.pswp--animate_opacity,.pswp__bg,.pswp__preloader{will-change:opacity}.pswp__link{display:block}/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license---- */.pswp{display:none;left:0;top:0;overflow:hidden;-ms-touch-action:none;touch-action:none;z-index:1500;-webkit-text-size-adjust:100%;outline:0}.pswp *{-webkit-box-sizing:border-box;box-sizing:border-box}.pswp img{max-width:none}.pswp--animate_opacity{opacity:.001;-webkit-transition:opacity 333ms cubic-bezier(.4, 0, .22, 1);transition:opacity 333ms cubic-bezier(.4, 0, .22, 1)}.pswp--open{display:block}.pswp--zoom-allowed .pswp__img{cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.pswp--zoomed-in .pswp__img{cursor:-webkit-grab;cursor:-moz-grab;cursor:grab}.pswp--dragging .pswp__img{cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:grabbing}.pswp__bg{left:0;top:0;opacity:0;-webkit-transform:translateZ(0);transform:translateZ(0)}.pswp__scroll-wrap{left:0;top:0;overflow:hidden}.pswp__container,.pswp__zoom-wrap{-ms-touch-action:none;touch-action:none}.pswp__container,.pswp__img{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.pswp__zoom-wrap{width:100%;-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top;-webkit-transition:-webkit-transform 333ms cubic-bezier(.4, 0, .22, 1);transition:transform 333ms cubic-bezier(.4, 0, .22, 1)}.pswp__bg{-webkit-transition:opacity 333ms cubic-bezier(.4, 0, .22, 1);transition:opacity 333ms cubic-bezier(.4, 0, .22, 1)}.pswp--animated-in .pswp__bg,.pswp--animated-in .pswp__zoom-wrap{-webkit-transition:none;transition:none}.pswp__item{overflow:hidden}.pswp__img{width:auto;height:auto;top:0;left:0}.pswp--ie .pswp__img{width:100%!important;height:auto!important;left:0;top:0}.pswp__error-msg{left:0;top:50%;width:100%;text-align:center;font-size:14px;line-height:16px;margin-top:-8px;color:#ccc}.pswp__error-msg a{color:#ccc;text-decoration:underline}.pswp__button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;width:45px;height:45px;margin:0;padding:0;border:1px solid var(--direction-hover);border-radius:50%!important;opacity:1;background-color:var(--direction-background);overflow:visible;-webkit-appearance:none;-webkit-transition:opacity .2s;transition:opacity .2s}.pswp--zoom-allowed .pswp__button--zoom,.pswp__button.pswp__button--zoom,.pswp__element--disabled,.pswp__ui--one-slide .pswp__button--arrow--left,.pswp__ui--one-slide .pswp__button--arrow--right,.pswp__ui--one-slide .pswp__counter{display:none}.pswp__button:focus,.pswp__button:hover{opacity:1}.pswp__button::-moz-focus-inner{padding:0;border:0}.pswp__button svg{pointer-events:none;height:12px}.pswp__ui--over-close .pswp__button--close{opacity:1}.pswp--touch .pswp__button--arrow--left,.pswp--touch .pswp__button--arrow--right{visibility:hidden}.pswp--has_mouse .pswp__button--arrow--left,.pswp--has_mouse .pswp__button--arrow--right,.pswp__ui{visibility:visible}.pswp__ui.pswp__ui--hidden{transform:translateY(200%);transition:none}.pswp__button--arrow--left,.pswp__button--arrow--right{top:50%;transform:translateY(-50%)}.pswp__button--arrow--left{left:15%}.pswp__button--arrow--right{right:15%}.pswp__button.pswp__button--close{top:10px;right:10px}.pswp__preloader{width:44px;height:44px;top:0;left:50%;margin-left:-22px;opacity:0;-webkit-transition:opacity .25s ease-out;transition:opacity .25s ease-out;direction:ltr}.pswp--css_animation .pswp__preloader--active,.pswp__preloader--active,.pswp__ui{opacity:1}.pswp__preloader__icn{width:20px;height:20px;margin:12px}.pswp__preloader--active .pswp__preloader__icn{background:url(preloader.gif) no-repeat}.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn{-webkit-animation:.5s linear infinite clockwise;animation:.5s linear infinite clockwise}.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut{-webkit-animation:1s cubic-bezier(.4,0,.22,1) infinite donut-rotate;animation:1s cubic-bezier(.4,0,.22,1) infinite donut-rotate}.pswp--css_animation .pswp__preloader__icn{background:0 0;opacity:.75;width:14px;height:14px;position:absolute;left:15px;top:15px;margin:0}.pswp--css_animation .pswp__preloader__cut{position:relative;width:7px;height:14px;overflow:hidden}.pswp--css_animation .pswp__preloader__donut{-webkit-box-sizing:border-box;box-sizing:border-box;width:14px;height:14px;border:2px solid #fff;border-radius:50%;border-left-color:transparent;border-bottom-color:transparent;position:absolute;top:0;left:0;background:0 0;margin:0}@media screen and (max-width:1024px){.pswp__preloader{position:relative;left:auto;top:auto;margin:0;float:right}}@-webkit-keyframes clockwise{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes clockwise{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes donut-rotate{0%,100%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(-140deg);transform:rotate(-140deg)}}@keyframes donut-rotate{0%,100%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(-140deg);transform:rotate(-140deg)}}.pswp__ui{-webkit-font-smoothing:auto;z-index:1550;animation:2.5s fadeIn}.pswp__top-bar{position:absolute;left:0;top:0;height:44px;width:100%}.pswp--has_mouse .pswp__button--arrow--left,.pswp--has_mouse .pswp__button--arrow--right,.pswp__caption,.pswp__top-bar{-webkit-backface-visibility:hidden;will-change:opacity;-webkit-transition:opacity 333ms cubic-bezier(.4, 0, .22, 1);transition:opacity 333ms cubic-bezier(.4, 0, .22, 1)}.pswp__caption,.pswp__top-bar{background-color:#fff}.pswp__ui--fit .pswp__caption,.pswp__ui--fit .pswp__top-bar{background-color:rgba(0,0,0,.3)}.pswp__ui--idle .pswp__button--arrow--left,.pswp__ui--idle .pswp__button--arrow--right,.pswp__ui--idle .pswp__top-bar{opacity:0}.pswp__ui--hidden .pswp__button--arrow--left,.pswp__ui--hidden .pswp__button--arrow--right,.pswp__ui--hidden .pswp__caption,.pswp__ui--hidden .pswp__top-bar{opacity:.001}.pswp__element--disabled{display:none!important}.pswp--minimal--dark .pswp__top-bar{background:0 0}
/* --------------------------------------------------------------------------
Policy pages
-------------------------------------------------------------------------- */
.shopify-policy__container{margin-top: 30px;margin-bottom: 50px;}
/* --------------------------------------------------------------------------
Unit Pricing Update
-------------------------------------------------------------------------- */
.price {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 0;
margin-bottom: 0;
}
.price dl {
margin: 0;
}
.price dd {
margin: 0 0.5em 0px 0;
}
.price--unavailable {
visibility: hidden;
}
.price--compare-price-hidden .price__compare {
display: none;
}
.price__pricing-group {
display: flex;
flex-direction: row;
align-items: center;
}
.price__regular {
display: block;
}
.price--on-sale .price__regular,
.price--on-sale .price__availability {
display: none;
}
.price__availability {
display: none;
color: var(--text-color);
font-size: 0.9em;
text-transform: uppercase;
letter-spacing: 1px;
}
.price--sold-out .price__availability {
display: block;
}
.price__sale {
display: none;
}
.price--on-sale .price__sale {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
}
.price__vendor {
color: var(--text-color);
font-size: 0.9em;
text-transform: uppercase;
margin: 5px 0 10px;
width: 100%;
-ms-flex-preferred-size: 100%;
-webkit-flex-basis: 100%;
-moz-flex-basis: 100%;
flex-basis: 100%;
}
.price__vendor--listing {
margin: 0 0 4px;
}
.price__unit {
-ms-flex-preferred-size: 100%;
-webkit-flex-basis: 100%;
-moz-flex-basis: 100%;
flex-basis: 100%;
display: none;
}
.price--unit-available .price__unit {
display: block;
}
.price-item {
color: var(--text-color);
}
.price-item--sale {
color: var(--sale-color);
}
.price--on-sale .price-item--regular {
text-decoration: line-through;
}
.price-unit-price {
color: var(--price-unit-price) !important;
font-size: 0.8em;
font-style: italic;
}
.price-item__label {
display: inline-block;
white-space: nowrap;
}
.price__badges {
display: none;
margin-top: 0;
}
.price__badge {
display: none;
align-self: center;
text-align: center;
font-size: 0.5em;
line-height: 1em;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
border: 1px solid var(--text-color);
border-radius: 2px;
padding: 0.2rem 0.5rem;
}
.price__badge--sale {
color: var(--sale-color);
border-color: var(--sale-color);
}
.price--on-sale .price__badge--sale {
display: flex;
}
.price--sold-out .price__badge--sale {
display: none;
}
.price--on-sale .price__badges,
.price--sold-out .price__badges {
display: none;
}
.price__badge--sold-out {
color: var(--text-color);
border-color: var(--text-color);
}
.price--sold-out .price__badge--sold-out {
display: flex;
}
.price__badges--listing {
margin-top: 0.5rem;
}
.price__badges--listing .price__badge {
font-size: 0.6em;
padding: 0.25rem 0.55rem;
}
/* --------------------------------------------------------------------------
Misc
-------------------------------------------------------------------------- */
.content-wrapper {
background: var(--background);
}
/* --------------------------------------------------------------------------
Section caption accents
-------------------------------------------------------------------------- */
@keyframes wipeIn {
from {
width: 0;
opacity: 0;
}
to {
width: 100%;
opacity: 1;
}
}
.highlight {
position: relative;
display: inline-block;
overflow: visible;
z-index: 1;
color: var(--accent-text-color);
}
.highlight.accent--underline::after {
content: "";
position: absolute;
left: 0;
bottom: 0px;
white-space: nowrap;
overflow: hidden;
background-color: var(--accent-color);
padding: 2px;
width: 0;
opacity: 0;
border-radius: 12px;
clip-path: ellipse(100% 100% at 50% 100%);
transform: rotate(-2.5deg);
z-index: -1;
}
.highlight.accent--highlight::after {
content: "";
position: absolute;
left: -1px;
bottom: 0;
white-space: nowrap;
overflow: hidden;
background-color: var(--accent-color);
padding: 2px;
width: 0;
height: 100%;
opacity: 0;
border-radius: 5px;
clip-path: ellipse(100% 100% at 50% 100%);
transform: rotate(-2.5deg);
z-index: -1;
}
.highlight svg {
display: none;
}
.highlight.accent--circle svg.elipse {
display: inline-block;
position: absolute;
top: 50%;
left: 60%;
transform: translate(-50%, -50%);
width: 105%;
overflow: visible;
fill: var(--accent-color);
z-index: -1;
}
.highlight.animated::after {
animation: wipeIn 1s ease-out forwards;
}
/* --------------------------------------------------------------------------
Flickity
-------------------------------------------------------------------------- */
/*! Flickity v2.2.1
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled{position:relative}.flickity-enabled:focus{outline:0}.flickity-viewport{overflow:hidden;position:relative;height:100%}.flickity-slider{position:absolute;width:100%;height:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:-webkit-grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:-webkit-grabbing;cursor:grabbing}.flickity-button{position:absolute;border:none;color:var(--direction-color);background-color:var(--direction-background);width:45px;height:45px;border:1px solid var(--direction-hover);border-radius:50%!important;margin:0;display:flex;align-items: center;justify-content:center;}.flickity-button:hover{cursor:pointer;background-color: var(--direction-hover);}.flickity-button:focus{outline:0;box-shadow:0 0 0 1px var(--keyboard-focus-color)}.flickity-button:active{opacity:.6}.flickity-button:disabled{opacity:.3;cursor:auto;pointer-events:none}.flickity-prev-next-button{top:50%;transform:translateY(-50%)}.flickity-prev-next-button.previous{left:10px}.flickity-prev-next-button.next{right:10px}.flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px}.flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px}.flickity-prev-next-button .flickity-button-icon{height:12px;color:var(--direction-color);fill:var(--direction-color);}.flickity-page-dots{position:absolute;width:100%;bottom:-25px;padding:0;margin:0;list-style:none;text-align:center;line-height:1}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{display:inline-block;width:10px;height:10px;margin:0 5px;border:1px solid #fff;background:#333;border-radius:50%;opacity:.25;cursor:pointer}.flickity-page-dots .dot.is-selected{opacity:1}
/* flickity-fade */
.flickity-enabled.is-fade .flickity-slider > * {
pointer-events: none;
z-index: 0;
}
.flickity-enabled.is-fade .flickity-slider > .is-selected {
pointer-events: auto;
z-index: 1;
}
.flickity-slider {
-ms-touch-action: pan-y;
touch-action: pan-y;
}
/* Section fade-in on scroll */
.animate-on-scroll {
opacity: 0;
transform: translateY(24px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.animate-on-scroll.is-visible {
opacity: 1;
transform: none;
}
@media (prefers-reduced-motion: reduce) {
.animate-on-scroll {
opacity: 1;
transform: none;
transition: none;
}
}
/* ==========================================================================
CUSTOM DEVELOPMENT OVERRIDES: PRODUCT CARDS, COLLECTIONS, AND HEADER STATES
========================================================================== */
/* =========================================================
PRODUCT CARD SWATCHES - 3:4 SIZE
========================================================= */
@media screen and (max-width: 980px) {
.devCollectionCardSwatch {
flex: 0 0 39px !important;
width: 39px !important;
height: 52px !important;
min-width: 39px !important;
min-height: 52px !important;
max-width: 39px !important;
max-height: 52px !important;
}
.devCollectionCardSwatchImg,
.devCollectionCardSwatch img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}
}
.devProductCardCarousel {
position: relative;
width: 100%;
overflow: hidden;
background: #eee;
}
.devProductCardCarouselTrack {
display: flex;
width: 100%;
overflow-x: auto;
overflow-y: hidden;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.devProductCardCarouselTrack::-webkit-scrollbar {
display: none;
}
.devProductCardCarouselSlide {
display: block;
flex: 0 0 100%;
width: 100%;
scroll-snap-align: start;
}
.devProductCardCarouselSlide img {
display: block;
width: 100%;
height: auto;
object-fit: contain;
}
.devProductCardCarousel {
position: relative !important;
}
.nvProductCardNav {
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: 2px !important;
pointer-events: none !important;
z-index: 5 !important;
}
.nvProductCardNav__track {
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: 1.5px !important;
background: #e7e7e7 !important;
border-radius: 999px !important;
}
.nvProductCardNav__thumb {
position: absolute !important;
left: 0 !important;
bottom: 0 !important;
height: 2px !important;
width: var(--nv-card-thumb-width, 40px);
background: #000 !important;
border-radius: 999px !important;
transform: translate3d(var(--nv-card-thumb-x, 0px), 0, 0);
will-change: transform, width;
}
.devProductCardCarouselTrack {
scroll-behavior: auto !important;
}
.devProductCardCarousel {
transition: none !important;
}
#collection-grid.nvCollectionSwitching {
opacity: 0 !important;
transition: opacity 450ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}
#collection-grid.nvCollectionVisible {
opacity: 1 !important;
transition: opacity 650ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}
.devProductCardCarousel {
position: relative !important;
width: 100% !important;
overflow: hidden !important;
}
.devProductCardCarouselTrack {
display: flex !important;
flex-wrap: nowrap !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
scrollbar-width: none !important;
-webkit-overflow-scrolling: touch !important;
touch-action: pan-x pan-y !important;
}
.devProductCardCarouselTrack::-webkit-scrollbar {
display: none !important;
}
.devProductCardCarouselSlide {
display: block !important;
flex: 0 0 100% !important;
min-width: 100% !important;
width: 100% !important;
scroll-snap-align: start !important;
}
body {
overflow-x: hidden;
}
.orbe-flags-base {
display: none !important;
}
#main-collection-product-grid {
opacity: 0;
animation: nvCollectionFadeIn 900ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
animation-delay: 750ms;
will-change: opacity;
}
@keyframes nvCollectionFadeIn {
0% { opacity: 0.00; }
5% { opacity: 0.01; }
10% { opacity: 0.02; }
15% { opacity: 0.04; }
20% { opacity: 0.07; }
25% { opacity: 0.11; }
30% { opacity: 0.16; }
35% { opacity: 0.22; }
40% { opacity: 0.29; }
45% { opacity: 0.37; }
50% { opacity: 0.46; }
55% { opacity: 0.56; }
60% { opacity: 0.66; }
65% { opacity: 0.74; }
70% { opacity: 0.81; }
75% { opacity: 0.87; }
80% { opacity: 0.92; }
85% { opacity: 0.95; }
90% { opacity: 0.97; }
95% { opacity: 0.99; }
100% { opacity: 1.00; }
}
#searchbox,
#searchbox::placeholder {
font-size: 10px !important;
font-weight: 500 !important;
}
#collection-sidebar .sortByFilter input[value="most-relevant"],
#collection-sidebar .sortByFilter input[value="best-selling"] {
display: none !important;
}
#collection-sidebar .sortByFilter input[value="most-relevant"] ~ label,
#collection-sidebar .sortByFilter input[value="best-selling"] ~ label {
display: none !important;
}
#collection-sidebar .sortByFilter li:has(input[value="most-relevant"]),
#collection-sidebar .sortByFilter li:has(input[value="best-selling"]) {
display: none !important;
}
.nvCollectionNav__thumb {
transition: none !important;
}
.nvCollectionNav__link.is-active {
color: rgba(0, 0, 0, 0.5) !important;
}
#CollectionProductGrid .product-info-inner > .price.price--listing {
padding-top: 6px !important;
}
#main-collection-product-grid {
row-gap: 12px !important;
}
#slideout-mobile-navigation .slideout__trigger-mobile-menu .hover-stroke {
stroke: #000 !important;
}
.slideout__trigger--close .slideout__trigger-mobile-menu svg.testament--apollo-close path {
stroke: #fff !important;
}
/* Active tab */
#dev_tabs-nav li.active a {
background: #fff !important;
color: #000 !important;
padding: 0px 0px !important;
}
/* Inactive tabs */
#dev_tabs-nav li:not(.active) a {
background: transparent !important;
color: #fff !important;
}
#dev_tabs-nav li a {
text-decoration: none;
font-size: var(--nav-size);
text-transform: uppercase;
padding: 8px 16px;
display: inline-block;
}
.debvSidebarHead ul#dev_tabs-nav > li.active > a {
background-color: #fff !important;
color: #000 !important;
}
.debvSidebarHead ul#dev_tabs-nav > li:not(.active) > a {
background-color: transparent !important;
color: #fff !important;
}
.product__section--buttons.product-add.dev-sticky-active .dev-express-checkout,
.product__section--buttons.product-add.dev-sticky-active .dev-accelerated-checkout,
.dev-sticky-ghost .dev-express-checkout,
.dev-sticky-ghost .dev-accelerated-checkout {
display: none !important;
}
/* Hidden by default (normal PDP) */
.dev-sticky-product-info {
display: none !important;
}
/* Show only in sticky bar */
.product__section--buttons.product-add.dev-sticky-active .dev-sticky-product-info {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
width: 100% !important;
margin: 0 0 12px 0 !important;
padding: 0 !important;
}
/* Title */
.product__section--buttons.product-add.dev-sticky-active .dev-sticky-product-title {
font-family: "BasisGrotesqueArabicPro-Black",
"Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 11px !important;
font-style: normal !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase !important;
color: #000 !important;
}
/* Price */
.product__section--buttons.product-add.dev-sticky-active .dev-sticky-product-price {
font-family: "BasisGrotesqueArabicPro-Black",
"Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 11px !important;
font-style: normal !important;
font-weight: 900 !important;
line-height: 1 !important;
color: #000 !important;
}
.product__section--buttons.product-add.dev-sticky-active .AddtoCart,
.product__section--buttons.product-add.dev-sticky-active .add,
.product__section--buttons.product-add.dev-sticky-active .js-ajax-submit {
display: block !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
}
.product__section--buttons.product-add.dev-sticky-active.dev-sticky-hidden {
pointer-events: none !important;
}
@media screen and (max-width: 980px) {
.dev-low-stock-line {
font-family: "BasisGrotesqueArabicPro-Bold",
"Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 10px !important;
font-weight: 700 !important;
font-style: normal !important;
line-height: 1 !important;
color: #8D021F !important;
text-align: left !important;
text-transform: uppercase !important;
margin: 0 0 0px 0 !important;
padding: 0 !important;
}
}
/* Klaviyo Back in Stock button */
#klaviyo-bis-button-container {
height: 35px !important;
margin-bottom: 10px !important;
}
#klaviyo-bis-button-container button[data-a11y-identifier^="bis-button"] {
height: 35px !important;
min-height: 35px !important;
width: 100% !important;
border-radius: 1px !important;
font-family: "BasisGrotesqueArabicPro-Black",
"Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
font-style: normal !important;
line-height: 35px !important;
text-transform: uppercase !important;
}
.product__section--buttons.product-add:has(#klaviyo-bis-button-container)
.dev-express-checkout,
.product__section--buttons.product-add:has(#klaviyo-bis-button-container)
.dev-accelerated-checkout {
display: none !important;
}
/* Quickview Klaviyo Back in Stock button */
#modal-quickview-cart #klaviyo-bis-button-container {
height: 35px !important;
margin-bottom: 10px !important;
}
#modal-quickview-cart #klaviyo-bis-button-container button[data-a11y-identifier^="bis-button"] {
height: 35px !important;
min-height: 35px !important;
width: 100% !important;
border-radius: 1px !important;
font-family: "BasisGrotesqueArabicPro-Black",
"Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
font-style: normal !important;
line-height: 35px !important;
text-transform: uppercase !important;
}
/* Hide express checkout when BIS exists in quickview */
#modal-quickview-cart .product__section--buttons.product-add:has(#klaviyo-bis-button-container)
.dev-express-checkout,
#modal-quickview-cart .product__section--buttons.product-add:has(#klaviyo-bis-button-container)
.dev-accelerated-checkout {
display: none !important;
}
.product__section--buttons.product-add {
opacity: 1 !important;
transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1) !important;
will-change: opacity;
}
.product__section--buttons.product-add.dev-variant-fade-out {
opacity: 0 !important;
transition-duration: 180ms !important;
transition-timing-function: ease-out !important;
}
.recently-viewed-products .product-info-inner .devCollectionCardSwatch,
.recently-viewed-products .product-info-inner .devCollectionCardSwatch.is-active,
.recently-viewed-products .product-info-inner button.devCollectionCardSwatch,
.recently-viewed-products .product-info-inner button.devCollectionCardSwatch:not(.is-active) {
width: 30px !important;
min-width: 30px !important;
max-width: 30px !important;
flex: 0 0 30px !important;
height: 40px !important;
}
.recently-viewed-products .product-info-inner .devCollectionCardSwatch img,
.recently-viewed-products .product-info-inner .devCollectionCardSwatchImg {
width: 28px !important;
height: 38px !important;
object-fit: cover !important;
}
/* Recently Viewed - prevent next section hiding price */
.recently-viewed {
padding-bottom: 0px !important;
}
.recently-viewed-products {
padding-bottom: 0px !important;
}
.recently-viewed-products .product-info {
padding-bottom: 0px !important;
}
.testament--apollo-down-carrot {
width: 24px !important;
height: 24px !important;
min-width: 24px !important;
max-width: 24px !important;
margin-left: 4px !important;
pointer-events: none !important;
display: inline-block !important;
}
.dev_tab-content {
opacity: 1 !important;
transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1) !important;
will-change: opacity;
}
.dev_tab-content.dev-variant-fade-out {
opacity: 0 !important;
transition-duration: 250ms !important;
transition-timing-function: ease-out !important;
}
html.dev-mobile-nav-lock,
body.dev-mobile-nav-lock {
overflow: hidden !important;
overscroll-behavior: none !important;
}
#slideout-mobile-navigation {
max-height: 100dvh !important;
overflow-y: auto !important;
overscroll-behavior: contain !important;
-webkit-overflow-scrolling: touch;
}
#slideout-mobile-navigation .dev-modal-fade-content {
opacity: 0 !important;
transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1) !important;
will-change: opacity;
}
#slideout-mobile-navigation.dev-modal-content-visible .dev-modal-fade-content {
opacity: 1 !important;
}
#slideout-mobile-navigation {
transition:
transform 600ms cubic-bezier(0.16, 1, 0.3, 1) !important,
translate 600ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#dev_tabs-content .c-accordion__header > a.devHasSubmenu .devChevron {
display: inline-block !important;
transform: rotate(0deg) !important;
transform-origin: center center !important;
transition: transform 300ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#dev_tabs-content .c-accordion__header > a.devHasSubmenu.active .devChevron {
transform: rotate(180deg) !important;
}
/* Header cart + wishlist icon sizing */
.header-wishlist-link {
width: 24px !important;
height: 24px !important;
min-width: 24px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
svg.testament--icon-theme-wishlist.header-wishlist-icon {
width: 24px !important;
height: 24px !important;
}
svg.testament--icon-theme-bag.cart-links__link-cart--icon {
width: 24px !important;
height: 24px !important;
}
.header-section span.js-cart-count {
position: absolute;
top: 0px !important;
right: 0px !important;
background: transparent !important;
border-radius: 0 !important;
font-size: 12px !important;
font-weight: 700 !important;
line-height: 1 !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
display: block !important;
width: auto !important;
height: auto !important;
text-rendering: optimizeSpeed !important;
}
/* Cart count default homepage transparent state */
body.template-index #header-group .header-section span.js-cart-count {
color: #fff !important;
}
/* Cart count hover + sticky state */
body.template-index #header-group:hover .header-section span.js-cart-count,
body.template-index #header-group .navigation.navigation--sticky span.js-cart-count {
color: #000 !important;
}
/* ==========================================================
Mobile Menu (Hamburger) Icon
========================================================== */
.slideout__trigger-mobile-menu {
width: 32px !important;
height: 32px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
svg.testament--icon-theme-menu-bars.slideout__trigger-mobile-menu--icon {
width: 32px !important;
height: 32px !important;
}
/* Search icon wrapper */
.seeks,
.cart-links__link-search,
.header-section .seeks {
width: 24px !important;
height: 24px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
/* Search icon size */
button.button svg.testament--icon-theme-search,
.button svg.testament--icon-theme-search,
svg.testament--icon-theme-search {
width: 24px !important;
height: 24px !important;
max-width: 24px !important;
max-height: 24px !important;
min-width: 24px !important;
min-height: 24px !important;
}
/* Header enterprise fade system */
#header-group,
#header-group .header-wrapper,
#header-group .navigation,
#header-group .nav-container,
#header-group svg,
#header-group svg path,
#header-group span,
#header-group a,
#header-group button {
transition:
opacity 420ms cubic-bezier(0.22, 1, 0.36, 1),
background-color 420ms cubic-bezier(0.22, 1, 0.36, 1),
color 420ms cubic-bezier(0.22, 1, 0.36, 1),
stroke 420ms cubic-bezier(0.22, 1, 0.36, 1),
fill 420ms cubic-bezier(0.22, 1, 0.36, 1),
transform 420ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}
/* ==========================================================
Header Search Fade Progress
Keeps predictive search rendered and fades opacity on scroll
========================================================== */
predictive-search.devMobilePreSerach {
display: block !important;
opacity: 1 !important;
visibility: visible !important;
transition: opacity 1200ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}
body.nvlty-header-search-not-top predictive-search.devMobilePreSerach {
display: block !important;
opacity: 0 !important;
visibility: visible !important;
pointer-events: none !important;
}
body:not(.nvlty-header-search-not-top) predictive-search.devMobilePreSerach {
display: block !important;
opacity: 1 !important;
visibility: visible !important;
}
.slideshow__caption-wrapper--bar {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 16px !important;
box-sizing: border-box !important;
}
.slideshow__caption-wrapper--bar .slideshow__bar-link {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
padding: 0 16px !important;
box-sizing: border-box !important;
background: rgba(0, 0, 0, 0.45) !important;
color: #fff !important;
text-decoration: none !important;
}
.slideshow__caption-wrapper--bar .slideshow__bar-title {
margin: 0 !important;
padding: 0 !important;
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 35px !important;
letter-spacing: normal !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
.slideshow__caption-wrapper--bar .slideshow__bar-cta {
margin-left: auto !important;
padding: 0 !important;
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
line-height: 35px !important;
letter-spacing: normal !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
body.template-index #header-group .searchbox__input::placeholder {
color: var(--homepage-header-muted) !important;
}
.slideshow__bar-link {
transform: translateY(10px) !important;
}
/* Only Dev Collection List Slider sections */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
column-gap: 4px !important;
row-gap: 4px !important;
width: 100% !important;
}
/* Hide ALL old Flickity wrappers in this section only, including non-empty duplicate wrappers */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section > div[data-flickity-config] {
display: none !important;
}
/* Keep only the direct collection tiles as the 2x2 grid */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section > .featured__collection-product {
display: block !important;
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
}
/* Image structure */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section > .featured__collection-product .collection__item-image,
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section > .featured__collection-product .collection__item-image a,
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section > .featured__collection-product .collection__item-image img,
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section > .featured__collection-product .collection__item-image .box-ratio {
display: block !important;
width: 100% !important;
}
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .global__section > .featured__collection-product .collection__item-image img {
height: auto !important;
}
/* Collection card overlay button - only Dev Collection List Slider */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .featured__collection-product {
position: relative !important;
overflow: hidden !important;
}
/* Make image area the card surface */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .collection__item-image {
position: relative !important;
}
/* Move title block from below image onto the card */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .collection__item-details {
position: absolute !important;
left: 16px !important;
right: 16px !important;
bottom: 16px !important;
z-index: 5 !important;
width: auto !important;
margin: 0 !important;
padding: 0 !important;
}
/* Full overlay link */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .collection__item-details a {
display: block !important;
width: 100% !important;
text-decoration: none !important;
}
/* Semi-transparent bar */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .collection--title.mobBtn {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
width: 100% !important;
height: 25px !important;
min-height: 25px !important;
margin: 0 !important;
padding: 0 16px !important;
box-sizing: border-box !important;
background: rgba(0, 0, 0, 0.45) !important;
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 35px !important;
letter-spacing: normal !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
/* Add SHOP NOW on the right */
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList .collection--title.mobBtn::after {
content: "SHOP NOW";
margin-left: auto !important;
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
line-height: 35px !important;
letter-spacing: normal !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
body.template-index div#header-group #logo .whiteLogo {
display: inline-block !important;
}
body.template-index div#header-group #logo .blackLogo {
display: none !important;
}
body.template-index div#header-group .header-wishlist-count {
display: inline !important;
visibility: visible !important;
}
@media screen and (max-width: 980px) {
body.template-index #header-group {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
z-index: 9999 !important;
background: transparent !important;
}
body.template-index #header-group .header-wrapper,
body.template-index #header-group .navigation,
body.template-index #header-group .nav-container {
background: transparent !important;
}
body.template-index #header-group .navigation.navigation--sticky {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
z-index: 9999 !important;
background: #fff !important;
}
body.template-index #header-group .navigation.navigation--sticky .nav-container,
body.template-index #header-group .navigation.navigation--sticky .devMobilePreSerach {
background: #fff !important;
}
}
/* Homepage mobile load state: force overlay icons white */
@media screen and (max-width: 980px) {
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu,
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu svg,
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu svg *,
body.template-index #header-group .navigation:not(.navigation--sticky) .cart-links__link-cart,
body.template-index #header-group .navigation:not(.navigation--sticky) .cart-links__link-cart button,
body.template-index #header-group .navigation:not(.navigation--sticky) .cart-links__link-cart svg,
body.template-index #header-group .navigation:not(.navigation--sticky) .cart-links__link-cart svg *,
body.template-index #header-group .navigation:not(.navigation--sticky) .header-wishlist-link,
body.template-index #header-group .navigation:not(.navigation--sticky) .header-wishlist-icon,
body.template-index #header-group .navigation:not(.navigation--sticky) .header-wishlist-icon *,
body.template-index #header-group .navigation:not(.navigation--sticky) svg.testament--icon-theme-search,
body.template-index #header-group .navigation:not(.navigation--sticky) svg.testament--icon-theme-search * {
color: #fff !important;
stroke: #fff !important;
fill: none !important;
}
body.template-index #header-group .navigation.navigation--sticky,
body.template-index #header-group .navigation.navigation--sticky * {
color: #000 !important;
stroke: #000 !important;
}
}
/* Homepage mobile load state: remaining black header items */
@media screen and (max-width: 980px) {
body.template-index #header-group .navigation:not(.navigation--sticky) #logo,
body.template-index #header-group .navigation:not(.navigation--sticky) #logo a,
body.template-index #header-group .navigation:not(.navigation--sticky) #logo img,
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu--icon,
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu--icon *,
body.template-index #header-group .navigation:not(.navigation--sticky) .searchbox__input,
body.template-index #header-group .navigation:not(.navigation--sticky) .searchbox__input::placeholder,
body.template-index #header-group .navigation:not(.navigation--sticky) .js-cart-count,
body.template-index #header-group .navigation:not(.navigation--sticky) .header-wishlist-count {
color: #fff !important;
-webkit-text-fill-color: #fff !important;
stroke: #fff !important;
}
body.template-index #header-group .navigation:not(.navigation--sticky) #logo .blackLogo {
display: none !important;
}
body.template-index #header-group .navigation:not(.navigation--sticky) #logo .whiteLogo {
display: flex !important;
}
}
/* Homepage mobile load state: hamburger + divider lines */
@media screen and (max-width: 980px) {
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu svg,
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu svg g,
body.template-index #header-group .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu svg path,
body.template-index #header-group .navigation:not(.navigation--sticky) svg.testament--icon-theme-menu-bars,
body.template-index #header-group .navigation:not(.navigation--sticky) svg.testament--icon-theme-menu-bars g,
body.template-index #header-group .navigation:not(.navigation--sticky) svg.testament--icon-theme-menu-bars path {
color: #fff !important;
stroke: #fff !important;
fill: none !important;
}
body.template-index #header-group .navigation:not(.navigation--sticky) .nav-container::after,
body.template-index #header-group .navigation:not(.navigation--sticky) predictive-search.devMobilePreSerach::after {
background: #e7e7e7 !important;
border-color: #e7e7e7 !important;
}
}
@media (hover: hover) and (pointer: fine) {
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars,
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars path {
fill: none !important;
stroke: #e7e7e7 !important;
}
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars {
color: #e7e7e7 !important;
}
}
/* body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars */
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars {
color: #fff !important;
}
/* ==========================================================================
FINAL MOBILE/TABLET OVERRIDES
========================================================================== */
/* ========================================================================== */
/* FINAL MOBILE V1 - OVERRIDES & FIXES */
/* ========================================================================== */
.header-wishlist-link {
transform: translateX(5px) !important;
}
@media screen and (max-width: 980px) {
body.template-index div[id*="__dev_collection_clist_slider"].devCollectionList
.global__section > .featured__collection-product:nth-of-type(n+7) {
transform: translateY(4px) !important;
}
}
.template-product .recently-viewed {
margin-top: 0px !important;
}
#mini-cart .devOrderSummary .subtotal {
margin-bottom: 5px !important;
}
#mini-cart .devOrderSummary .subtotal {
padding-top: 5px !important;
margin-bottom: 5px !important;
}
div.nvlty-cart-rewards-block,
.nvlty-cart-rewards-block,
.nvlty-cart-rewards-block * {
display: none !important;
visibility: hidden !important;
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* ==========================================================================
PRODUCT DETAIL PAGE OVERRIDES
========================================================================== */
/* PDP: remove all bottom header lines */
body.template-product #header-group .navigation,
body.template-product #header-group .nav-container,
body.template-product #header-group .header-wrapper {
border-bottom: none !important;
box-shadow: none !important;
}
body.template-product #header-group .nav-container::after,
body.template-product #header-group .navigation::after,
body.template-product #header-group .header-wrapper::after,
body.template-product #header-group .nav-container::before,
body.template-product #header-group .navigation::before,
body.template-product #header-group .header-wrapper::before {
display: none !important;
content: none !important;
}
#swym-atw-pdp-button {
margin-bottom: 0 !important;
}
#swym-atw-button-container {
display: none !important;
}
.product-title-row {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 16px;
}
.product-title-row .product-title {
flex: 1;
margin: 0;
}
.custom-pdp-wishlist {
all: unset;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
flex: 0 0 auto;
}
.custom-pdp-wishlist,
.custom-pdp-wishlist.is-active,
.custom-pdp-wishlist.added,
.custom-pdp-wishlist.atw-button-added {
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.devNativeProductGallerySizeLabel {
border-radius: 1px !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-weight: 700 !important;
height: 25px !important;
padding: 0 10px !important;
pointer-events: none !important;
position: absolute !important;
bottom: 14px !important;
right: 14px !important;
top: auto !important;
left: auto !important;
white-space: nowrap !important;
z-index: 50 !important;
background: rgba(0, 0, 0, 0.5) !important;
color: #fff !important;
font-size: 12px !important;
line-height: 24px !important;
letter-spacing: normal !important;
opacity: 1 !important;
text-indent: 0 !important;
visibility: visible !important;
}
.collection__page-product .product-badge.model-size,
.collection__page-product .devCollectionProductLabel.model-size,
.product-index .product-badge.model-size {
display: none !important;
}
html.nvlty-cart-open,
body.nvlty-cart-open {
overflow: hidden !important;
height: 100% !important;
touch-action: none !important;
}
.nvlty-cart-open .nvlty-cart-scroll-area {
overflow-y: auto !important;
-webkit-overflow-scrolling: touch !important;
touch-action: pan-y !important;
overscroll-behavior: contain !important;
}
#slideout-ajax-cart .js-mini-cart-loader,
#slideout-ajax-cart .loading-wrapper,
#slideout-ajax-cart .loading-ripple {
display: none !important;
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
}
#modal-quickview-cart .AddtoCart[disabled] ~ .dev-express-checkout,
#modal-quickview-cart .AddtoCart:disabled ~ .dev-express-checkout {
display: none !important;
}
#modal-quickview-cart button.AddtoCart[disabled][type="submit"] {
display: none !important;
}
/* ==========================================================
Quick View - Notify Me button
========================================================== */
#modal-quickview-cart .dev-quickview-notify {
display: none;
}
#modal-quickview-cart .AddtoCart:disabled + .dev-quickview-notify {
display: flex !important;
align-items: center;
justify-content: center;
width: 100%;
height: 35px;
min-height: 35px;
border: 0;
border-radius: 1px;
background: #000;
color: #fff;
font-family: "BasisGrotesqueArabicPro-Black",
"Basis Grotesque Arabic Pro",
Arial,
sans-serif;
font-size: 12px;
font-weight: 900;
line-height: 35px;
text-transform: uppercase;
cursor: pointer;
margin-bottom: 10px;
}
.devPdpColorSwatches {
margin: 0 0 0px 0;
}
.devPdpColorSwatches__label {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
text-transform: uppercase;
margin-bottom: 15px;
}
.devPdpColorSwatches__items {
display: flex;
align-items: flex-start;
justify-content: flex-start;
gap: 4px;
flex-wrap: nowrap;
overflow-x: auto;
}
.devPdpColorSwatch {
display: block;
width: 54px;
aspect-ratio: 3 / 4;
border: 1px solid transparent;
padding: 0;
background: #f2f2f2;
flex: 0 0 auto;
overflow: hidden;
}
.devPdpColorSwatch.is-active {
border-color: #000;
}
.devPdpColorSwatch img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
html.dev-mobile-nav-lock,
body.dev-mobile-nav-lock {
overflow: hidden !important;
overscroll-behavior: none !important;
position: static !important;
}
#slideout-mobile-navigation {
position: fixed !important;
inset: 0 auto 0 0 !important;
width: 100vw !important;
height: 100dvh !important;
max-height: 100dvh !important;
margin: 0 !important;
overflow: hidden !important;
}
#slideout-mobile-navigation .mobile-menu {
height: 100dvh !important;
max-height: 100dvh !important;
overflow-y: auto !important;
}
#slideout-mobile-navigation::backdrop {
position: fixed !important;
inset: 0 !important;
width: 100vw !important;
height: 100dvh !important;
background: rgba(0, 0, 0, 0.70) !important;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.site-overlay,
.js-slideout-overlay {
position: fixed !important;
inset: 0 !important;
width: 100vw !important;
height: 100dvh !important;
}
body.slideout-left--open .js-slideout-overlay.site-overlay {
position: fixed !important;
inset: 0 !important;
width: 100vw !important;
height: 100dvh !important;
opacity: 1 !important;
visibility: visible !important;
background: rgba(0, 0, 0, 0.90) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
z-index: 30 !important;
}
.dev2-menu {
display: block !important;
width: 100%;
padding: 0;
margin: 0;
}
.dev2-menu ul {
margin: 0;
padding: 0;
list-style: none;
}
.dev2-menu .c-accordion__header {
margin: 0;
padding: 0;
}
.dev2-menu .c-accordion__link {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
.dev2-menu .c-accordion__link {
font-weight: 700 !important;
}
body.template-index #header-group .navigation:not(.navigation--sticky)
.devMobilePreSerach .searchbox__input {
color: #fff;
}
body.template-index #header-group:hover .navigation:not(.navigation--sticky) predictive-search.devMobilePreSerach .devInputWrapper.active input#searchbox.searchbox__input,
body.template-index #header-group:hover .navigation:not(.navigation--sticky) predictive-search.devMobilePreSerach .devInputWrapper.active input#searchbox.searchbox__input:hover,
body.template-index #header-group:hover .navigation:not(.navigation--sticky) predictive-search.devMobilePreSerach .devInputWrapper.active input#searchbox.searchbox__input:focus {
color: #fff !important;
-webkit-text-fill-color: #fff !important;
caret-color: #fff !important;
}
body.template-index #header-group:hover .navigation:not(.navigation--sticky) .devMobilePreSerach,
body.template-index #header-group:hover .navigation:not(.navigation--sticky) .devInputWrapper {
color: #fff !important;
}
/* ==========================================================================
NVLTY / TOLY UPDATES INTEGRATED OVERRIDE LAYER
==========================================================================
This section contains the former TolyUpdates.css content.
Important:
- It intentionally remains after the base stylesheet to preserve cascade.
- Rules are kept in their existing purpose-led sections.
- Viewport-specific rules remain inside their section context so mobile and
tablet behavior stays traceable.
========================================================================== */
/* =========================================================
NVLTY Custom (CSS)
Version: DRAFT
Last Hygiene: 29/06/2026
========================================================= */
/* =========================================================
01. FONTS / TOKENS
========================================================= */
/* ---------------------------------------------------------
Font files
--------------------------------------------------------- */
/* "BasisGrotesqueArabicPro-Black" */
@font-face {
font-family: "BasisGrotesqueArabicPro-Black";
src: url("/cdn/shop/files/BasisGrotesqueArabicPro-Black.woff2?v=1780061010") format("woff2");
font-weight: 900;
font-style: normal;
}
/* "BasisGrotesqueArabicPro" */
@font-face {
font-family: "BasisGrotesqueArabicPro";
src: url("/cdn/shop/files/BasisGrotesqueArabicPro-Regular.woff2?v=1780061033") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}
/* "BasisGrotesqueArabicPro-Bold" */
@font-face {
font-family: "BasisGrotesqueArabicPro-Bold";
src: url("/cdn/shop/files/BasisGrotesqueArabicPro-Bold.woff2?v=1780061016") format("woff2");
font-weight: 700;
font-style: normal;
font-display: swap;
}
/* "BasisGrotesqueArabicPro-Medium" */
@font-face {
font-family: "BasisGrotesqueArabicPro-Medium";
src: url("/cdn/shop/files/BasisGrotesqueArabicPro-Medium.woff2?v=1780061027") format("woff2");
font-weight: 500;
font-style: normal;
font-display: swap;
}
/* =========================================================
02. Global Base / Resets
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* h2 */
h2 {
font-size: 14px !important;
}
/* .rte p */
.rte p {
font-size: 16px !important;
}
/* .money */
.money {
font-size: 11px !important;
line-height: 1.00 !important;
}
/* h3 */
h3 {
font-family: "BasisGrotesqueArabicPro-Black", sans-serif !important;
font-size: 20px !important;
font-weight: 900 !important;
}
/* h2.h4 */
h2.h4 {
font-family: "BasisGrotesqueArabicPro-Black", sans-serif !important;
font-size: 20px !important;
font-weight: 900 !important;
}
/* .rte[style*="margin-bottom: 0px"] p */
.rte[style*="margin-bottom: 0px"] p {
font-family: "BasisGrotesqueArabicPro-Regular", sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 768px)
--------------------------------------------------------- */
@media screen and (max-width: 768px) {
/* body:not(.template-index) input[type="search"]::placeholder */
body:not(.template-index) input[type="search"]::placeholder {
color: #000 !important;
opacity: 1 !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* .price-item--regular, .price-item--regular .money */
.price-item--regular, .price-item--regular .money {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
line-height: 12px !important;
font-weight: 900 !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 767px)
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
/* body.template-product .swym-wishlist-collections-v2 */
body.template-product .swym-wishlist-collections-v2 {
display: none !important;
opacity: 0 !important;
pointer-events: none !important;
visibility: hidden !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 749px)
--------------------------------------------------------- */
@media screen and (max-width: 749px) {
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2-container */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2-container {
transform: translateX(-8px) !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2 */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2 {
background: transparent !important;
color: #000 !important;
height: 22px !important;
max-height: 22px !important;
max-width: 18px !important;
min-height: 22px !important;
min-width: 18px !important;
opacity: 1 !important;
width: 18px !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2 svg */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2 svg {
display: none !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover, body:has(form[action="/cart"]) .swym-wishlist-col... */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover, body:has(form[action="/cart"]) .swym-wishlist-collections-v2:focus, body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover::before, body:has(form[action="/cart"]) .swym-wishlist-collections-v2:focus::before {
background-color: #000 !important;
color: #000 !important;
opacity: 1 !important;
visibility: visible !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover, body:has(form[action="/cart"]) .swym-wishlist-col... */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover, body:has(form[action="/cart"]) .swym-wishlist-collections-v2:focus, body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover *, body:has(form[action="/cart"]) .swym-wishlist-collections-v2:focus * {
background: transparent !important;
background-color: transparent !important;
color: #000 !important;
fill: none !important;
opacity: 1 !important;
stroke: #000 !important;
visibility: visible !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover::before, body:has(form[action="/cart"]) .swym-wish... */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2:hover::before, body:has(form[action="/cart"]) .swym-wishlist-collections-v2:focus::before {
background-color: #000 !important;
opacity: 1 !important;
visibility: visible !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2-container, body:has(form[action="/cart"]) .swym-wishlist... */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2-container, body:has(form[action="/cart"]) .swym-wishlist-collections-v2 {
cursor: pointer !important;
pointer-events: auto !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2::before */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 375 375' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25 25H350V350L187.5 250L25 350V25Z' fill='none' stroke='black' stroke-width='37.5' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='4'/%3E%3C/svg%3E") !important;
-webkit-mask-position: center !important;
-webkit-mask-repeat: no-repeat !important;
-webkit-mask-size: contain !important;
background-color: #000 !important;
content: "" !important;
display: block !important;
height: 22px !important;
mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 375 375' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25 25H350V350L187.5 250L25 350V25Z' fill='none' stroke='black' stroke-width='37.5' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='4'/%3E%3C/svg%3E") !important;
mask-position: center !important;
mask-repeat: no-repeat !important;
mask-size: contain !important;
opacity: 1 !important;
visibility: visible !important;
width: 18px !important;
pointer-events: none !important;
}
/* body:has(form[action="/cart"]) .swym-wishlist-collections-v2.swym-added::before, body:has(form[action="/cart"]) .swym... */
body:has(form[action="/cart"]) .swym-wishlist-collections-v2.swym-added::before, body:has(form[action="/cart"]) .swym-wishlist-collections-v2[aria-pressed="true"]::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 375 375' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25 25H350V350L187.5 250L25 350V25Z' fill='black' stroke='black' stroke-width='37.5' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='4'/%3E%3C/svg%3E") !important;
background-color: #000 !important;
mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 375 375' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25 25H350V350L187.5 250L25 350V25Z' fill='black' stroke='black' stroke-width='37.5' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='4'/%3E%3C/svg%3E") !important;
}
}
/* =========================================================
03. Header + Announcement
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* body.template-index #header-group .navigation */
body.template-index #header-group .navigation {
background: transparent !important;
overflow: hidden !important;
position: relative !important;
}
body.template-index #header-group .navigation.navigation--sticky,
body.template-index #header-group .navigation.navigation--sticky .nav-container,
body.template-index #header-group .navigation.navigation--sticky predictive-search.devMobilePreSerach {
background: #fff !important;
}
body.template-index #header-group .navigation.navigation--sticky,
body.template-index #header-group .navigation.navigation--sticky a,
body.template-index #header-group .navigation.navigation--sticky button,
body.template-index #header-group .navigation.navigation--sticky svg,
body.template-index #header-group .navigation.navigation--sticky .js-cart-count,
body.template-index #header-group .navigation.navigation--sticky .header-wishlist-count {
color: #000 !important;
stroke: #000 !important;
}
body.template-index #header-group .navigation.navigation--sticky svg path {
stroke: #000 !important;
}
/* body.template-index #header-group .devHeaderFrostLayer */
body.template-index #header-group .devHeaderFrostLayer {
-webkit-backdrop-filter: blur(18px) !important;
backdrop-filter: blur(18px) !important;
background: linear-gradient(
to bottom,
rgba(255,255,255,0.92) 0%,
rgba(255,255,255,0.68) 38%,
rgba(255,255,255,0.32) 70%,
rgba(255,255,255,0) 100%
) !important;
inset: 0 !important;
opacity: 0 !important;
pointer-events: none !important;
position: absolute !important;
transition: none !important;
z-index: 0 !important;
}
body.template-index #header-group .navigation.navigation--sticky .devHeaderFrostLayer {
opacity: 0 !important;
display: none !important;
}
/* body.template-index #header-group .navigation > *:not(.devHeaderFrostLayer) */
body.template-index #header-group .navigation > *:not(.devHeaderFrostLayer) {
position: relative !important;
z-index: 1 !important;
}
/* body.template-index div#header-group:hover .grid__wrapper.nav-container, body.template-index div#header-group .naviga... */
body.template-index div#header-group:hover .grid__wrapper.nav-container, body.template-index div#header-group .navigation.navigation--sticky .grid__wrapper.nav-container, div#header-group .grid__wrapper.nav-container, .header-section .navigation {
border-bottom: none !important;
box-shadow: none !important;
}
/* .nav-container */
.nav-container {
grid-template-columns: 3fr 6fr 3fr !important;
height: 45px !important;
min-height: 45px !important;
max-height: 45px !important;
display: grid !important;
align-items: center !important;
position: relative !important;
}
@media screen and (max-width: 980px) {
div#header-group .mobile-menu__trigger {
grid-column: 1 !important;
justify-self: start !important;
}
div#header-group .shopping__cart-links {
grid-column: 3 !important;
justify-self: end !important;
}
div#header-group #logo a {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
}
/* Center section (logo) - true viewport center */
#logo {
position: absolute !important;
left: 50% !important;
top: 50% !important;
transform: translate(-50%, -50%) !important;
z-index: 3 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
height: 45px !important;
width: auto !important;
margin: 0 !important;
padding: 0 !important;
pointer-events: auto !important;
}
/* .shopping__cart-links */
.shopping__cart-links {
align-items: center !important;
display: flex !important;
height: 45px !important;
justify-content: flex-end !important;
}
/* .shop__logo.a-left */
.shop__logo.a-left {
text-align: center;
}
/* svg.testament--icon-theme-user.account-button__icon */
svg.testament--icon-theme-user.account-button__icon {
height: 18px !important;
max-height: 18px !important;
max-width: 18px !important;
min-height: 18px !important;
min-width: 18px !important;
width: 18px !important;
}
/* body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-menu-bars, body.templat... */
body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-menu-bars, body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-bag, body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-search {
color: #000 !important;
stroke: #000 !important;
}
/* body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-menu-bars path, body.te... */
body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-menu-bars path, body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-bag path, body.template-index div#header-group .navigation.navigation--sticky svg.testament--icon-theme-search path {
stroke: #000 !important;
}
/* body.template-index div#header-group:hover svg.account-button__icon, body.template-index div#header-group:hover svg.a... */
body.template-index div#header-group:hover svg.account-button__icon, body.template-index div#header-group:hover svg.account-button__icon path {
color: #000 !important;
stroke: #000 !important;
}
/* .devFiltersActive div#header-group .shopify-section:nth-child(2), .devFiltersActive div#header-group .shopify-section... */
.devFiltersActive div#header-group .shopify-section:nth-child(2), .devFiltersActive div#header-group .shopify-section:nth-child(3), .devFiltersActive header.announcement__bar-section {
z-index: 0;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
body.template-index #header-group .devHeaderFrostLayer {
opacity: 0 !important;
display: none !important;
background: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
transition: none !important;
}
/* .testament--icon-theme-bag.cart-links__link-cart--icon */
.testament--icon-theme-bag.cart-links__link-cart--icon {
height: 18px !important;
width: 18px !important;
}
/* .cart-links__link-cart--icon */
.cart-links__link-cart--icon {
margin-right: 5px !important;
}
/* .announcement__bar-section .flickity-viewport */
.announcement__bar-section .flickity-viewport {
height: 25px !important;
}
/* .announcement__bar-section .announcement__carousel-item */
.announcement__bar-section .announcement__carousel-item {
align-items: center !important;
display: flex !important;
height: 25px !important;
justify-content: center !important;
}
/* .announcement__bar-section .announcement__carousel-item p */
.announcement__bar-section .announcement__carousel-item p {
line-height: 25px !important;
margin: 0 !important;
}
@media screen and (max-width: 980px) {
div#header-group #logo img {
width: 112px !important;
max-width: 112px !important;
height: auto !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* .announcement__bar-section, .announcement__bar-section p, .announcement__bar-section strong, .announcement__carousel-... */
.announcement__bar-section, .announcement__bar-section p, .announcement__bar-section strong, .announcement__carousel-item p, .announcement__carousel-item strong {
font-size: 9px !important;
font-family: 'BasisGrotesqueArabicPro-Black', sans-serif !important;
font-weight: 900;
font-style: normal;
}
}
@media screen and (max-width: 980px) {
body:not(.template-index) div#header-group #logo .whiteLogo {
display: none !important;
}
body:not(.template-index) div#header-group #logo .blackLogo {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
body:not(.template-index) div#header-group #logo {
left: 50% !important;
transform: translate(-50%, -50%) !important;
width: auto !important;
}
}
/* =========================================================
04. Search
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
predictive-search.devMobilePreSerach {
position: relative !important;
}
predictive-search.devMobilePreSerach::after {
content: "" !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: 1px !important;
background: currentColor !important;
pointer-events: none !important;
}
/* predictive-search.devMobilePreSerach */
predictive-search.devMobilePreSerach {
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
padding: 0 16px !important;
}
/* .navigation.navigation--sticky predictive-search.devMobilePreSerach */
.navigation.navigation--sticky predictive-search.devMobilePreSerach {
border-bottom: none !important;
}
/* .devMobilePreSerach .devInputWrapper */
.devMobilePreSerach .devInputWrapper {
align-items: center !important;
border: none !important;
border-radius: 0 !important;
box-sizing: border-box !important;
display: flex !important;
height: 35px !important;
justify-content: flex-start !important;
text-align: left !important;
}
/* .devMobilePreSerach input#searchbox */
.devMobilePreSerach input#searchbox {
background-color: transparent !important;
border: none !important;
box-shadow: none !important;
box-sizing: border-box !important;
color: var(--background) !important;
font-size: 12px !important;
height: 32px !important;
line-height: 32px !important;
margin-bottom: 0 !important;
outline: none !important;
padding: 0 0 0 0px !important;
width: 100% !important;
display: block !important;
flex: 1 1 auto !important;
min-width: 0 !important;
text-align: left !important;
}
/* .devMobilePreSerach input#searchbox::placeholder */
.devMobilePreSerach input#searchbox::placeholder {
color: var(--background) !important;
font-size: 10px !important;
line-height: 32px !important;
}
/* .devMobilePreSerach .devSearchButtons */
.devMobilePreSerach .devSearchButtons {
align-items: center !important;
display: flex !important;
height: 34px !important;
flex: 0 0 auto !important;
margin-left: auto !important;
}
/* .devMobilePreSerach button#search_button */
.devMobilePreSerach button#search_button {
align-items: center !important;
background: transparent !important;
border: none !important;
display: flex !important;
height: 34px !important;
justify-content: center !important;
margin-bottom: 0 !important;
min-height: 34px !important;
padding: 0 !important;
width: 38px !important;
}
/* .devMobilePreSerach button#search_button svg */
.devMobilePreSerach button#search_button svg {
height: 17px !important;
width: 17px !important;
}
/* .devMobilePreSerach .devSearchClose */
.devMobilePreSerach .devSearchClose {
display: none !important;
}
/* body.template-index div#header-group:hover .devMobilePreSerach .devInputWrapper, body.template-index div#header-group... */
body.template-index div#header-group:hover .devMobilePreSerach .devInputWrapper,
body.template-index div#header-group .navigation.navigation--sticky .devMobilePreSerach .devInputWrapper {
border-color: #e7e7e7 !important;
}
/* body.template-index div#header-group:hover .devMobilePreSerach input#searchbox, body.template-index div#header-group ... */
body.template-index div#header-group:hover .devMobilePreSerach input#searchbox, body.template-index div#header-group .navigation.navigation--sticky .devMobilePreSerach input#searchbox {
-webkit-text-fill-color: #000 !important;
color: #000 !important;
}
/* body.template-index div#header-group:hover .devMobilePreSerach input#searchbox::placeholder, body.template-index div#... */
body.template-index div#header-group:hover .devMobilePreSerach input#searchbox::placeholder, body.template-index div#header-group .navigation.navigation--sticky .devMobilePreSerach input#searchbox::placeholder {
color: #000 !important;
opacity: 1 !important;
}
/* body.template-index div#header-group:hover .devMobilePreSerach button#search_button, body.template-index div#header-g... */
body.template-index div#header-group:hover .devMobilePreSerach button#search_button, body.template-index div#header-group .navigation.navigation--sticky .devMobilePreSerach button#search_button {
color: #000 !important;
}
/* body.template-index div#header-group:hover .devMobilePreSerach button#search_button svg, body.template-index div#head... */
body.template-index div#header-group:hover .devMobilePreSerach button#search_button svg, body.template-index div#header-group:hover .devMobilePreSerach button#search_button path, body.template-index div#header-group .navigation.navigation--sticky .devMobilePreSerach button#search_button svg, body.template-index div#header-group .navigation.navigation--sticky .devMobilePreSerach button#search_button path {
color: #000 !important;
fill: #000 !important;
}
/* predictive-search.devMobilePreSerach form .devInputWrapper .devSearchButtons button#search_button svg.testament--icon... */
predictive-search.devMobilePreSerach form .devInputWrapper .devSearchButtons button#search_button svg.testament--icon-theme-search {
block-size: 18px !important;
height: 18px !important;
inline-size: 18px !important;
max-height: 18px !important;
max-width: 18px !important;
min-height: 18px !important;
min-width: 18px !important;
width: 18px !important;
}
/* body:not(.template-index) .devMobilePreSerach */
body:not(.template-index) .devMobilePreSerach {
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
padding: 0 16px !important;
}
/* body:not(.template-index) .devMobilePreSerach .searchbox__input */
body:not(.template-index) .devMobilePreSerach .searchbox__input {
height: 100% !important;
}
/* body:not(.template-index) predictive-search.devMobilePreSerach */
body:not(.template-index) predictive-search.devMobilePreSerach {
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
padding: 0 16px !important;
}
/* body:not(.template-index) .devMobilePreSerach .devInputWrapper */
body:not(.template-index) .devMobilePreSerach .devInputWrapper {
align-items: center !important;
border-radius: 0 !important;
box-sizing: border-box !important;
display: flex !important;
height: 35px !important;
border-bottom: 1px #e7e7e7 !important;
}
/* body:not(.template-index) .devMobilePreSerach input#searchbox */
body:not(.template-index) .devMobilePreSerach input#searchbox {
-webkit-text-fill-color: #000 !important;
background-color: transparent !important;
border: none !important;
box-shadow: none !important;
box-sizing: border-box !important;
color: #000 !important;
font-size: 12px !important;
height: 32px !important;
line-height: 32px !important;
margin-bottom: 0 !important;
outline: none !important;
padding: 0 0 0 0px !important;
width: 100% !important;
text-align: left !important;
}
/* body:not(.template-index) .devMobilePreSerach input#searchbox::placeholder */
body:not(.template-index) .devMobilePreSerach input#searchbox::placeholder {
color: #000 !important;
font-size: 10px !important;
line-height: 32px !important;
opacity: 1 !important;
}
/* body:not(.template-index) .devMobilePreSerach .devSearchButtons */
body:not(.template-index) .devMobilePreSerach .devSearchButtons {
align-items: center !important;
display: flex !important;
height: 34px !important;
}
/* body:not(.template-index) .devMobilePreSerach button#search_button */
body:not(.template-index) .devMobilePreSerach button#search_button {
align-items: center !important;
background: transparent !important;
border: none !important;
color: #000 !important;
display: flex !important;
height: 34px !important;
justify-content: center !important;
margin-bottom: 0 !important;
min-height: 34px !important;
padding: 0 !important;
width: 38px !important;
}
/* body:not(.template-index) .devMobilePreSerach button#search_button svg */
body:not(.template-index) .devMobilePreSerach button#search_button svg {
color: #000 !important;
height: 17px !important;
width: 17px !important;
}
/* body:not(.template-index) .devMobilePreSerach .devSearchClose */
body:not(.template-index) .devMobilePreSerach .devSearchClose {
display: none !important;
}
body.template-index div#header-group predictive-search.devMobilePreSerach {
color: #e7e7e7 !important;
}
body.template-index div#header-group:hover predictive-search.devMobilePreSerach,
body.template-index div#header-group .navigation.navigation--sticky predictive-search.devMobilePreSerach {
color: var(--header-link-color) !important;
}
body:not(.template-index) predictive-search.devMobilePreSerach {
color: #e7e7e7 !important;
}
@media screen and (max-width: 980px) {
predictive-search.devMobilePreSerach form,
predictive-search.devMobilePreSerach .devInputWrapper {
padding-left: 0 !important;
margin-left: 0 !important;
}
predictive-search.devMobilePreSerach input#searchbox,
body:not(.template-index) predictive-search.devMobilePreSerach input#searchbox,
body:not(.template-index) .devMobilePreSerach input#searchbox {
padding-left: 0 !important;
text-indent: 0 !important;
text-align: left !important;
}
}
@media screen and (max-width: 980px) {
predictive-search.devMobilePreSerach .devSearchButtons {
margin-left: auto !important;
margin-right: 0 !important;
padding-right: 0 !important;
}
predictive-search.devMobilePreSerach button#search_button {
justify-content: flex-end !important;
padding-right: 0 !important;
}
}
@media screen and (max-width: 980px) {
body.template-product predictive-search.devMobilePreSerach,
body.nvlty-template-product predictive-search.devMobilePreSerach,
body.nvlty-header-search-not-top predictive-search.devMobilePreSerach {
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
padding: 0 !important;
border: 0 !important;
overflow: hidden !important;
}
}
@media screen and (max-width: 980px) {
nav.navigation .nav-container {
position: relative !important;
}
nav.navigation .nav-container::after {
content: "" !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: 1px !important;
background: #000 !important;
pointer-events: none !important;
}
body.template-index div#header-group nav.navigation .nav-container::after {
background: var(--background) !important;
}
body.template-index div#header-group:hover nav.navigation .nav-container::after,
body.template-index div#header-group nav.navigation.navigation--sticky .nav-container::after,
body:not(.template-index) div#header-group nav.navigation .nav-container::after {
background: #e7e7e7 !important;
}
}
}
/* =========================================================
05. Buttons + Shared Components
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* a.btn, .btn, a.button, .button, .secondary-button */
a.btn, .btn, a.button, .button, .secondary-button {
align-items: center !important;
box-sizing: border-box !important;
display: inline-flex !important;
font-size: 12px !important;
height: 35px !important;
justify-content: center !important;
line-height: 1 !important;
max-width: 100% !important;
min-height: 35px !important;
padding: 0 24px !important;
white-space: nowrap !important;
width: fit-content !important;
}
/* .devSecondaryBtn */
.devSecondaryBtn {
box-sizing: border-box !important;
margin-left: 16px !important;
margin-right: 16px !important;
margin-top: -2px !important;
max-width: calc(100vw - 32px) !important;
text-align: center !important;
width: calc(100vw - 32px) !important;
}
/* .devSecondaryBtn .secondary-button */
.devSecondaryBtn .secondary-button {
border-width: 1px !important;
box-sizing: border-box !important;
max-width: 100% !important;
width: 100% !important;
}
/* .devSecondaryBtn .secondary-button, .devSecondaryBtn .secondary-button:hover, .devSecondaryBtn .secondary-button:focu... */
.devSecondaryBtn .secondary-button, .devSecondaryBtn .secondary-button:hover, .devSecondaryBtn .secondary-button:focus, .devSecondaryBtn .secondary-button:active {
background: #000 !important;
border: 1px solid #000 !important;
color: #fff !important;
opacity: 1 !important;
}
/* button.js-accordion-header.c-accordion__header[aria-expanded="true"] + .filter.c-accordion__panel */
button.js-accordion-header.c-accordion__header[aria-expanded="true"] + .filter.c-accordion__panel {
display: block;
min-height: unset !important;
opacity: 1;
transform: unset;
}
/* #swym-atw-button-container */
#swym-atw-button-container {
align-self: flex-start !important;
margin-top: 0 !important;
padding-top: 0 !important;
}
/* #swym-atw-pdp-button */
#swym-atw-pdp-button {
margin-top: 0 !important;
padding-top: 0 !important;
}
/* #swym-atw-pdp-button::before */
#swym-atw-pdp-button::before {
transform: none !important;
}
/* .devQuantityWithBtn */
.devQuantityWithBtn {
height: auto;
min-height: 24px;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* a.secondary-button[href="/collections"]::before, a.secondary-button[href="/collections"]::after, a.secondary-button[h... */
a.secondary-button[href="/collections"]::before, a.secondary-button[href="/collections"]::after, a.secondary-button[href="/collections"]:hover::before, a.secondary-button[href="/collections"]:hover::after {
background: #000 !important;
border-color: #000 !important;
}
/* .testament--icon-theme-search, .testament--icon-theme-search *, .testament--icon-theme-search:hover, .testament--icon... */
.testament--icon-theme-search, .testament--icon-theme-search *, .testament--icon-theme-search:hover, .testament--icon-theme-search:hover * {
fill: none !important;
}
/* .testament--icon-theme-search .nv-search-stroke */
.testament--icon-theme-search .nv-search-stroke {
stroke: currentColor !important;
}
/* .scrollup */
.scrollup {
display: none !important;
}
/* .devChevron */
.devChevron {
height: 25px !important;
width: 25px !important;
}
/* .btn */
.btn {
font-weight: bold;
letter-spacing: normal;
min-height: 65px;
padding: 0px 40px;
}
/* .slideout::backdrop */
.slideout::backdrop {
-webkit-backdrop-filter: blur(5px) saturate(150%) !important;
backdrop-filter: blur(5px) saturate(150%) !important;
background: rgba(0, 0, 0, 0.22) !important;
}
/* .no-popover .slideout */
.no-popover .slideout {
display: block;
opacity: 1;
}
/* .site-overlay */
.site-overlay {
-webkit-backdrop-filter: blur(18px) saturate(150%) !important;
backdrop-filter: blur(18px) saturate(150%) !important;
background: rgba(0, 0, 0, 0.22) !important;
height: 100vh;
left: 0;
opacity: 0;
position: fixed;
top: 0;
transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
visibility: hidden;
width: 100vw;
z-index: 30;
}
/* svg.devChevron */
svg.devChevron {
height: 30px !important;
min-height: 30px !important;
min-width: 30px !important;
width: 30px !important;
}
/* svg.devChevron path */
svg.devChevron path {
stroke-width: 2 !important;
}
/* .devQuantityWithBtn .devRemoveBtn */
.devQuantityWithBtn .devRemoveBtn {
align-items: center !important;
display: flex !important;
flex: 0 0 32px !important;
height: 24px !important;
justify-content: center !important;
width: 32px !important;
}
/* .devQuantityWithBtn .devRemoveBtn .removeImage */
.devQuantityWithBtn .devRemoveBtn .removeImage {
display: block !important;
height: 12px !important;
object-fit: contain !important;
width: 12px !important;
}
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* .devSecondaryBtn */
.devSecondaryBtn {
margin-top: -10px !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 767px)
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
/* #swym-atw-pdp-button #swym-atw-pdp-button-icon */
#swym-atw-pdp-button #swym-atw-pdp-button-icon {
display: none !important;
}
/* #swym-atw-button-container */
#swym-atw-button-container {
align-self: flex-start !important;
height: 16px !important;
margin-left: auto !important;
margin-right: 0 !important;
min-width: 16px !important;
width: 16px !important;
}
/* #swym-atw-pdp-button */
#swym-atw-pdp-button {
align-items: flex-start !important;
color: #000 !important;
display: flex !important;
height: 16px !important;
justify-content: flex-end !important;
min-width: 16px !important;
padding: 21px 0 0 0 !important;
width: 16px !important;
}
/* #swym-atw-pdp-button::before */
#swym-atw-pdp-button::before {
-webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 375 375' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='none' stroke='black' stroke-width='37.5' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='4' d='M25 25H350V350L187.5 250L25 350V25Z'%3E%3C/path%3E%3C/svg%3E") center / contain no-repeat !important;
background-color: currentColor !important;
content: "" !important;
display: block !important;
height: 16px !important;
mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 375 375' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='none' stroke='black' stroke-width='37.5' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='4' d='M25 25H350V350L187.5 250L25 350V25Z'%3E%3C/path%3E%3C/svg%3E") center / contain no-repeat !important;
transform: translateY(21px) !important;
width: 16px !important;
}
/* body.template-product #swym-atw-button-container, body.template-product #swym-atw-pdp-button */
body.template-product #swym-atw-button-container, body.template-product #swym-atw-pdp-button {
display: none !important;
opacity: 1 !important;
pointer-events: auto !important;
visibility: visible !important;
}
}
/* =========================================================
06. Homepage Sections
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* .gallery__btn-wrapper a.btn */
.gallery__btn-wrapper a.btn {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
border: 0.5px solid #fff !important;
box-shadow: none !important;
color: #fff !important;
isolation: isolate !important;
overflow: hidden !important;
position: relative !important;
z-index: 0 !important;
}
/* .gallery__btn-wrapper a.btn::before */
.gallery__btn-wrapper a.btn::before {
-webkit-backdrop-filter: blur(12px) saturate(140%) !important;
backdrop-filter: blur(12px) saturate(140%) !important;
background: rgba(28, 22, 20, 0.18) !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12),
inset 0 0 18px rgba(255, 255, 255, 0.05) !important;
content: "" !important;
display: block !important;
inset: 0 !important;
opacity: 1 !important;
position: absolute !important;
z-index: -1 !important;
}
/* .gallery__btn-wrapper a.btn::after */
.gallery__btn-wrapper a.btn::after {
content: none !important;
display: none !important;
}
/* .slideshow-section .slideshow__btn-wrapper a.btn */
.slideshow-section .slideshow__btn-wrapper a.btn {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
border: 0.5px solid #fff !important;
box-shadow: none !important;
color: #fff !important;
isolation: isolate !important;
overflow: hidden !important;
position: relative !important;
z-index: 0 !important;
}
/* .slideshow-section .slideshow__btn-wrapper a.btn::before */
.slideshow-section .slideshow__btn-wrapper a.btn::before {
-webkit-backdrop-filter: blur(12px) saturate(140%) !important;
backdrop-filter: blur(12px) saturate(140%) !important;
background: rgba(28, 22, 20, 0.18) !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12),
inset 0 0 18px rgba(255, 255, 255, 0.05) !important;
content: "" !important;
display: block !important;
inset: 0 !important;
opacity: 1 !important;
position: absolute !important;
z-index: -1 !important;
}
/* .slideshow-section .slideshow__btn-wrapper a.btn::after */
.slideshow-section .slideshow__btn-wrapper a.btn::after {
content: none !important;
display: none !important;
}
/* .slideshow__caption.slide-1625671734793532ca-1 .slideshow__caption-wrapper .rte, .slideshow__caption.slide-1625671734... */
.slideshow__caption.slide-1625671734793532ca-1 .slideshow__caption-wrapper .rte, .slideshow__caption.slide-1625671734793532ca-1 .slideshow__caption-wrapper .rte p, .slideshow__caption.slide-1625671734793532ca-1 .slideshow__caption-wrapper .rte p * {
font: 400 14px/1 "BasisGrotesqueArabicPro", sans-serif !important;
}
/* .slideshow .slideshow__caption .slideshow__caption-wrapper h2.slideshow__title */
.slideshow .slideshow__caption .slideshow__caption-wrapper h2.slideshow__title {
font-family: "BasisGrotesqueArabicPro-Bold", sans-serif !important;
font-size: 16px !important;
line-height: 1 !important;
}
/* .slideshow__caption .rte p */
.slideshow__caption .rte p {
font-family: "BasisGrotesqueArabicPro-Light", sans-serif !important;
font-size: 16px !important;
line-height: 1 !important;
}
/* .devCollectionList p.collection--title.bold--title */
.devCollectionList p.collection--title.bold--title {
font-size: 16px !important;
padding-left: 15px;
padding-right: 15px;
}
/* .devCollectionList .collection__item-details */
.devCollectionList .collection__item-details {
padding: 10px 8px 10px;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* .slideshow__caption */
.slideshow__caption {
left: 16px !important;
max-width: none !important;
right: 16px !important;
width: auto !important;
}
/* .slideshow__caption .slideshow__caption-wrapper */
.slideshow__caption .slideshow__caption-wrapper {
display: block !important;
box-sizing: border-box;
padding-left: 0 !important;
padding-right: 0 !important;
width: 100% !important;
}
/* .slideshow__btn-wrapper */
.slideshow__btn-wrapper {
display: block !important;
margin-right: 0 !important;
width: 100% !important;
}
/* .slideshow__btn-wrapper .btn */
.slideshow__btn-wrapper .btn {
align-items: center !important;
display: flex !important;
justify-content: center !important;
line-height: 1 !important;
box-sizing: border-box;
width: 100% !important;
}
/* [id^="shopify-section-"][id*="__featured_collection"] .flickity-viewport */
[id^="shopify-section-"][id*="__featured_collection"] .flickity-viewport {
margin-top: 0 !important;
}
/* .nvlty-seen__heading */
.nvlty-seen__heading {
font-family: "BasisGrotesqueArabicPro-Black", sans-serif !important;
font-size: 20px !important;
font-weight: 900 !important;
}
/* p strong */
p strong {
font-family: "BasisGrotesqueArabicPro-Regular", sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
}
/* .gallery__caption:has(.gallery__btn-wrapper .btn[href="/collections"]) */
.gallery__caption:has(.gallery__btn-wrapper .btn[href="/collections"]) {
left: 16px !important;
max-width: none !important;
right: 16px !important;
width: auto !important;
}
/* .gallery__caption:has(.gallery__btn-wrapper .btn[href="/collections"]) .gallery__caption-wrapper */
.gallery__caption:has(.gallery__btn-wrapper .btn[href="/collections"]) .gallery__caption-wrapper {
box-sizing: border-box;
padding-left: 0 !important;
padding-right: 0 !important;
width: 100% !important;
}
/* .gallery__btn-wrapper:has(.btn[href="/collections"]) */
.gallery__btn-wrapper:has(.btn[href="/collections"]) {
display: block !important;
margin-right: 0 !important;
width: 100% !important;
}
/* .gallery__btn-wrapper .btn[href="/collections"] */
.gallery__btn-wrapper .btn[href="/collections"] {
align-items: center !important;
box-sizing: border-box;
display: flex !important;
justify-content: center !important;
width: 100% !important;
}
/* p:has(a[href="https://instagram.com/nvltylondon"]), p:has(a[href="https://www.tiktok.com/@nvltylondon"]), p:has(a[hre... */
p:has(a[href="https://instagram.com/nvltylondon"]), p:has(a[href="https://www.tiktok.com/@nvltylondon"]), p:has(a[href*="snapchat.com/add/nvltylondon"]) {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 11px !important;
font-weight: 700 !important;
/* p:has(a[href="https://instagram.com/nvltylondon"]) a, p:has(a[href="https://www.tiktok.com/@nvltylondon"]) a, p:has(a... */
p:has(a[href="https://instagram.com/nvltylondon"]) a, p:has(a[href="https://www.tiktok.com/@nvltylondon"]) a, p:has(a[href*="snapchat.com/add/nvltylondon"]) a {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 11px !important;
font-weight: 700 !important;
}
/* p:has(strong):has(br) strong */
p:has(strong):has(br) strong {
font-family: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
}
/* p:has(strong) strong */
p:has(strong) strong {
font-family: "BasisGrotesqueArabicPro-Medium", sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
}
/* p:has(strong) */
p:has(strong) {
margin-bottom: 0px !important;
margin-top: -7px !important;
}
/* p:has(strong):has(br) */
p:has(strong):has(br) {
font-family: "BasisGrotesqueArabicPro-Regular", sans-serif !important;
font-size: 12px !important;
font-weight: 400 !important;
line-height: 1.50 !important;
margin-bottom: 5px !important;
margin-top: 0 !important;
}
/* p:has(strong):has(br) br */
p:has(strong):has(br) br {
line-height: 1 !important;
}
/* .devNewsText, .devNewsText p, .devNewsText strong */
.devNewsText, .devNewsText p, .devNewsText strong {
font-family: "BasisGrotesqueArabicPro-Medium", sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* .devCollectionList .mobileLayoutGrid.grid__wrapper */
.devCollectionList .mobileLayoutGrid.grid__wrapper {
grid-gap: 0px 0px !important;
grid-template-columns: 1fr 1fr;
}
/* .gallery__image-section */
.gallery__image-section {
margin-top: -14px !important;
}
/* .nvlty-seen__item */
.nvlty-seen__item {
margin: 0 !important;
}
/* .nvlty-seen__gallery */
.nvlty-seen__gallery {
gap: 4px !important;
margin-top: -8px !important;
}
/* Fix featured collection Flickity carousel drag/scroll glitch */
.featured__collection-carousel.flickity-enabled {
overflow: hidden !important;
}
.featured__collection-carousel .flickity-viewport {
overflow: visible !important;
touch-action: pan-y pan-x !important;
}
.featured__collection-carousel .flickity-slider {
will-change: transform;
}
.featured__collection-carousel .featured__collection-product {
min-width: 0 !important;
box-sizing: border-box !important;
}
/* Stop blue page/background showing on right edge */
.featured__collection-carousel,
.featured__collection-carousel .flickity-viewport,
.featured__collection-carousel .flickity-slider {
background: #fff !important;
}
/* ---------------------------------------------------------
@media screen and (max-width: 350px)
--------------------------------------------------------- */
@media screen and (max-width: 350px) {
/* .devCollectionList .collection__item-details */
.devCollectionList .collection__item-details {
padding: 8px 10px;
}
}
/* =========================================================
07. Collection Lists + Product Cards
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* section[data-section-type="featured-collection"] [id^="featured_collection--"].featured__collection-carousel > .flick... */
section[data-section-type="featured-collection"] [id^="featured_collection--"].featured__collection-carousel > .flickity-viewport {
min-height: 363.625px !important;
}
/* .devCollectionCardSwatch */
.devCollectionCardSwatch {
flex: 0 0 30px !important;
height: 40px !important;
max-height: 40px !important;
max-width: 30px !important;
min-height: 40px !important;
min-width: 30px !important;
width: 30px !important;
}
/* .devCollectionCardSwatchImg, .devCollectionCardSwatch img */
.devCollectionCardSwatchImg, .devCollectionCardSwatch img {
height: 100% !important;
object-fit: cover !important;
width: 100% !important;
}
/* .prod-title */
.prod-title {
font-size: 11px !important;
line-height: 1 !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatches::-webkit-sc... */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatches::-webkit-scrollbar {
display: none;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatch */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatch {
background: none !important;
border: 1px solid transparent !important;
display: block !important;
flex: 0 0 40px !important;
height: 40px !important;
overflow: hidden !important;
padding: 0 !important;
width: 30px !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatch.is-active */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatch.is-active {
border-color: #000 !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatchImg */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatchImg {
display: block !important;
height: 100% !important;
object-fit: cover !important;
width: 100% !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .prod-title */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .prod-title {
display: block !important;
font-size: 11px !important;
font-weight: 900 !important;
line-height: 1.05 !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .price, section[data-section-type="fea... */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .price, section[data-section-type="featured-collection"] [id^="featured_collection--"] .money {
font-size: 11px !important;
font-weight: 900 !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] */
section[data-section-type="featured-collection"] [id^="featured_collection--"] {
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
max-width: 100vw !important;
padding-left: 0 !important;
padding-right: 0 !important;
width: 100vw !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .featured__collection-product */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .featured__collection-product {
margin-right: 4px !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .devProduct-image */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .devProduct-image {
margin-bottom: 2px !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .product-info */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .product-info {
box-sizing: border-box;
padding-left: 8px !important;
padding-right: 8px !important;
margin-top: 0 !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatches */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCollectionCardSwatches {
display: flex !important;
gap: 4px !important;
margin: 4px 0 6px !important;
overflow-x: auto !important;
scrollbar-width: none;
margin-bottom: 6px !important;
margin-top: 0 !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCardColorLabel */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .devCardColorLabel {
display: block !important;
font-size: 10px !important;
line-height: 1.0 !important;
margin-top: 2px !important;
text-transform: uppercase;
margin-bottom: -4px !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .price */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .price {
margin-top: 0 !important;
}
/* section[data-section-type="featured-collection"] [id^="featured_collection--"] .price dl */
section[data-section-type="featured-collection"] [id^="featured_collection--"] .price dl {
margin-top: 0 !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products */
section[data-section-type="recently-viewed"] .recently-viewed-products {
margin-left: 0px !important;
margin-right: 0px !important;
max-width: 100vw !important;
padding-left: 0 !important;
padding-right: 0 !important;
width: 100vw !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product */
section[data-section-type="recently-viewed"] .recently-viewed-products__product {
margin-right: 4px !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .product-info */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .product-info {
box-sizing: border-box;
margin-top: 2px !important;
padding-left: 8px !important;
padding-right: 8px !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatches */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatches {
margin-bottom: 2px !important;
margin-top: 0 !important;
display: flex !important;
gap: 4px !important;
margin: 0px 0 6px !important;
overflow-x: auto !important;
scrollbar-width: none;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatches::-webkit-s... */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatches::-webkit-scrollbar {
display: none;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatch */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatch {
background: none !important;
border: 1px solid transparent !important;
display: block !important;
flex: 0 0 40px !important;
height: 40px !important;
margin: 0 !important;
max-height: 40px !important;
max-width: 40px !important;
min-height: 40px !important;
min-width: 40px !important;
overflow: hidden !important;
padding: 0 !important;
width: 40px !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatch.is-active */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatch.is-active {
border-color: #000 !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatchImg, section[... */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatchImg, section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCollectionCardSwatch img {
display: block !important;
height: 100% !important;
max-width: none !important;
object-fit: cover !important;
width: 100% !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .prod-title */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .prod-title {
display: block !important;
font-size: 11px !important;
font-weight: 900 !important;
line-height: 1.05 !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCardColorLabel */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .devCardColorLabel {
display: block !important;
font-size: 10px !important;
line-height: 1.1 !important;
margin-bottom: 2px !important;
margin-top: 2px !important;
text-transform: uppercase;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .price, section[data-section-type="re... */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .price, section[data-section-type="recently-viewed"] .recently-viewed-products__product .money {
font-size: 11px !important;
font-weight: 900 !important;
}
/* section[data-section-type="recently-viewed"] .recently-viewed-products__product .price, section[data-section-type="re... */
section[data-section-type="recently-viewed"] .recently-viewed-products__product .price, section[data-section-type="recently-viewed"] .recently-viewed-products__product .price dl {
margin-top: 0 !important;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* .recently-viewed-products .section-title h2, #recently-viewed-products .section-title h2 */
.recently-viewed-products .section-title h2, #recently-viewed-products .section-title h2 {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase;
}
/* .collection__item-details .btn.collection--title, .collection__item-details a:hover .btn.collection--title, .collecti... */
.collection__item-details .btn.collection--title, .collection__item-details a:hover .btn.collection--title, .collection__item-details .btn.collection--title:hover, .collection__item-details:hover .btn.collection--title {
background: none !important;
background-color: transparent !important;
border: none !important;
box-shadow: none !important;
color: #000 !important;
display: inline-block;
line-height: 1.4 !important;
margin: 0 !important;
opacity: 1 !important;
padding: 0 !important;
scale: none !important;
text-indent: 0 !important;
transform: none !important;
transition: none !important;
visibility: visible !important;
width: auto;
}
/* .collection__item-details .btn.collection--title::before, .collection__item-details .btn.collection--title::after */
.collection__item-details .btn.collection--title::before, .collection__item-details .btn.collection--title::after {
content: none !important;
display: none !important;
}
/* .collection__item img, .collection__item:hover img, .collection__item .media, .collection__item:hover .media, .card-w... */
.collection__item img, .collection__item:hover img, .collection__item .media, .collection__item:hover .media, .card-wrapper img, .card-wrapper:hover img, .card-wrapper .media, .card-wrapper:hover .media, .collection-card img, .collection-card:hover img, .collection-card .media, .collection-card:hover .media {
animation: none !important;
scale: 1 !important;
transform: none !important;
transition: none !important;
}
/* .product-info .product-info-inner > .price.price--listing */
.product-info .product-info-inner > .price.price--listing {
margin-top: 6px !important;
}
/* ---------------------------------------------------------
@media screen and (max-width: 767px)
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
/* .mobileLayoutGrid.grid__wrapper.product-loop.featured__collection .featured__collection-product */
.mobileLayoutGrid.grid__wrapper.product-loop.featured__collection .featured__collection-product {
margin: 0 !important;
min-width: 0 !important;
width: 100% !important;
}
/* .product-info .product-info-inner > .price.price--listing .price__regular, .product-info .product-info-inner > .price... */
.product-info .product-info-inner > .price.price--listing .price__regular, .product-info .product-info-inner > .price.price--listing .price__regular .price-item, .product-info .product-info-inner > .price.price--listing .price__regular .money {
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
/* .mobileLayoutGrid.grid__wrapper.product-loop.featured__collection .collection__item-image img */
.mobileLayoutGrid.grid__wrapper.product-loop.featured__collection .collection__item-image img {
display: block !important;
width: 100% !important;
}
/* .mobileLayoutGrid.grid__wrapper.product-loop.featured__collection */
.mobileLayoutGrid.grid__wrapper.product-loop.featured__collection {
box-sizing: border-box !important;
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
padding-left: 16px !important;
padding-right: 16px !important;
column-gap: 4px !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* .product-color-name.devVariantColor.devCardColorLabel */
.product-color-name.devVariantColor.devCardColorLabel {
background: transparent !important;
display: inline !important;
padding: 0 !important;
width: auto !important;
}
/* .featured__collection-product .devProduct-image */
.featured__collection-product .devProduct-image {
position: relative !important;
}
/* .featured__collection-product .devCollectionProductLabel */
.featured__collection-product .devCollectionProductLabel {
background: rgba(0, 0, 0, 0.5) !important;
border-radius: 1px !important;
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 8px !important;
font-weight: 700 !important;
height: 18px !important;
left: 0px !important;
letter-spacing: normal !important;
line-height: 20px !important;
padding: 0 5px !important;
pointer-events: none !important;
position: absolute !important;
top: 0px !important;
white-space: nowrap !important;
z-index: 50 !important;
}
/* .recently-viewed .section-title h2 */
.recently-viewed .section-title h2 {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase !important;
}
/* .recently-viewed */
.recently-viewed {
margin-top: -20px !important;
}
}
/* =========================================================
08. Collection Page + Filters
========================================================= */
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* .collection__page .devCollectionMainWrap .prod-title */
.collection__page .devCollectionMainWrap .prod-title {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-weight: 900 !important;
}
/* .collection__page .devCollectionMainWrap .price, .collection__page .devCollectionMainWrap .money */
.collection__page .devCollectionMainWrap .price, .collection__page .devCollectionMainWrap .money {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-weight: 900 !important;
}
/* .collection__page .devCollectionMainWrap .product-info */
.collection__page .devCollectionMainWrap .product-info {
margin-top: 2px !important;
}
/* .collection__page .devCollectionMainWrap .devCollectionCardSwatches */
.collection__page .devCollectionMainWrap .devCollectionCardSwatches {
display: flex !important;
gap: 4px !important;
height: 40px !important;
min-height: 40px !important;
max-height: 40px !important;
margin: 0 0 6px !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scrollbar-width: none !important;
contain: layout paint !important;
}
/* .collection__page .devCollectionMainWrap .devCollectionCardSwatches::-webkit-scrollbar */
.collection__page .devCollectionMainWrap .devCollectionCardSwatches::-webkit-scrollbar {
display: none;
}
/* .collection__page .devCollectionMainWrap .devCollectionCardSwatch */
.collection__page .devCollectionMainWrap .devCollectionCardSwatch {
background: none !important;
border: 1px solid transparent !important;
box-sizing: border-box !important;
display: block !important;
flex: 0 0 30px !important;
height: 40px !important;
min-width: 30px !important;
max-width: 30px !important;
overflow: hidden !important;
padding: 0 !important;
width: 30px !important;
}
/* .collection__page .devCollectionMainWrap .devCollectionCardSwatch.is-active */
.collection__page .devCollectionMainWrap .devCollectionCardSwatch.is-active {
border: 1px solid #000 !important;
}
/* .collection__page .devCollectionMainWrap .devCollectionCardSwatchImg */
.collection__page .devCollectionMainWrap .devCollectionCardSwatchImg {
display: block;
height: 100%;
object-fit: cover;
width: 100%;
}
/* .collection__page .devCollectionMainWrap .devCardColorLabel */
.collection__page .devCollectionMainWrap .devCardColorLabel {
background: none !important;
display: block;
font-size: 10px !important;
line-height: 1.1 !important;
margin-top: 2px;
text-transform: uppercase;
}
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* .collection__page .devCollectionMainWrap .prod-title */
.collection__page .devCollectionMainWrap .prod-title {
line-height: 1.05 !important;
}
/* .collection__page .devCollectionMainWrap .devCardColorLabel */
.collection__page .devCollectionMainWrap .devCardColorLabel {
margin-bottom: -4px !important;
}
/* .collection__page .devCollectionMainWrap .price */
.collection__page .devCollectionMainWrap .price {
margin-top: 0 !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* .collectionTitle */
.collectionTitle {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 18px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
}
/* .devCollectionhead .collectionTitle */
.devCollectionhead .collectionTitle {
align-items: flex-end !important;
display: flex !important;
gap: 6px !important;
}
/* .collection__page #main-collection-product-grid .collection__page-product .devProduct-image */
.collection__page #main-collection-product-grid .collection__page-product .devProduct-image {
overflow: hidden !important;
position: relative !important;
}
/* .collection__page #main-collection-product-grid .collection__page-product .devProduct-image.devCardCarouselReady .reveal */
.collection__page #main-collection-product-grid .collection__page-product .devProduct-image.devCardCarouselReady .reveal {
display: none !important;
}
/* .collection__page #main-collection-product-grid .devCollectionCardImageCarousel */
.collection__page #main-collection-product-grid .devCollectionCardImageCarousel {
-webkit-overflow-scrolling: touch !important;
aspect-ratio: 100 / 137.4496644295302 !important;
display: flex !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
scrollbar-width: none !important;
width: 100% !important;
}
/* .collection__page #main-collection-product-grid .devCollectionCardImageCarousel::-webkit-scrollbar */
.collection__page #main-collection-product-grid .devCollectionCardImageCarousel::-webkit-scrollbar {
display: none !important;
}
/* .collection__page #main-collection-product-grid .devCollectionCardImageSlide */
.collection__page #main-collection-product-grid .devCollectionCardImageSlide {
flex: 0 0 100% !important;
scroll-snap-align: start !important;
scroll-snap-stop: always !important;
width: 100% !important;
}
/* .collection__page #main-collection-product-grid .devCollectionCardImageSlide img */
.collection__page #main-collection-product-grid .devCollectionCardImageSlide img {
display: block !important;
height: 100% !important;
object-fit: cover !important;
width: 100% !important;
}
/* .collection__page-product .devProduct-image */
.collection__page-product .devProduct-image {
position: relative !important;
}
/* .collection__page-product .devCollectionCardImageCarousel */
.collection__page-product .devCollectionCardImageCarousel {
-webkit-overflow-scrolling: touch !important;
display: flex !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
scrollbar-width: none !important;
width: 100% !important;
}
/* .collection__page-product .devCollectionCardImageCarousel::-webkit-scrollbar */
.collection__page-product .devCollectionCardImageCarousel::-webkit-scrollbar {
display: none !important;
}
/* .collection__page-product .devCollectionCardImageSlide */
.collection__page-product .devCollectionCardImageSlide {
flex: 0 0 100% !important;
scroll-snap-align: start !important;
width: 100% !important;
}
/* .collection__page-product .devCollectionCardImageSlide img */
.collection__page-product .devCollectionCardImageSlide img {
display: block !important;
height: auto !important;
width: 100% !important;
}
/* .collection__page-product .devCollectionCardImageIndicator */
.collection__page-product .devCollectionCardImageIndicator {
background: #e7e7e7 !important;
bottom: 0 !important;
height: 2px !important;
left: 0 !important;
pointer-events: none !important;
position: absolute !important;
width: 100% !important;
z-index: 5 !important;
}
/* .collection__page-product .devCollectionCardImageIndicator span */
.collection__page-product .devCollectionCardImageIndicator span {
background: #000 !important;
border-radius: 999px !important;
bottom: 0 !important;
display: block !important;
height: 2px !important;
left: var(--dev-card-indicator-left, 0px) !important;
position: absolute !important;
width: var(--dev-card-indicator-width, 36px) !important;
}
/* .devCollectionhead */
.devCollectionhead {
display: block !important;
min-height: 0 !important;
position: relative !important;
}
/* .devCollectionHeaderBottom .devCollectionViewSelector */
.devCollectionHeaderBottom .devCollectionViewSelector {
background: #fff !important;
border: 1px solid #000 !important;
box-sizing: border-box !important;
display: flex !important;
height: 24px !important;
margin: 0 !important;
overflow: hidden !important;
width: 150px !important;
}
/* .devCollectionHeaderBottom .devCollectionViewSelectorItem */
.devCollectionHeaderBottom .devCollectionViewSelectorItem {
align-items: center !important;
background: #fff !important;
color: #000 !important;
display: flex !important;
flex: 0 0 50% !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
height: 100% !important;
justify-content: center !important;
letter-spacing: 0 !important;
line-height: 1 !important;
padding: 0 !important;
text-align: center !important;
width: 50% !important;
}
/* .devCollectionHeaderBottom .devCollectionViewSelectorItem.is-active */
.devCollectionHeaderBottom .devCollectionViewSelectorItem.is-active {
background: #000 !important;
color: #fff !important;
}
/* .collection__page.main__section */
.collection__page.main__section {
margin-top: 0 !important;
padding-top: 0 !important;
}
/* .devCollectionHeaderBottom > .devMobileFiltersPos > button.filter-toggle__trigger.sidebar--toggle.js-collection-side-... */
.devCollectionHeaderBottom > .devMobileFiltersPos > button.filter-toggle__trigger.sidebar--toggle.js-collection-side-toggle {
position: relative !important;
top: 2px !important;
}
/* #CollectionProductGrid */
#CollectionProductGrid {
padding-top: 0 !important;
margin-top: 20px !important;
}
/* .devCollectionhead .collectionTitle > span */
.devCollectionhead .collectionTitle > span {
align-items: flex-end !important;
display: inline-flex !important;
font-family: "BasisGrotesqueArabicPro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
padding-bottom: 0 !important;
transform: translate(2px, 0px) !important;
}
/* .collection__page-sidebar label */
.collection__page-sidebar label {
align-items: center;
border: 1px solid var(--dotted-color);
color: currentColor;
cursor: pointer;
display: flex !important;
font-size: 14px !important;
height: 100%;
justify-content: center;
padding: 9.5px 5px;
text-align: center;
width: 100%;
}
/* .collection__page-sidebar ul li a */
.collection__page-sidebar ul li a {
height: 100%;
}
/* .collection__page-sidebar .checkbox-indicator */
.collection__page-sidebar .checkbox-indicator {
display: none;
}
/* .collection__page-sidebar .checkbox-wrapper input:not([disabled]):checked ~ label */
.collection__page-sidebar .checkbox-wrapper input:not([disabled]):checked ~ label {
background-color: #000;
border-color: #000;
color: #fff;
}
/* .collection__page-sidebar .checkbox-wrapper input */
.collection__page-sidebar .checkbox-wrapper input {
display: block !important;
z-index: 1 !important;
}
/* .collection__page-sidebar span.filter__count */
.collection__page-sidebar span.filter__count {
display: none;
}
/* .c-accordion.c-accordion--custom-page .c-accordion__header */
.c-accordion.c-accordion--custom-page .c-accordion__header {
border-bottom: none;
border-top: 1px solid var(--dotted-color);
font-size: 15px !important;
font-weight: bold;
margin-top: 16px;
outline: none !important;
padding: 25px 0px 17px 0px;
text-transform: uppercase;
}
/* .c-accordion.c-accordion--custom-page .c-accordion__header:first-child */
.c-accordion.c-accordion--custom-page .c-accordion__header:first-child {
border-top: none;
margin-top: 0px;
padding-top: 0px;
}
/* .collection__page-sidebar .c-accordion__panel */
.collection__page-sidebar .c-accordion__panel {
display: none;
}
/* .collection__page-sidebar .c-accordion__panel.sortByFilter */
.collection__page-sidebar .c-accordion__panel.sortByFilter {
display: block;
}
/* .collection__page-sidebar .filter.c-accordion__panel */
.collection__page-sidebar .filter.c-accordion__panel {
padding: 0px !important;
}
/* .collection__page-sidebar .filter ul */
.collection__page-sidebar .filter ul {
column-gap: 8px;
display: grid;
row-gap: 8px;
}
/* .collection__page-sidebar .filter ul li */
.collection__page-sidebar .filter ul li {
margin: 0px;
}
/* .collection__page-sidebar .c-accordion__panel--2__main-list-1 ul */
.collection__page-sidebar .c-accordion__panel--2__main-list-1 ul {
grid-template-columns: 1fr 1fr 1fr;
}
/* .collection__page-sidebar .c-accordion__panel--2__main-list-1 ul label */
.collection__page-sidebar .c-accordion__panel--2__main-list-1 ul label {
text-transform: uppercase;
z-index: 999999;
}
/* .collection__page-sidebar .filter--color ul, .c-accordion__panel--2__main-list-7 ul, .c-accordion__panel--2__main-lis... */
.collection__page-sidebar .filter--color ul, .c-accordion__panel--2__main-list-7 ul, .c-accordion__panel--2__main-list-8 ul {
grid-template-columns: 1fr 1fr;
}
/* .collection__page-sidebar span.color-filter */
.collection__page-sidebar span.color-filter {
display: none !important;
}
/* .collection__page-sidebar .color-filter svg */
.collection__page-sidebar .color-filter svg {
height: 26px;
opacity: 0;
width: 26px;
}
/* .collection__page-sidebar .color-filter.current svg */
.collection__page-sidebar .color-filter.current svg {
opacity: 1;
}
/* .collection__page-sidebar .color-filter svg path */
.collection__page-sidebar .color-filter svg path {
stroke-width: 2px;
}
/* .collection__page-sidebar .filter.filter--color ul li a */
.collection__page-sidebar .filter.filter--color ul li a {
flex-direction: column;
height: auto;
}
/* .collection__page-sidebar .sortByFilter li */
.collection__page-sidebar .sortByFilter li {
padding: 0px !important;
}
/* .collection__page-sidebar .sortByFilter .checkbox-wrapper input:not([disabled]):checked ~ label */
.collection__page-sidebar .sortByFilter .checkbox-wrapper input:not([disabled]):checked ~ label {
background-color: transparent;
border: none;
color: currentColor;
padding: 0px;
}
/* .collection__page-sidebar .sortByFilter label */
.collection__page-sidebar .sortByFilter label {
border: none !important;
text-align: left !important;
}
/* .sortByFilter ul */
.sortByFilter ul {
row-gap: 0px !important;
}
/* .sortByFilter .checkbox-wrapper */
.sortByFilter .checkbox-wrapper {
align-items: center;
cursor: pointer;
display: inline-flex;
font-size: 16px;
gap: 10px;
padding: 12px 0px;
user-select: none;
width: 100%;
}
/* .collection__page-sidebar .sortByFilter .checkbox-wrapper label */
.collection__page-sidebar .sortByFilter .checkbox-wrapper label {
align-items: center;
border: none;
display: inline-flex;
font-size: 15px !important;
gap: 10px;
padding: 0px;
text-align: left;
width: auto;
}
/* .sortByFilter .checkbox-wrapper input */
.sortByFilter .checkbox-wrapper input {
display: none;
}
/* .sortByFilter .checkbox-wrapper .checkmark */
.sortByFilter .checkbox-wrapper .checkmark {
border: 1px solid #bbbcbc;
border-radius: 50%;
display: block !important;
height: 22px;
position: relative;
transition: all .2s ease;
width: 22px;
}
/* .sortByFilter .checkbox-wrapper .checkmark::after */
.sortByFilter .checkbox-wrapper .checkmark::after {
background: #000;
border-radius: 50%;
content: "";
height: 10px;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%) scale(0);
transition: transform 0.2s ease;
width: 10px;
}
/* .js-collection-side-filter .checkmark:after */
.js-collection-side-filter .checkmark:after {
transform: translate(-50%, -50%) scale(1);
}
/* .transform-zero:after */
.transform-zero:after {
transform: translate(-50%, -50%) scale(0);
}
/* .sortByFilter .checkbox-wrapper.current .checkmark:after */
.sortByFilter .checkbox-wrapper.current .checkmark:after {
transform: translate(-50%, -50%) scale(1);
}
/* .collection__page-sidebar .collectionFiltersMenu li a.current, .collection__page-sidebar .collectionFiltersMenu li a:... */
.collection__page-sidebar .collectionFiltersMenu li a.current, .collection__page-sidebar .collectionFiltersMenu li a:active {
background-color: #000;
border-color: #000;
color: #fff;
}
/* .collection__page-sidebar svg.testament--apollo-down-carrot.c-accordion__header--icon */
.collection__page-sidebar svg.testament--apollo-down-carrot.c-accordion__header--icon {
height: 10px;
width: 10px;
}
/* .collection__page-sidebar svg.testament--apollo-down-carrot.c-accordion__header--icon path */
.collection__page-sidebar svg.testament--apollo-down-carrot.c-accordion__header--icon path {
stroke: currentColor;
stroke-width: 4px;
}
/* .collection--grid_container */
.collection--grid_container {
grid-column: unset;
width: 100% !important;
}
/* .grid__wrapper.dev_collectionWrap */
.grid__wrapper.dev_collectionWrap {
display: flex;
flex-wrap: wrap;
}
/* div#CollectionProductGrid .row.grid__wrapper.rg0 */
div#CollectionProductGrid .row.grid__wrapper.rg0 {
grid-gap: 0px;
}
/* .dev_collectionWrap .span-12.auto.devToolbarWrap */
.dev_collectionWrap .span-12.auto.devToolbarWrap {
display: none;
}
/* .template-collection main#main-content */
.template-collection main#main-content {
outline: none !important;
}
/* .collectionTopHeader .colleciton__page-title.page-title */
.collectionTopHeader .colleciton__page-title.page-title {
margin-bottom: 0px !important;
}
/* .span-12.auto.collectionTopHeader */
.span-12.auto.collectionTopHeader {
display: flex;
justify-content: space-between;
align-items: end;
margin-bottom: 25px;
}
/* .devMobileFiltersPos */
.devMobileFiltersPos {
line-height: 1;
}
/* .devMobileFiltersPos .sort__filter--triggers */
.devMobileFiltersPos .sort__filter--triggers {
display: block;
}
/* .devMobileFiltersPos .filtering__pagination */
.devMobileFiltersPos .filtering__pagination {
display: none;
}
/* .collection__filter-toggleWrapper */
.collection__filter-toggleWrapper {
height: 0;
margin-bottom: 0 !important;
padding-bottom: 0 !important;
visibility: hidden;
}
/* .devMobileFiltersPos .collection__filter-toggleWrapper */
.devMobileFiltersPos .collection__filter-toggleWrapper {
border: none;
display: flex;
margin: 0px;
padding: 0px;
height: auto;
visibility: visible;
}
/* .devFiltersActive .collection__page-sidebar */
.devFiltersActive .collection__page-sidebar {
display: block !important;
}
/* .devSidebarWrap */
.devSidebarWrap {
align-items: center;
display: flex;
font-size: 15px;
font-weight: bold;
justify-content: center;
padding: 24px 10px 39px;
position: relative;
}
/* .devSidebarWrap .filterCloseBtn */
.devSidebarWrap .filterCloseBtn {
left: -10px;
padding: 10px;
position: absolute;
}
/* .filterCloseBtn */
.filterCloseBtn {
cursor: pointer;
}
/* .devSidebarWrap .filterCloseBtn svg */
.devSidebarWrap .filterCloseBtn svg {
width: 12px;
}
/* .devSidebarWrap .filterCloseBtn svg path */
.devSidebarWrap .filterCloseBtn svg path {
stroke: #6e6e6e;
}
/* .filterCloseBtn.full */
.filterCloseBtn.full {
align-items: center;
border-radius: 5.6rem;
display: flex;
font-size: initial;
justify-content: center;
margin-top: 15px;
min-height: 44px;
}
/* .devSidebarWrap .filtering__results.js-filters-reset */
.devSidebarWrap .filtering__results.js-filters-reset {
position: absolute;
right: 0px;
}
/* .devSidebarWrap a.current_filters--clear.js-current-filter.clear-tags */
.devSidebarWrap a.current_filters--clear.js-current-filter.clear-tags {
font-size: 14px;
text-decoration: none !important;
text-transform: capitalize;
}
/* .devSidebarWrap ul.current_tags */
.devSidebarWrap ul.current_tags {
line-height: 1;
margin: 0px;
}
/* .devSidebarWrap .filtering__results ul.current_tags li */
.devSidebarWrap .filtering__results ul.current_tags li {
margin-bottom: 0px;
margin-right: 0px;
padding: 0px;
}
/* .innerFilterWrap */
.innerFilterWrap {
display: flex;
flex-direction: column;
height: calc(100% - 83px);
justify-content: space-between;
}
/* .collection__page-sidebar .c-accordion.c-accordion--custom-page */
.collection__page-sidebar .c-accordion.c-accordion--custom-page {
-ms-overflow-style: none;
overflow-x: hidden;
overflow-y: auto;
padding-bottom: 25px;
padding-top: 25px;
scrollbar-width: none;
}
/* .collection__page-sidebar .c-accordion.c-accordion--custom-page::-webkit-scrollbar */
.collection__page-sidebar .c-accordion.c-accordion--custom-page::-webkit-scrollbar {
display: none;
}
/* .devFiltersActive .devfiltersOverlay */
.devFiltersActive .devfiltersOverlay {
opacity: 1;
visibility: visible;
}
/* .devFiltersActive */
.devFiltersActive {
overflow: hidden;
}
/* .devFiltersActive .scrollup */
.devFiltersActive .scrollup {
z-index: -1;
}
/* .devFiltersActive .collection__page.main__section */
.devFiltersActive .collection__page.main__section {
z-index: 4;
}
/* .devCollectionHeaderBottom .filter-toggle__trigger.sidebar--toggle.js-collection-side-toggle */
.devCollectionHeaderBottom .filter-toggle__trigger.sidebar--toggle.js-collection-side-toggle {
background: transparent !important;
border: none !important;
height: auto !important;
line-height: 1 !important;
margin: 0 !important;
min-height: 0 !important;
padding: 0 !important;
position: static !important;
top: auto !important;
transform: none !important;
}
/* .devCollectionHeaderBottom .mobFiltersBtn svg */
.devCollectionHeaderBottom .mobFiltersBtn svg {
height: auto !important;
margin: 0 !important;
transform: none !important;
width: 20px !important;
}
/* .devCollectionHeaderBottom */
.devCollectionHeaderBottom {
display: flex !important;
gap: 16px !important;
justify-content: space-between !important;
margin-bottom: 10px !important;
margin-top: 12px !important;
align-items: center !important;
}
/* .devCollectionHeaderBottom .mobFiltersBtn */
.devCollectionHeaderBottom .mobFiltersBtn {
align-items: center !important;
column-gap: 10px !important;
display: flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
position: relative !important;
text-transform: uppercase !important;
transform: none !important;
top: 0 !important;
}
/* .devCollectionHeaderBottom .devMobileFiltersPos */
.devCollectionHeaderBottom .devMobileFiltersPos {
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
position: relative !important;
}
/* .devfiltersOverlay */
.devfiltersOverlay {
height: 100vh;
left: 0;
opacity: 0;
position: fixed;
top: 0;
transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
visibility: hidden;
width: 100vw;
z-index: 30;
-webkit-backdrop-filter: none !important;
backdrop-filter: none!important;
background: transparent !important;
}
/* .collection__page-sidebar .devSidebarWrap .filterCloseBtn */
.collection__page-sidebar .devSidebarWrap .filterCloseBtn {
left: auto !important;
right: 0 !important;
}
/* .collection__page-sidebar .filterCloseBtn .testament--apollo-close */
.collection__page-sidebar .filterCloseBtn .testament--apollo-close {
height: 18px !important;
width: 18px !important;
}
/* .collection__page-sidebar .filterCloseBtn .testament--apollo-close, .collection__page-sidebar .filterCloseBtn .testam... */
.collection__page-sidebar .filterCloseBtn .testament--apollo-close, .collection__page-sidebar .filterCloseBtn .testament--apollo-close .hover-stroke, .collection__page-sidebar .filterCloseBtn .testament--apollo-close path {
color: #000 !important;
stroke: #000 !important;
}
/* .collection__page-sidebar .filterCloseBtn */
.collection__page-sidebar .filterCloseBtn {
transform: translateX(4px) !important;
}
/* .collection__page-sidebar .devFilterBtns .filtering__results, .collection__page-sidebar .devFilterBtns .current_tags,... */
.collection__page-sidebar .devFilterBtns .filtering__results,
.collection__page-sidebar .devFilterBtns .current_tags,
.collection__page-sidebar .devFilterBtns .current_tags li {
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
/* .collection__page-sidebar .devFilterBtns .current_filters--clear.btn, .collection__page-sidebar .devFilterBtns .devFi... */
.collection__page-sidebar .devFilterBtns .current_filters--clear.btn,
.collection__page-sidebar .devFilterBtns .devFilterApplyBtn {
align-items: center !important;
box-sizing: border-box !important;
display: flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
height: 35px !important;
justify-content: center !important;
letter-spacing: 0 !important;
line-height: 1 !important;
margin: 0 !important;
min-height: 35px !important;
outline: none !important;
padding: 0 !important;
text-decoration: none !important;
text-transform: uppercase !important;
width: 100% !important;
}
/* .collection__page-sidebar .devFilterBtns .current_filters--clear.btn:hover, .collection__page-sidebar .devFilterBtns ... */
.collection__page-sidebar .devFilterBtns .current_filters--clear.btn:hover, .collection__page-sidebar .devFilterBtns .current_filters--clear.btn:focus, .collection__page-sidebar .devFilterBtns .current_filters--clear.btn:active {
background: #000 !important;
border: 1.5px solid #000 !important;
box-shadow: none !important;
color: #fff !important;
outline: none !important;
}
/* .collection__page-sidebar .devFilterBtns .devFilterApplyBtn:hover, .collection__page-sidebar .devFilterBtns .devFilte... */
.collection__page-sidebar .devFilterBtns .devFilterApplyBtn:hover, .collection__page-sidebar .devFilterBtns .devFilterApplyBtn:focus, .collection__page-sidebar .devFilterBtns .devFilterApplyBtn:active {
background: #fff !important;
border: 1.5px solid #000 !important;
box-shadow: none !important;
color: #000 !important;
outline: none !important;
}
/* .collection__page-sidebar .devFilterBtns .current_filters--clear.btn, .collection__page-sidebar .devFilterBtns .curre... */
.collection__page-sidebar .devFilterBtns .current_filters--clear.btn, .collection__page-sidebar .devFilterBtns .current_filters--clear.btn:hover, .collection__page-sidebar .devFilterBtns .current_filters--clear.btn:focus, .collection__page-sidebar .devFilterBtns .current_filters--clear.btn:active {
background: #fff !important;
border: 1.5px solid #000 !important;
color: #000 !important;
}
/* .collection__page-sidebar .devFilterBtns .devFilterApplyBtn, .collection__page-sidebar .devFilterBtns .devFilterApply... */
.collection__page-sidebar .devFilterBtns .devFilterApplyBtn, .collection__page-sidebar .devFilterBtns .devFilterApplyBtn:hover, .collection__page-sidebar .devFilterBtns .devFilterApplyBtn:focus, .collection__page-sidebar .devFilterBtns .devFilterApplyBtn:active {
background: #000 !important;
border: 1.5px solid #000 !important;
color: #fff !important;
}
/* .collection__page-sidebar .c-accordion.c-accordion--custom-page, .collection__page-sidebar .c-accordion.c-accordion--... */
.collection__page-sidebar .c-accordion.c-accordion--custom-page, .collection__page-sidebar .c-accordion.c-accordion--custom-page *, .collection__page-sidebar .sortByFilter, .collection__page-sidebar .sortByFilter * {
font-size: 14px !important;
}
/* .collection__page-sidebar .sortByFilter .checkbox-wrapper, .collection__page-sidebar .sortByFilter .checkbox-wrapper ... */
.collection__page-sidebar .sortByFilter .checkbox-wrapper, .collection__page-sidebar .sortByFilter .checkbox-wrapper label, .collection__page-sidebar .sortByFilter .checkbox-wrapper .js-hz-filter-label, .collection__page-sidebar .sortByFilter .checkbox-wrapper .js-hz-filter-label span {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
letter-spacing: 0 !important;
line-height: 1.2 !important;
text-transform: uppercase !important;
}
/* .collection__page-sidebar .sortByFilter .checkbox-wrapper */
.collection__page-sidebar .sortByFilter .checkbox-wrapper {
font-size: 12px !important;
}
/* .collection__page-sidebar .sortByFilter, .collection__page-sidebar .sortByFilter.c-accordion__panel, .collection__pag... */
.collection__page-sidebar .sortByFilter, .collection__page-sidebar .sortByFilter.c-accordion__panel, .collection__page-sidebar .sortByFilter ul {
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* .collection__page-sidebar .sortByFilter ul */
.collection__page-sidebar .sortByFilter ul {
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
margin: 0 !important;
padding: 0 !important;
}
/* .collection__page-sidebar .sortByFilter li, .collection__page-sidebar .sortByFilter .checkbox-wrapper, .collection__p... */
.collection__page-sidebar .sortByFilter li, .collection__page-sidebar .sortByFilter .checkbox-wrapper, .collection__page-sidebar .sortByFilter .js-hz-filter-label {
margin: 0 !important;
padding: 0 !important;
}
/* .collection__page-sidebar .js-accordion-header.js-accordion-is-open .devChevron, .collection__page-sidebar .sidebarFi... */
.collection__page-sidebar .js-accordion-header.js-accordion-is-open .devChevron, .collection__page-sidebar .sidebarFilterAccordian.js-accordion-is-open .devChevron {
transform: rotate(180deg) !important;
}
/* .collection__page-sidebar .collectionFiltersMenu */
.collection__page-sidebar .collectionFiltersMenu {
display: grid !important;
gap: 6px !important;
grid-template-columns: repeat(3, 1fr) !important;
list-style: none !important;
margin: 0 !important;
overflow: visible !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .collectionFiltersMenu li */
.collection__page-sidebar .collectionFiltersMenu li {
border: none !important;
box-shadow: none !important;
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
margin: 0 !important;
min-width: 0 !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .collectionFiltersMenu li a */
.collection__page-sidebar .collectionFiltersMenu li a {
cursor: pointer;
text-decoration: none !important;
align-items: center !important;
background: #fff !important;
border: 1.5px solid #e7e7e7 !important;
box-shadow: none !important;
box-sizing: border-box !important;
color: #000 !important;
display: flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
height: 100% !important;
justify-content: center !important;
letter-spacing: 0 !important;
line-height: 1 !important;
min-width: 0 !important;
overflow-wrap: anywhere !important;
padding: 0 4px !important;
text-align: center !important;
text-transform: uppercase !important;
white-space: normal !important;
width: 100% !important;
word-break: normal !important;
}
/* .collection__page-sidebar .collectionFiltersMenu li a.current */
.collection__page-sidebar .collectionFiltersMenu li a.current {
background: #000 !important;
border-color: #000 !important;
color: #fff !important;
}
/* .collection__page-sidebar .details__content ul:has(input[name="filter.v.option.size"]) */
.collection__page-sidebar .details__content ul:has(input[name="filter.v.option.size"]) {
display: grid !important;
gap: 6px !important;
grid-template-columns: repeat(3, 1fr) !important;
list-style: none !important;
margin: 0 !important;
overflow: visible !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content li:has(input[name="filter.v.option.size"]) */
.collection__page-sidebar .details__content li:has(input[name="filter.v.option.size"]) {
border: none !important;
box-shadow: none !important;
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
margin: 0 !important;
min-width: 0 !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) {
align-items: center !important;
background: #fff !important;
border: 1.5px solid #e7e7e7 !important;
box-shadow: none !important;
box-sizing: border-box !important;
color: #000 !important;
display: flex !important;
height: 100% !important;
justify-content: center !important;
min-width: 0 !important;
padding: 0 4px !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) input, .collec... */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) input, .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) .checkbox-indicator {
display: none !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) label */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) label {
border: none !important;
box-shadow: none !important;
color: inherit !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
text-align: center !important;
text-transform: uppercase !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) .filter__count */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]) .filter__count {
display: none !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper.current:has(input[name="filter.v.option.size"]), .coll... */
.collection__page-sidebar .details__content a.checkbox-wrapper.current:has(input[name="filter.v.option.size"]), .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.option.size"]:checked) {
background: #000 !important;
border-color: #000 !important;
color: #fff !important;
}
/* .collection__page-sidebar .details__content ul:has(input[name="filter.p.m.custom.colour"]) */
.collection__page-sidebar .details__content ul:has(input[name="filter.p.m.custom.colour"]) {
display: grid !important;
gap: 6px !important;
grid-template-columns: repeat(3, 1fr) !important;
list-style: none !important;
margin: 0 !important;
overflow: visible !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content li:has(input[name="filter.p.m.custom.colour"]) */
.collection__page-sidebar .details__content li:has(input[name="filter.p.m.custom.colour"]) {
border: none !important;
box-shadow: none !important;
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
margin: 0 !important;
min-width: 0 !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) {
align-items: center !important;
background: #fff !important;
border: 1.5px solid #e7e7e7 !important;
box-shadow: none !important;
box-sizing: border-box !important;
color: #000 !important;
display: flex !important;
height: 100% !important;
justify-content: center !important;
min-width: 0 !important;
padding: 0 4px !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) input, .co... */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) input, .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) .checkbox-indicator {
display: none !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) label */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) label {
border: none !important;
box-shadow: none !important;
color: inherit !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
text-align: center !important;
text-transform: uppercase !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) .filter__c... */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"]) .filter__count {
display: none !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper.current:has(input[name="filter.p.m.custom.colour"]), .... */
.collection__page-sidebar .details__content a.checkbox-wrapper.current:has(input[name="filter.p.m.custom.colour"]), .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.p.m.custom.colour"] input:checked) {
background: #000 !important;
border-color: #000 !important;
color: #fff !important;
}
/* .collection__page-sidebar .filter-range__boxes */
.collection__page-sidebar .filter-range__boxes {
column-gap: 8px !important;
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
margin: 0 !important;
padding: 0 !important;
row-gap: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .filter-range__field */
.collection__page-sidebar .filter-range__field {
align-items: center !important;
background: #fff !important;
border: 1.5px solid #e7e7e7 !important;
box-sizing: border-box !important;
display: flex !important;
grid-column: auto !important;
height: 34px !important;
margin: 0 !important;
min-height: 34px !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .filter-range__field__currency */
.collection__page-sidebar .filter-range__field__currency {
align-items: center !important;
color: #000 !important;
display: flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
height: 100% !important;
justify-content: center !important;
letter-spacing: 0 !important;
line-height: 1 !important;
min-width: 28px !important;
width: 28px !important;
}
/* .collection__page-sidebar .filter-range__field__input */
.collection__page-sidebar .filter-range__field__input {
background: transparent !important;
border: none !important;
box-shadow: none !important;
color: #000 !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
height: 34px !important;
letter-spacing: 0 !important;
line-height: 34px !important;
margin: 0 !important;
min-height: 34px !important;
outline: none !important;
padding: 0 8px 0 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .filter-range__field__input::placeholder */
.collection__page-sidebar .filter-range__field__input::placeholder {
color: #9b9b9b !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
letter-spacing: 0 !important;
line-height: 34px !important;
opacity: 1 !important;
}
/* .collection__page-sidebar .filter-range__slider--wrapper, .collection__page-sidebar .filter-range__slider--input */
.collection__page-sidebar .filter-range__slider--wrapper, .collection__page-sidebar .filter-range__slider--input {
display: none !important;
}
/* .collection__page-sidebar .details__content ul:has(input[name="filter.v.availability"]) */
.collection__page-sidebar .details__content ul:has(input[name="filter.v.availability"]) {
display: grid !important;
gap: 6px !important;
grid-template-columns: repeat(3, 1fr) !important;
list-style: none !important;
margin: 0 !important;
overflow: visible !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content li:has(input[name="filter.v.availability"]) */
.collection__page-sidebar .details__content li:has(input[name="filter.v.availability"]) {
border: none !important;
box-shadow: none !important;
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
margin: 0 !important;
min-width: 0 !important;
padding: 0 !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) {
align-items: center !important;
background: #fff !important;
border: 1.5px solid #e7e7e7 !important;
box-shadow: none !important;
box-sizing: border-box !important;
color: #000 !important;
display: flex !important;
height: 100% !important;
justify-content: center !important;
min-width: 0 !important;
padding: 0 4px !important;
width: 100% !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) input, .colle... */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) input, .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) .checkbox-indicator {
display: none !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) label */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) label {
border: none !important;
box-shadow: none !important;
color: inherit !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
text-align: center !important;
text-transform: uppercase !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) .filter__count */
.collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"]) .filter__count {
display: none !important;
}
/* .collection__page-sidebar .details__content a.checkbox-wrapper.current:has(input[name="filter.v.availability"]), .col... */
.collection__page-sidebar .details__content a.checkbox-wrapper.current:has(input[name="filter.v.availability"]), .collection__page-sidebar .details__content a.checkbox-wrapper:has(input[name="filter.v.availability"] input:checked) {
background: #000 !important;
border-color: #000 !important;
color: #fff !important;
}
/* .collection__page-sidebar .filterMinWrap, .collection__page-sidebar .innerFilterWrap */
.collection__page-sidebar .filterMinWrap, .collection__page-sidebar .innerFilterWrap {
height: auto !important;
max-height: none !important;
overflow: visible !important;
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* .collection__page-sidebar .sortByFilter, .collection__page-sidebar .sortByFilter ul */
.collection__page-sidebar .sortByFilter, .collection__page-sidebar .sortByFilter ul {
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* .collection__page-sidebar .innerFilterWrap .sortByFilter, .collection__page-sidebar .innerFilterWrap .sortByFilter.c-... */
.collection__page-sidebar .innerFilterWrap .sortByFilter, .collection__page-sidebar .innerFilterWrap .sortByFilter.c-accordion__panel {
display: block !important;
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* .collection__page-sidebar .innerFilterWrap .sortByFilter ul */
.collection__page-sidebar .innerFilterWrap .sortByFilter ul {
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* .collection__page-sidebar .innerFilterWrap .c-accordion.c-accordion--custom-page */
.collection__page-sidebar .innerFilterWrap .c-accordion.c-accordion--custom-page {
height: auto !important;
max-height: none !important;
overflow: visible !important;
margin-top: 0 !important;
}
/* #collection-sidebar .innerFilterWrap */
#collection-sidebar .innerFilterWrap {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
row-gap: 0 !important;
}
/* #collection-sidebar .innerFilterWrap > * */
#collection-sidebar .innerFilterWrap > * {
margin-bottom: 0 !important;
margin-top: 0 !important;
}
/* #collection-sidebar .innerFilterWrap > details, #collection-sidebar .innerFilterWrap > .c-accordion */
#collection-sidebar .innerFilterWrap > details, #collection-sidebar .innerFilterWrap > .c-accordion {
margin-bottom: 0 !important;
margin-top: 0 !important;
}
/* .collection__page-sidebar */
.collection__page-sidebar {
background-color: var(--background);
bottom: 0;
margin: 0 auto;
margin-right: 0px;
max-width: 100%;
padding: 0 10px;
position: fixed;
right: 0;
top: 0;
z-index: 9999;
padding-left: 16px !important;
padding-right: 16px !important;
width: calc(100% - 48px) !important;
-webkit-overflow-scrolling: touch !important;
overflow-x: hidden !important;
overflow-y: auto !important;
overscroll-behavior: contain !important;
padding-bottom: 0 !important;
border-left: 1px solid #000 !important;
box-sizing: border-box !important;
height: 100dvh !important;
max-height: 100dvh !important;
overflow: hidden !important;
}
/* .collection__page-sidebar .devFilterBtns */
.collection__page-sidebar .devFilterBtns {
margin-bottom: 24px !important;
padding-bottom: 0 !important;
margin-top: 48px !important;
border-top: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
box-sizing: border-box !important;
width: 100% !important;
transform: none !important;
background: #fff !important;
bottom: 0 !important;
display: grid !important;
gap: 16px !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
left: 0 !important;
margin: 0 !important;
padding: 35px 0 28px !important;
position: absolute !important;
right: 0 !important;
z-index: 20 !important;
}
/* .collection__page-sidebar .innerFilterWrap */
.collection__page-sidebar .innerFilterWrap {
bottom: 82px !important;
height: auto !important;
left: 0 !important;
max-height: none !important;
overscroll-behavior: contain !important;
right: 0 !important;
top: 0 !important;
padding-top: -50px !important;
-webkit-overflow-scrolling: touch !important;
column-gap: 0 !important;
inset: 0 0 96px 0 !important;
margin: 0 !important;
overflow-x: hidden !important;
overflow-y: auto !important;
padding: 0 !important;
position: absolute !important;
align-content: flex-start !important;
display: block !important;
gap: 0 !important;
justify-content: flex-start !important;
row-gap: 0 !important;
}
/* .collection__page-sidebar .innerFilterWrap > .js-accordion, .collection__page-sidebar .innerFilterWrap > details.details */
.collection__page-sidebar .innerFilterWrap > .js-accordion, .collection__page-sidebar .innerFilterWrap > details.details {
margin: 0 0 14px 0 !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details:last-of-type */
.collection__page-sidebar .innerFilterWrap > details.details:last-of-type {
margin-bottom: 0 !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details */
.collection__page-sidebar .innerFilterWrap > details.details {
align-items: start !important;
display: grid !important;
grid-template-rows: 44px auto !important;
margin: 0 0 10px 0 !important;
overflow: visible !important;
padding: 0 !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details[open] > .details__content */
.collection__page-sidebar .innerFilterWrap > details.details[open] > .details__content {
grid-row: 2 !important;
margin-top: 0 !important;
padding-top: 12px !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details:not([open]) */
.collection__page-sidebar .innerFilterWrap > details.details:not([open]) {
padding: 0 !important;
grid-template-rows: 64px 0 !important;
height: 64px !important;
margin: 0 !important;
max-height: 64px !important;
min-height: 64px !important;
overflow: hidden !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details:not([open]) > .details__content */
.collection__page-sidebar .innerFilterWrap > details.details:not([open]) > .details__content {
visibility: hidden !important;
height: 0 !important;
margin: 0 !important;
max-height: 0 !important;
overflow: hidden !important;
padding: 0 !important;
}
/* .collection__page-sidebar .devSidebarWrap */
.collection__page-sidebar .devSidebarWrap {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 16px !important;
font-weight: 900 !important;
justify-content: flex-start !important;
letter-spacing: 0 !important;
padding-left: 0 !important;
padding-right: 0 !important;
text-align: left !important;
text-transform: uppercase !important;
padding-bottom: 13px !important;
border-bottom: none !important;
}
/* .collection__page-sidebar .devSidebarWrap::after */
.collection__page-sidebar .devSidebarWrap::after {
content: none !important;
display: none !important;
}
/* #collection-sidebar.collection__page-sidebar::after */
#collection-sidebar.collection__page-sidebar::after {
content: none !important;
display: none !important;
}
#collection-sidebar.collection__page-sidebar::before {
background: #000000 !important;
content: "" !important;
display: block !important;
height: 1px !important;
left: 0 !important;
pointer-events: none !important;
position: absolute !important;
right: 0 !important;
top: 0 !important;
z-index: 9999 !important;
}
/* #collection-sidebar.collection__page-sidebar .devSidebarWrap */
#collection-sidebar.collection__page-sidebar .devSidebarWrap {
background: transparent !important;
position: relative !important;
z-index: 10000 !important;
}
/* .collection__page-sidebar .filterMinWrap */
.collection__page-sidebar .filterMinWrap {
height: auto !important;
max-height: none !important;
bottom: 0 !important;
left: 16px !important;
overflow: hidden !important;
position: absolute !important;
right: 16px !important;
top: 60px !important;
}
#collection-sidebar.collection__page-sidebar .filterMinWrap > .devFilterBtns {
position: absolute !important;
left: 0px !important;
right: 16px !important;
bottom: 12px !important;
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 16px !important;
margin: 0 !important;
padding: 0 !important;
align-items: center !important;
box-sizing: border-box !important;
background: transparent !important;
z-index: 50 !important;
}
/* #collection-sidebar.collection__page-sidebar .filterMinWrap > .devFilterBtns::before */
#collection-sidebar.collection__page-sidebar .filterMinWrap > .devFilterBtns::before {
background: #000 !important;
content: "" !important;
height: 1px !important;
left: 0 !important;
pointer-events: none !important;
position: absolute !important;
right: 0 !important;
top: 0 !important;
}
/* #collection-sidebar.collection__page-sidebar .filterMinWrap > .innerFilterWrap */
#collection-sidebar.collection__page-sidebar .filterMinWrap > .innerFilterWrap {
bottom: 25px !important;
padding-bottom: 0px !important;
}
/* .collection__page-sidebar .devFilterBtns::before */
.collection__page-sidebar .devFilterBtns::before {
pointer-events: none !important;
background: #000 !important;
height: 1px !important;
left: -16px !important;
position: absolute !important;
right: -16px !important;
top: 20px !important;
content: none !important;
display: none !important;
}
/* #collection-sidebar.collection__page-sidebar .devFilterBtns */
#collection-sidebar.collection__page-sidebar .devFilterBtns {
background: transparent !important;
border-top: none !important;
}
/* #collection-sidebar.collection__page-sidebar .devFilterBtns::before, #collection-sidebar.collection__page-sidebar .fi... */
#collection-sidebar.collection__page-sidebar .devFilterBtns::before, #collection-sidebar.collection__page-sidebar .filterMinWrap::after {
content: none !important;
display: none !important;
}
/* #collection-sidebar.collection__page-sidebar */
#collection-sidebar.collection__page-sidebar {
background-image: linear-gradient(
to bottom,
#fff 0,
#fff calc(100% - 60px),
#000 calc(100% - 60px),
#000 calc(100% - 59px),
#fff calc(100% - 59px),
#fff 100%
) !important;
background-repeat: no-repeat !important;
background-size: 100% 100% !important;
}
/* .collection__page-product .devCollectionProductLabel */
.collection__page-product .devCollectionProductLabel {
border-radius: 1px !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-weight: 700 !important;
height: 20px !important;
left: 5px !important;
letter-spacing: normal !important;
padding: 0 0px !important;
pointer-events: none !important;
position: absolute !important;
top: 0px !important;
white-space: nowrap !important;
z-index: 50 !important;
background: rgba(0, 0, 0, 0.5) !important;
color: #fff !important;
font-size: 10px !important;
line-height: 24px !important;
opacity: 1 !important;
text-indent: 0 !important;
visibility: visible !important;
}
/* .collection__page-product .product-info-inner > .devCardColorLabel */
.collection__page-product .product-info-inner > .devCardColorLabel {
display: block !important;
margin-top: 2px !important;
}
/* .collection__page-product .product-info-inner > .price.price--listing */
.collection__page-product .product-info-inner > .price.price--listing {
margin-top: 3px !important;
}
/* .collection__page-product span.product-color-name.devVariantColor.devCardColorLabel */
.collection__page-product span.product-color-name.devVariantColor.devCardColorLabel {
color: rgb(114, 114, 114) !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 767px)
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
/* .collection__page-product .devProduct-image */
.collection__page-product .devProduct-image {
position: relative !important;
}
/* .collection__page-product .devCollectionProductLabel */
.collection__page-product .devCollectionProductLabel {
border-radius: 1px !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-weight: 700 !important;
height: 20px !important;
left: 0px !important;
letter-spacing: normal !important;
padding: 0 8px !important;
pointer-events: none !important;
position: absolute !important;
top: 0px !important;
white-space: nowrap !important;
z-index: 50 !important;
background: rgba(0, 0, 0, 0.5) !important;
color: #fff !important;
font-size: 10px !important;
line-height: 22px !important;
opacity: 1 !important;
text-indent: 0 !important;
visibility: visible !important;
}
}
/* =========================================================
09. Product Page
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* button, .button, .btn, a.button, a.btn, input[type="button"], input[type="submit"], input[type="reset"], .shopify-pay... */
button, .button, .btn, a.button, a.btn, input[type="button"], input[type="submit"], input[type="reset"], .shopify-payment-button__button {
font-size: 12px !important;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* button, .btn, .button, a.btn, a.button, .secondary-button, input[type="submit"], input[type="button"], .shopify-payme... */
button, .btn, .button, a.btn, a.button, .secondary-button, input[type="submit"], input[type="button"], .shopify-payment-button__button {
border-radius: 2px !important;
}
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* .collection__page-sidebar .sidebarFilterAccordian, .collection__page-sidebar .details__summary, .collection__page-sid... */
.collection__page-sidebar .sidebarFilterAccordian, .collection__page-sidebar .details__summary, .collection__page-sidebar .details__title {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
}
/* .collection__page-sidebar summary.details__summary.sidebarFilterAccordian */
.collection__page-sidebar summary.details__summary.sidebarFilterAccordian {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
line-height: 1.2 !important;
text-transform: uppercase !important;
}
/* .collection__page-sidebar summary.details__summary > .details__title */
.collection__page-sidebar summary.details__summary > .details__title {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
line-height: 1.2 !important;
margin: 0 !important;
text-transform: uppercase !important;
}
/* .collection__page-sidebar .details__summary .devChevron, .collection__page-sidebar .sidebarFilterAccordian .devChevron */
.collection__page-sidebar .details__summary .devChevron, .collection__page-sidebar .sidebarFilterAccordian .devChevron {
display: inline-block !important;
transform: rotate(0deg) !important;
transform-origin: center center !important;
transition: transform 0.25s ease !important;
}
/* .collection__page-sidebar details[open] > summary.details__summary .devChevron */
.collection__page-sidebar details[open] > summary.details__summary .devChevron {
transform: rotate(180deg) !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details > summary.details__summary */
.collection__page-sidebar .innerFilterWrap > details.details > summary.details__summary {
border-top: 1px solid #ccc !important;
align-items: center !important;
display: flex !important;
grid-row: 1 !important;
height: 44px !important;
justify-content: space-between !important;
margin: 0 !important;
max-height: 44px !important;
min-height: 44px !important;
padding: 0 !important;
position: relative !important;
transform: none !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details > summary.details__summary, .collection__page-sidebar .i... */
.collection__page-sidebar .innerFilterWrap > details.details > summary.details__summary, .collection__page-sidebar .innerFilterWrap > details.details > summary.details__summary .details__title {
line-height: 14px !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details:not([open]) > summary.details__summary */
.collection__page-sidebar .innerFilterWrap > details.details:not([open]) > summary.details__summary {
align-items: center !important;
height: 64px !important;
max-height: 64px !important;
min-height: 64px !important;
}
/* .collection__page-sidebar .innerFilterWrap > details.details[open] > summary.details__summary */
.collection__page-sidebar .innerFilterWrap > details.details[open] > summary.details__summary {
height: 44px !important;
max-height: 44px !important;
min-height: 44px !important;
}
/* .product__section--header */
.product__section--header {
align-items: flex-start !important;
}
/* .product__section-container .swatches__swatch--regular .swatches__form--label */
.product__section-container .swatches__swatch--regular .swatches__form--label {
font-size: 12px;
padding: 12px 8.4px !important;
}
/* .product__variants-swatches .swatch-element.soldout .swatches__form--label::before, .product__variants-swatches .swat... */
.product__variants-swatches .swatch-element.soldout .swatches__form--label::before, .product__variants-swatches .swatch-element.soldout .swatches__form--label::after {
content: none !important;
display: none !important;
}
/* .product__section--accordion .details__summary */
.product__section--accordion .details__summary {
align-items: center !important;
display: flex !important;
height: auto !important;
min-height: auto !important;
padding: 14px 0 !important;
}
/* .product__section--accordion details[open] .details__content */
.product__section--accordion details[open] .details__content {
margin-bottom: 10px !important;
}
/* .product__section--accordion .details__content, .product__section--accordion .details__content p, .product__section--... */
.product__section--accordion .details__content, .product__section--accordion .details__content p, .product__section--accordion .details__content li {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
/* .product__section--accordion .details__content, .product__section--accordion .details__content * */
.product__section--accordion .details__content, .product__section--accordion .details__content * {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
line-height: 1.4 !important;
}
/* .product__section--accordion .details__content b, .product__section--accordion .details__content strong, .product__se... */
.product__section--accordion .details__content b, .product__section--accordion .details__content strong, .product__section--accordion .details__content a {
font-size: 12px !important;
}
/* .product__section--accordion .details__content b, .product__section--accordion .details__content strong */
.product__section--accordion .details__content b, .product__section--accordion .details__content strong {
font-weight: 700 !important;
}
/* .product__section--accordion */
.product__section--accordion {
transform: translateY(24px);
}
/* .product__section--accordion .details__title */
.product__section--accordion .details__title {
display: block !important;
line-height: 1.2 !important;
margin-bottom: 0px !important;
margin-top: 0px !important;
text-transform: uppercase !important;
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 767px)
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
/* .product__section-images .flickity-page-dots */
.product__section-images .flickity-page-dots {
display: none !important;
}
/* .product__section-images .js-carousel-main */
.product__section-images .js-carousel-main {
display: none !important;
}
/* .devNativeProductGallery */
.devNativeProductGallery {
-webkit-overflow-scrolling: touch !important;
display: flex !important;
overflow-x: auto !important;
scroll-snap-type: x mandatory !important;
scrollbar-width: none !important;
width: 100% !important;
}
/* .devNativeProductGallery::-webkit-scrollbar */
.devNativeProductGallery::-webkit-scrollbar {
display: none !important;
}
/* .devNativeProductGallerySlide */
.devNativeProductGallerySlide {
flex: 0 0 100% !important;
scroll-snap-align: start !important;
}
/* .devNativeProductGallerySlide img */
.devNativeProductGallerySlide img {
display: block !important;
height: auto !important;
width: 100% !important;
}
/* .product-main-images */
.product-main-images {
position: relative !important;
}
/* .devNativeProductGalleryIndicator */
.devNativeProductGalleryIndicator {
background: #e7e7e7 !important;
bottom: 0 !important;
height: 2px !important;
left: 0 !important;
position: absolute !important;
width: 100% !important;
z-index: 20 !important;
}
/* .devNativeProductGalleryIndicator span */
.devNativeProductGalleryIndicator span {
background: #000 !important;
height: 2px !important;
left: var(--dev-native-indicator-left, 0%) !important;
position: absolute !important;
width: var(--dev-native-indicator-width, 100%) !important;
}
/* .product__section-title.product-title */
.product__section-title.product-title {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1.05 !important;
}
/* .product__section-label.product-label */
.product__section-label.product-label {
color: rgba(0, 0, 0, 0.5) !important;
display: block !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 700 !important;
line-height: 1 !important;
margin: 0 0 8px 0 !important;
padding: 0 !important;
text-align: left !important;
width: 100% !important;
}
/* .dev-product-installment-line */
.dev-product-installment-line {
align-items: center !important;
color: rgba(0, 0, 0, 0.5) !important;
display: flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
gap: 5px !important;
justify-content: flex-start !important;
line-height: 1.2 !important;
margin: 8px 0 0 0 !important;
padding: 0 !important;
white-space: nowrap !important;
width: 100% !important;
}
/* .dev-product-installment-line strong */
.dev-product-installment-line strong {
color: rgba(0, 0, 0, 0.5) !important;
font-weight: 900 !important;
}
/* .dev-product-installment-klarna-logo */
.dev-product-installment-klarna-logo {
display: inline-block !important;
height: 20px !important;
margin: 0 !important;
padding: 0 !important;
vertical-align: middle !important;
width: auto !important;
}
/* .devOptionWrap .swatches__option-name, .devOptionWrap .swatches__option-name strong */
.devOptionWrap .swatches__option-name, .devOptionWrap .swatches__option-name strong {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
text-transform: uppercase !important;
}
/* .product__variants-swatches .swatch-element.soldout .swatches__form--label */
.product__variants-swatches .swatch-element.soldout .swatches__form--label {
color: rgba(0, 0, 0, 0.25) !important;
opacity: 1 !important;
position: relative !important;
text-decoration: none !important;
z-index: 2 !important;
}
/* .product__variants-swatches .swatch-element.soldout .swatches__form--label::before, .product__variants-swatches .swat... */
.product__variants-swatches .swatch-element.soldout .swatches__form--label::before, .product__variants-swatches .swatch-element.soldout .swatches__form--label::after {
pointer-events: none !important;
z-index: 0 !important;
}
/* .product__variants-swatches .swatch-element.soldout:hover .swatches__form--label, .product__variants-swatches .swatch... */
.product__variants-swatches .swatch-element.soldout:hover .swatches__form--label, .product__variants-swatches .swatch-element.soldout .swatches__form--input:checked + .swatches__form--label {
color: rgba(0, 0, 0, 0.25) !important;
opacity: 1 !important;
}
/* .product__variants-swatches .swatch-element.soldout .swatches__form--input:checked + .swatches__form--label */
.product__variants-swatches .swatch-element.soldout .swatches__form--input:checked + .swatches__form--label {
color: #fff !important;
}
/* .product__variants-swatches .swatches__form--input:checked + .swatches__form--label */
.product__variants-swatches .swatches__form--input:checked + .swatches__form--label {
align-items: center !important;
display: flex !important;
height: 35px !important;
justify-content: center !important;
line-height: 35px !important;
min-height: 35px !important;
border-radius: 1px !important;
}
/* .product__section--buttons.product-add .AddtoCart */
.product__section--buttons.product-add .AddtoCart {
height: 35px !important;
line-height: 35px !important;
min-height: 35px !important;
padding-bottom: 0 !important;
padding-top: 0 !important;
}
/* .product__section--buttons.product-add .AddtoCart, .product__section--buttons.product-add .dev-express-checkout */
.product__section--buttons.product-add .AddtoCart, .product__section--buttons.product-add .dev-express-checkout {
border-radius: 1px !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
height: 35px !important;
line-height: 35px !important;
min-height: 35px !important;
padding-bottom: 0 !important;
padding-top: 0 !important;
text-align: center !important;
text-transform: uppercase !important;
width: 100% !important;
}
/* .product__section--buttons.product-add .dev-express-checkout */
.product__section--buttons.product-add .dev-express-checkout {
align-items: center !important;
background: #fff !important;
border: 1px solid #000 !important;
box-sizing: border-box !important;
color: #000 !important;
display: flex !important;
justify-content: center !important;
margin: 8px 0 0 0 !important;
}
/* .product__section--buttons.product-add .dev-express-checkout:disabled */
.product__section--buttons.product-add .dev-express-checkout:disabled {
opacity: 1 !important;
}
/* .product__section--buttons.product-add .dev-accelerated-checkout */
.product__section--buttons.product-add .dev-accelerated-checkout {
height: 35px !important;
margin: 8px 0 0 0 !important;
max-height: 35px !important;
min-height: 35px !important;
overflow: hidden !important;
padding: 0 !important;
width: 100% !important;
}
/* .product__section--buttons.product-add .dev-accelerated-checkout .shopify-payment-button */
.product__section--buttons.product-add .dev-accelerated-checkout .shopify-payment-button {
height: 50px !important;
margin: 0 !important;
max-height: 50px !important;
min-height: 50px !important;
padding: 0 !important;
transform: scale(0.7) !important;
transform-origin: top left !important;
width: 142.857% !important;
}
/* .product__section--buttons.product-add .dev-accelerated-checkout .shopify-payment-button__button */
.product__section--buttons.product-add .dev-accelerated-checkout .shopify-payment-button__button {
border-radius: 1px !important;
height: 50px !important;
max-height: 50px !important;
min-height: 50px !important;
}
/* .product__section--buttons.product-add .dev-accelerated-checkout .shopify-payment-button__more-options, .product__sec... */
.product__section--buttons.product-add .dev-accelerated-checkout .shopify-payment-button__more-options, .product__section--buttons.product-add .dev-accelerated-checkout more-payment-options-link {
display: none !important;
}
/* .devCheckoutSupport */
.devCheckoutSupport {
background: #e7e7e7 !important;
box-sizing: border-box !important;
margin: 16px 0 0 0 !important;
padding: 16px !important;
width: 100% !important;
}
/* .devCheckoutSupport__delivery, .devCheckoutSupport__delivery span, .devCheckoutSupport__lines p, .devCheckoutSupport_... */
.devCheckoutSupport__delivery, .devCheckoutSupport__delivery span, .devCheckoutSupport__lines p, .devCheckoutSupport__lines p a, .devCheckoutSupport__lines p span, .devCheckoutSupport__lines p strong {
color: #000 !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
line-height: 1.35 !important;
text-align: left !important;
}
/* .devCheckoutSupport__delivery */
.devCheckoutSupport__delivery {
font-weight: 900 !important;
margin: 0 !important;
text-transform: uppercase !important;
}
/* .devCheckoutSupport__delivery span */
.devCheckoutSupport__delivery span {
color: rgb(16, 137, 20) !important;
font-weight: 900 !important;
}
/* .devCheckoutSupport__separator */
.devCheckoutSupport__separator {
background: #cfcfcf !important;
height: 1px !important;
margin: 10px 0 !important;
width: 100% !important;
}
/* .devCheckoutSupport__lines p */
.devCheckoutSupport__lines p {
font-weight: 500 !important;
margin: 0 0 8px 0 !important;
}
/* .devCheckoutSupport__lines p:last-child */
.devCheckoutSupport__lines p:last-child {
margin-bottom: 0 !important;
}
/* .devCheckoutSupport__lines p a, .devCheckoutSupport__lines p span */
.devCheckoutSupport__lines p a, .devCheckoutSupport__lines p span {
color: #000 !important;
font-weight: 900 !important;
text-decoration: underline !important;
text-underline-offset: 2px !important;
}
/* .devCheckoutSupport__lines p strong */
.devCheckoutSupport__lines p strong {
font-weight: 900 !important;
}
/* .details__summary */
.details__summary {
align-items: center !important;
display: flex !important;
justify-content: space-between !important;
}
/* .details__summary .details__title */
.details__summary .details__title {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
margin: 0 !important;
}
/* .details__summary .details__icon */
.details__summary .details__icon {
align-items: center !important;
display: flex !important;
height: 14px !important;
justify-content: center !important;
line-height: 1 !important;
}
/* .details__summary .details__icon svg, .details__summary .details__icon .devChevron */
.details__summary .details__icon svg, .details__summary .details__icon .devChevron {
display: block !important;
}
/* .dev-sticky-button-placeholder */
.dev-sticky-button-placeholder {
display: block !important;
height: 0;
margin: 0 !important;
padding: 0 !important;
}
/* html body .product__section--buttons.product-add.dev-sticky-active */
html body .product__section--buttons.product-add.dev-sticky-active {
background: #fff !important;
border-top: 1px solid #000 !important;
bottom: 0 !important;
box-sizing: border-box !important;
left: 0 !important;
margin: 0 !important;
opacity: 1 !important;
padding: 12px 16px calc(16px + env(safe-area-inset-bottom)) 16px !important;
position: fixed !important;
right: 0 !important;
transform: none !important;
transition-property: opacity !important;
transition-duration: 900ms !important;
transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1) !important;
transition-delay: 0ms !important;
width: 100% !important;
will-change: opacity !important;
contain: paint !important;
backface-visibility: hidden !important;
-webkit-backface-visibility: hidden !important;
z-index: 2147483647 !important;
}
/* hidden/fading state */
html body .product__section--buttons.product-add.dev-sticky-hidden,
html body .product__section--buttons.product-add.dev-variant-fade-out {
opacity: 0 !important;
pointer-events: none !important;
transform: none !important;
transition-property: opacity !important;
transition-duration: 180ms !important;
transition-timing-function: ease-out !important;
transition-delay: 0ms !important;
}
/* html body .product__section--buttons.product-add.dev-sticky-active .product__form-buttons */
html body .product__section--buttons.product-add.dev-sticky-active .product__form-buttons {
margin: 0 !important;
width: 100% !important;
}
/* .dev-sticky-ghost */
.dev-sticky-ghost {
background: #fff !important;
box-sizing: border-box !important;
padding: 12px 16px calc(16px + env(safe-area-inset-bottom)) 16px !important;
}
}
/* =========================================================
10. Quickview / Quick Buy
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 767px)
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
/* #modal-quickview-cart .modal__inner-wrapper */
#modal-quickview-cart .modal__inner-wrapper {
background: #fff !important;
box-sizing: border-box !important;
height: auto !important;
margin: 0 !important;
max-height: calc(100dvh - 16px) !important;
max-width: 100% !important;
overflow: hidden !important;
padding: 0 !important;
width: 100% !important;
}
/* #modal-quickview-cart .product-quickview__container, #modal-quickview-cart #quickview-form, #modal-quickview-cart .pr... */
#modal-quickview-cart .product-quickview__container, #modal-quickview-cart #quickview-form, #modal-quickview-cart .product__inner-wrapper, #modal-quickview-cart .product__section-container {
background: #fff !important;
box-sizing: border-box !important;
height: auto !important;
margin: 0 !important;
max-height: none !important;
max-width: 100% !important;
overflow: hidden !important;
padding: 0 !important;
width: 100% !important;
}
/* #modal-quickview-cart .product__section-images, #modal-quickview-cart .product__section-content */
#modal-quickview-cart .product__section-images, #modal-quickview-cart .product__section-content {
box-sizing: border-box !important;
margin-left: 16px !important;
margin-right: 16px !important;
max-width: calc(100% - 32px) !important;
width: calc(100% - 32px) !important;
}
/* #modal-quickview-cart #slider, #modal-quickview-cart #thumbnails */
#modal-quickview-cart #slider, #modal-quickview-cart #thumbnails {
box-sizing: border-box !important;
margin: 0 !important;
max-width: 100% !important;
overflow: hidden !important;
padding: 0 !important;
width: 100% !important;
}
/* #modal-quickview-cart .product__section-title.product-title, #modal-quickview-cart .product__section-title.product-ti... */
#modal-quickview-cart .product__section-title.product-title, #modal-quickview-cart .product__section-title.product-title a, #modal-quickview-cart #product-price, #modal-quickview-cart #product-price .money, #modal-quickview-cart #product-price .price-item, #modal-quickview-cart #product-price .price__badge, #modal-quickview-cart #product-price .price__badge span, #modal-quickview-cart #product-price .sale-item--icon {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
/* #modal-quickview-cart klarna-placement, #modal-quickview-cart .dev_klarna, #modal-quickview-cart .spi-banner, #modal-... */
#modal-quickview-cart klarna-placement, #modal-quickview-cart .dev_klarna, #modal-quickview-cart .spi-banner, #modal-quickview-cart #product-form-installment {
display: none !important;
}
/* #modal-quickview-cart .dev-product-installment-line, #modal-quickview-cart .dev-product-installment-line span, #modal... */
#modal-quickview-cart .dev-product-installment-line, #modal-quickview-cart .dev-product-installment-line span, #modal-quickview-cart .dev-product-installment-line strong {
color: rgba(0, 0, 0, 0.5) !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
line-height: 1.2 !important;
}
/* #modal-quickview-cart .dev-product-installment-line */
#modal-quickview-cart .dev-product-installment-line {
align-items: center !important;
display: flex !important;
font-weight: 500 !important;
gap: 5px !important;
justify-content: flex-start !important;
margin: 8px 0 0 0 !important;
padding: 0 !important;
white-space: nowrap !important;
width: 100% !important;
}
/* #modal-quickview-cart .dev-product-installment-line strong */
#modal-quickview-cart .dev-product-installment-line strong {
font-weight: 900 !important;
}
/* #modal-quickview-cart .dev-product-installment-klarna-logo */
#modal-quickview-cart .dev-product-installment-klarna-logo {
display: inline-block !important;
height: 20px !important;
margin: 0 !important;
padding: 0 !important;
vertical-align: middle !important;
width: auto !important;
}
/* #modal-quickview-cart .devQuickViewSize .popup_content_link, #modal-quickview-cart .devQuickViewSize .product__contac... */
#modal-quickview-cart .devQuickViewSize .popup_content_link, #modal-quickview-cart .devQuickViewSize .product__contact-trigger {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
/* #modal-quickview-cart .product__section--buttons.product-add .AddtoCart */
#modal-quickview-cart .product__section--buttons.product-add .AddtoCart {
align-items: center !important;
border-radius: 1px !important;
display: flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
height: 35px !important;
justify-content: center !important;
line-height: 1 !important;
min-height: 35px !important;
padding: 0 !important;
text-align: center !important;
text-transform: uppercase !important;
width: 100% !important;
}
/* #modal-quickview-cart #thumbnails .flickity-button, #modal-quickview-cart #thumbnails .flickity-page-dots */
#modal-quickview-cart #thumbnails .flickity-button, #modal-quickview-cart #thumbnails .flickity-page-dots {
display: none !important;
}
/* #modal-quickview-cart #thumbnails, #modal-quickview-cart #thumbnails .thumb-slider-wrapper, #modal-quickview-cart #th... */
#modal-quickview-cart #thumbnails, #modal-quickview-cart #thumbnails .thumb-slider-wrapper, #modal-quickview-cart #thumbnails .carousel-nav, #modal-quickview-cart #thumbnails .flickity-viewport {
-webkit-overflow-scrolling: touch !important;
margin: 0 !important;
max-width: 100% !important;
overflow-x: auto !important;
overflow-y: hidden !important;
padding: 0 !important;
scrollbar-width: none !important;
width: 100% !important;
}
/* #modal-quickview-cart #thumbnails .flickity-viewport::-webkit-scrollbar, #modal-quickview-cart #thumbnails .carousel-... */
#modal-quickview-cart #thumbnails .flickity-viewport::-webkit-scrollbar, #modal-quickview-cart #thumbnails .carousel-nav::-webkit-scrollbar {
display: none !important;
}
/* #modal-quickview-cart #thumbnails .flickity-slider */
#modal-quickview-cart #thumbnails .flickity-slider {
display: flex !important;
gap: 4px !important;
position: static !important;
transform: none !important;
width: max-content !important;
}
/* #modal-quickview-cart #thumbnails .image-thumbnail */
#modal-quickview-cart #thumbnails .image-thumbnail {
flex: 0 0 calc((100vw - 40px) / 2.4) !important;
left: auto !important;
margin: 0 !important;
padding: 0 !important;
position: relative !important;
width: auto !important;
}
/* #modal-quickview-cart #thumbnails .product-single__thumbnail, #modal-quickview-cart #thumbnails .product-single__thum... */
#modal-quickview-cart #thumbnails .product-single__thumbnail, #modal-quickview-cart #thumbnails .product-single__thumbnail img {
display: block !important;
height: auto !important;
width: 100% !important;
}
/* #modal-quickview-cart .product__section-images */
#modal-quickview-cart .product__section-images {
margin-top: 0 !important;
margin-bottom: 12px !important;
}
/* #modal-quickview-cart .devQuickviewHeader */
#modal-quickview-cart .devQuickviewHeader {
align-items: center !important;
box-sizing: border-box !important;
display: flex !important;
justify-content: space-between !important;
margin: 16px 16px 8px 16px !important;
padding: 0 !important;
width: calc(100% - 32px) !important;
}
/* #modal-quickview-cart .devQuickviewHeader__title */
#modal-quickview-cart .devQuickviewHeader__title {
color: #000 !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 16px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
text-transform: uppercase !important;
}
/* #modal-quickview-cart .slideout__trigger-quickview__wrapper */
#modal-quickview-cart .slideout__trigger-quickview__wrapper {
margin: 0 !important;
padding: 0 !important;
position: static !important;
}
/* #modal-quickview-cart .slideout__trigger-quickview */
#modal-quickview-cart .slideout__trigger-quickview {
align-items: center !important;
display: flex !important;
height: 24px !important;
justify-content: center !important;
margin: 0 !important;
padding: 0 !important;
width: 24px !important;
}
/* #modal-quickview-cart .slideout__trigger-quickview svg .hover-stroke, #modal-quickview-cart .slideout__trigger-quickv... */
#modal-quickview-cart .slideout__trigger-quickview svg .hover-stroke, #modal-quickview-cart .slideout__trigger-quickview svg path {
stroke-width: 2.75px !important;
}
/* #modal-quickview-cart .slideout__trigger-quickview svg */
#modal-quickview-cart .slideout__trigger-quickview svg {
height: 16px !important;
width: 16px !important;
transform: translateY(-1px) !important;
}
/* #modal-quickview-cart .modal__inner-wrapper, #modal-quickview-cart .product-quickview__container, #modal-quickview-ca... */
#modal-quickview-cart .modal__inner-wrapper, #modal-quickview-cart .product-quickview__container, #modal-quickview-cart #quickview-form, #modal-quickview-cart .product__inner-wrapper, #modal-quickview-cart .product__section-container {
height: auto !important;
max-height: none !important;
min-height: 0 !important;
}
/* #modal-quickview-cart .product__section-content */
#modal-quickview-cart .product__section-content {
margin-bottom: 16px !important;
}
/* #modal-quickview-cart */
#modal-quickview-cart {
border-radius: 0 !important;
box-sizing: border-box !important;
inset: auto 0 0 0 !important;
left: 0 !important;
margin: 0 !important;
max-width: 100% !important;
overflow: hidden !important;
padding: 0 !important;
position: fixed !important;
right: 0 !important;
width: 100% !important;
bottom: 0 !important;
height: auto !important;
max-height: calc(100dvh - 16px) !important;
min-height: 0 !important;
top: auto !important;
opacity: 0;
transform: translateY(100%);
transition: transform 650ms cubic-bezier(0.22, 1, 0.36, 1), opacity 220ms ease;
}
/* #modal-quickview-cart:popover-open */
#modal-quickview-cart:popover-open {
opacity: 1;
transform: translateY(0);
}
}
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* #modal-quickview-cart #thumbnails .thumb-slider-wrapper, #modal-quickview-cart #thumbnails .flickity-viewport, #modal... */
#modal-quickview-cart #thumbnails .thumb-slider-wrapper, #modal-quickview-cart #thumbnails .flickity-viewport, #modal-quickview-cart #thumbnails .flickity-slider {
margin-top: 0 !important;
padding-top: 0 !important;
}
/* #modal-quickview-cart .product__section-details, #modal-quickview-cart .product__section--header, #modal-quickview-ca... */
#modal-quickview-cart .product__section-details, #modal-quickview-cart .product__section--header, #modal-quickview-cart .product__form-container, #modal-quickview-cart .product__variants-swatches, #modal-quickview-cart .product__section--buttons {
box-sizing: border-box !important;
margin-left: 0 !important;
margin-right: 0 !important;
max-width: 100% !important;
width: 100% !important;
}
/* #modal-quickview-cart::backdrop */
#modal-quickview-cart::backdrop {
-webkit-backdrop-filter: blur(5px) saturate(150%) !important;
backdrop-filter: blur(5px) saturate(150%) !important;
background: rgba(0, 0, 0, 0.50) !important;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* #modal-quickview-cart */
#modal-quickview-cart {
overscroll-behavior: contain !important;
}
/* #modal-quickview-cart, #modal-quickview-cart .product__section-container, #modal-quickview-cart .modal__inner-wrapper */
#modal-quickview-cart, #modal-quickview-cart .product__section-container, #modal-quickview-cart .modal__inner-wrapper {
touch-action: pan-x !important;
}
/* #modal-quickview-cart #thumbnails, #modal-quickview-cart #thumbnails .carousel-nav */
#modal-quickview-cart #thumbnails, #modal-quickview-cart #thumbnails .carousel-nav {
touch-action: pan-x !important;
}
/* #modal-quickview-cart #thumbnails .carousel-nav.no_carousel */
#modal-quickview-cart #thumbnails .carousel-nav.no_carousel {
display: flex !important;
gap: 4px !important;
width: max-content !important;
}
/* #modal-quickview-cart #thumbnails .carousel-nav.no_carousel .image-thumbnail */
#modal-quickview-cart #thumbnails .carousel-nav.no_carousel .image-thumbnail {
margin: 0 !important;
}
/* #modal-quickview-cart #thumbnails, #modal-quickview-cart #thumbnails .thumb-slider-wrapper, #modal-quickview-cart #th... */
#modal-quickview-cart #thumbnails, #modal-quickview-cart #thumbnails .thumb-slider-wrapper, #modal-quickview-cart #thumbnails .carousel-nav, #modal-quickview-cart #thumbnails .flickity-viewport {
-webkit-overflow-scrolling: touch !important;
overflow-x: auto !important;
overflow-y: hidden !important;
touch-action: pan-x !important;
}
/* #modal-quickview-cart #thumbnails .flickity-slider, #modal-quickview-cart #thumbnails .carousel-nav.no_carousel */
#modal-quickview-cart #thumbnails .flickity-slider, #modal-quickview-cart #thumbnails .carousel-nav.no_carousel {
display: flex !important;
gap: 4px !important;
touch-action: pan-x !important;
transform: none !important;
width: max-content !important;
}
/* #modal-quickview-cart #thumbnails .flickity-slider */
#modal-quickview-cart #thumbnails .flickity-slider {
max-width: fit-content !important;
width: fit-content !important;
}
/* #modal-quickview-cart .price__badges, #modal-quickview-cart .price__badge--sold-out, #modal-quickview-cart .price__ba... */
#modal-quickview-cart .price__badges, #modal-quickview-cart .price__badge--sold-out, #modal-quickview-cart .price__badge--sale {
display: none !important;
}
/* #modal-quickview-cart .dev-accelerated-checkout:has(.shopify-payment-button[style*="display: none"]) */
#modal-quickview-cart .dev-accelerated-checkout:has(.shopify-payment-button[style*="display: none"]) {
display: none !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
#modal-quickview-cart #slider .flickity-viewport {
height: 520px !important;
}
#modal-quickview-cart #slider .image-slide,
#modal-quickview-cart #slider .product-media-container,
#modal-quickview-cart #slider .product__image {
display: block !important;
height: 520px !important;
}
#modal-quickview-cart #slider .product__image {
object-fit: cover !important;
width: 100% !important;
}
#modal-quickview-cart #thumbnails .flickity-viewport {
height: auto !important;
min-height: 120px !important;
}
/* =========================================================
11. Mobile Navigation
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* .mobile-menu__trigger */
.mobile-menu__trigger {
align-items: center !important;
display: flex !important;
height: 45px !important;
}
@media (hover: hover) and (pointer: fine) {
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars,
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars path {
fill: none !important;
stroke: var(--header-link-color) !important;
}
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars {
color: var(--header-link-color) !important;
}
}
/* body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars */
body.template-index div#header-group:hover .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars {
color: #fff !important;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* .mobile-menu__trigger, .slideout__trigger--open, .slideout__trigger-mobile-menu */
.mobile-menu__trigger, .slideout__trigger--open, .slideout__trigger-mobile-menu {
align-items: center !important;
display: flex !important;
height: 45px !important;
justify-content: flex-start !important;
}
/* .slideout__trigger-mobile-menu */
.slideout__trigger-mobile-menu {
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
}
/* .slideout__trigger-mobile-menu svg */
.slideout__trigger-mobile-menu svg {
display: block !important;
}
/* .slideout__trigger-mobile-menu--icon */
.slideout__trigger-mobile-menu--icon {
height: 18px !important;
width: 28px !important;
transform: translateX(-1px) !important;
}
/* .c-accordion__header > .c-accordion__link */
.c-accordion__header > .c-accordion__link {
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
}
/* .devSubmenu .c-accordion__link */
.devSubmenu .c-accordion__link {
color: #000 !important;
font-family: "BasisGrotesqueArabicPro-Medium", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
}
/* .debvSidebarHead #dev_tabs-nav li a */
.debvSidebarHead #dev_tabs-nav li a {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
}
/* #dev_tabs-content .dev_tab-content > .c-accordion--mobile-nav > .c-accordion__header */
#dev_tabs-content .dev_tab-content > .c-accordion--mobile-nav > .c-accordion__header {
margin-bottom: -10px !important;
}
/* #dev_tabs-content .dev_tab-content > .c-accordion--mobile-nav > .c-accordion__header:last-child */
#dev_tabs-content .dev_tab-content > .c-accordion--mobile-nav > .c-accordion__header:last-child {
margin-bottom: 0 !important;
}
/* #dev_tabs-content .dev_tab-content > .c-accordion--mobile-nav > .c-accordion__header > .c-accordion__link */
#dev_tabs-content .dev_tab-content > .c-accordion--mobile-nav > .c-accordion__header > .c-accordion__link {
line-height: 1 !important;
padding-bottom: 0 !important;
padding-top: 0 !important;
}
/* #dev_tabs-content .dev_tab-content .c-accordion__header .devSubmenu > li */
#dev_tabs-content .dev_tab-content .c-accordion__header .devSubmenu > li {
margin-bottom: -10px !important;
}
/* #dev_tabs-content .dev_tab-content .c-accordion__header .devSubmenu > li:last-child */
#dev_tabs-content .dev_tab-content .c-accordion__header .devSubmenu > li:last-child {
margin-bottom: 0 !important;
}
/* #dev_tabs-content .dev_tab-content .c-accordion__header .devSubmenu > li > a.js-accordion-link.c-accordion__link */
#dev_tabs-content .dev_tab-content .c-accordion__header .devSubmenu > li > a.js-accordion-link.c-accordion__link {
font-family: "BasisGrotesqueArabicPro-Medium", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
padding-bottom: 0 !important;
padding-top: 0 !important;
text-transform: uppercase !important;
}
#dev_tabs-content .c-accordion__header > a.devHasSubmenu .devChevron {
display: inline-block !important;
transform: rotate(0deg) !important;
transform-origin: center center !important;
transition: transform 300ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#dev_tabs-content .c-accordion__header > a.devHasSubmenu.active .devChevron {
transform: rotate(180deg) !important;
}
/* .devMemberBtn .secondary-button */
.devMemberBtn .secondary-button {
margin-bottom: -10px !important;
}
/* .devMemberBtn > p */
.devMemberBtn > p {
font-family: "BasisGrotesqueArabicPro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
margin-top: 0 !important;
}
/* .devMemberBtn */
.devMemberBtn {
padding-bottom: 0px !important;
padding-top: 20px !important;
}
/* ul.devBottomMenu > li.js-accordion-header.c-accordion__header */
ul.devBottomMenu > li.js-accordion-header.c-accordion__header {
margin-bottom: -10px !important;
}
/* ul.devBottomMenu > li.js-accordion-header.c-accordion__header:last-child */
ul.devBottomMenu > li.js-accordion-header.c-accordion__header:last-child {
margin-bottom: 0 !important;
}
/* ul.devBottomMenu > li.js-accordion-header.c-accordion__header > a.js-accordion-link.c-accordion__link */
ul.devBottomMenu > li.js-accordion-header.c-accordion__header > a.js-accordion-link.c-accordion__link {
font-family: "BasisGrotesqueArabicPro-Medium", Arial, sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
letter-spacing: 0 !important;
line-height: 1 !important;
}
/* ul.devBottomMenu */
ul.devBottomMenu {
margin-bottom: 0 !important;
margin-top: 0 !important;
padding-bottom: 18px !important;
padding-top: 18px !important;
}
/* #slideout-mobile-navigation */
#slideout-mobile-navigation {
-webkit-overflow-scrolling: touch !important;
height: 100dvh !important;
max-height: 100dvh !important;
overflow-y: auto !important;
overscroll-behavior: contain !important;
}
/* html.devMobileMenuLocked, body.devMobileMenuLocked */
html.devMobileMenuLocked, body.devMobileMenuLocked {
overflow: hidden !important;
overscroll-behavior: none !important;
}
/* .devMobileNavigation svg.testament--apollo-close */
.devMobileNavigation svg.testament--apollo-close {
height: 20px;
width: 20px;
}
/* .debvSidebarHead .slideout__trigger--close, .debvSidebarHead .slideout__trigger-mobile-menu.js-slideout-close */
.debvSidebarHead .slideout__trigger--close, .debvSidebarHead .slideout__trigger-mobile-menu.js-slideout-close {
margin-right: 0 !important;
padding-right: 0 !important;
}
/* .debvSidebarHead .slideout__trigger-mobile-menu.js-slideout-close */
.debvSidebarHead .slideout__trigger-mobile-menu.js-slideout-close {
align-items: center !important;
display: flex !important;
justify-content: center !important;
}
/* #slideout-mobile-navigation .mobile-menu > .devMemberBtn */
#slideout-mobile-navigation .mobile-menu > .devMemberBtn {
border-bottom-width: 0.8px !important;
border-top-width: 0.8px !important;
}
/* #slideout-mobile-navigation .mobile-menu > .devBottomMenu, #slideout-mobile-navigation .mobile-menu > .mobile-menu__l... */
#slideout-mobile-navigation .mobile-menu > .devBottomMenu, #slideout-mobile-navigation .mobile-menu > .mobile-menu__locales {
border-bottom-width: 0.8px !important;
border-top-width: 0.8px !important;
}
/* #slideout-mobile-navigation .mobile-menu > .dev_tabs:has(#dev_tabs-nav > li:nth-child(2).active) + .devMemberBtn */
#slideout-mobile-navigation .mobile-menu > .dev_tabs:has(#dev_tabs-nav > li:nth-child(2).active) + .devMemberBtn {
margin-top: -25px !important;
}
/* #slideout-mobile-navigation .mobile-menu > .dev_tabs:has(#dev_tabs-nav > li:nth-child(1).active) + .devMemberBtn */
#slideout-mobile-navigation .mobile-menu > .dev_tabs:has(#dev_tabs-nav > li:nth-child(1).active) + .devMemberBtn {
margin-top: 0 !important;
}
/* ---------------------------------------------------------
@media screen and (max-width: 768px)
--------------------------------------------------------- */
@media screen and (max-width: 768px) {
/* body:not(.template-index) .slideout__trigger-mobile-menu */
body:not(.template-index) .slideout__trigger-mobile-menu {
color: #000 !important;
display: flex !important;
opacity: 1 !important;
visibility: visible !important;
}
/* body:not(.template-index) .slideout__trigger-mobile-menu svg, body:not(.template-index) .slideout__trigger-mobile-men... */
body:not(.template-index) .slideout__trigger-mobile-menu svg, body:not(.template-index) .slideout__trigger-mobile-menu svg path, body:not(.template-index) .slideout__trigger-mobile-menu svg line, body:not(.template-index) .slideout__trigger-mobile-menu svg polygon {
fill: none !important;
stroke: #000 !important;
}
}
/* =========================================================
12. Cart / Mini Cart
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* #slideout-ajax-cart .section-heading.h5 */
#slideout-ajax-cart .section-heading.h5 {
font-family: var(--font-heading-family, inherit) !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .devCartItem, #slideout-ajax-cart .devCartItem *, #slideout-ajax-cart .devCartSubPrice, #slideout... */
#slideout-ajax-cart .devCartItem, #slideout-ajax-cart .devCartItem *, #slideout-ajax-cart .devCartSubPrice, #slideout-ajax-cart .devCartSubPrice .devPrice, #slideout-ajax-cart .devCartSubPrice .money {
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .devCartCloseTrigger svg, #slideout-ajax-cart .devCartCloseTrigger button */
#slideout-ajax-cart .devCartCloseTrigger svg, #slideout-ajax-cart .devCartCloseTrigger button {
height: 14px !important;
width: 14px !important;
}
/* #slideout-ajax-cart .xbfsbu_message, #slideout-ajax-cart .xbfsbu_message * */
#slideout-ajax-cart .xbfsbu_message, #slideout-ajax-cart .xbfsbu_message * {
font-size: 12px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .titleWithPrice .ajax-cart__title, #slideout-ajax-cart .titleWithPrice .ajax-cart__title a, #slid... */
#slideout-ajax-cart .titleWithPrice .ajax-cart__title, #slideout-ajax-cart .titleWithPrice .ajax-cart__title a, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice dl, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice dt, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice dd, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice .money, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice s, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice .order-discount {
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .ajax-cart__cart-variants, #slideout-ajax-cart .ajax-cart__cart-variants span */
#slideout-ajax-cart .ajax-cart__cart-variants, #slideout-ajax-cart .ajax-cart__cart-variants span {
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .devMiniHiddenDetails, #slideout-ajax-cart .devMiniHiddenDetails button, #slideout-ajax-cart .dev... */
#slideout-ajax-cart .devMiniHiddenDetails, #slideout-ajax-cart .devMiniHiddenDetails button, #slideout-ajax-cart .devMiniHiddenDetails input, #slideout-ajax-cart .ajax-cart__item-quantity, #slideout-ajax-cart .ajax-cart__qty-control--down, #slideout-ajax-cart .ajax-cart__qty-control--up, #slideout-ajax-cart .ajax-cart__qty-input {
font-size: 12px !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .devMiniHiddenDetails svg, #slideout-ajax-cart .devMiniHiddenDetails img, #slideout-ajax-cart .re... */
#slideout-ajax-cart .devMiniHiddenDetails svg, #slideout-ajax-cart .devMiniHiddenDetails img, #slideout-ajax-cart .removeImage, #slideout-ajax-cart .ajax-cart__item-remove--icon {
height: 12px !important;
width: 12px !important;
}
/* #slideout-ajax-cart .devRemoveBtn */
#slideout-ajax-cart .devRemoveBtn {
height: 24px !important;
margin-right: 0px !important;
width: 24px !important;
}
/* #slideout-ajax-cart .cart--upsell_title, #slideout-ajax-cart .summaryHeading */
#slideout-ajax-cart .cart--upsell_title, #slideout-ajax-cart .summaryHeading {
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .cart--upsell_text */
#slideout-ajax-cart .cart--upsell_text {
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
/* #slideout-ajax-cart .subtotal .title, #slideout-ajax-cart .subtotal .title *, #slideout-ajax-cart .subtotal .subtotal... */
#slideout-ajax-cart .subtotal .title, #slideout-ajax-cart .subtotal .title *, #slideout-ajax-cart .subtotal .subtotal-price, #slideout-ajax-cart .subtotal .subtotal-price .cart-original-total, #slideout-ajax-cart .subtotal .subtotal-price .cart-price, #slideout-ajax-cart .subtotal .subtotal-price .money, #slideout-ajax-cart .shipping .title, #slideout-ajax-cart .shipping .title *, #slideout-ajax-cart .shipping p {
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
/* .devQuantityWithBtn .ajax-cart__item-quantity, .devQuantityWithBtn .ajax-cart__qty-control--down, .devQuantityWithBtn... */
.devQuantityWithBtn .ajax-cart__item-quantity, .devQuantityWithBtn .ajax-cart__qty-control--down, .devQuantityWithBtn .ajax-cart__qty-control--up, .devQuantityWithBtn .ajax-cart__qty-input {
height: 24px;
}
/* #slideout-ajax-cart .imageWithDetails > .ajax-cart__item-image__wrapper */
#slideout-ajax-cart .imageWithDetails > .ajax-cart__item-image__wrapper {
flex: 0 0 146px !important;
height: 195px !important;
max-width: 146px !important;
min-width: 146px !important;
overflow: hidden !important;
width: 146px !important;
}
/* #slideout-ajax-cart .imageWithDetails > .ajax-cart__item-image__wrapper > a */
#slideout-ajax-cart .imageWithDetails > .ajax-cart__item-image__wrapper > a {
display: block !important;
height: 195px !important;
width: 146px !important;
}
/* #slideout-ajax-cart .imageWithDetails > .ajax-cart__item-image__wrapper > a > img */
#slideout-ajax-cart .imageWithDetails > .ajax-cart__item-image__wrapper > a > img {
display: block !important;
height: 195px !important;
max-width: none !important;
object-fit: cover !important;
object-position: top right !important;
width: 146px !important;
}
/* #slideout-ajax-cart .devQuantityWithBtn */
#slideout-ajax-cart .devQuantityWithBtn {
align-items: center !important;
display: flex !important;
height: auto !important;
}
/* #slideout-ajax-cart .devQuantityWithBtn .devRemoveBtn */
#slideout-ajax-cart .devQuantityWithBtn .devRemoveBtn {
flex: 0 0 32px !important;
height: 24px !important;
margin-right: 0 !important;
width: 32px !important;
}
/* #slideout-ajax-cart .devQuantityWithBtn .ajax-cart__item-quantity */
#slideout-ajax-cart .devQuantityWithBtn .ajax-cart__item-quantity {
border: 0px solid #000 !important;
box-sizing: border-box !important;
display: grid !important;
grid-template-columns: 28px 34px 28px !important;
height: 24px !important;
width: 90px !important;
}
/* #slideout-ajax-cart .devQuantityWithBtn .ajax-cart__qty-control--down, #slideout-ajax-cart .devQuantityWithBtn .ajax-... */
#slideout-ajax-cart .devQuantityWithBtn .ajax-cart__qty-control--down, #slideout-ajax-cart .devQuantityWithBtn .ajax-cart__qty-control--up, #slideout-ajax-cart .devQuantityWithBtn .ajax-cart__qty-input {
border: 0 !important;
box-sizing: border-box !important;
height: 22px !important;
line-height: 22px !important;
margin: 0 !important;
min-height: 22px !important;
padding: 0 !important;
text-align: center !important;
width: 100% !important;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* #slideout-ajax-cart .devQuantityWithBtn button, #slideout-ajax-cart .devQuantityWithBtn input */
#slideout-ajax-cart .devQuantityWithBtn button, #slideout-ajax-cart .devQuantityWithBtn input {
-webkit-appearance: none !important;
appearance: none !important;
border-radius: 0 !important;
}
/* #slideout-ajax-cart .devQuantityWithBtn .devRemoveBtn .removeImage */
#slideout-ajax-cart .devQuantityWithBtn .devRemoveBtn .removeImage {
display: block !important;
height: 12px !important;
min-width: 12px !important;
object-fit: contain !important;
width: 12px !important;
}
/* #slideout-ajax-cart .titleWithPrice */
#slideout-ajax-cart .titleWithPrice {
align-items: flex-start !important;
display: flex !important;
}
/* #slideout-ajax-cart .titleWithPrice .ajax-cart__title, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice, #slideo... */
#slideout-ajax-cart .titleWithPrice .ajax-cart__title, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice dl, #slideout-ajax-cart .titleWithPrice .devMiniItemPrice dd {
line-height: 1.2 !important;
margin-top: 0 !important;
padding-top: 0 !important;
}
/* #slideout-ajax-cart .miniCartDetails .ajax-cart__cart-title__wrapper, #slideout-ajax-cart .miniCartDetails .ajax-cart... */
#slideout-ajax-cart .miniCartDetails .ajax-cart__cart-title__wrapper, #slideout-ajax-cart .miniCartDetails .ajax-cart__cart-title__wrapper.v-center {
line-height: 1.2 !important;
vertical-align: top !important;
}
/* #slideout-ajax-cart .miniCartDetails .ajax-cart__cart-variants */
#slideout-ajax-cart .miniCartDetails .ajax-cart__cart-variants {
display: block !important;
line-height: 1.2 !important;
margin: 0 !important;
padding: 0 !important;
}
/* ---- #mini-cart .miniCartDetails */
---- #mini-cart .miniCartDetails {
position: relative;
}
/* #mini-cart .miniCartDetails > .nvlty-cart-remove-x */
#mini-cart .miniCartDetails > .nvlty-cart-remove-x {
bottom: -4px;
cursor: pointer;
display: grid !important;
height: 24px;
place-items: center;
position: absolute;
right: -3px;
width: 24px;
z-index: 20;
}
/* #mini-cart .nvlty-cart-remove-x svg */
#mini-cart .nvlty-cart-remove-x svg {
height: 18px;
width: 18px;
}
/* #mini-cart .nvlty-cart-remove-x svg path */
#mini-cart .nvlty-cart-remove-x svg path {
fill: none;
stroke: #000000;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2.1px;
}
/* .product-index .prod-image, .product-index .js-product-image, .custom-cart-upsell__card */
.product-index .prod-image, .product-index .js-product-image, .custom-cart-upsell__card {
position: relative !important;
}
/* #mini-cart .ajax-cart__cart-form > .nvlty-cart-checkout-stack */
#mini-cart .ajax-cart__cart-form > .nvlty-cart-checkout-stack {
background: #fff;
border-top: 1px solid #000 !important;
bottom: 0;
box-sizing: border-box !important;
display: grid !important;
gap: 8px;
grid-column: 1 / -1 !important;
grid-template-columns: 1fr;
margin: 0 !important;
max-width: none !important;
padding: 16px !important;
position: sticky;
width: 100% !important;
z-index: 50;
}
/* #mini-cart .nvlty-cart-sticky-total */
#mini-cart .nvlty-cart-sticky-total {
align-items: center !important;
box-sizing: border-box !important;
color: #000 !important;
display: flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
justify-content: space-between !important;
letter-spacing: normal !important;
line-height: 1.2 !important;
margin: 0 !important;
padding: 0 !important;
text-transform: uppercase !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-sticky-total span:first-child */
#mini-cart .nvlty-cart-sticky-total span:first-child {
text-align: left !important;
}
/* #mini-cart .nvlty-cart-sticky-total span:last-child */
#mini-cart .nvlty-cart-sticky-total span:last-child {
text-align: right !important;
}
/* #mini-cart .nvlty-cart-checkout-stack > button#checkout.nvlty-cart-checkout-main */
#mini-cart .nvlty-cart-checkout-stack > button#checkout.nvlty-cart-checkout-main {
align-items: center !important;
background: #000 !important;
border: 1px solid #000 !important;
border-radius: 1px !important;
box-sizing: border-box !important;
color: transparent !important;
cursor: pointer;
display: flex !important;
font-size: 0 !important;
height: 35px !important;
justify-content: center !important;
margin: 0 !important;
max-height: 35px !important;
max-width: none !important;
min-height: 35px !important;
padding: 0 !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-checkout-stack > button#checkout.nvlty-cart-checkout-main::before */
#mini-cart .nvlty-cart-checkout-stack > button#checkout.nvlty-cart-checkout-main::before {
color: #fff !important;
content: "SECURE CHECKOUT";
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
letter-spacing: normal !important;
line-height: 1.2 !important;
text-align: center !important;
text-transform: uppercase !important;
}
/* #mini-cart .nvlty-cart-express-checkout */
#mini-cart .nvlty-cart-express-checkout {
display: none !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout */
#mini-cart .nvlty-cart-accelerated-checkout {
--shopify-accelerated-checkout-button-block-size: 35px !important;
--shopify-accelerated-checkout-button-border-radius: 1px !important;
--shopify-accelerated-checkout-button-box-shadow: none !important;
box-sizing: border-box !important;
font-size: 0 !important;
height: 35px !important;
margin: 0 !important;
overflow: visible !important;
padding: 0 !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout shopify-accelerated-checkout, #mini-cart .nvlty-cart-accelerated-checkout... */
#mini-cart .nvlty-cart-accelerated-checkout shopify-accelerated-checkout, #mini-cart .nvlty-cart-accelerated-checkout shopify-accelerated-checkout-cart {
align-items: stretch !important;
display: grid !important;
font-size: 0 !important;
gap: 8px !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
height: 35px !important;
max-height: 35px !important;
min-height: 35px !important;
overflow: visible !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout [slot^="button"], #mini-cart .nvlty-cart-accelerated-checkout shopify-pay... */
#mini-cart .nvlty-cart-accelerated-checkout [slot^="button"], #mini-cart .nvlty-cart-accelerated-checkout shopify-paypal-button, #mini-cart .nvlty-cart-accelerated-checkout shopify-google-pay-button {
border: 1px solid #000 !important;
border-radius: 1px !important;
box-sizing: border-box !important;
display: block !important;
height: 35px !important;
margin: 0 !important;
max-height: 35px !important;
max-width: none !important;
min-height: 35px !important;
min-width: 0 !important;
overflow: hidden !important;
padding: 0 !important;
transform: none !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout shopify-paypal-button > div, #mini-cart .nvlty-cart-accelerated-checkout ... */
#mini-cart .nvlty-cart-accelerated-checkout shopify-paypal-button > div, #mini-cart .nvlty-cart-accelerated-checkout shopify-google-pay-button > div, #mini-cart .nvlty-cart-accelerated-checkout [slot^="shadow-slot"], #mini-cart .nvlty-cart-accelerated-checkout .paypal-buttons, #mini-cart .nvlty-cart-accelerated-checkout .gpay-button, #mini-cart .nvlty-cart-accelerated-checkout iframe {
border-radius: 1px !important;
height: 35px !important;
max-height: 35px !important;
max-width: 100% !important;
min-height: 35px !important;
min-width: 0 !important;
transform: none !important;
width: 100% !important;
}
/* #mini-cart p.sm-caps.or-divider.mt2.mb2.a-center, #mini-cart .sm-caps.or-divider, #mini-cart .shopify-payment-button_... */
#mini-cart p.sm-caps.or-divider.mt2.mb2.a-center, #mini-cart .sm-caps.or-divider, #mini-cart .shopify-payment-button__more-options, #mini-cart more-payment-options-link {
display: none !important;
}
/* #mini-cart .nvlty-cart-sticky-total .cart-price, #mini-cart .nvlty-cart-sticky-total .money */
#mini-cart .nvlty-cart-sticky-total .cart-price, #mini-cart .nvlty-cart-sticky-total .money {
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
/* #mini-cart .nvlty-wallet-grid */
#mini-cart .nvlty-wallet-grid {
display: grid !important;
gap: 8px !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
height: 35px !important;
width: 100% !important;
}
/* #mini-cart .nvlty-wallet-slot */
#mini-cart .nvlty-wallet-slot {
border: 1px solid #000 !important;
border-radius: 1px !important;
box-sizing: border-box !important;
height: 35px !important;
min-width: 0 !important;
overflow: hidden !important;
width: 100% !important;
}
/* #mini-cart .nvlty-wallet-slot shopify-paypal-button, #mini-cart .nvlty-wallet-slot shopify-google-pay-button */
#mini-cart .nvlty-wallet-slot shopify-paypal-button, #mini-cart .nvlty-wallet-slot shopify-google-pay-button {
border: 0 !important;
display: block !important;
height: 35px !important;
max-width: 100% !important;
min-width: 0 !important;
width: 100% !important;
}
/* #mini-cart .nvlty-wallet-source */
#mini-cart .nvlty-wallet-source {
height: 0 !important;
opacity: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button */
#mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button {
font-size: 0 !important;
margin: 0 !important;
padding: 0 !important;
column-gap: 8px !important;
display: grid !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
height: 35px !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button shopify-accelerated-checkout, #mini-cart .nvlty-c... */
#mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button shopify-accelerated-checkout, #mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button shopify-accelerated-checkout-cart {
display: contents !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button shopify-paypal-button, #mini-cart .nvlty-cart-acc... */
#mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button shopify-paypal-button, #mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button shopify-google-pay-button {
display: block !important;
height: 35px !important;
margin: 0 !important;
max-width: 100% !important;
min-width: 0 !important;
transform: none !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button, #mini-cart .nvlty-cart-accelerated-checkout shop... */
#mini-cart .nvlty-cart-accelerated-checkout .shopify-payment-button, #mini-cart .nvlty-cart-accelerated-checkout shopify-accelerated-checkout, #mini-cart .nvlty-cart-accelerated-checkout shopify-accelerated-checkout-cart {
display: block !important;
height: 35px !important;
max-width: none !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout .wallet-cart-grid.accelerated-checkout-button-container */
#mini-cart .nvlty-cart-accelerated-checkout .wallet-cart-grid.accelerated-checkout-button-container {
display: grid !important;
gap: 8px !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
height: 35px !important;
max-width: none !important;
min-height: 35px !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-accelerated-checkout .wallet-cart-grid.accelerated-checkout-button-container > * */
#mini-cart .nvlty-cart-accelerated-checkout .wallet-cart-grid.accelerated-checkout-button-container > * {
height: 35px !important;
margin: 0 !important;
max-height: 35px !important;
max-width: 100% !important;
min-height: 35px !important;
min-width: 0 !important;
width: 100% !important;
}
/* #mini-cart .nvlty-cart-rewards-block strong */
#mini-cart .nvlty-cart-rewards-block strong {
font-weight: 900 !important;
}
/* #mini-cart .nvlty-cart-rewards-block a */
#mini-cart .nvlty-cart-rewards-block a {
color: #000 !important;
font-weight: 500 !important;
text-decoration: underline !important;
}
/* #mini-cart .nvlty-cart-rewards-block */
#mini-cart .nvlty-cart-rewards-block {
align-items: center !important;
background: rgb(231, 231, 231) !important;
border-radius: 1px !important;
box-sizing: border-box !important;
color: #000 !important;
display: none !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
grid-column: 1 / -1 !important;
height: 35px !important;
justify-content: center !important;
line-height: 1.2 !important;
margin: 0 16px !important;
min-height: 35px !important;
padding: 0 10px !important;
text-align: center !important;
width: calc(100% - 32px) !important;
gap: 0 !important;
}
#mini-cart .nvlty-cart-rewards-block {
display: none !important;
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
/* #mini-cart .nvlty-cart-rewards-block span, #mini-cart .nvlty-cart-rewards-block strong, #mini-cart .nvlty-cart-reward... */
#mini-cart .nvlty-cart-rewards-block span, #mini-cart .nvlty-cart-rewards-block strong, #mini-cart .nvlty-cart-rewards-block a {
display: inline-block !important;
}
/* ---------------------------------------------------------
@media screen and (max-width: 749px)
--------------------------------------------------------- */
@media screen and (max-width: 749px) {
/* .upsell--carousel_container .swym-wishlist-collections-v2-container */
.upsell--carousel_container .swym-wishlist-collections-v2-container {
display: none !important;
}
/* .upsell--carousel_container .box-ratio img.img_class */
.upsell--carousel_container .box-ratio img.img_class {
height: auto !important;
max-height: 126.5px !important;
max-width: 108px !important;
width: auto !important;
}
/* .upsell--carousel_container .scroll-wrapper */
.upsell--carousel_container .scroll-wrapper {
-webkit-overflow-scrolling: touch !important;
display: flex !important;
flex-wrap: nowrap !important;
gap: 4px !important;
margin: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
padding: 0 !important;
scroll-behavior: smooth !important;
scroll-snap-type: x mandatory !important;
scrollbar-width: none !important;
}
/* .upsell--carousel_container .scroll-wrapper::-webkit-scrollbar */
.upsell--carousel_container .scroll-wrapper::-webkit-scrollbar {
display: none !important;
}
/* .upsell--carousel_container .cart-form__upsell-item--outer */
.upsell--carousel_container .cart-form__upsell-item--outer {
background: var(--background-darken) !important;
box-sizing: border-box !important;
flex: 0 0 38% !important;
margin-bottom: 0 !important;
margin-right: 0 !important;
max-width: 38% !important;
min-width: 38% !important;
scroll-snap-align: start !important;
width: 38% !important;
}
/* .upsell--carousel_container .cart-form__upsell-item */
.upsell--carousel_container .cart-form__upsell-item {
box-sizing: border-box !important;
display: flex !important;
flex-direction: column !important;
gap: 4px !important;
max-width: 100% !important;
min-width: 0 !important;
padding: 0 !important;
transform: none !important;
transition: none !important;
width: 100% !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .js-product-image, .upsell--carousel_container .cart-form__upsell... */
.upsell--carousel_container .cart-form__upsell-item .js-product-image, .upsell--carousel_container .cart-form__upsell-item .prod-image, .upsell--carousel_container .cart-form__upsell-item .reveal, .upsell--carousel_container .cart-form__upsell-item .box-ratio {
box-sizing: border-box !important;
display: block !important;
max-width: 100% !important;
min-width: 0 !important;
width: 100% !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .prod-image */
.upsell--carousel_container .cart-form__upsell-item .prod-image {
grid-column: auto !important;
grid-row: auto !important;
overflow: hidden !important;
position: relative !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .box-ratio */
.upsell--carousel_container .cart-form__upsell-item .box-ratio {
overflow: hidden !important;
padding-bottom: 133.333333% !important;
position: relative !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .box-ratio img.img_class */
.upsell--carousel_container .cart-form__upsell-item .box-ratio img.img_class {
height: 100% !important;
inset: 0 !important;
max-height: none !important;
max-width: none !important;
position: absolute !important;
width: 100% !important;
object-fit: contain !important;
object-position: center center !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .product-info, .upsell--carousel_container .cart-form__upsell-ite... */
.upsell--carousel_container .cart-form__upsell-item .product-info, .upsell--carousel_container .cart-form__upsell-item .product-info-inner, .upsell--carousel_container .cart-form__upsell-item .price {
box-sizing: border-box !important;
display: block !important;
max-width: 100% !important;
min-width: 0 !important;
overflow: hidden !important;
text-align: left !important;
width: 100% !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .product-info */
.upsell--carousel_container .cart-form__upsell-item .product-info {
align-self: auto !important;
font-size: calc(var(--font-size) - 2px) !important;
grid-column: auto !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .product-info-inner */
.upsell--carousel_container .cart-form__upsell-item .product-info-inner {
flex-direction: column !important;
line-height: 1.4em !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .prod-title */
.upsell--carousel_container .cart-form__upsell-item .prod-title {
display: block !important;
max-width: 100% !important;
overflow-wrap: anywhere !important;
white-space: normal !important;
}
/* .upsell--carousel_container .cart-form__upsell-item .price */
.upsell--carousel_container .cart-form__upsell-item .price {
align-items: flex-start !important;
}
}
/* =========================================================
13. Footer
========================================================= */
/* ---------------------------------------------------------
@media screen and (max-width: 740px)
--------------------------------------------------------- */
@media screen and (max-width: 740px) {
/* #footer-EMAIL */
#footer-EMAIL {
margin-bottom: 15px !important;
}
/* #footer-subscribe, #footer-subscribe.parent, form:has(#footer-EMAIL) #footer-subscribe */
#footer-subscribe, #footer-subscribe.parent, form:has(#footer-EMAIL) #footer-subscribe {
margin-top: 0 !important;
}
/* form:has(#footer-EMAIL) */
form:has(#footer-EMAIL) {
gap: 8px !important;
row-gap: 8px !important;
}
/* .footer-block.block-1480352627697 */
.footer-block.block-1480352627697 {
margin-top: -10px !important;
padding-top: 0 !important;
}
}
/* ---------------------------------------------------------
Global rules
--------------------------------------------------------- */
/* .footerMenu a, .footerMenu .menu__list a */
.footerMenu a, .footerMenu .menu__list a {
font-family: "BasisGrotesqueArabicPro-Medium", sans-serif !important;
font-size: 12px !important;
line-height: 1.2 !important;
}
/* .footerMenu .menu__list li a */
.footerMenu .menu__list li a {
display: block !important;
line-height: 2 !important;
}
/* .footerMenu li.hasSubmenu > a .devChevron */
.footerMenu li.hasSubmenu > a .devChevron {
display: inline-block !important;
transform-origin: center center !important;
transition: transform 0.25s ease !important;
}
/* .footerMenu li.hasSubmenu > a.active .devChevron */
.footerMenu li.hasSubmenu > a.active .devChevron {
transform: rotate(180deg) !important;
}
/* #footer-wrapper #footer-subscribe */
#footer-wrapper #footer-subscribe {
font-size: 19px;
height: 35px;
margin-bottom: 0px;
margin-top: 15px;
}
/* #footer-wrapper input#footer-EMAIL */
#footer-wrapper input#footer-EMAIL {
background: transparent;
border: 1px solid var(--footer-input);
color: var(--footer-input);
height: 32px;
padding-left: 5px;
padding-right: 5px;
}
/* ---------------------------------------------------------
@media screen and (max-width: 980px)
--------------------------------------------------------- */
@media screen and (max-width: 980px) {
/* .footerMenu > li, .footerMenu .menu__list > li */
.footerMenu > li, .footerMenu .menu__list > li {
border-bottom-width: 0.5px !important;
border-top-width: 0.5px !important;
}
/* .footerMenu > li > a, .footerMenu .menu__list > li > a */
.footerMenu > li > a, .footerMenu .menu__list > li > a {
border-bottom-width: 0.5px !important;
border-top-width: 0.5px !important;
}
.footer-sect .disclosure-list {
border-bottom: 0.5px solid rgb(204, 204, 204) !important;
border-top: 0.5px solid rgb(204, 204, 204) !important;
}
}
/* ==========================================================================
SWYM WISHLIST CUSTOMIZATIONS
========================================================================== */
/* ==========================================================================
HEADER WISHLIST LINK — STATIC, NON-SWYM CONTROL
========================================================================== */
.header-wishlist-link {
width: 24px !important;
height: 24px !important;
}
.header-wishlist-icon {
width: 24px !important;
height: 24px !important;
}
.header-wishlist-item {
margin-right: 5px;
}
.header-wishlist-item {
position: relative;
margin-right: 12px;
}
.header-wishlist-link {
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.header-wishlist-count {
position: absolute;
top: 0px;
right: -8px;
font-size: 12px;
font-weight: 700;
line-height: 1;
color: currentColor;
font-family: "Basis Grotesque Pro", "Basis", sans-serif;
}
body.template-index div#header-group .header-wishlist-link {
color: {{ section.settings.overlay_color }};
}
body.template-index div#header-group:hover .header-wishlist-link,
body.template-index div#header-group .navigation.navigation--sticky .header-wishlist-link {
color: var(--header-link-color);
}
#swym-wishlist-render-container .swym-storefront-layout-default-list-container {
display: none !important;
}
#nvlty-wishlist-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 4px;
padding: 0;
margin: 0;
}
#nvlty-wishlist-grid .featured__collection-product {
width: 100%;
}
#swym-wishlist-render-container > *:not(#nvlty-wishlist-shell),
.swym-ui-component,
.swym-wishlist-page,
.swym-storefront-layout-default-list-container {
display: none !important;
}
#swym-wishlist-render-container {
display: block !important;
}
#nvlty-wishlist-shell {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
}
#nvlty-wishlist-grid:not([hidden]) {
display: grid !important;
visibility: visible !important;
opacity: 1 !important;
}
.nvlty-wishlist-heading {
margin: 0 0 16px;
font-family: "BasisGrotesqueArabicPro-Black", sans-serif;
font-size: 14px;
font-weight: 900;
line-height: 1;
text-transform: uppercase;
}
#nvlty-wishlist-shell .nvlty-wishlist-heading {
margin: 0 16px 16px !important;
padding: 0 !important;
font-family: "BasisGrotesqueArabicPro-Black", sans-serif !important;
font-size: 14px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-align: left !important;
text-transform: uppercase !important;
color: #000 !important;
}
#nvlty-wishlist-shell {
margin: 0;
padding: 0;
width: 100%;
}
#nvlty-wishlist-shell .nvlty-wishlist-heading {
margin: 15px 16px 16px !important;
padding: 0 !important;
font-family: "BasisGrotesqueArabicPro-Black", sans-serif !important;
font-size: 18px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-align: left !important;
text-transform: uppercase !important;
color: #000 !important;
}
#nvlty-wishlist-grid {
left: 50%;
margin-left: -50vw;
width: 100vw;
}
#nvlty-wishlist-grid .nvlty-wishlist-price {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
clear: both !important;
margin-top: 2px !important;
position: relative !important;
z-index: 2 !important;
}
#nvlty-wishlist-grid .nvlty-wishlist-product-info {
padding-bottom: 18px !important;
}
#nvlty-wishlist-grid .nvlty-wishlist-card {
margin-bottom: 0px !important;
}
/* Hide SWYM injected button if it lands inside colour swatches */
.devCollectionCardSwatches .swym-wishlist-collections-v2,
.devCollectionCardSwatches .swym-wishlist-collections-v2-container {
display: none !important;
}
.collection__page-product .devProduct-image {
position: relative !important;
}
.product-index .devProduct-image,
.product-index .prod-image {
position: relative !important;
}
.devWishlistProxy {
display: block !important;
position: absolute !important;
top: 2px !important;
right: 2px !important;
z-index: 50 !important;
width: 24px !important;
height: 24px !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
background: transparent !important;
cursor: pointer !important;
}
.nvCollectionNav {
grid-column: 1 / -1 !important;
min-width: 0 !important;
position: relative !important;
width: 100% !important;
margin: 14px 0 22px 0 !important;
padding: 0 0 3px 0 !important;
overflow: hidden !important;
}
.nvCollectionNav__list {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: 24px !important;
width: 100% !important;
margin: 0 !important;
padding: 0 0 8px 0 !important;
list-style: none !important;
overflow-x: auto !important;
overflow-y: hidden !important;
white-space: nowrap !important;
scrollbar-width: none !important;
-webkit-overflow-scrolling: touch !important;
}
.nvCollectionNav__list::-webkit-scrollbar {
display: none !important;
}
.nvCollectionNav__item {
flex: 0 0 auto !important;
display: block !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
.nvCollectionNav__link {
display: block !important;
font-family: "BasisGrotesqueArabicPro-Black", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
color: #000 !important;
text-decoration: none !important;
white-space: nowrap !important;
}
.nvCollectionNav__track {
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: 1.5px !important;
background: #e7e7e7 !important;
border-radius: 999px !important;
pointer-events: none !important;
}
.nvCollectionNav__thumb {
position: absolute !important;
left: 0 !important;
bottom: 0 !important;
height: 2px !important;
width: var(--nv-thumb-width, 40px) !important;
background: #000 !important;
border-radius: 999px !important;
pointer-events: none !important;
z-index: 2 !important;
transform: translate3d(var(--nv-thumb-x, 0px), 0, 0) !important;
will-change: transform, width;
}
@media (max-width: 980px) {
html body:not(.devFiltersActive) div#collection-sidebar.collection__page-sidebar {
display: none !important;
}
html body.devFiltersActive div#collection-sidebar.collection__page-sidebar {
display: block !important;
}
}
#main-collection-product-grid {
opacity: 0;
animation: nvCollectionFadeIn 900ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
animation-delay: 500ms;
will-change: opacity;
}
@keyframes nvCollectionFadeIn {
0% { opacity: 0.00; }
5% { opacity: 0.01; }
10% { opacity: 0.02; }
15% { opacity: 0.04; }
20% { opacity: 0.07; }
25% { opacity: 0.11; }
30% { opacity: 0.16; }
35% { opacity: 0.22; }
40% { opacity: 0.29; }
45% { opacity: 0.37; }
50% { opacity: 0.46; }
55% { opacity: 0.56; }
60% { opacity: 0.66; }
65% { opacity: 0.74; }
70% { opacity: 0.81; }
75% { opacity: 0.87; }
80% { opacity: 0.92; }
85% { opacity: 0.95; }
90% { opacity: 0.97; }
95% { opacity: 0.99; }
100% { opacity: 1.00; }
}
#searchbox,
#searchbox::placeholder {
font-size: 10px !important;
font-weight: 700 !important;
}
#CollectionProductGrid .product-info-inner > .price.price--listing {
padding-top: 6px !important;
}
#slideout-mobile-navigation .slideout__trigger-mobile-menu .hover-stroke {
stroke: #000 !important;
}
.slideout__trigger--close .slideout__trigger-mobile-menu svg.testament--apollo-close path {
stroke: #fff !important;
}
.devNativeProductGalleryIndicator {
position: relative !important;
width: 100% !important;
height: 2px !important;
background: #e7e7e7 !important;
overflow: hidden !important;
}
.devNativeProductGalleryIndicator span {
position: absolute !important;
left: 0 !important;
top: 0 !important;
height: 2px !important;
width: var(--pdp-gallery-thumb-width, 40px) !important;
background: #000 !important;
transform: translate3d(var(--pdp-gallery-thumb-x, 0px), 0, 0) !important;
transition: transform 120ms linear !important;
border-radius: 1px !important;
}
/* Disable product-card image toggle ONLY in Featured Collection sections */
.dev-featured-native-slider .devProductCardCarouselSlide:not(:first-child),
.dev-featured-native-slider .nvProductCardNav {
display: none !important;
}
.dev-featured-native-slider .devProductCardCarouselTrack {
transform: none !important;
transition: none !important;
}
@media screen and (max-width: 980px) {
body.template-index div#header-group:hover .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars,
body.template-index div#header-group:hover .navigation:not(.navigation--sticky) .slideout__trigger-mobile-menu svg.testament--icon-theme-menu-bars path {
color: #fff !important;
stroke: #fff !important;
fill: none !important;
}
}
@media screen and (max-width: 980px) {
body.template-index div#header-group nav.navigation:not(.navigation--sticky) .nav-container::after {
background: #e7e7e7 !important;
border-color: #e7e7e7 !important;
}
body.template-index div#header-group nav.navigation.navigation--sticky .nav-container::after {
background: #e7e7e7 !important;
border-color: #e7e7e7 !important;
}
}
.devFeaturedCollection {
display: block !important;
}
.global__section.mt0 {
margin-top: 20px !important;
margin-bottom: 20px;
}
footer {
margin-top: 0px;
}
.nvlty-seen__gallery {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
}
/*
============================================================================================================================================================
DESKTOP VERSIONS
SHOPIFY CODE
@media screen and (min-width: 990px)
============================================================================================================================================================
*/
@media screen and (min-width: 990px) {
predictive-search.devMobilePreSerach {
transition: opacity 180ms ease, height 180ms ease, overflow 180ms ease;
}
predictive-search.devMobilePreSerach.devDesktopSearchHidden {
height: 0 !important;
opacity: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
}
@media screen and (min-width: 990px) {
body.template-index div#header-group .nav-container {
display: flex !important;
height: 50px !important;
min-height: 50px !important;
max-height: 50px !important;
align-items: center !important;
justify-content: space-between !important;
position: relative !important;
}
body.template-index div#header-group #logo {
position: absolute !important;
left: 50% !important;
top: 50% !important;
transform: translate(-50%, -50%) !important;
margin: 0 !important;
line-height: 0 !important;
width: auto !important;
}
body.template-index div#header-group #logo a {
display: block !important;
line-height: 0 !important;
}
body.template-index div#header-group #logo img {
display: block !important;
width: auto !important;
height: 34px !important;
max-height: 34px !important;
max-width: 220px !important;
}
}
@media screen and (min-width: 990px) {
/* Search input */
body.template-index #header-group:hover .searchbox__input,
body.template-index #header-group:hover .searchbox__input::placeholder {
color: #000 !important;
opacity: 1 !important;
}
/* Search icon */
body.template-index #header-group:hover #search_button,
body.template-index #header-group:hover #search_button svg,
body.template-index #header-group:hover #search_button svg * {
color: #000 !important;
stroke: #000 !important;
fill: none !important;
}
}
@media screen and (min-width: 990px) {
body.template-index #header-group:hover .devMobilePreSerach .devInputWrapper {
border-top-color: #e7e7e7 !important;
border-bottom-color: #e7e7e7 !important;
border-left-color: transparent !important;
border-right-color: transparent !important;
}
}
@media screen and (min-width: 990px) {
.slideshow__bar-link {
width: 700px !important;
max-width: 700px !important;
min-width: 700px !important;
}
}
@media screen and (min-width: 990px) {
body.template-index #header-group .devMobilePreSerach .devInputWrapper {
border-top: 0 !important;
border-bottom: 0 !important;
}
}
/* DESKTOP ONLY — EVERY PAGE */
@media screen and (min-width: 990px) {
#header-group .devInputWrapper {
position: relative !important;
}
#header-group .devInputWrapper::before {
content: "" !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
height: 1px !important;
background: #e7e7e7 !important;
opacity: 1 !important;
visibility: visible !important;
transition: none !important;
pointer-events: none !important;
}
}
/* Show only in the initial static state */
body.template-index
#header-group:not(:hover)
.navigation:not(.navigation--sticky)
.devInputWrapper::before {
opacity: 1;
}
/* Hide while hovering */
body.template-index
#header-group:hover
.devInputWrapper::before {
opacity: 0;
}
/* Hide after the header becomes sticky on scroll */
body.template-index
#header-group
.navigation.navigation--sticky
.devInputWrapper::before {
opacity: 0;
}
}
/* =========================================================
FEATURED COLLECTION PDC — DESKTOP ONLY
Preserve the working mobile card layout on desktop.
========================================================= */
@media screen and (min-width: 741px) {
/*
* Do not change the carousel/card-width rules above.
* This section only corrects the content inside each card.
*/
#featured_collection--{{ section.id }}
.featured__collection-product {
min-width: 0 !important;
}
/* Image is the positioning parent */
#featured_collection--{{ section.id }}
.featured__collection-product
.devProduct-image {
position: relative !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.devProductCardCarousel,
#featured_collection--{{ section.id }}
.featured__collection-product
.devProductCardCarouselTrack,
#featured_collection--{{ section.id }}
.featured__collection-product
.devProductCardCarouselSlide {
width: 100% !important;
max-width: 100% !important;
}
/*
* NEW RELEASE:
* return it to the image overlay instead of normal document flow.
*/
#featured_collection--{{ section.id }}
.featured__collection-product
.devNewtags {
position: absolute !important;
top: 10px !important;
left: 10px !important;
right: auto !important;
bottom: auto !important;
z-index: 20 !important;
display: block !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
pointer-events: none !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.devCollectionProductLabel {
display: inline-flex !important;
align-items: center !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 7px 10px !important;
font-size: 13px !important;
line-height: 1 !important;
font-weight: 600 !important;
white-space: nowrap !important;
}
/*
* Quick-view / plus icon:
* return it to the bottom-right corner of the image.
*/
#featured_collection--{{ section.id }}
.featured__collection-product
.product-listing__quickview-trigger {
position: absolute !important;
right: 8px !important;
bottom: 8px !important;
top: auto !important;
left: auto !important;
z-index: 20 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 32px !important;
height: 32px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.product-listing__quickview-trigger img {
display: block !important;
width: 32px !important;
height: 32px !important;
object-fit: contain !important;
}
/*
* Product information:
* keep it tight beneath the image.
*/
#featured_collection--{{ section.id }}
.featured__collection-product
.product-info {
display: block !important;
width: 100% !important;
margin: 6px 0 0 !important;
padding: 0 !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.product-info-inner {
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
/*
* Active thumbnail border.
*/
#featured_collection--{{ section.id }}
.featured__collection-product
.devCollectionCardSwatch.is-active {
outline: 1px solid #000 !important;
outline-offset: -1px !important;
}
/*
* Title, colour and price:
* stop the theme's desktop typography from scaling these up.
*/
#featured_collection--{{ section.id }}
.featured__collection-product
.devCollectionCardTitleLink {
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
text-decoration: none !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.prod-title {
display: block !important;
margin: 0 !important;
padding: 0 !important;
font-size: 14px !important;
line-height: 1.08 !important;
font-weight: 900 !important;
text-transform: uppercase !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.devCardColorLabel {
display: block !important;
margin: 6px 0 0 !important;
padding: 0 !important;
font-size: 12px !important;
line-height: 1.2 !important;
font-weight: 400 !important;
text-transform: uppercase !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.price--listing {
display: block !important;
margin: 6px 0 0 !important;
padding: 0 !important;
font-size: 14px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.price--listing dl,
#featured_collection--{{ section.id }}
.featured__collection-product
.price--listing dt,
#featured_collection--{{ section.id }}
.featured__collection-product
.price--listing dd {
margin: 0 !important;
padding: 0 !important;
}
}
@media screen and (min-width: 741px) {
html body #shopify-section-{{ section.id }}
div#featured_collection--{{ section.id }}.dev-featured-native-slider {
gap: 4px !important;
}
html body #shopify-section-{{ section.id }}
div#featured_collection--{{ section.id }}.dev-featured-native-slider
div.devCollectionCardSwatches {
gap: 4px !important;
}
}
@media screen and (min-width: 741px) {
#featured_collection--{{ section.id }}
.featured__collection-product
.product-info-inner {
padding-inline: 8px !important;
}
}
@media screen and (min-width: 741px) {
#featured_collection--{{ section.id }}
.featured__collection-product
.devProduct-image {
position: relative !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
.devNewtags {
position: absolute !important;
top: 0 !important;
left: 4px !important;
z-index: 50 !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
pointer-events: none !important;
}
#featured_collection--{{ section.id }}
.featured__collection-product
span.product-badge.new-release.devCollectionProductLabel {
position: relative !important;
top: auto !important;
left: auto !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
height: 20px !important;
margin: 0 !important;
padding: 0 8px !important;
border-radius: 1px !important;
border: 0 !important;
background: rgba(0, 0, 0, 0.5) !important;
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 10px !important;
font-weight: 700 !important;
font-style: normal !important;
line-height: 20px !important;
letter-spacing: normal !important;
text-indent: 0 !important;
text-transform: uppercase !important;
white-space: nowrap !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: none !important;
z-index: 50 !important;
}
}
@media screen and (min-width: 741px) {
#shopify-section-template--28397085819262__dev_collection_clist_slider_CKhyQP
section.global__section {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
column-gap: 4px !important;
row-gap: 4px !important;
width: 100% !important;
}
#shopify-section-template--28397085819262__dev_collection_clist_slider_CKhyQP
section.global__section
> .featured__collection-product {
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
float: none !important;
}
#shopify-section-template--28397085819262__dev_collection_clist_slider_CKhyQP
.collection__item-image {
width: 100% !important;
aspect-ratio: 3 / 4 !important;
overflow: hidden !important;
}
#shopify-section-template--28397085819262__dev_collection_clist_slider_CKhyQP
.collection__item-image > a {
display: block !important;
width: 100% !important;
height: 100% !important;
}
#shopify-section-template--28397085819262__dev_collection_clist_slider_CKhyQP
.collection__item-image img {
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
object-position: center !important;
}
}
@media screen and (min-width: 741px) {
.nvlty-seen__heading {
font-size: 20px !important;
line-height: 1.2 !important;
letter-spacing: normal !important;
}
.nvlty-seen__handle,
.nvlty-seen__handle p,
.nvlty-seen__handle a {
font-size: 12px !important;
line-height: 1.4 !important;
letter-spacing: normal !important;
}
}
@media screen and (min-width: 741px) {
/* NVLTY Seen — same card dimensions as desktop product cards */
#shopify-section-template--28397085819262__dev_nvlty_seen_Q3Pkci
.nvlty-seen__gallery.devNvltyseenSlider {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-start !important;
gap: 4px !important;
column-gap: 4px !important;
row-gap: 0 !important;
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scrollbar-width: none !important;
}
#shopify-section-template--28397085819262__dev_nvlty_seen_Q3Pkci
.nvlty-seen__gallery.devNvltyseenSlider::-webkit-scrollbar {
display: none !important;
}
@media screen and (min-width: 741px) {
/* NVLTY Seen — horizontal slider */
#shopify-section-template--28397085819262__dev_nvlty_seen_Q3Pkci
.nvlty-seen__gallery.devNvltyseenSlider {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-start !important;
justify-content: flex-start !important;
gap: 4px !important;
column-gap: 4px !important;
row-gap: 0 !important;
width: calc(100% + 48px) !important;
max-width: none !important;
margin-left: -24px !important;
margin-right: -24px !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x proximity !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
}
#shopify-section-template--28397085819262__dev_nvlty_seen_Q3Pkci
.nvlty-seen__gallery.devNvltyseenSlider::-webkit-scrollbar {
display: none !important;
}
/* Every slide remains exactly 280 × 384 */
#shopify-section-template--28397085819262__dev_nvlty_seen_Q3Pkci
.nvlty-seen__gallery.devNvltyseenSlider
> .nvlty-seen__item {
position: relative !important;
display: block !important;
flex: 0 0 280px !important;
flex-grow: 0 !important;
flex-shrink: 0 !important;
flex-basis: 280px !important;
width: 280px !important;
min-width: 280px !important;
max-width: 280px !important;
height: 384px !important;
min-height: 384px !important;
max-height: 384px !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
scroll-snap-align: start !important;
}
/* Image fills the fixed-size slide without changing its dimensions */
#shopify-section-template--28397085819262__dev_nvlty_seen_Q3Pkci
.nvlty-seen__gallery.devNvltyseenSlider
> .nvlty-seen__item
> .nvlty-seen__image {
display: block !important;
width: 280px !important;
min-width: 280px !important;
max-width: 280px !important;
height: 384px !important;
min-height: 384px !important;
max-height: 384px !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
}
}@media screen and (min-width: 741px) {
/* NVLTY MEMBERS heading */
.devNewsletter h2 {
font-size: 20px !important;
line-height: 1.2 !important;
letter-spacing: normal !important;
}
/* EARN 10% OFF YOUR FIRST ORDER. */
.devNewsletter > p,
.devNewsletter > p strong {
font-size: 14px !important;
line-height: 1.4 !important;
letter-spacing: normal !important;
}
/* Restock alerts... */
.devNewsletter .devNewsText,
.devNewsletter .devNewsText p {
font-size: 12px !important;
line-height: 1.4 !important;
letter-spacing: normal !important;
}
/* Enter your Email */
.devNewsletter input[type="email"] {
font-size: 12px !important;
line-height: 1.4 !important;
letter-spacing: normal !important;
}
.devNewsletter input[type="email"]::placeholder {
font-size: 12px !important;
letter-spacing: normal !important;
}
/* BECOME A NVLTY MEMBER */
.devNewsletter #footer-subscribe {
font-size: 12px !important;
line-height: 1.2 !important;
letter-spacing: normal !important;
}
}
@media screen and (min-width: 741px) {
.devNewsletter input[type="email"] {
border: 1px solid #fff !important;
border-radius: 1px !important;
}
.devNewsletter #footer-subscribe {
border-radius: 1px !important;
}
}
@media screen and (min-width: 741px) {
.disclosures,
.disclosures .disclosure__toggle,
.disclosures .disclosure-list__option,
.disclosures .country--name,
.disclosures .localization-form__currency,
.disclosures .selectors-form__select select {
font-size: 12px !important;
letter-spacing: normal !important;
}
}
@media screen and (min-width: 741px) {
.mobile-menu__locales .disclosure__toggle,
.mobile-menu__locales .disclosure-list__option,
.mobile-menu__locales .country--name,
.mobile-menu__locales .localization-form__currency,
.mobile-menu__locales .selectors-form__select select {
font-size: 12px !important;
letter-spacing: normal !important;
}
}
@media screen and (min-width: 741px) {
.devMemberBtn .secondary-button {
display: flex !important;
align-items: center !important;
justify-content: center !important;
height: 35px !important;
min-height: 35px !important;
padding: 0 16px !important;
font-size: 14px !important;
line-height: 1 !important;
letter-spacing: normal !important;
border-radius: 1px !important;
text-align: center !important;
}
}
@media screen and (min-width: 741px) {
.collectionTitle {
font-size: 18px;
}
.collectionTitle span {
font-size: 12px;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.devCollectionHeaderBottom .devCollectionViewSelector {
display: flex !important;
width: 150px !important;
height: 24px !important;
margin: 0 !important;
background: #fff !important;
border: 1px solid #000 !important;
box-sizing: border-box !important;
overflow: hidden !important;
}
.devCollectionHeaderBottom .devCollectionViewSelectorItem {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex: 0 0 50% !important;
width: 50% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
background: #fff !important;
color: #000 !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
letter-spacing: 0 !important;
text-align: center !important;
cursor: pointer;
}
.devCollectionHeaderBottom .devCollectionViewSelectorItem.is-active {
background: #000 !important;
color: #fff !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
/* Right-align the entire block */
.devMobileFiltersPos {
display: flex !important;
justify-content: flex-end !important;
align-items: center !important;
width: 100% !important;
margin-left: auto !important;
}
/* Remove button styling */
.devMobileFiltersPos .filter-toggle__trigger {
background: transparent !important;
border: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
/* Text + icon */
.devMobileFiltersPos .mobFiltersBtn {
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 8px !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
/* Make the icon visually match the heavier text */
.devMobileFiltersPos .mobFiltersBtn svg {
width: 18px !important;
height: 18px !important;
flex: 0 0 18px !important;
}
.devMobileFiltersPos .mobFiltersBtn svg path {
stroke-width: 2.4 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.devCollectionHeaderBottom {
position: relative !important;
display: flex !important;
align-items: center !important;
width: 100% !important;
min-height: 24px !important;
margin: 12px 0 24px !important;
overflow: visible !important;
}
/* Model / Plain — left */
.devCollectionHeaderBottom .devCollectionViewSelector {
display: flex !important;
flex: 0 0 150px !important;
width: 150px !important;
height: 24px !important;
margin: 0 !important;
}
/* Filter & Sort — right */
.devCollectionHeaderBottom .devMobileFiltersPos {
position: absolute !important;
top: 50% !important;
right: 0 !important;
transform: translateY(-50%) !important;
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
opacity: 1 !important;
visibility: visible !important;
overflow: visible !important;
pointer-events: auto !important;
z-index: 5 !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.filter-toggle__trigger {
display: flex !important;
align-items: center !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
color: #000 !important;
opacity: 1 !important;
visibility: visible !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.mobFiltersBtn {
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 8px !important;
color: #000 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.mobFiltersBtn svg {
display: block !important;
width: 18px !important;
height: 18px !important;
flex: 0 0 18px !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.mobFiltersBtn svg path {
stroke-width: 2.4 !important;
}
}/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.devCollectionHeaderBottom {
position: relative !important;
display: flex !important;
align-items: center !important;
width: 100% !important;
min-height: 24px !important;
margin: 12px 0 24px !important;
overflow: visible !important;
}
/* Model / Plain — left */
.devCollectionHeaderBottom .devCollectionViewSelector {
display: flex !important;
flex: 0 0 150px !important;
width: 150px !important;
height: 24px !important;
margin: 0 !important;
}
/* Filter & Sort — right */
.devCollectionHeaderBottom .devMobileFiltersPos {
position: absolute !important;
top: 50% !important;
right: 0 !important;
transform: translateY(-50%) !important;
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
opacity: 1 !important;
visibility: visible !important;
overflow: visible !important;
pointer-events: auto !important;
z-index: 5 !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.filter-toggle__trigger {
display: flex !important;
align-items: center !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
color: #000 !important;
opacity: 1 !important;
visibility: visible !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.mobFiltersBtn {
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 8px !important;
color: #000 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase !important;
white-space: nowrap !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.mobFiltersBtn svg {
display: block !important;
width: 18px !important;
height: 18px !important;
flex: 0 0 18px !important;
}
.devCollectionHeaderBottom
.devMobileFiltersPos
.mobFiltersBtn svg path {
stroke-width: 2.4 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.nvCollectionNav__item:not(:last-child) {
margin-right: 28px !important;
}
}
@media screen and (min-width: 741px) {
.nvCollectionNav {
--nv-thumb-width: 60px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.collection__page-product .devProduct-image {
position: relative !important;
}
.collection__page-product .devNewtags {
position: absolute !important;
top: -1px !important;
left: 5px !important;
z-index: 50 !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
pointer-events: none !important;
}
.collection__page-product
span.product-badge.new-release.devCollectionProductLabel {
position: relative !important;
top: auto !important;
left: auto !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
height: 20px !important;
margin: 0 !important;
padding: 0 8px !important;
border-radius: 1px !important;
border: 0 !important;
background: rgba(0, 0, 0, 0.5) !important;
color: #fff !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 10px !important;
font-weight: 700 !important;
font-style: normal !important;
line-height: 20px !important;
letter-spacing: normal !important;
text-indent: 0 !important;
text-transform: uppercase !important;
white-space: nowrap !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: none !important;
z-index: 50 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.collection__page-product .product-info {
padding-left: 8px !important;
padding-right: 8px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.collection__page-product .devCollectionCardTitleLink,
.collection__page-product .devCollectionCardTitleLink .prod-title {
font-size: 14px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.collection__page-product .devCardColorLabel {
font-size: 12px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.collection__page-product .price,
.collection__page-product .price-item,
.collection__page-product .money {
font-size: 14px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.collection__page-product .dev-low-stock-line {
font-size: 12px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.collection__page-product .price,
.collection__page-product .price dl,
.collection__page-product .price dd,
.collection__page-product .price-item {
margin-top: 0 !important;
padding-top: 0 !important;
}
}
/* DESKTOP ONLY — NON-HOME PAGES */
@media screen and (min-width: 741px) {
body:not(.template-index) .mobile-menu__trigger,
body:not(.template-index) .slideout__trigger--open,
body:not(.template-index) .slideout__trigger-mobile-menu {
display: flex !important;
align-items: left !important;
justify-content: flex-start !important;
visibility: visible !important;
opacity: 1 !important;
}
body:not(.template-index)
.slideout__trigger-mobile-menu--icon {
display: block !important;
width: 30px !important;
height: 30px !important;
color: #000 !important;
opacity: 1 !important;
visibility: visible !important;
}
body:not(.template-index)
.slideout__trigger-mobile-menu--icon
.nv-menu-bar {
stroke: #000 !important;
stroke-width: 2 !important;
opacity: 1 !important;
visibility: visible !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
.mobile-menu__trigger .slideout__trigger-mobile-menu {
justify-content: flex-start !important;
}
}
/* DESKTOP ONLY — COLLECTION FILTER DRAWER */
@media screen and (min-width: 741px) {
body.template-collection #collection-sidebar {
position: fixed !important;
top: 0 !important;
bottom: 0 !important;
left: 0 !important;
right: auto !important;
display: block !important;
width: 425px !important;
min-width: 425px !important;
max-width: 425px !important;
height: 100vh !important;
height: 100dvh !important;
margin: 0 !important;
padding: 0 !important;
background: #fff !important;
overflow-x: hidden !important;
overflow-y: auto !important;
transform: translate3d(-100%, 0, 0) !important;
visibility: hidden !important;
opacity: 1 !important;
pointer-events: none !important;
transition:
transform 0.35s ease,
visibility 0.35s ease !important;
z-index: 10001 !important;
}
body.template-collection #collection-sidebar.open {
transform: translate3d(0, 0, 0) !important;
visibility: visible !important;
pointer-events: auto !important;
}
body.template-collection .devfiltersOverlay {
position: fixed !important;
inset: 0 !important;
display: block !important;
background: transparent !important;
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
transition:
opacity 0.35s ease,
visibility 0.35s ease !important;
z-index: 10000 !important;
}
body.template-collection.devFiltersActive .devfiltersOverlay,
html.devFiltersActive body.template-collection .devfiltersOverlay {
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
}
html.devFiltersActive,
body.template-collection.devFiltersActive {
overflow: hidden !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
/* Filter & Sort title only */
body.template-collection #collection-sidebar .devSidebarWrap {
font-size: 16px !important;
text-transform: uppercase !important;
font-weight: 900 !important;
}
/* Sort heading */
body.template-collection
#collection-sidebar
.sidebarFilterAccordian.js-accordion-header {
font-size: 14px !important;
text-transform: uppercase !important;
font-weight: 900 !important;
}
/* Product Type heading */
body.template-collection
#collection-sidebar
summary.sidebarFilterAccordian {
font-size: 14px !important;
text-transform: uppercase !important;
font-weight: 900 !important;
}
/* Product Type links */
body.template-collection
#collection-sidebar
.collectionFiltersMenu,
body.template-collection
#collection-sidebar
.collectionFiltersMenu a {
font-size: 12px !important;
text-transform: uppercase !important;
font-weight: 700 !important;
}
/* Sort options */
body.template-collection
#collection-sidebar
.sortByFilter,
body.template-collection
#collection-sidebar
.sortByFilter label,
body.template-collection
#collection-sidebar
.sortByFilter a {
font-size: 12px !important;
text-transform: uppercase !important;
font-weight: 700 !important;
}
/* Bottom button area */
body.template-collection
#collection-sidebar
.devFilterBtns {
display: flex !important;
gap: 8px !important;
padding: 8px !important;
}
body.template-collection
#collection-sidebar
.devFilterBtns
.filtering__results,
body.template-collection
#collection-sidebar
.devFilterBtns
.current_tags,
body.template-collection
#collection-sidebar
.devFilterBtns
.current_tags li {
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
body.template-collection
#collection-sidebar
.devFilterBtns
.current_filters--clear,
body.template-collection
#collection-sidebar
.devFilterApplyBtn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
margin: 0 !important;
padding: 0 12px !important;
background: #000 !important;
color: #fff !important;
border: 0 !important;
font-size: 12px !important;
line-height: 1 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
/* 16px inner spacing on both sides of the drawer */
body.template-collection #collection-sidebar .devSidebarWrap,
body.template-collection #collection-sidebar .filterMinWrap,
body.template-collection #collection-sidebar .devFilterBtns {
padding-left: 16px !important;
padding-right: 16px !important;
box-sizing: border-box !important;
}
/* Keep accordion separators aligned within the padded content */
body.template-collection #collection-sidebar .filterMinWrap {
width: 100% !important;
}
/* Bottom buttons layout */
body.template-collection #collection-sidebar .devFilterBtns {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 16px !important;
padding-top: 12px !important;
padding-bottom: 12px !important;
}
body.template-collection #collection-sidebar .devFilterBtns .filtering__results,
body.template-collection #collection-sidebar .devFilterBtns .current_tags,
body.template-collection #collection-sidebar .devFilterBtns .current_tags li {
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
/* RESET — white background, black border/text */
body.template-collection
#collection-sidebar
.devFilterBtns
.current_filters--clear {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
margin: 0 !important;
padding: 0 12px !important;
background: #fff !important;
color: #000 !important;
border: 1px solid #000 !important;
border-radius: 0 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase !important;
}
/* APPLY — black background, white text */
body.template-collection
#collection-sidebar
.devFilterApplyBtn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
margin: 0 !important;
padding: 0 12px !important;
background: #000 !important;
color: #fff !important;
border: 1px solid #000 !important;
border-radius: 0 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
text-transform: uppercase !important;
}
}
/* Full-width divider above bottom buttons */
@media screen and (min-width: 741px) {
body.template-collection #collection-sidebar .devFilterBtns {
position: relative !important;
}
body.template-collection #collection-sidebar .devFilterBtns::before {
content: "";
position: absolute;
top: 0;
left: -16px;
right: -16px;
height: 1px;
background: #000;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 741px) {
body.template-collection
#collection-sidebar
.details__summary
.details__title {
font-size: 14px !important;
font-weight: 900 !important;
text-transform: uppercase !important;
line-height: 1 !important;
margin: 0 !important;
}
}
/* =========================================================
QUICKVIEW — DESKTOP TWO-COLUMN LAYOUT
MOBILE/TABLET REMAIN COMPLETELY UNTOUCHED
========================================================= */
/* Hidden by default so mobile keeps the existing Flickity gallery */
.dev-native-gallery {
display: none;
}
@media screen and (min-width: 769px) {
/* ---------------------------------------------------------
MODAL
--------------------------------------------------------- */
#modal-quickview-cart {
position: fixed !important;
inset: auto 0 0 0 !important;
width: 100vw !important;
max-width: 100vw !important;
height: auto !important;
max-height: 85vh !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
border-radius: 0 !important;
overflow: hidden !important;
}
#modal-quickview-cart > .modal__inner-wrapper {
display: flex !important;
flex-direction: column !important;
width: 100% !important;
max-width: 100% !important;
height: 100% !important;
max-height: 100% !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* ---------------------------------------------------------
HEADER
--------------------------------------------------------- */
#modal-quickview-cart .devQuickviewHeader {
position: relative !important;
z-index: 10 !important;
flex: 0 0 auto !important;
width: 100% !important;
box-sizing: border-box !important;
}
/* ---------------------------------------------------------
QUICKVIEW BODY
--------------------------------------------------------- */
#modal-quickview-cart #quickview-form {
flex: 1 1 auto !important;
width: 100% !important;
min-width: 0 !important;
min-height: 0 !important;
overflow: hidden !important;
}
#modal-quickview-cart .product__quickview-wrapper {
width: 100% !important;
height: 100% !important;
min-width: 0 !important;
min-height: 0 !important;
overflow: hidden !important;
}
/* ---------------------------------------------------------
TWO-COLUMN STRUCTURE
--------------------------------------------------------- */
#modal-quickview-cart .product__section-container {
display: grid !important;
grid-template-columns:
minmax(0, calc(50% - 2px))
minmax(0, calc(50% - 2px)) !important;
column-gap: 4px !important;
width: 100% !important;
max-width: 100% !important;
height: 100% !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 16px !important;
box-sizing: border-box !important;
align-items: stretch !important;
overflow: hidden !important;
}
/* ---------------------------------------------------------
LEFT COLUMN — NATIVE DESKTOP GALLERY
--------------------------------------------------------- */
#modal-quickview-cart .product__section-images {
grid-column: 1 !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: 100% !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
overflow: hidden !important;
}
/* Hide the original Flickity gallery on desktop only */
#modal-quickview-cart .product__section-images #slider,
#modal-quickview-cart .product__section-images #thumbnails {
display: none !important;
}
/* Native horizontal scrolling gallery */
#modal-quickview-cart .product__section-images .dev-native-gallery {
display: flex !important;
flex-flow: row nowrap !important;
align-items: flex-start !important;
gap: 4px !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: 384px !important;
margin: 0 !important;
padding: 0 16px !important;
box-sizing: border-box !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x proximity;
scroll-behavior: smooth;
overscroll-behavior-x: contain;
-webkit-overflow-scrolling: touch;
touch-action: pan-x;
scrollbar-width: none;
}
/* Hide scrollbar while preserving native scrolling */
#modal-quickview-cart
.product__section-images
.dev-native-gallery::-webkit-scrollbar {
display: none;
}
/* Individual image cards */
#modal-quickview-cart
.product__section-images
.dev-native-gallery__slide {
display: block !important;
flex: 0 0 280px !important;
width: 280px !important;
min-width: 280px !important;
max-width: 280px !important;
height: 384px !important;
min-height: 384px !important;
max-height: 384px !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
overflow: hidden !important;
scroll-snap-align: start;
}
/* Images */
#modal-quickview-cart
.product__section-images
.dev-native-gallery__image {
display: block !important;
width: 280px !important;
min-width: 280px !important;
max-width: 280px !important;
height: 384px !important;
min-height: 384px !important;
max-height: 384px !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
user-select: none;
-webkit-user-drag: none;
}
/* ---------------------------------------------------------
RIGHT COLUMN — ALL PRODUCT INFORMATION
--------------------------------------------------------- */
#modal-quickview-cart .product__section-content {
grid-column: 2 !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: 100% !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0px 32px 0px !important;
box-sizing: border-box !important;
overflow-x: hidden !important;
overflow-y: auto !important;
overscroll-behavior: contain;
scrollbar-gutter: stable;
}
#modal-quickview-cart .product__section-details {
width: 100% !important;
max-width: 640px !important;
margin: 0 auto !important;
padding: 0 !important;
}
/* Prevent forms and controls from overflowing the right column */
#modal-quickview-cart .product__section-content form,
#modal-quickview-cart .product__section-content fieldset,
#modal-quickview-cart .product__section-content input,
#modal-quickview-cart .product__section-content select,
#modal-quickview-cart .product__section-content button,
#modal-quickview-cart .product__section-content textarea {
max-width: 100% !important;
box-sizing: border-box !important;
}
/* ---------------------------------------------------------
RIGHT-COLUMN SCROLLBAR
--------------------------------------------------------- */
#modal-quickview-cart
.product__section-content::-webkit-scrollbar {
width: 6px;
}
#modal-quickview-cart
.product__section-content::-webkit-scrollbar-track {
background: transparent;
}
#modal-quickview-cart
.product__section-content::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.25);
border-radius: 999px;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
.dev-product-installment-line--quickview {
display: none !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
.devQuickviewHeader__title {
display: none !important;
}
}
/* ==========================================================
QUICKVIEW STYLING — DESKTOP ONLY
========================================================== */
@media screen and (min-width: 769px) {
/* Product title */
.product__section-title.product-title {
font-size: 14px !important;
line-height: 1.3 !important;
font-weight: 900 !important;
}
.product__section-title.product-title a {
font-size: 14px !important;
}
/* Price */
.price-item--regular,
.price-item--regular .money {
font-size: 14px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
/* Size swatches */
.swatches__swatch--regular {
margin: 0 6px 6px 0 !important;
}
.swatches__swatch--regular .swatches__form--label {
width: 44px !important;
height: 44px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 0 !important;
font-size: 12px !important;
font-weight: 900 !important;
border: 1px solid #D9D9D9 !important;
border-radius: 0 !important;
transition: all .2s ease;
}
.swatches__swatch--regular
.swatches__form--input:checked
+ .swatches__form--label {
background: #000 !important;
color: #fff !important;
border-color: #000 !important;
}
.swatches__swatch--regular
.swatches__form--label:hover {
border-color: #000 !important;
}
/* Find your size */
.popup_content_link,
.popup_content_link button {
font-size: 12px !important;
line-height: 1.2 !important;
}
/* Hide More payment options */
more-payment-options-link,
#more-payment-options-link {
display: none !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
#product-price .price-item,
#product-price .price-item .money {
font-size: 14px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
.product__section--buttons {
display: flex !important;
flex-direction: column !important;
gap: 4px !important;
}
.product__section--buttons .add,
.product__section--buttons .dev-quickview-notify,
.product__section--buttons .dev-express-checkout {
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
padding: 0 !important;
margin: 0 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 35px !important;
letter-spacing: 0 !important;
text-align: center !important;
}
/* Only force visible buttons into flex layout */
.product__section--buttons .add,
.product__section--buttons .dev-express-checkout {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
/* Never override the theme's visibility logic */
.product__section--buttons .dev-quickview-notify {
align-items: center;
justify-content: center;
}
.product__section--buttons .dev-accelerated-checkout {
margin-top: 0 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
#modal-quickview-cart
.devQuickViewSize
.popup_content_link
> button.product__contact-trigger {
font: 500 12px/1 var(--main-family) !important;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 12px !important;
letter-spacing: 0 !important;
text-size-adjust: none !important;
-webkit-text-size-adjust: none !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
button.add.AddtoCart.js-ajax-submit {
font: normal 900 12px/35px var(--main-family) !important;
font-size: 12px !important;
line-height: 35px !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
/* ADD TO BAG */
#modal-quickview-cart
.product__section--buttons
button.add.AddtoCart.js-ajax-submit {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
margin: 0 !important;
padding: 0 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
background: #000 !important;
color: #fff !important;
border: 1px solid #000 !important;
border-radius: 0 !important;
box-sizing: border-box !important;
}
/* EXPRESS CHECKOUT — this element is the button itself */
#modal-quickview-cart
.product__section--buttons
button.dev-express-checkout {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
margin: 10px 0 0 !important;
padding: 0 !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
background: #fff !important;
color: #000 !important;
border: 1px solid #000 !important;
border-radius: 0 !important;
box-sizing: border-box !important;
}
/* Space before PayPal */
#modal-quickview-cart
.product__section--buttons
.dev-accelerated-checkout {
margin-top: 10px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
#modal-quickview-cart .shopify-payment-button {
--shopify-accelerated-checkout-button-block-size: 35px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 769px) {
#modal-quickview-cart:popover-open::backdrop {
background: rgba(0, 0, 0, 0.15) !important;
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
pointer-events: auto !important;
}
html:has(#modal-quickview-cart:popover-open),
body:has(#modal-quickview-cart:popover-open) {
overflow: hidden !important;
overscroll-behavior: none !important;
}
}
/* FILTER DRAWER OVERLAY */
.devfiltersOverlay {
backdrop-filter: blur(10px) !important;
-webkit-backdrop-filter: blur(10px) !important;
background: rgba(0,0,0,.25) !important;
}
/* ==========================================================
CART TYPOGRAPHY — DESKTOP ONLY
========================================================== */
@media screen and (min-width: 769px) {
/* Cart heading */
h2.section-heading {
font-size: 14px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
/* Item count + subtotal */
.devCartItem,
.devCartItem p,
.devCartItem span,
.devCartSubPrice,
.devCartSubPrice .devPrice,
.devCartSubPrice .money,
.divider {
font-size: 12px !important;
line-height: 1.2 !important;
}
/* Free shipping message */
.xbfsbu_message,
.xbfsbu_message p {
font-size: 12px !important;
line-height: 1.2 !important;
}
/* Cart item title */
.ajax-cart__title,
.ajax-cart__title a {
font-size: 12px !important;
line-height: 1.3 !important;
font-weight: 900 !important;
}
/* Cart item prices */
.devMiniItemPrice,
.devMiniItemPrice *,
[data-cart-item-price],
[data-cart-item-price] *,
[data-cart-item-regular-price],
[data-cart-item-final-price],
[data-cart-item-original-price],
[data-cart-item-price-list] {
font-size: 12px !important;
line-height: 1.2 !important;
}
/* Variant text */
.ajax-cart__cart-variants,
.ajax-cart__cart-variants * {
font-size: 12px !important;
line-height: 1.2 !important;
}
/* Quantity input */
.ajax-cart__qty-input {
font-size: 12px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
/* Upsell heading */
.custom-cart-upsell__title {
font-size: 12px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
/* Upsell price */
.custom-cart-upsell__price,
.custom-cart-upsell__price .money {
font-size: 12px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
/* Order Summary */
.summaryHeading {
font-size: 14px !important;
line-height: 1.2 !important;
font-weight: 900 !important;
}
}
/* ==========================================================
CART UPSELL — DESKTOP ONLY
MOBILE REMAINS COMPLETELY UNTOUCHED
========================================================== */
@media screen and (min-width: 769px) {
/* Keep the upsell section contained inside the cart drawer */
.nvlty-cart-scroll-area .custom-cart-upsell {
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
box-sizing: border-box !important;
}
/* Native horizontal slider */
.nvlty-cart-scroll-area .custom-cart-upsell__slider {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-start !important;
gap: 4px !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x proximity !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__slider::-webkit-scrollbar {
display: none !important;
}
/* Small cards in one horizontal row */
.nvlty-cart-scroll-area
.custom-cart-upsell__slider
> .custom-cart-upsell__card {
display: flex !important;
flex-direction: column !important;
flex: 0 0 calc((100% - 8px) / 3) !important;
width: calc((100% - 8px) / 3) !important;
min-width: calc((100% - 8px) / 3) !important;
max-width: calc((100% - 8px) / 3) !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
overflow: hidden !important;
scroll-snap-align: start !important;
}
/* Product image */
.nvlty-cart-scroll-area
.custom-cart-upsell__image-link {
display: block !important;
width: 100% !important;
aspect-ratio: 3 / 4 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__image {
display: block !important;
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
}
/* Price and plus-button footer */
.nvlty-cart-scroll-area
.custom-cart-upsell__footer {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
width: 100% !important;
min-height: 28px !important;
margin: 0 !important;
padding: 4px 2px !important;
box-sizing: border-box !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__price,
.nvlty-cart-scroll-area
.custom-cart-upsell__price .money {
font-size: 12px !important;
line-height: 1 !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__quickview {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex: 0 0 24px !important;
width: 24px !important;
min-width: 24px !important;
max-width: 24px !important;
height: 24px !important;
min-height: 24px !important;
max-height: 24px !important;
margin: 0 !important;
padding: 0 !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__quickview
.nvlty-quickview-plus-svg {
width: 14px !important;
height: 14px !important;
}
}
/* DESKTOP ONLY — place price and quick-add inside the image */
@media screen and (min-width: 769px) {
.nvlty-cart-scroll-area
.custom-cart-upsell__slider
> .custom-cart-upsell__card {
position: relative !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__footer {
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
z-index: 5 !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
width: 100% !important;
min-height: 32px !important;
margin: 0 !important;
padding: 6px 8px !important;
box-sizing: border-box !important;
pointer-events: none !important;
}
/* Price inside bottom-left of image */
.nvlty-cart-scroll-area
.custom-cart-upsell__price {
position: relative !important;
z-index: 6 !important;
margin: 0 !important;
padding: 0 !important;
font-size: 12px !important;
line-height: 1 !important;
font-weight: 900 !important;
color: #000 !important;
pointer-events: none !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__price .money {
font-size: 12px !important;
line-height: 1 !important;
font-weight: 900 !important;
}
/* Quick-add plus inside bottom-right of image */
.nvlty-cart-scroll-area
.custom-cart-upsell__quickview {
position: relative !important;
z-index: 6 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 24px !important;
min-width: 24px !important;
max-width: 24px !important;
height: 24px !important;
min-height: 24px !important;
max-height: 24px !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
pointer-events: auto !important;
}
.nvlty-cart-scroll-area
.custom-cart-upsell__quickview
.nvlty-quickview-plus-svg {
width: 24px !important;
height: 24px !important;
}
}
/* DESKTOP ONLY — FINAL SWATCH ROW OVERRIDE */
@media screen and (min-width: 741px) {
html body
#shopify-section-{{ section.id }}
#featured_collection--{{ section.id }}
.featured__collection-product
.devCollectionCardSwatches {
position: relative !important;
display: flex !important;
flex-direction: row !important;
flex-flow: row nowrap !important;
flex-wrap: nowrap !important;
align-items: flex-start !important;
justify-content: flex-start !important;
gap: 4px !important;
column-gap: 4px !important;
row-gap: 0 !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: 72px !important;
min-height: 72px !important;
max-height: 72px !important;
margin: 0 0 10px !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
white-space: nowrap !important;
scrollbar-width: none !important;
-webkit-overflow-scrolling: touch !important;
}
html body
#shopify-section-{{ section.id }}
#featured_collection--{{ section.id }}
.featured__collection-product
.devCollectionCardSwatches::-webkit-scrollbar {
display: none !important;
}
html body
#shopify-section-{{ section.id }}
#featured_collection--{{ section.id }}
.featured__collection-product
.devCollectionCardSwatches
> .devCollectionCardSwatch {
position: relative !important;
display: block !important;
float: none !important;
clear: none !important;
flex: 0 0 52px !important;
flex-grow: 0 !important;
flex-shrink: 0 !important;
flex-basis: 52px !important;
grid-column: auto !important;
grid-row: auto !important;
width: 52px !important;
min-width: 52px !important;
max-width: 52px !important;
height: 72px !important;
min-height: 72px !important;
max-height: 72px !important;
margin: 0 !important;
padding: 0 !important;
vertical-align: top !important;
white-space: normal !important;
overflow: hidden !important;
box-sizing: border-box !important;
}
html body
#shopify-section-{{ section.id }}
#featured_collection--{{ section.id }}
.featured__collection-product
.devCollectionCardSwatches
> .devCollectionCardSwatch
.devCollectionCardSwatchImg {
display: block !important;
width: 52px !important;
min-width: 52px !important;
max-width: 52px !important;
height: 72px !important;
min-height: 72px !important;
max-height: 72px !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
}
}
/* Desktop only — reduce space between product title and price */
@media screen and (min-width: 990px) {
.product__section--header
.product__section-title.product-title {
margin-bottom: -4px !important;
}
.product__section--header
.product__section-title.product-title + #product-price {
margin-top: 0 !important;
}
}
/* Desktop only — increase spacing between price and Klarna */
@media screen and (min-width: 990px) {
.product__section--header #product-price {
margin-bottom: 10px !important;
}
}
/* Desktop only */
@media screen and (min-width: 990px) {
.product__section--buttons {
margin: 15px 0 10px 0 !important;
}
}
/* Desktop only */
@media screen and (min-width: 990px) {
.product__contact-trigger {
font-family: 'BasisGrotesqueArabicPro-Medium', Arial, sans-serif;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
}
/* PDP adjustments — desktop only */
@media screen and (min-width: 990px) {
/* Remove wishlist bookmark from the colour swatches */
.devPdpColorSwatches
.swym-wishlist-collections-v2-container {
display: none !important;
}
/* Klarna instalment text */
.product__section-contentWrapper
.dev-product-installment-line {
font-size: 12px !important;
line-height: 1.2 !important;
}
/* Desktop only */
@media screen and (min-width: 990px) {
.product__section-contentWrapper
.dev-product-installment-klarna-logo {
width: auto !important;
height: 20px !important;
max-width: none !important;
object-fit: contain !important;
position: relative;
left: 1px;
top: 5px;
}
}
/* Size heading and selected size */
.product__section-contentWrapper
.swatches__option-name {
font-size: 12px !important;
line-height: 1.2 !important;
}
}
/* Desktop only */
@media screen and (min-width: 990px) {
.devPdpColorSwatches {
margin-top: 5px !important;
}
}
/* Desktop only — style checkout support like mobile */
@media screen and (min-width: 990px) {
.devCheckoutSupport {
background: #e7e7e7 !important;
box-sizing: border-box !important;
margin: 16px 0 0 0 !important;
padding: 16px !important;
width: 100% !important;
}
.devCheckoutSupport__delivery,
.devCheckoutSupport__delivery span,
.devCheckoutSupport__lines p,
.devCheckoutSupport__lines p a,
.devCheckoutSupport__lines p span,
.devCheckoutSupport__lines p strong {
color: #000 !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
line-height: 1.35 !important;
text-align: left !important;
}
.devCheckoutSupport__delivery {
font-weight: 900 !important;
margin: 0 !important;
text-transform: uppercase !important;
}
.devCheckoutSupport__delivery span {
color: rgb(16, 137, 20) !important;
font-weight: 900 !important;
}
.devCheckoutSupport__separator {
background: #cfcfcf !important;
height: 1px !important;
margin: 16px 0 !important;
width: 100% !important;
}
.devCheckoutSupport__lines p {
font-weight: 500 !important;
margin: 0 0 8px 0 !important;
}
.devCheckoutSupport__lines p:last-child {
margin-bottom: 0 !important;
}
.devCheckoutSupport__lines p a,
.devCheckoutSupport__lines p span {
color: #000 !important;
font-weight: 900 !important;
text-decoration: underline !important;
text-underline-offset: 2px !important;
}
.devCheckoutSupport__lines p strong {
font-weight: 900 !important;
}
}
/* =========================================================
PDP NATIVE GALLERY — DESKTOP ONLY
Two 3:4 images, 4px gap, native horizontal scrolling
========================================================= */
@media screen and (min-width: 990px) {
/* Hide the old Testament/Flickity gallery on desktop */
.product__section-images .product-image-container.carousel-main {
display: none !important;
}
.product__section-images .product-main-images {
min-width: 0 !important;
width: 100% !important;
overflow: hidden !important;
}
/* Native horizontal slider */
.product__section-images .devNativeProductGallery {
display: grid !important;
grid-auto-flow: column !important;
grid-auto-columns: calc((100% - 4px) / 2) !important;
column-gap: 4px !important;
width: 100% !important;
max-width: 100% !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
scroll-behavior: smooth !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
-ms-overflow-style: none !important;
padding: 0 !important;
margin: 0 !important;
}
.product__section-images .devNativeProductGallery::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
/* Each slide remains exactly 3:4 */
.product__section-images .devNativeProductGallerySlide {
position: relative !important;
display: block !important;
width: 100% !important;
min-width: 0 !important;
aspect-ratio: 3 / 4 !important;
overflow: hidden !important;
scroll-snap-align: start !important;
scroll-snap-stop: normal !important;
padding: 0 !important;
margin: 0 !important;
}
.product__section-images .devNativeProductGalleryImage {
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
object-fit: cover !important;
object-position: center !important;
padding: 0 !important;
margin: 0 !important;
}
/* Indicator track below gallery */
.product__section-images .devNativeProductGalleryIndicator {
--pdp-gallery-thumb-width: 40px;
--pdp-gallery-thumb-x: 0px;
position: relative !important;
display: block !important;
width: 100% !important;
height: 2px !important;
margin: 14px 0 0 !important;
padding: 0 !important;
background: rgba(0, 0, 0, 0.5) !important;
border-radius: 999px !important;
overflow: hidden !important;
pointer-events: none !important;
}
/* Moving black thumb */
.product__section-images .devNativeProductGalleryIndicator > span {
position: absolute !important;
left: 0 !important;
top: 0 !important;
display: block !important;
width: var(--pdp-gallery-thumb-width) !important;
height: 2px !important;
background: #000 !important;
border-radius: 999px !important;
transform: translate3d(
var(--pdp-gallery-thumb-x),
0,
0
) !important;
transition: none !important;
will-change: transform, width !important;
pointer-events: none !important;
}
}
/* =========================================================
PDP RIGHT COLUMN — SCROLL FIRST
Desktop only
========================================================= */
@media screen and (min-width: 990px) {
.product__section-contentWrapper {
min-height: 0 !important;
overflow-y: auto !important;
overflow-x: hidden !important;
overscroll-behavior-y: auto !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
.product__section-contentWrapper::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
}
/* =========================================================
PDP BUTTON STACK — DESKTOP ONLY
Matches the quick-view reference styling
========================================================= */
@media screen and (min-width: 990px) {
/* Remove inherited spacing inside the button stack */
.product__section--buttons {
margin: 10px 0 10px 0 !important;
}
.product__section--buttons
.product__form-buttons {
display: block !important;
width: 100% !important;
}
/* ADD TO BAG */
.product__section--buttons
button.add.AddtoCart.js-ajax-submit {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
margin: 0 !important;
padding: 0 !important;
font-family: var(--main-family) !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
background: #000 !important;
color: #fff !important;
border: 1px solid #000 !important;
border-radius: 0 !important;
box-sizing: border-box !important;
}
/* EXPRESS CHECKOUT */
.product__section--buttons
button.dev-express-checkout {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
margin: 10px 0 0 !important;
padding: 0 !important;
font-family: var(--main-family) !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
letter-spacing: 0 !important;
text-transform: uppercase !important;
background: #fff !important;
color: #000 !important;
border: 1px solid #000 !important;
border-radius: 0 !important;
box-sizing: border-box !important;
}
/* PAYPAL WRAPPER SPACING */
.product__section--buttons
.dev-accelerated-checkout {
width: 100% !important;
margin-top: 10px !important;
}
/* SHOPIFY / PAYPAL HEIGHT */
.product__section--buttons
.shopify-payment-button {
width: 100% !important;
--shopify-accelerated-checkout-button-block-size: 35px !important;
}
.product__section--buttons
shopify-accelerated-checkout,
.product__section--buttons
shopify-paypal-button {
display: block !important;
width: 100% !important;
min-height: 35px !important;
}
}
/* Mobile/tablet: keep the existing label behavior */
.devNativeProductGallerySizeLabel--desktop {
display: none !important;
}
/* Desktop only */
@media screen and (min-width: 990px) {
.devNativeProductGallerySizeLabel--mobile {
display: none !important;
}
.devNativeProductGallerySlide {
position: relative !important;
}
.devNativeProductGallerySlide
.devNativeProductGallerySizeLabel--desktop {
position: absolute !important;
right: 10px !important;
bottom: 10px !important;
z-index: 5 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
max-width: calc(100% - 20px) !important;
margin: 0 !important;
padding: 7px 10px !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
white-space: nowrap !important;
color: #fff !important;
background: rgba(0, 0, 0, 0.72) !important;
border: 0 !important;
border-radius: 0 !important;
box-sizing: border-box !important;
pointer-events: none !important;
}
}
.devNativeProductGallerySizeLabel--desktop {
display: none !important;
}
@media screen and (min-width: 990px) {
.product-main-images >
.devNativeProductGallerySizeLabel--mobile {
display: none !important;
}
.devNativeProductGallerySizeLabel--desktop {
display: inline-flex !important;
}
}
/* Desktop only */
@media screen and (min-width: 990px) {
.product__section--accordion .details__title {
font-family: "BasisGrotesqueArabicPro-Black", sans-serif !important;
font-size: 14px !important;
text-transform: uppercase !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
}
/* Desktop only */
@media screen and (min-width: 990px) {
.section-title h2 {
font-family: "BasisGrotesqueArabicPro-Black", sans-serif !important;
font-size: 14px !important;
text-transform: uppercase !important;
font-weight: 900 !important;
line-height: 1.2 !important;
}
}
/*swym css*/
svg.testament--icon-theme-user {
width: 20px;
height: 20px;
}
/* Complete the Fit placement — desktop only */
.devCompleteFitDesktop {
display: none !important;
}
@media screen and (min-width: 990px) {
.product__section-images .devCompleteFitDesktop {
display: block !important;
width: 100% !important;
grid-column: 1 / -1 !important;
}
/*
* Override the snippet's mobile full-viewport layout
* when it is rendered beneath the desktop gallery.
*/
.product__section-images
.devCompleteFitDesktop
.devCompleteFit {
width: 100% !important;
margin: 0px 0 0 !important;
padding: 24px 0 !important;
box-sizing: border-box !important;
}
.product__section-images
.devCompleteFitDesktop
.devCompleteFit::after {
left: 0 !important;
right: 0 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 990px) {
.devCompleteFit .swym-wishlist-collections-v2,
.devCompleteFit .swym-wishlist-collections-v2-container,
.devCompleteFit [class*="swym-wishlist"] {
display: none !important;
}
}
complete-the-fit-native-gallery-mobile-desktop.txt
/* =========================================================
COMPLETE THE FIT — NATIVE GALLERY
Mobile and desktop
========================================================= */
/* Ensure the Complete the Fit wrapper is visible on all screen sizes. */
.devCompleteFitDesktop {
display: block !important;
width: 100% !important;
min-width: 0 !important;
}
/* Hide the old single-image version everywhere. */
.devCompleteFit__imageLink--mobile {
display: none !important;
}
/* Native gallery container. */
.devCompleteFitGallery {
display: block !important;
width: 100% !important;
min-width: 0 !important;
}
/* Native horizontal slider viewport. */
.devCompleteFitGallery__viewport {
display: grid !important;
grid-auto-flow: column !important;
grid-auto-columns: 100% !important;
column-gap: 4px !important;
width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
scroll-behavior: smooth !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
.devCompleteFitGallery__viewport::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
/* Each gallery slide remains 3:4. */
.devCompleteFitGallery__slide {
position: relative !important;
display: block !important;
width: 100% !important;
min-width: 0 !important;
aspect-ratio: 3 / 4 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
scroll-snap-align: start !important;
scroll-snap-stop: normal !important;
}
/* Gallery images. */
.devCompleteFitGallery__image {
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
}
/* Grey indicator track. */
.devCompleteFitGallery__indicator {
--complete-fit-thumb-width: 40px;
--complete-fit-thumb-x: 0px;
position: relative !important;
display: block !important;
width: 100% !important;
height: 2px !important;
margin: 14px 0 0 !important;
padding: 0 !important;
background: #e7e7e7 !important;
border-radius: 999px !important;
overflow: hidden !important;
pointer-events: none !important;
}
/* Moving black indicator thumb. */
.devCompleteFitGallery__indicator > span {
position: absolute !important;
top: 0 !important;
left: 0 !important;
display: block !important;
width: var(--complete-fit-thumb-width) !important;
height: 2px !important;
background: #000 !important;
border-radius: 999px !important;
transform: translate3d(
var(--complete-fit-thumb-x),
0,
0
) !important;
transition: none !important;
will-change: transform, width !important;
pointer-events: none !important;
}
/* =========================================================
COMPLETE THE FIT NATIVE GALLERY — MOBILE + DESKTOP
Keep this at the END of the style block
========================================================= */
/* Hide the old single-image version on every screen size */
.devCompleteFit .devCompleteFit__imageLink--mobile {
display: none !important;
}
/* Show the native gallery on every screen size */
.devCompleteFit .devCompleteFitGallery {
display: block !important;
width: 100% !important;
min-width: 0 !important;
}
/* Native horizontal scrolling */
.devCompleteFit .devCompleteFitGallery__viewport {
display: grid !important;
grid-auto-flow: column !important;
grid-auto-columns: 100% !important;
column-gap: 4px !important;
width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
scroll-behavior: smooth !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
touch-action: pan-x !important;
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
.devCompleteFit
.devCompleteFitGallery__viewport::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
/* Individual 3:4 slides */
.devCompleteFit .devCompleteFitGallery__slide {
position: relative !important;
display: block !important;
width: 100% !important;
min-width: 100% !important;
aspect-ratio: 3 / 4 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
scroll-snap-align: start !important;
scroll-snap-stop: always !important;
}
/* Images */
.devCompleteFit .devCompleteFitGallery__image {
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
}
/* Indicator track */
.devCompleteFit .devCompleteFitGallery__indicator {
--complete-fit-thumb-width: 40px;
--complete-fit-thumb-x: 0px;
position: relative !important;
display: block !important;
width: 100% !important;
height: 2px !important;
margin: 14px 0 0 !important;
padding: 0 !important;
background: #e7e7e7 !important;
border-radius: 999px !important;
overflow: hidden !important;
pointer-events: none !important;
}
/* Moving indicator thumb */
.devCompleteFit
.devCompleteFitGallery__indicator > span {
position: absolute !important;
top: 0 !important;
left: 0 !important;
display: block !important;
width: var(--complete-fit-thumb-width) !important;
height: 2px !important;
background: #000 !important;
border-radius: 999px !important;
transform: translate3d(
var(--complete-fit-thumb-x),
0,
0
) !important;
transition: none !important;
will-change: transform, width !important;
pointer-events: none !important;
}
/* Remove injected wishlist controls from the gallery */
.devCompleteFit .swym-wishlist-collections-v2-container,
.devCompleteFit .swym-wishlist-collections-v2 {
display: none !important;
}
@media screen and (min-width: 750px) {
/* Remove the cross */
.dev_Size .swatch-element.soldout .swatches__form--label::before,
.dev_Size .swatch-element.soldout .swatches__form--label::after {
content: none !important;
display: none !important;
}
/* Sold out text color */
.dev_Size .swatch-element.soldout .swatches__form--label {
color: background: rgba(0, 0, 0, 0.5) !important;
}
}
/* DESKTOP ONLY - Hide sticky Add to Bag clone */
@media screen and (min-width: 990px) {
.product__section--buttons.dev-sticky-clone {
display: none !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 990px) {
.devCollectionCardTitleLink .prod-title {
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 990px) {
.devCardColorLabel,
.product-color-name.devVariantColor.devCardColorLabel {
font-size: 11px !important;
font-weight: 700 !important;
line-height: 1 !important;
text-transform: uppercase !important;
color: rgba(0, 0, 0, 0.5) !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 990px) {
.product-color-name.devVariantColor.devCardColorLabel {
position: relative !important;
top: -12px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 990px) {
.price--listing .price-item,
.price--listing .money {
font-size: 12px !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 990px) {
.product-info-inner > .price.price--listing {
position: relative !important;
transform: translateY(-25px) !important;
}
}
/* DESKTOP ONLY */
@media screen and (min-width: 990px) {
.slideshow__caption .slideshow__bar-link {
transform: translateX(24px) !important;
width: calc(100% - 24px) !important;
}
}
/* DESKTOP ONLY — RECENTLY VIEWED FIXED SWATCH SIZE */
@media screen and (min-width: 990px) {
html body
[id^="recently-viewed--"]
.recently-viewed-products__product
.devCollectionCardSwatches {
display: flex !important;
flex-flow: row nowrap !important;
align-items: flex-start !important;
justify-content: flex-start !important;
gap: 4px !important;
width: 100% !important;
min-width: 0 !important;
max-width: 100% !important;
height: 72px !important;
min-height: 72px !important;
max-height: 72px !important;
margin: 0 0 10px !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scrollbar-width: none !important;
}
html body
[id^="recently-viewed--"]
.recently-viewed-products__product
.devCollectionCardSwatches::-webkit-scrollbar {
display: none !important;
}
html body
[id^="recently-viewed--"]
.recently-viewed-products__product
.devCollectionCardSwatches
> button.devCollectionCardSwatch {
position: relative !important;
display: block !important;
flex-grow: 0 !important;
flex-shrink: 0 !important;
flex-basis: 52px !important;
flex: 0 0 52px !important;
width: 52px !important;
min-width: 52px !important;
max-width: 52px !important;
inline-size: 52px !important;
min-inline-size: 52px !important;
max-inline-size: 52px !important;
height: 72px !important;
min-height: 72px !important;
max-height: 72px !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
overflow: hidden !important;
}
html body
[id^="recently-viewed--"]
.recently-viewed-products__product
.devCollectionCardSwatches
> button.devCollectionCardSwatch
> img.devCollectionCardSwatchImg {
display: block !important;
width: 52px !important;
min-width: 52px !important;
max-width: 52px !important;
inline-size: 52px !important;
min-inline-size: 52px !important;
max-inline-size: 52px !important;
height: 72px !important;
min-height: 72px !important;
max-height: 72px !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
}
}
/* DESKTOP ONLY — Recently Viewed */
@media screen and (min-width: 990px) {
.recently-viewed-products
.recently-viewed-products__product
.product-info {
padding-left: 8px !important;
padding-right: 8px !important;
box-sizing: border-box !important;
}
}
/* DESKTOP ONLY — Recently Viewed */
@media screen and (min-width: 990px) {
.recently-viewed-products
.recently-viewed-products__product
.devCardColorLabel {
display: block !important;
margin-top: 0px !important;
}
}
/* DESKTOP ONLY — Recently Viewed */
@media screen and (min-width: 990px) {
.recently-viewed-products
.recently-viewed-products__product
.devCollectionCardTitleLink {
line-height: 1 !important;
}
.recently-viewed-products
.recently-viewed-products__product
.devCollectionCardTitleLink .prod-title {
line-height: 1 !important;
}
}
/* DESKTOP ONLY — Recently Viewed */
@media screen and (min-width: 990px) {
.recently-viewed-products
.recently-viewed-products__product
.product-info-inner
> .product-color-name.devVariantColor.devCardColorLabel {
display: block !important;
position: relative !important;
top: auto !important;
margin: 0 !important;
transform: translateY(5px) !important;
}
}
/* DESKTOP ONLY — Recently Viewed */
@media screen and (min-width: 990px) {
.recently-viewed-products
.recently-viewed-products__product
.product-info-inner
> .price.price--listing {
position: relative !important;
transform: translateY(2px) !important;
}
}
/* DESKTOP ONLY — Featured Collection cards with visible LOW STOCK */
@media screen and (min-width: 990px) {
.dev-featured-native-slider
.featured__collection-product
.product-info-inner:has(
> .dev-low-stock-line:not([style*="display:none"]):not([style*="display: none"])
)
> .devCollectionCardTitleLink {
position: relative !important;
top: -4px !important;
}
}
/* DESKTOP ONLY — PDP gallery track */
@media screen and (min-width: 990px) {
.product__section-images
.product-main-images
.devNativeProductGalleryIndicator {
background: #e7e7e7 !important;
background-color: #e7e7e7 !important;
border: 0 !important;
box-shadow: none !important;
}
.product__section-images
.product-main-images
.devNativeProductGalleryIndicator::before,
.product__section-images
.product-main-images
.devNativeProductGalleryIndicator::after {
content: none !important;
display: none !important;
}
/* Moving thumb only */
.product__section-images
.product-main-images
.devNativeProductGalleryIndicator
> span {
background: #000 !important;
background-color: #000 !important;
}
}
@media screen and (min-width: 990px) {
.devPdpOriginalVideo {
display: none !important;
}
}
/* =========================================================
COMPLETE THE FIT — DESKTOP TWO-IMAGE LAYOUT
KEEP THIS AT THE VERY END OF THE CSS
========================================================= */
@media screen and (min-width: 990px) {
/* Main Complete the Fit card:
gallery on the left, product information on the right */
.product__section-images
.devCompleteFitDesktop
.devCompleteFit__card {
display: grid !important;
grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr) !important;
column-gap: 20px !important;
align-items: stretch !important;
width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
/* Gallery occupies the left two-thirds */
.product__section-images
.devCompleteFitDesktop
.devCompleteFitGallery {
grid-column: 1 !important;
width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
}
/* Display exactly two images inside the visible gallery area */
.product__section-images
.devCompleteFitDesktop
.devCompleteFitGallery__viewport {
display: grid !important;
grid-auto-flow: column !important;
grid-auto-columns: calc((100% - 8px) / 2) !important;
column-gap: 8px !important;
width: 100% !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory !important;
scroll-behavior: auto !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
.product__section-images
.devCompleteFitDesktop
.devCompleteFitGallery__viewport::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
/* Each individual image occupies half of the gallery */
.product__section-images
.devCompleteFitDesktop
.devCompleteFitGallery__slide {
display: block !important;
position: relative !important;
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
aspect-ratio: 3 / 4 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
scroll-snap-align: start !important;
scroll-snap-stop: normal !important;
}
.product__section-images
.devCompleteFitDesktop
.devCompleteFitGallery__image {
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
object-position: center !important;
}
/* Indicator remains directly beneath the two images */
.product__section-images
.devCompleteFitDesktop
.devCompleteFitGallery__indicator {
display: block !important;
position: relative !important;
width: 100% !important;
height: 2px !important;
margin: 14px 0 0 !important;
padding: 0 !important;
background: #e7e7e7 !important;
border-radius: 999px !important;
overflow: hidden !important;
}
.product__section-images
.devCompleteFitDesktop
.devCompleteFitGallery__indicator > span {
position: absolute !important;
top: 0 !important;
left: 0 !important;
display: block !important;
height: 2px !important;
background: #000 !important;
border-radius: 999px !important;
will-change: transform, width !important;
}
/* Push title, price, swatches and buttons into the right column */
.product__section-images
.devCompleteFitDesktop
.devCompleteFit__info {
grid-column: 2 !important;
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
width: 100% !important;
min-width: 0 !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
}
/* Prevent controls from overflowing the right column */
.product__section-images
.devCompleteFitDesktop
.devCompleteFit__info form,
.product__section-images
.devCompleteFitDesktop
.devCompleteFit__info button,
.product__section-images
.devCompleteFitDesktop
.devCompleteFit__info select {
max-width: 100% !important;
box-sizing: border-box !important;
}
}
@media screen and (min-width: 990px) {
.product__section-images,
.product__section-contentWrapper {
-ms-overflow-style: none !important;
}
.product__section-images::-webkit-scrollbar,
.product__section-contentWrapper::-webkit-scrollbar {
display: none !important;
width: 0 !important;
height: 0 !important;
}
}
/* =========================================================
DESKTOP MENU DRAWER — HALF PAGE WIDTH
========================================================= */
@media screen and (min-width: 981px) {
#slideout-mobile-navigation.slideout__drawer-left {
width: 50vw !important;
max-width: 50vw !important;
height: 100vh !important;
left: 0 !important;
right: auto !important;
transform: translateX(-100%) !important;
}
#slideout-mobile-navigation.slideout__drawer-left:popover-open {
display: block !important;
opacity: 1 !important;
transform: translateX(0) !important;
}
.no-popover
#slideout-mobile-navigation.slideout__drawer-left {
transform: translateX(-100%) !important;
}
.no-popover
#slideout-mobile-navigation.slideout__drawer-left.\:popover-open,
.slideout-left--open
#slideout-mobile-navigation.slideout--active.slideout__drawer-left {
transform: translateX(0) !important;
}
}
@media screen and (min-width: 981px) {
.dev-low-stock-line {
font-family: "BasisGrotesqueArabicPro-Bold",
"Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 10px !important;
font-weight: 700 !important;
font-style: normal !important;
line-height: 1 !important;
color: #8D021F !important;
text-align: left !important;
text-transform: uppercase !important;
margin: 0 0 4px 0 !important;
padding: 0 !important;
}
}
/* =========================================================
DESKTOP PRODUCT CARDS — CONSISTENT TITLE / COLOUR ROWS
========================================================= */
@media screen and (min-width: 990px) {
/* Keep the title in its own row */
.product-info-inner > a.devCollectionCardTitleLink {
display: block !important;
position: static !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
line-height: 20px !important;
}
.product-info-inner
> a.devCollectionCardTitleLink
> .prod-title {
display: block !important;
position: static !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
line-height: 20px !important;
}
/* Keep colour in a separate row */
.product-info-inner > .product-color-name.devCardColorLabel {
display: block !important;
position: static !important;
width: 100% !important;
margin: 2px 0 0 !important;
padding: 0 !important;
line-height: 11px !important;
}
}
@media screen and (min-width: 990px) {
.dev-low-stock-line {
margin-bottom: 0px !important; /* adjust this value */
}
}
@media screen and (max-width: 740px) {
body div#shopify-section-sections--28397086212478__mobile-navigation,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .mobile-menu,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .dev_tabs,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .debvSidebarHead,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation #dev_tabs-content,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .dev_tab-content,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .dev2-menu,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .devSubmenu,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .devMemberBtn,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .devBottomMenu,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .mobile-menu__locales {
--text-color: #000 !important;
--link-color: #000 !important;
--accordion-color: #000 !important;
--background: #fff !important;
--background-color: #fff !important;
background: #fff !important;
background-color: #fff !important;
color: #000 !important;
}
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation *,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .debvSidebarHead ul#dev_tabs-nav > li:not(.active) > a,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .debvSidebarHead ul#dev_tabs-nav > li.active > a,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .c-accordion__header > .c-accordion__link {
color: #000 !important;
}
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation svg,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation svg *,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .devChevron,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .devChevron * {
color: #000 !important;
stroke: #000 !important;
}
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation svg path:not([fill="none"]),
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation svg polygon {
fill: #000 !important;
}
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation li,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation hr,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .devMemberBtn,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .devBottomMenu,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .mobile-menu__locales,
body div#shopify-section-sections--28397086212478__mobile-navigation aside#slideout-mobile-navigation .c-accordion__header {
border-color: #000 !important;
}
}
@media screen and (max-width: 767px) {
.product__section-details
> .devCheckoutSupport
~ .product__section--accordion {
transform: none !important;
}
}
@media screen and (max-width: 767px) {
body.template-product
.product__section-details
> .devCheckoutSupport
+ .product__section--accordion {
margin-top: 25px !important;
}
body.template-product
.product__section-details
> .product__section--accordion:last-of-type {
margin-bottom: 25px !important;
}
}
@media screen and (max-width: 767px) {
body.template-product .devNativeProductGalleryIndicator {
display: none !important;
}
}
/*
Add this entire file to the END of the stylesheet that already controls
.devNativeProductGallery and .devNativeProductGallerySizeLabel.
*/
.devNativeProductGalleryCounter {
display: none;
}
@media screen and (max-width: 767px) {
body.template-product .product-main-images {
position: relative !important;
}
body.template-product .devNativeProductGalleryCounter {
align-items: center !important;
background: rgba(0, 0, 0, 0.5) !important;
border: 0 !important;
border-radius: 1px !important;
bottom: 14px !important;
box-sizing: border-box !important;
color: #fff !important;
column-gap: 3px !important;
display: inline-flex !important;
font-family: "Basis Grotesque Arabic Pro", Arial, sans-serif !important;
font-size: 12px !important;
font-style: normal !important;
font-weight: 700 !important;
height: 25px !important;
justify-content: center !important;
left: 14px !important;
letter-spacing: normal !important;
line-height: 24px !important;
margin: 0 !important;
min-width: 0 !important;
opacity: 1 !important;
padding: 0 10px !important;
pointer-events: none !important;
position: absolute !important;
right: auto !important;
text-indent: 0 !important;
top: auto !important;
visibility: visible !important;
white-space: nowrap !important;
z-index: 50 !important;
}
body.template-product .devNativeProductGalleryCounter span {
color: inherit !important;
font: inherit !important;
letter-spacing: inherit !important;
line-height: inherit !important;
margin: 0 !important;
padding: 0 !important;
}
}
@media screen and (max-width: 767px) {
.product__section-container .devOptionWrap {
margin-bottom: 10px !important;
}
}
@media screen and (max-width: 767px) {
/*
Both containers must grow according to the rendered title height.
*/
body.template-product
.product__section--header
.product-title-row,
body.template-product
.product__section--header
.product-title-row
> .swym-atw-btn-wrapper {
height: auto !important;
min-height: 0 !important;
overflow: visible !important;
}
/*
Important: the title is nested inside the wishlist wrapper.
It must remain in normal document flow.
*/
body.template-product
.product__section--header
.product-title-row
.product__section-title.product-title {
display: block !important;
height: auto !important;
min-height: 0 !important;
margin: 0 !important;
overflow: visible !important;
position: static !important;
white-space: normal !important;
}
@media screen and (max-width: 767px) {
.product__section--header
> .nvlty-pdp-current-colour {
color: #6e6e6eff !important;
display: block !important;
height: auto !important;
margin: 5px 5px 0 !important;
position: static !important;
inset: auto !important;
transform: none !important;
}
}
@media screen and (max-width: 767px) {
/*
Convert only the PDP size-selector container to a wrapping layout.
*/
body.template-product
.swatches__container.dev_Size.nvlty-size-option {
align-items: stretch !important;
box-sizing: border-box !important;
column-gap: 8px !important;
display: flex !important;
flex-wrap: wrap !important;
row-gap: 4px !important;
width: 100% !important;
}
/*
Keep the SIZE / Find Your Size heading on its own complete row.
The negative bottom margin cancels the newly introduced 4px gap between
the heading and the first swatch row. The 4px remains only between actual
swatch rows.
*/
body.template-product
.swatches__container.dev_Size.nvlty-size-option
> .devOptionWrap {
flex: 0 0 100% !important;
margin-bottom: -4px !important;
width: 100% !important;
}
/*
Remove inline-block line-layout behaviour without changing tile sizes.
*/
body.template-product
.swatches__container.dev_Size.nvlty-size-option
> .swatches__swatch--regular {
flex: 0 0 auto !important;
margin-bottom: 0 !important;
}
}
@media screen and (max-width: 767px) {
#slideout-mobile-navigation,
nav.mobile-menu {
background-color: #ffffff !important;
--text-color: #000000;
color: #000000;
}
nav.mobile-menu a,
nav.mobile-menu p,
nav.mobile-menu button,
nav.mobile-menu li,
nav.mobile-menu span:not(.country--flag),
nav.mobile-menu .c-accordion__link,
nav.mobile-menu .country--name,
nav.mobile-menu .localization-form__currency,
nav.mobile-menu .disclosure__toggle,
nav.mobile-menu .disclosure-list__option {
color: #000000 !important;
}
nav.mobile-menu #dev_tabs-nav li a,
nav.mobile-menu #dev_tabs-nav li.active a,
nav.mobile-menu #dev_tabs-nav li:not(.active) a {
color: #000000 !important;
}
nav.mobile-menu svg,
nav.mobile-menu svg path,
nav.mobile-menu svg g,
nav.mobile-menu svg .hover-stroke {
stroke: #000000 !important;
}
nav.mobile-menu .devChevron {
color: #000000 !important;
}
nav.mobile-menu .testament--apollo-checkmark .hover-fill,
nav.mobile-menu .testament--apollo-checkmark polygon {
fill: #000000 !important;
stroke: none !important;
}
nav.mobile-menu .secondary-button {
background-color: #ffffff !important;
color: #000000 !important;
border: 1px solid #000000 !important;
}
nav.mobile-menu .disclosure__toggle,
nav.mobile-menu .disclosure-list,
nav.mobile-menu .disclosure-list__item,
nav.mobile-menu .selectors-form__select {
border-color: #000000 !important;
}
}
@media screen and (max-width: 749px) {
.ajax-cart__cart-form
.custom-cart-upsell__footer
.custom-cart-upsell__quickview {
top: -100px !important;
}
}
/* Cart mini-modal header close button only */
#slideout-ajax-cart
.slideout__trigger--close
> button.slideout__trigger-ajax-cart[aria-label="Close cart"] {
width: 24px !important;
height: 24px !important;
min-width: 24px !important;
min-height: 24px !important;
max-width: 24px !important;
max-height: 24px !important;
padding: 0 !important;
display: grid !important;
place-items: center !important;
line-height: 0 !important;
overflow: visible !important;
}
/* SVG inside that exact cart-header button only */
#slideout-ajax-cart
.slideout__trigger--close
> button.slideout__trigger-ajax-cart[aria-label="Close cart"]
> svg.testament--apollo-close {
width: 24px !important;
height: 24px !important;
inline-size: 24px !important;
block-size: 24px !important;
min-width: 24px !important;
min-height: 24px !important;
max-width: 24px !important;
max-height: 24px !important;
display: block !important;
flex: 0 0 24px !important;
}
/* Mobile quick-view spacing: price → Klarna → swatches */
@media screen and (max-width: 767px) {
/* Remove existing space below the price */
.product__quickview-wrapper #product-price {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
/* Approximately 10px between price and Klarna */
.product__quickview-wrapper
#product-price + .dev-product-installment-line--quickview {
margin-top: 10px !important;
margin-bottom: 20px !important;
}
/* Remove the swatches' existing mt4 top-margin utility */
.product__quickview-wrapper .product__variants-swatches {
margin-top: 0 !important;
}
}
html body .global__section {
animation: none !important;
}
@media screen and (max-width: 749px) {
.devMobilePreSerach .devInputWrapper {
position: relative !important;
}
.devMobilePreSerach .devInputWrapper > .devSearchButtons {
position: absolute !important;
inset-block-start: 0 !important;
inset-block-end: 0 !important;
height: auto !important;
display: flex !important;
align-items: center !important;
}
.devMobilePreSerach
.devInputWrapper
> .devSearchButtons
> #search_button {
align-self: center !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin-block: 0 !important;
padding-block: 0 !important;
line-height: 0 !important;
}
.devMobilePreSerach
.devInputWrapper
> .devSearchButtons
> #search_button
> .testament--icon-theme-search {
display: block !important;
margin-block: 0 !important;
transform: translateY(-2px) !important;
}
}
/* QuickView sold-out purchase state only. */
#modal-quickview-cart
form.nvlty-quickview-notify-only
.AddtoCart,
#modal-quickview-cart
form.nvlty-quickview-notify-only
.dev-express-checkout,
#modal-quickview-cart
form.nvlty-quickview-notify-only
.dev-accelerated-checkout {
display: none !important;
}
/*
QuickView only: when the selected variant is sold out, show only the
existing Notify Me control within the purchase-button stack.
*/
#modal-quickview-cart
.product__section--buttons:has(
.AddtoCart:is(.nv-hide-sold-out-button, .dev_disableBtn)
)
.AddtoCart,
#modal-quickview-cart
.product__section--buttons:has(
.AddtoCart:is(.nv-hide-sold-out-button, .dev_disableBtn)
)
.dev-express-checkout,
#modal-quickview-cart
.product__section--buttons:has(
.AddtoCart:is(.nv-hide-sold-out-button, .dev_disableBtn)
)
.dev-accelerated-checkout {
display: none !important;
}
/* ==========================================================================
CANONICAL NVLTY WISHLIST ICON
All wishlist icons use the same SVG snippet.
Do not set icon width, height, transform, fill, stroke or stroke-width
anywhere else.
========================================================================== */
.nvlty-wishlist-icon {
display: block !important;
width: 24px !important;
height: 24px !important;
min-width: 24px !important;
min-height: 24px !important;
max-width: 24px !important;
max-height: 24px !important;
margin: 0 !important;
padding: 0 !important;
transform: none !important;
flex: 0 0 24px !important;
}
.nvlty-wishlist-icon > path {
fill: none !important;
stroke-width: 1.7 !important;
stroke-linecap: butt !important;
stroke-linejoin: round !important;
}
/* =========================================================
CART — DISPLAY THE REAL CANONICAL WISHLIST SVG
========================================================= */
html body:has(form[action="/cart"])
#slideout-ajax-cart
.swym-wishlist-collections-v2::before,
html body:has(form[action="/cart"])
#slideout-ajax-cart
.swym-wishlist-collections-v2::after,
html body:has(form[action="/cart"])
#modal-ajax-cart
.swym-wishlist-collections-v2::before,
html body:has(form[action="/cart"])
#modal-ajax-cart
.swym-wishlist-collections-v2::after,
html body:has(form[action="/cart"])
.nvlty-cart-modal
.swym-wishlist-collections-v2::before,
html body:has(form[action="/cart"])
.nvlty-cart-modal
.swym-wishlist-collections-v2::after {
content: none !important;
display: none !important;
width: 0 !important;
height: 0 !important;
background: none !important;
background-color: transparent !important;
-webkit-mask: none !important;
mask: none !important;
-webkit-mask-image: none !important;
mask-image: none !important;
}
/* Normalise the existing Swym button around the real 24px SVG. */
html body:has(form[action="/cart"])
#slideout-ajax-cart
.swym-wishlist-collections-v2,
html body:has(form[action="/cart"])
#modal-ajax-cart
.swym-wishlist-collections-v2,
html body:has(form[action="/cart"])
.nvlty-cart-modal
.swym-wishlist-collections-v2 {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 24px !important;
height: 24px !important;
min-width: 24px !important;
min-height: 24px !important;
max-width: 24px !important;
max-height: 24px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
background-color: transparent !important;
box-shadow: none !important;
overflow: visible !important;
}
/* Reveal the correct SVG that is already present in the button. */
html body:has(form[action="/cart"])
#slideout-ajax-cart
.swym-wishlist-collections-v2
svg.nvlty-wishlist-icon.header-wishlist-icon,
html body:has(form[action="/cart"])
#modal-ajax-cart
.swym-wishlist-collections-v2
svg.nvlty-wishlist-icon.header-wishlist-icon,
html body:has(form[action="/cart"])
.nvlty-cart-modal
.swym-wishlist-collections-v2
svg.nvlty-wishlist-icon.header-wishlist-icon {
display: block !important;
width: 24px !important;
height: 24px !important;
min-width: 24px !important;
min-height: 24px !important;
max-width: 24px !important;
max-height: 24px !important;
margin: 0 !important;
padding: 0 !important;
color: #000 !important;
fill: none !important;
transform: none !important;
}
/* Preserve the exact canonical path presentation. */
html body:has(form[action="/cart"])
#slideout-ajax-cart
.swym-wishlist-collections-v2
svg.nvlty-wishlist-icon.header-wishlist-icon > path,
html body:has(form[action="/cart"])
#modal-ajax-cart
.swym-wishlist-collections-v2
svg.nvlty-wishlist-icon.header-wishlist-icon > path,
html body:has(form[action="/cart"])
.nvlty-cart-modal
.swym-wishlist-collections-v2
svg.nvlty-wishlist-icon.header-wishlist-icon > path {
fill: none !important;
stroke: currentColor !important;
stroke-width: 1.7px !important;
stroke-linecap: butt !important;
stroke-linejoin: round !important;
}
/* =========================================================
NVLTY PDC WISHLIST — BLACK HOLLOW/FILLED STATES
Product cards only. Does not affect header or PDP.
========================================================= */
/*
Force currentColor to resolve as black at every SVG level.
*/
html body button.devWishlistProxy,
html body button.devWishlistProxy svg.nvlty-wishlist-icon,
html body button.devWishlistProxy svg.nvlty-wishlist-icon > path {
color: #000000 !important;
}
/* Filled state. */
html body button.devWishlistProxy.nvlty-wishlist-filled
svg.nvlty-wishlist-icon > path,
html body button.devWishlistProxy.is-active
svg.nvlty-wishlist-icon > path,
html body button.devWishlistProxy[aria-pressed="true"]
svg.nvlty-wishlist-icon > path {
color: #000000 !important;
fill: #000000 !important;
stroke: #000000 !important;
stroke-width: 1.7px !important;
}
/* Hollow/default state. */
html body button.devWishlistProxy:not(.nvlty-wishlist-filled):not(.is-active):not([aria-pressed="true"])
svg.nvlty-wishlist-icon > path {
color: #000000 !important;
fill: none !important;
stroke: #000000 !important;
stroke-width: 1.7px !important;
}
.nvlty-seen__handle > p:first-of-type {
margin-bottom: 0 !important;
}
.nvlty-seen__handle > p + p {
margin-top: 0px !important;
}
@media screen and (min-width: 990px) {
.devFeaturedCollection .js-product-listing {
width: 25% !important;
flex: 0 0 25% !important;
max-width: 25% !important;
}
.devFeaturedCollection [data-flickity-config] {
display: flex !important;
flex-wrap: nowrap !important;
gap: 0 !important;
}
.devFeaturedCollection .featured__collection-product {
margin: 0 !important;
}
}
/* PDP native gallery loading stability and progress — desktop only */
@media screen and (min-width: 990px) {
/*
Prevent the prepended infinite-scroll clone from appearing before the
gallery JavaScript has moved the rail to the first genuine image.
*/
body.template-product
.product__section-images
.devNativeProductGallery:not([data-native-gallery-ready="true"]) {
visibility: hidden !important;
}
body.template-product
.product__section-images
.devNativeProductGallery[data-native-gallery-ready="true"] {
visibility: visible !important;
}
body.template-product
.product__section-images
.devNativeProductGalleryIndicator {
--pdp-gallery-thumb-width: 40px;
--pdp-gallery-thumb-x: 0px;
background: #e7e7e7 !important;
border: 0 !important;
border-radius: 2px !important;
box-sizing: border-box !important;
display: block !important;
height: 2px !important;
margin: 14px 0 0 !important;
overflow: hidden !important;
padding: 0 !important;
pointer-events: none !important;
position: relative !important;
width: 100% !important;
}
body.template-product
.product__section-images
.devNativeProductGalleryIndicator
> span {
background: #000000 !important;
border: 0 !important;
border-radius: 2px !important;
display: block !important;
height: 2px !important;
left: 0 !important;
margin: 0 !important;
padding: 0 !important;
position: absolute !important;
top: 0 !important;
transform: translate3d(
var(--pdp-gallery-thumb-x),
0,
0
) !important;
transition: none !important;
width: var(--pdp-gallery-thumb-width) !important;
will-change: transform;
}
}
/* Remove visible SOLD OUT purchase controls throughout the storefront. */
/* Quick View: hide the disabled Add to Cart/Sold Out button. */
#modal-quickview-cart
.product__section--buttons
.AddtoCart:disabled,
#modal-quickview-cart
.product__section--buttons
.AddtoCart[disabled],
#modal-quickview-cart
.product__section--buttons
.AddtoCart.dev_disableBtn,
#modal-quickview-cart
.product__section--buttons
.AddtoCart.nv-hide-sold-out-button {
display: none !important;
}
/* PDP: when Klaviyo Back in Stock exists, remove the old Sold Out button. */
body.template-product
.product__section--buttons:has(#klaviyo-bis-button-container)
.AddtoCart:disabled,
body.template-product
.product__section--buttons:has(#klaviyo-bis-button-container)
.AddtoCart[disabled] {
display: none !important;
}
/* Remove Shopify's separate Sold Out price badge everywhere. */
.price__badge--sold-out {
display: none !important;
}
/* Quick View — vertically balance the information column on desktop */
@media screen and (min-width: 990px) {
#modal-quickview-cart
.product__section-content {
box-sizing: border-box !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
height: 100% !important;
min-height: 100% !important;
padding-top: 32px !important;
padding-bottom: 32px !important;
}
#modal-quickview-cart
.product__section-details {
width: 100% !important;
margin-top: auto !important;
margin-bottom: auto !important;
}
}
/* Desktop collection navigation — full available width */
@media screen and (min-width: 990px) {
body.template-collection
.grid__wrapper.rg0:has(> .nvCollectionNav) {
box-sizing: border-box !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding-right: 24px !important;
padding-left: 24px !important;
}
body.template-collection
.grid__wrapper.rg0 > .nvCollectionNav {
box-sizing: border-box !important;
grid-column: 1 / -1 !important;
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
margin: 0 !important;
}
body.template-collection
.nvCollectionNav__list,
body.template-collection
.nvCollectionNav__track {
width: 100% !important;
max-width: none !important;
}
}
@media only screen and (min-width: 990px) {
html body .slideshow__caption
.slideshow__caption-wrapper.section--caption.slideshow__caption-wrapper--bar {
display: block !important;
width: 1500px !important;
min-width: 1500px !important;
max-width: 1500px !important;
box-sizing: border-box !important;
}
html body .slideshow__caption-wrapper--bar > .slideshow__bar-link {
display: flex !important;
width: 100% !important;
box-sizing: border-box !important;
justify-content: space-between !important;
}
}
@media screen and (min-width: 769px) {
#modal-quickview-cart:popover-open {
opacity: 1 !important;
visibility: visible !important;
}
#modal-quickview-cart:popover-open > .modal__inner-wrapper {
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
}
}