@import url('https://fonts.googleapis.com/css2?family=Sofia+Sans:ital,wght@0,1..1000;1,1..1000&display=swap');.primary-button.active .button-loader,.secondary-button.active .button-loader{stroke-linecap:round;display:block;color:var(--primary-font-color);}
.form_control,.line-primary,.range_container,.slider-wrapper,.sliders_control,.tab-button,.ui-menu{position:relative;}
.star,.star.active{stroke:var(--primary);}
:root{--primary:#FFC400;--secondary:#E52E05;--white:#ffffff;--gray:#999999;--silver: #E6E6E6;--inbound-price: #FFC400;--outbound-price: #E6E6E6;--primary-opacity: rgb(var(--primary), 0.2);
;--black:#000000;--blue:#0886CF;--green:#006300;--red:#ff0000;--gold:#e8b923;--placeholder:var(--gray);--primary-font-family:"Sofia Sans",serif;--primary-font-color:var(--black);--inverted-font-color:#ffffff;--mask-background-color:rgba(0,0,0,0.4);}
html,body{font-family:var(--primary-font-family);}
#header-categories{white-space:nowrap;}
#header-categories div[type="button"]:hover + div{display:block;left:170px;height:fit-content;}
#header-categories:has(+ div:hover){display:block;}
.primary-button{display:block;color:var(--black);background-color:var(--primary);border:2px solid var(--primary);}
/* .primary-button:hover svg path{fill:var(--white);stroke:var(--white);}
*/
.primary-button.active,.primary-button:hover{color:var(--black);background-color:var(--white);border:2px solid var(--primary);}
.primary-button.active .button-loader{color:var(--primary);stroke-linecap:round;}
.primary-button.active .button-loader .path{stroke:var(--primary);}
.primary-button.inverted{display:block;color:var(--black);background-color:var(--white);border:1px solid var(--primary);}
.primary-button.inverted:hover{color:var(--white);background-color:var(--primary);border:1px solid var(--white);}
.primary-button.inverted.active{background-color:var(--primary);color:var(--inverted-font-color);border-color:var(--primary);}
.primary-button.inverted.active .button-loader{color:var(--white);stroke-linecap:round;display:block;}
.primary-button.inverted.active .button-loader .path{stroke:var(--white);}
.secondary-button{color:var(--white);background-color:var(--secondary);border:1px solid var(--secondary);}
.secondary-button:hover{color:var(--secondary);background-color:var(--white);border:1px solid var(--secondary);}
.secondary-button:hover svg path{fill:var(--secondary);stroke:var(--secondary);}
.secondary-button.active{color:var(--secondary);background-color:var(--white);border:1px solid var(--secondary);}
.secondary-button.active .button-loader{stroke-linecap:round;display:block;color:var(--primary-font-color);}
.secondary-button.active .button-loader .path{stroke:var(--white);}
button{background-color:var(--primary-font-color);color:var(--inverted-font-color);}
button.active{background-color:var(--primary);color:var(--white);}
button.disabled,button.primary-button.disabled{background-color:var(--secondary-background);opacity:0.6;color:var(--primary-font-color);cursor:not-allowed;border-color:var(--primary-border);}
.button-loader{animation:rotate 2s linear infinite;z-index:2;width:20px;height:20px;display:none;}
@keyframes rotate{100%{transform:rotate(360deg);}
}
@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0;}
50%{stroke-dasharray:90,150;stroke-dashoffset:-35;}
100%{stroke-dasharray:90,150;stroke-dashoffset:-124;}
}
.client-address.selected{font-weight:700;border-width:2px;}
.ui-menu{width:50%;overflow-x:hidden;box-shadow:rgba(0,0,0,0.2) 0px 0px 10px;background-color:var(--primary-input) !important;z-index:60 !important;position:relative;margin-top:2rem;border-radius:0.5rem;border-width:1px;--tw-border-opacity:1;border-color:var(--primary-border);max-height:200px;}
.autocomplete-option.selected{border-color:var(--primary-border);background-color:var(--secondary-background);color:var(--primary-font-color);border-width:2px;}
.autocomplete-option.selected span{font-weight:bold;}
.ui-menu .ui-menu-item{padding:0.5rem;cursor:pointer;}
.ui-menu .ui-menu-item:hover{background-color:var(--secondary-background);}
.ui-helper-hidden-accessible{display:none;}
.invalid{border-color:var(--red) !important;}
.valid{border-color:var(--green) !important;}
.line-primary{position:relative;margin-bottom:2rem;}
.line-primary:after{content:"";background:var(--primary);position:absolute;bottom:-1rem;left:0;width:50%;height:0.4rem;}
.tab-button{position:relative;}
/* .tab-button.active{font-weight:bold;cursor:not-allowed;border-bottom: 2px solid var(--primary);} */
.tab-button:not(.active){color: var(--gray);}
.tab-line-primary.active::after{content:"";background:var(--primary);position:absolute;bottom:0;left:0;width:100%;height:3px;border-radius:10px;z-index: 10;}
*:has(>.description-tab-button)::after{content:"";background:var(--silver);position:absolute;bottom:1px;left:0;width:100%;height:2px;border-radius:10px;}
.variant-select:hover{background-color:var(--primary);border-color:var(--secondary-accent);color:var(--white);cursor:pointer;}
.variant-select.active{border-color:var(--secondary-accent);color:var(--white);}
.range_container{position:relative;display:flex;flex-direction:column;}
.sliders_control{position:relative;min-height:25px;}
.form_control{position:relative;color:#635a5a;}
.image-attribute.active{border-color:var(--primary);}
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:all;width:24px;height:24px;background-color:var(--primary);border-radius:50%;border: 2px solid var(--primary);box-shadow: none;}
input[type="range"]::-moz-range-thumb{-webkit-appearance:none;pointer-events:all;width:24px;height:24px;background-color:var(--primary);border-radius:50%;border: 2px solid var(--primary);box-shadow: none;}
input[type="range"]::-webkit-slider-thumb:hover{background:#f7f7f7;}
input[type="range"]::-webkit-slider-thumb:active{box-shadow:inset 0 0 3px var(--primary),0 0 9px var(--primary);-webkit-box-shadow:inset 0 0 3px var(--primary),0 0 9px var(--primary)}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{opacity:1;}
input[type="range"]{-webkit-appearance:none;appearance:none;height:4px;width:100%;position:absolute;background-color:#c6c6c6;pointer-events:none;}
#fromSlider{height:0;z-index:1;}
.slider-wrapper{position:relative;}
input[type="range"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;outline:none;position:absolute;margin:auto;top:0;bottom:0;background-color:transparent;pointer-events:none;}
input[type="checkbox"]{accent-color:var(--primary);width:20px;}
#search-autocomplete-wrapper{position:absolute;top:100%;background-color:white;z-index:1000;height:70vh;max-height: fit-content;width:100%;overflow-y:auto;display:none;}
.autocomplete-item{display:flex;padding:1rem;gap:1rem;align-items:center;cursor:pointer;border-bottom:1px solid var(--border-color);}
.autocomplete-item:hover{background-color:var(--red);color:var(--white);border-color:1px solid var(--red);}
.star{fill:var(--white);stroke:var(--primary);}
.star.active{fill:var(--primary);stroke:var(--primary);}

.slick-track{display:flex !important;padding-block: 10px;}
.slick-slide{height:inherit !important;margin: 0 10px;}
.slick-dots{display:flex !important;justify-content:center;align-items:center;list-style:none;padding:0;margin:20px 0 0 0;}
.slick-dots li{display:inline-block;margin:0 8px;}
.slick-dots li button{font-size:0;border:none;background:transparent;padding:0;cursor:pointer;}
.slick-dots li button:before{content:'';display:block;width:10px;height:10px;background-color:var(--gray);border-radius:50%;transition:background-color 0.3s ease,transform 0.3s ease;}
.slick-dots li.slick-active button:before{background-color:var(--primary);transform:scale(1.2);}
#products-slick-index-products .slick-track {margin-block: 10px;}
#products-slick-index-products .slick-slide {margin-inline: 10px;}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
#product-details-buy-button input::-webkit-outer-spin-button,#product-details-buy-button input::-webkit-inner-spin-button{-webkit-appearance:auto;margin:0;}
input[type=number]{-moz-appearance:textfield;}
#categories-ul #desktop-navigation ul li:nth-child(2) a::before{content:"";display:inline-block;width:20px;height:20px;margin-right:6px;background-image:url("/static/images/promo-red.svg");background-size:contain;background-repeat:no-repeat;vertical-align:middle;left:0;top:50%;}
#categories-ul #desktop-navigation ul li:nth-child(2) a{color:var(--primary);}
#categories-ul #desktop-navigation ul li:nth-child(3) a::before{content:"";display:inline-block;width:20px;height:25px;margin-right:6px;background-image:url("/static/images/new.svg");background-size:contain;background-repeat:no-repeat;vertical-align:middle;left:0;top:50%;}
#categories-ul #desktop-navigation ul li:nth-child(4) a::before{content:"";display:inline-block;width:20px;height:25px;margin-right:6px;background-image:url("/static/images/bestsellers.svg");background-size:contain;background-repeat:no-repeat;vertical-align:middle;left:0;top:50%;}
.search-bar {max-height: 0;overflow: hidden;opacity: 0;transition:max-height 0.5s ease,opacity 0.5s ease,padding 0.5s ease;padding: 0 10px; /* no top/bottom padding when closed */}
.search-bar.open {max-height: 100px;opacity: 1;padding: 10px; /* adds vertical padding smoothly */z-index: 20;}
#pagination-controls button.active{background-color:var(--primary);color:var(--black);}
.product-shadow:hover,.button-shadow:hover{box-shadow:0 0px 8px 0 rgba(0,0,0,0.2),0 0px 0px 0px rgba(0,0,0,0.19);}


.overflow-x-auto {
  overflow-x: auto;
  scrollbar-width: thin; /* For Firefox */
  scrollbar-color: #bbb transparent; /* Firefox thumb and track */
}

.overflow-x-auto::-webkit-scrollbar {
  height: 6px;
}

.overflow-x-auto::-webkit-scrollbar-thumb {
  background-color: #bbb;
  border-radius: 8px;
  transition: background-color 0.3s ease;
}

.overflow-x-auto::-webkit-scrollbar-thumb:hover {
  background-color: #999;
}

.overflow-x-auto::-webkit-scrollbar-track {
  background: transparent;
}

@layer utilities {
  .number-input::-webkit-inner-spin-button,
  .number-input::-webkit-outer-spin-button {
    -webkit-appearance: inner-spin-button;
    margin: 0;
  }

  .number-input {
    -moz-appearance: auto;
    appearance: auto;
  }
}

/* ===================== POST CONTENT (VEditor output) ===================== */
/* Restore defaults removed by preflight so TinyMCE indent/outdent renders properly */
#post_content {
  line-height: 1.8;
}
#post_content p {
  margin: 0 0 1rem 0;
}
#post_content ul,
#post_content ol {
  list-style-position: outside;
  padding-left: 1.5rem;
  margin: 0 0 1rem 0;
}
#post_content ul {
  list-style-type: disc;
}
#post_content ol {
  list-style-type: decimal;
}
#post_content ul ul {
  list-style-type: circle;
  padding-left: 1.25rem;
}
#post_content ol ol {
  list-style-type: lower-alpha;
  padding-left: 1.25rem;
}
#post_content li {
  margin: 0.25rem 0;
}
#post_content blockquote {
  border-left: 4px solid var(--gray);
  padding-left: 1rem;
  margin: 1rem 0;
}
/* TinyMCE Accordion */
#post_content details {
  margin: 0 0 1rem 0;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--gray);
  border-radius: 0.5rem;
  background: transparent;
}
#post_content details > summary {
  font-weight: 600;
  cursor: pointer;
}

/* Column rows built by the editor */
#post_content #col_droppable_row {
  column-gap: 1rem;
  row-gap: 1rem;
}

/* Headings */
#post_content h1 {
  font-size: 1.75rem;
  font-weight: 700;
  margin: 0 0 1rem 0;
}
#post_content h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 0.875rem 0;
}
#post_content h3 {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 0 0.75rem 0;
}
#post_content h4 {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0 0 0.5rem 0;
}
#post_content h5 {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 0.5rem 0;
}
#post_content h6 {
  font-size: 0.875rem;
  font-weight: 600;
  margin: 0 0 0.5rem 0;
}

/* Links */
#post_content a {
  color: var(--secondary);
  text-decoration: underline;
}
#post_content a:hover {
  color: var(--primary);
}

/* Images and figures */
#post_content img {
  max-width: 100%;
  height: auto;
}
#post_content figure {
  margin: 1rem 0;
}
#post_content figcaption {
  text-align: center;
  font-size: 0.9em;
  color: #555;
}

/* Alignment helpers TinyMCE may output */
#post_content .alignleft {
  float: left;
  margin: 0 1rem 1rem 0;
}
#post_content .alignright {
  float: right;
  margin: 0 0 1rem 1rem;
}
#post_content .aligncenter {
  display: block;
  margin: 1rem auto;
  text-align: center;
}
#post_content::after {
  content: '';
  display: table;
  clear: both;
}

/* Tables from editor */
#post_content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
}
#post_content th,
#post_content td {
  border: 1px solid var(--gray);
  padding: 0.5rem;
}
#post_content th {
  background: var(--silver);
  text-align: left;
}

/* Code blocks */
#post_content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono',
    monospace;
  background: #f5f5f5;
  padding: 0 0.25rem;
  border-radius: 4px;
}
#post_content pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono',
    monospace;
  background: #f5f5f5;
  padding: 1rem;
  overflow-x: auto;
  border-radius: 6px;
}
#post_content pre code {
  background: transparent;
  padding: 0;
}

/* Horizontal rule */
#post_content hr {
  border: 0;
  border-top: 1px solid var(--gray);
  margin: 2rem 0;
}

/* Definition lists */
#post_content dl {
  margin: 1rem 0;
}
#post_content dt {
  font-weight: 600;
}
#post_content dd {
  margin: 0 0 0.5rem 1rem;
}

/* Superscript / subscript */
#post_content sup {
  vertical-align: super;
  font-size: 0.75em;
}
#post_content sub {
  vertical-align: sub;
  font-size: 0.75em;
}

/* Mark */
#post_content mark {
  background-color: #fff3a6;
  padding: 0 0.2em;
}

/* Embedded media */
#post_content iframe,
#post_content video,
#post_content audio {
  max-width: 100%;
}
