@import "mixin";@import "default";@mixin font-face($folderpath,$familyname,$filename,$weight,$style){@font-face{font-family:$familyname;src:url("{{ themeAsset('fonts/#{$folderpath}/#{$filename}.eot') }}");src:url("{{ themeAsset('fonts/#{$folderpath}/#{$filename}.eot?#iefix') }}") format("embedded-opentype"),url("{{ themeAsset('fonts/#{$folderpath}/#{$filename}.woff') }}") format("woff"),url("{{ themeAsset('fonts/#{$folderpath}/#{$filename}.ttf') }}") format("truetype"),url("{{ themeAsset('fonts/#{$folderpath}/#{$filename}.svg?#webfont') }}") format("svg");font-weight:$weight;font-style:$style}}body{position:relative;left:0;color:$color-text;font-size:var(--font-size-12);font-family:$font-family;background:$color-white;transition:left .2s linear,right .2s linear}.openbox-overlay,.dropbox-overlay,.navigation-menu-overlay,.fancybox-is-open .fancybox-bg{opacity:.7;background:#000}&::-webkit-scrollbar{width:4px;height:2px}&::-webkit-scrollbar-track{background:$color-background}&::-webkit-scrollbar-thumb{background:$color-primary}@include min($lg){.container{max-width:calc(1600px + calc(2*var(--gutter)))}}.container,.container-fluid{padding-right:var(--gutter);padding-left:var(--gutter)}.row{margin-right:calc(-1*var(--gutter));margin-left:calc(-1*var(--gutter));.col,[class*="col-"]{padding-right:var(--gutter);padding-left:var(--gutter)}}#header{.header-top{background-color:#eee}.header-middle{padding-block:var(--spacer-8)}.header-bottom{background:linear-gradient(90deg,#3C3C3C 0%,#011771 52.5%,#010E46 100%)}@include min($lg){position:relative;z-index:101;background:$color-white}}.header-top-left{display:flex;align-items:center;@include max($lg){justify-content:center}>div{display:flex;align-items:center;margin-left:var(--spacer-8);@include max($lg){margin-left:var(--spacer-6)}&:before{content:'';display:block;width:1px;height:22px;margin-right:var(--spacer-8);background-color:#ccc;@include max($lg){margin-right:var(--spacer-6)}}&:first-child{margin-left:0;&:before{display:none}}>a{display:flex;align-items:center;flex-wrap:wrap;height:44px;color:$color-text;@include heading-type-1;transition:$transition;@include svg;span{flex:1 0 0%;padding-left:var(--spacer-3);@include max($xs){display:none}}@include min($lg){&:hover{color:$color-primary;@include svghover($color-primary)}}@include max($sm){height:36px}}}}ul.menu-items-second-order{display:flex;align-items:center;flex-wrap:wrap;>li{display:flex;align-items:center;margin-left:var(--spacer-8);@include max($lg){margin-left:var(--spacer-6)}&:before{content:'';display:block;width:1px;height:22px;margin-right:var(--spacer-8);background-color:#ccc;@include max($lg){margin-right:var(--spacer-6)}}&:first-child{margin-left:0;&:before{display:none}}>a{display:flex;align-items:center;height:44px;color:$color-text;@include heading-type-1;transition:$transition;@include min($lg){&:hover{color:$color-primary}}}}@include max($md){display:none}}.search{form{position:relative;input{width:100%;height:56px;@include heading-type-2;color:$color-text;padding:6px 88px 6px 60px;border:2px solid #9B3037;background-color:#fff0;border-radius:$border-radius;background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.7748 18.6875L14.9656 13.8793C16.3595 12.2058 17.0546 10.0594 16.9062 7.88649C16.7579 5.7136 15.7775 3.68155 14.1691 2.21306C12.5607 0.744569 10.448 -0.0472976 8.27066 0.00218707C6.09327 0.0516718 4.01878 0.938698 2.47874 2.47874C0.938698 4.01878 0.0516718 6.09327 0.00218707 8.27066C-0.0472976 10.448 0.744569 12.5607 2.21306 14.1691C3.68155 15.7775 5.7136 16.7579 7.88649 16.9062C10.0594 17.0546 12.2058 16.3595 13.8793 14.9656L18.6875 19.7748C18.7589 19.8462 18.8437 19.9028 18.937 19.9415C19.0302 19.9801 19.1302 20 19.2312 20C19.3321 20 19.4321 19.9801 19.5254 19.9415C19.6187 19.9028 19.7034 19.8462 19.7748 19.7748C19.8462 19.7034 19.9028 19.6187 19.9415 19.5254C19.9801 19.4321 20 19.3321 20 19.2312C20 19.1302 19.9801 19.0302 19.9415 18.937C19.9028 18.8437 19.8462 18.7589 19.7748 18.6875ZM1.55803 8.47361C1.55803 7.10583 1.96362 5.76878 2.72351 4.63151C3.4834 3.49425 4.56347 2.60787 5.82713 2.08444C7.09078 1.56102 8.48128 1.42407 9.82277 1.69091C11.1643 1.95775 12.3965 2.61639 13.3637 3.58355C14.3308 4.55071 14.9895 5.78295 15.2563 7.12444C15.5231 8.46593 15.3862 9.85643 14.8628 11.1201C14.3393 12.3837 13.453 13.4638 12.3157 14.2237C11.1784 14.9836 9.84138 15.3892 8.47361 15.3892C6.6401 15.3872 4.88228 14.6579 3.5858 13.3614C2.28932 12.0649 1.56006 10.3071 1.55803 8.47361Z' fill='%239B3037'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 24px center;&::placeholder{color:$color-text;opacity:1}@include max($sm){height:44px}}button{position:absolute;top:0;right:0;@include center;height:100%;@include heading-type-3;color:#9B3037;padding:0 var(--spacer-4);border:none;border-left:2px solid #9B3037;background:none}}@include max($lg){margin-top:var(--spacer-8)}}.logo{@include center;max-height:110px;img{max-height:110px}@include max($lg){justify-content:flex-start;max-height:100px;img{max-height:100px}}@include max($md){max-height:80px;img{max-height:80px}}@include max($sm){max-height:70px;img{max-height:70px}}@include max($xs){max-height:60px;img{max-height:60px}}@include max($xxs){max-height:50px;img{max-height:50px}}}.header-middle-right{display:flex;align-items:center;justify-content:flex-end;gap:var(--spacer-10);@include max($xxlg){gap:var(--spacer-5)}>div{>a{position:relative;@include center;min-width:48px;height:48px;@include heading-type-2;color:$color-text;padding-inline:var(--spacer-6);background-color:$color-background;border-radius:$border-radius;transition:$transition;>span{padding-left:var(--spacer-3)}@include min($lg){&:hover{background-color:$color-border}}@include max($lg){padding-inline:var(--spacer-3)}@include max($xs){min-width:42px;height:42px}}&.header-button{flex:1 0 0%;>a{color:#01202A;@include heading-type-3;background-color:#25D366;padding-inline:var(--spacer-3);>span{padding-left:0;padding-right:var(--spacer-3);@include max($xxlg){padding-right:0}}@include min($lg){&:hover{background-color:darken(#25D366,$percentage-ratio)}}@include max($xxlg){span{display:none}}@include max(1270){@include min($lg){padding-inline:var(--spacer-3)}}}}&.user-menu{flex:0 0 auto;>a{@include max($xlg){span{display:none}}}}&.cart-menu{flex:0 0 auto}}}body{&.user-menu-content-active{.user-menu-content{right:0}}&.user-menu-welcome-active{.user-menu-welcome{right:0}}&.user-menu-content-active,&.user-menu-welcome-active{overflow:hidden;@include max($sm){position:fixed;left:-320px;overflow:hidden;height:100%;width:100%}@include max($xxxs){left:-280px}}}.user-menu{>a{>i{position:absolute;left:36px;top:-18px;@include center;width:32px;height:32px;background-color:$color-secondary;border-radius:100%;@include max($lg){left:24px}@include max($sm){top:-10px;width:20px;height:20px;svg{width:16px;height:16px}}}@include max($sm){>span{display:none}}}}.user-menu-content,.user-menu-welcome{position:fixed;top:0;right:-420px;width:420px;height:100%;z-index:101;overflow-y:auto;padding:var(--spacer-9) var(--spacer-10);background-color:#fff;transition:$transition;@include max($sm){right:-320px;width:320px}@include max($xxxs){right:-280px;width:280px}.user-menu-content-top{padding-bottom:var(--spacer-7);margin-bottom:var(--spacer-7);border-bottom:1px solid $color-border}.user-menu-title{line-height:28px;color:$color-text;font-size:var(--font-size-20);font-weight:600;margin-bottom:var(--spacer-3)}.user-menu-subtitle{line-height:20px;font-size:var(--font-size-16);margin-bottom:var(--spacer-5)}.user-menu-input{margin-bottom:var(--spacer-5);input{height:48px;color:$color-text;font-size:var(--font-size-14);padding:var(--spacer-2) var(--spacer-4);border:1px solid $color-border;background-color:#fff;&::placeholder{color:$color-text;opacity:1}}}.user-menu-remember{input[type=checkbox]{&+label{line-height:20px;color:$color-text;font-size:var(--font-size-14);padding-left:36px;&:before{width:20px;height:20px;border:1px solid $color-border}}&:checked{&+label{&:before{background-image:none;border-color:$color-border;background-color:$color-white}&:after{content:'';position:absolute;left:7px;top:2px;display:inline-block;width:6px;height:12px;border-bottom:2px solid $color-primary;border-right:2px solid $color-primary;transform:rotate(45deg)}}}}input[type=checkbox]:checked+label:before{background-image:none;border-color:$color-border;background-color:$color-white}}.user-menu-remember,.user-menu-forgot-pass{margin-bottom:var(--spacer-7)}.user-menu-forgot-pass{display:block;color:$color-text;font-size:var(--font-size-14);text-align:right}.user-menu-button{margin-bottom:var(--spacer-5);.btn{@include center;height:48px;color:$color-white;font-size:var(--font-size-18);font-weight:600;padding:0;@include max($xxxs){height:44px}&.btn-facebook{color:#485a96!important;background:#fff!important;border:1px solid #485a96;transition:$transition;&:hover{color:#fff!important;background:#485a96!important}}&.btn-google{color:#4285f4!important;background:#fff!important;border:1px solid #4285f4;transition:$transition;&:hover{color:#fff!important;background:#4285f4!important}}}}.btn-user-menu-signup{color:#fff;background-color:$color-text}.user-menu-profile-list{>a{display:flex;align-items:center;height:48px;color:$color-text;font-size:var(--font-size-14);font-weight:600;padding:0 var(--spacer-4);margin-bottom:var(--spacer-5);border:1px solid $color-border;border-radius:$border-radius;transition:$transition;&:hover{color:$color-white;border-color:$color-primary;background-color:$color-primary}}}}body{&.cart-content-active{overflow:hidden;.cart-content{right:0}@include max($sm){position:fixed;left:-320px;height:100%;width:100%}@include max($xxxs){left:-280px}}}.cart-menu{>a{.cart-amount{position:absolute;left:36px;top:-18px;@include center;width:32px;height:32px;color:$color-white;@include heading-type-1;text-align:center;border-radius:100%;background-color:$color-secondary;@include max($sm){left:32px;top:-10px;width:20px;height:20px}@include max($xs){left:24px}}@include max($sm){>span{display:none}}}}.cart-content{position:fixed;top:0;right:-420px;width:420px;height:100%;z-index:101;background-color:$color-white;transition:$transition;@include max($sm){right:-320px;width:320px}@include max($xxxs){right:-280px;width:280px}.cart-content-inside{display:flex;flex-direction:column;height:100%;>div{flex:0 0 auto;width:100%;padding:var(--spacer-5);background-color:$color-white;&.cart-content-top{position:sticky;position:-webkit-sticky;top:0;z-index:24;border-bottom:1px solid $color-border}&.cart-content-middle{overflow-y:auto;flex:1 0 0%}&.cart-content-bottom{position:sticky;position:-webkit-sticky;bottom:0;z-index:24;padding-inline:var(--spacer-10);border-top:1px solid $color-border}}}.cart-content-title{display:flex;align-items:center;justify-content:space-between;line-height:28px;color:$color-text;font-size:var(--font-size-24);font-weight:600;margin-bottom:var(--spacer-3);.cart-all-delete{color:#7A7474;@include line-rule(12);font-weight:500;cursor:pointer;transition:$transition;@include min($lg){&:hover{color:$color-primary}}}}.cart-content-sub-title{line-height:20px;font-size:var(--font-size-16);span{font-weight:700;text-decoration:underline}}.cart-list{&::-webkit-scrollbar{width:4px}&::-webkit-scrollbar-track{background:lighten($color-border,5%)}&::-webkit-scrollbar-thumb{background:darken($color-border,5%)}.cart-list-item{display:flex;flex-wrap:wrap;padding-bottom:var(--spacer-5);margin-bottom:var(--spacer-5);border-bottom:1px solid $color-border;&:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.cart-list-item-image{flex:0 0 100px;max-width:100px;margin-right:var(--spacer-4);>a{display:block;position:relative;aspect-ratio:$aspect-ratio;@include imgcenter;border:1px solid $color-border}&.no-picture{>a{background-color:$color-border}}@include max($xxs){flex:0 0 80px;max-width:80px}}.cart-list-item-content{flex:1 0 0%;.cart-list-item-brand{margin-bottom:var(--spacer-1);a{display:inline-block;line-height:calc(var(--font-size-12) + 8px);color:$color-text;font-size:var(--font-size-12);transition:$transition;@include min($lg){&:hover{color:$color-primary}}}}.cart-list-item-title{margin-bottom:var(--spacer-2);a{overflow:hidden;display:-webkit-inline-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:calc(var(--font-size-14) + 8px);color:$color-text;font-size:var(--font-size-14);transition:$transition;@include min($lg){&:hover{color:$color-primary}}}}.cart-list-item-price{line-height:calc(var(--font-size-14) + 8px);font-size:var(--font-size-14);font-weight:700;margin-bottom:var(--spacer-2);@include max($xxs){overflow:hidden;height:20px}.cart-list-item-amount{font-weight:400;font-size:var(--font-size-12)}}.cart-qty-and-delete{display:flex;align-items:center;gap:var(--spacer-4);padding-right:var(--spacer-16);.cart-list-item-delete{@include center;overflow:hidden;width:32px;height:32px;border:1px solid $color-border;background-color:$color-white;transition:$transition;svg{path{transition:$transition}}&:hover{border-color:$color-primary;background-color:$color-primary;svg{path{fill:$color-white}}}}.cart-qty{position:relative;flex:1 0 0%;height:32px;>a{position:absolute;top:0;z-index:1;@include center;width:36px;height:100%;transition:$transition;@include svg;&.cart-qty-minus{left:0}&.cart-qty-plus{right:0}@include min($lg){&:hover{background-color:$color-primary;@include svghover($color-white)}}}input{width:100%;height:100%;color:$color-text;@include line-rule(16);font-weight:600;text-align:center;padding:0;border:1px solid $color-border;background-color:$color-white}&.cart-qty-disabled{opacity:.8;pointer-events:none;cursor:disabled;input{background-color:$color-border}}}}}}}.cart-content-total-price{display:flex;align-items:center;justify-content:space-between;gap:var(--spacer-5);margin-bottom:var(--spacer-5);>span{display:block;line-height:20px;font-size:var(--font-size-16)}>div{line-height:22px;font-size:var(--font-size-18);font-weight:700}}.cart-content-button{margin-bottom:var(--spacer-5)}.btn{@include center;height:48px;color:$color-white;font-size:var(--font-size-18);font-weight:600;padding:0;@include max($xxxs){height:48px}&.cart-button-continue{color:$color-text;border:1px solid $color-text;background-color:#fff;transition:$transition;&:hover{color:#fff;background-color:$color-text}}}.cart-content-empty{padding:var(--spacer-5);background-color:$color-white;.cart-content-empty-icon{position:relative;@include center;padding-block:var(--spacer-4);margin-block:var(--spacer-5);border-top:1px solid $color-border;border-bottom:1px solid $color-border;svg{width:40%;height:40%;opacity:.1}}}}.navigation-active{.navigation-menu-overlay{display:block}}#navigation{position:relative;.category-level-1{>ul{display:flex;justify-content:center;flex-wrap:wrap;>li{display:flex;align-items:center;&:before{content:'';display:block;width:1px;height:28px;background-color:#000A30}&:first-child{margin-left:0;&:before{display:none}}>a{display:flex;align-items:center;height:56px;color:$color-white;@include heading-type-4;padding:0 var(--spacer-16);transition:$transition;&:hover{color:$color-fourth}}&.active{>a{color:$color-fourth}>.category-level-2{display:block}}}}}.category-level-2{position:absolute;top:100%;left:0;z-index:101;display:none;width:100%;padding-block:var(--spacer-10) var(--spacer-2);background-color:$color-white;.sub-category-content{>ul{display:flex;flex-wrap:wrap;margin-right:calc(-1 * var(--gutter));margin-left:calc(-1 * var(--gutter));>li{flex:0 0 25%;padding:0 var(--gutter) var(--spacer-8);>a{display:inline-block;height:100%;color:$color-text;@include text-type-4;margin-bottom:var(--spacer-3);padding:var(--spacer-6);border:1px solid $color-border;border-radius:$border-radius;transition:$transition;&:only-child{margin-bottom:0}&:hover{border-color:$color-secondary;box-shadow:0 4px 12px 0 rgb(54 50 50 / .12)}}&.navigation-category-image{flex:0 0 calc(100% / 5);max-width:calc(100% /5);>a{display:block;text-align:center;div{position:relative;padding-top:100%;margin-bottom:var(--spacer-6);transition:$transition;@include imgcenter}}}}}}}.category-level-3{>ul{>li{>a{display:inline-block;color:$color-text;margin-bottom:var(--spacer-2);transition:$transition;&:hover{color:$color-primary}}&.navigation-show-all{font-style:italic;text-decoration:underline}}}}@include max($lg){display:none}}#main{padding:var(--spacer-6) 0 calc(var(--spacer-18) + var(--spacer-19))}.current-page-default-entry{#main{padding:0}}.current-page-product-detail{#main{padding-bottom:0}}.store-banner-and-category-multi-search{padding-block:var(--spacer-8) calc(var(--spacer-18) + var(--spacer-19));>div{display:flex;flex-direction:column;gap:var(--spacer-8)}}Harika,sıfırdan ve temiz bir şekilde ilerleyelim. Aşağıda **HTML (Twig)** tarafında döngü içine markalara özel sınıf (class) atayan mantığı kurdum. **SCSS** tarafında ise bu sınıfları yakalayıp istediğin yanıp sönme animasyonlarını ve renkleri tanımladım. İşte güncel ve çalışan kodların:### 1. HTML (Twig) Burada `for` döngüsü içinde `i` değerine (1,2,3,4) göre `brandClass` adında bir değişken oluşturup,bunu `` etiketinin class'ına ekledim. ```html {% if theme.settings.branch_banner_one_status or theme.settings.branch_banner_one_status %}
{% if theme.settings.branch_banner_one_status %}
{{ theme.settings.branch_banner_one_title }}
{% if theme.settings.branch_banner_one_title %}
{{ theme.settings.branch_banner_one_title }}
{% endif %} {% if theme.settings.branch_banner_one_status_1 or theme.settings.branch_banner_one_status_2 or theme.settings.branch_banner_one_status_3 or theme.settings.branch_banner_one_status_4 %}
{% for i in 1..4 %} {% set branchBannerOneStatus = theme.settings["branch_banner_one_status_" ~ i] %} {% set branchBannerOneTitle = theme.settings["branch_banner_one_title_" ~ i] %} {% set branchBannerOneImage = theme.settings["branch_banner_one_image_" ~ i] %} {% set branchBannerOneWhatsapp = theme.settings["branch_banner_one_whatsapp_" ~ i] %} {% set branchBannerOneWhatsappText = theme.settings["branch_banner_one_whatsapp_text_" ~ i] %} {% if branchBannerOneStatus %}
{% if branchBannerOneTitle %}
{{ branchBannerOneTitle }}
{% endif %}
{{ branchBannerOneTitle }}
{% if branchBannerOneWhatsapp %}
{{ theme.settings.branch_banner_button_text }} {{ branchBannerOneWhatsapp }}
{% endif %}
{% endif %} {% endfor %}
{% endif %}
{% endif %} {% if theme.settings.branch_banner_two_status %}
{{ theme.settings.branch_banner_two_title }}
{% if theme.settings.branch_banner_two_title %}
{{ theme.settings.branch_banner_two_title }}
{% endif %} {% if theme.settings.branch_banner_two_status_1 or theme.settings.branch_banner_two_status_2 or theme.settings.branch_banner_two_status_3 or theme.settings.branch_banner_two_status_4 %}
{% for i in 1..4 %} {# --- Marka Class Ataması --- #} {% set brandClass = "" %} {% if i == 1 %}{% set brandClass = "btn-bmw" %}{% endif %} {% if i == 2 %}{% set brandClass = "btn-mercedes" %}{% endif %} {% if i == 3 %}{% set brandClass = "btn-landrover" %}{% endif %} {% if i == 4 %}{% set brandClass = "btn-mini" %}{% endif %} {# --------------------------- #} {% set branchBannerTwoStatus = theme.settings["branch_banner_two_status_" ~ i] %} {% set branchBannerTwoTitle = theme.settings["branch_banner_two_title_" ~ i] %} {% set branchBannerTwoImage = theme.settings["branch_banner_two_image_" ~ i] %} {% set branchBannerTwoWhatsapp = theme.settings["branch_banner_two_whatsapp_" ~ i] %} {% set branchBannerTwoWhatsappText = theme.settings["branch_banner_two_whatsapp_text_" ~ i] %} {% if branchBannerTwoStatus %}
{% if branchBannerTwoTitle %}
{{ branchBannerTwoTitle }}
{% endif %}
{{ branchBannerTwoTitle }}
{% if branchBannerTwoWhatsapp %}
{{ theme.settings.branch_banner_button_text }} {{ branchBannerTwoWhatsapp }}
{% endif %}
{% endif %} {% endfor %}
{% endif %}
{% endif %}
{% endif %} ``` --- ### 2. SCSS En alta animasyonları ekledim ve `.branch-banner-button > a` içerisine, Twig'den gelen sınıfları (`.btn-bmw` vb.) karşılayan kuralları yazdım. ```scss @keyframes parlat-bmw{0%{transform:scale(1);box-shadow:0 0 0 0 rgb(225 6 0 / .8)}70%{transform:scale(1.03);box-shadow:0 0 0 15px #fff0}100%{transform:scale(1);box-shadow:0 0 0 0 #fff0}}@keyframes parlat-mercedes{0%{transform:scale(1);box-shadow:0 0 0 0 rgb(0 123 255 / .8)}70%{transform:scale(1.03);box-shadow:0 0 0 15px #fff0}100%{transform:scale(1);box-shadow:0 0 0 0 #fff0}}@keyframes parlat-landrover{0%{transform:scale(1);box-shadow:0 0 0 0 rgb(0 66 37 / .8)}70%{transform:scale(1.03);box-shadow:0 0 0 15px #fff0}100%{transform:scale(1);box-shadow:0 0 0 0 #fff0}}@keyframes parlat-mini{0%{transform:scale(1);box-shadow:0 0 0 0 rgb(255 193 7 / .8)}70%{transform:scale(1.03);box-shadow:0 0 0 15px #fff0}100%{transform:scale(1);box-shadow:0 0 0 0 #fff0}}.branch-banner-wrapper{>div{row-gap:var(--spacer-16)}.branch-banner-header{@include center;gap:var(--spacer-4);color:$color-text;@include heading-type-5;margin-bottom:var(--spacer-10)}.branch-banner{display:flex;flex-direction:column;gap:var(--spacer-8);height:100%;>a,>.branch-banner-top{flex:0 0 auto;position:relative;overflow:hidden;display:block;@include border-radius(15px);.branch-banner-image{position:relative;overflow:hidden;aspect-ratio:784/500;@include fit;img{transition:$transition}}.branch-banner-title{text-align:center;position:absolute;left:0;bottom:0;width:100%;@include heading-type-6;color:$color-white;padding:var(--spacer-11) var(--spacer-8);background:linear-gradient(360deg,#000000 -24.5%,#fff0 100%)}}>a{@include min($lg){&:hover{.branch-banner-image{img{transform:scale(1.1)}}}}}.branch-banner-bottom-wrapper{flex:1 0 0%;display:flex;flex-wrap:wrap;gap:var(--spacer-8);@include max($lg){@include min($md){gap:var(--spacer-6)}}@include max($xs){justify-content:center}.branch-banner-bottom{flex:1 0 0%;text-align:center;padding:var(--spacer-6) var(--spacer-4);border:2px solid $color-border;@include border-radius(10px);@include max(1550){@include min($md){flex:0 0 calc(50% - var(--spacer-4))}}@include max($xs){flex:0 0 calc(50% - var(--spacer-4))}.branch-banner-title{@include heading-type-4;color:$color-text;margin-bottom:var(--spacer-6)}.branch-banner-image{margin-bottom:var(--spacer-4);>a,>div{position:relative;overflow:hidden;display:block;aspect-ratio:140/94;max-width:140px;margin-inline:auto;@include imgcenter}}.branch-banner-button{border-radius:5px;padding:5px 0;>a{display:flex;align-items:center;flex-direction:column;gap:var(--spacer-3);color:#fff;@include heading-type-2;transition:$transition;padding:15px;border-radius:50px;border:3px solid #fff;width:100%;justify-content:center;svg path{fill:#fff}@include min($lg){&:hover{opacity:.9;color:#fff}}&.btn-bmw{background-color:#e10600!important;animation:parlat-bmw 1.5s infinite}&.btn-mercedes{background-color:#007bff!important;animation:parlat-mercedes 1.5s infinite}&.btn-landrover{background-color:#006400!important;animation:parlat-landrover 1.5s infinite}&.btn-mini{background-color:#ffc107!important;color:#000!important;animation:parlat-mini 1.5s infinite;svg path{fill:#000}}}}}}}}.category-multi-search{position:relative;overflow:hidden;padding:var(--spacer-16);background-color:$color-secondary;@include border-radius(20px);&:before{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background-image:url("{{ themeAsset('images/category-multi-search-area-bg.png') }}");background-size:cover;background-position:center;opacity:.4}.category-multi-search-header{position:relative;text-align:center;display:flex;align-items:center;flex-direction:column;gap:var(--spacer-4);margin-bottom:var(--spacer-10);.category-multi-search-title{color:$color-white;@include heading-type-6}.category-multi-search-sub-title{color:$color-white;@include text-type-4}}.category-multi-search-content{position:relative;max-width:1175px;margin-inline:auto;>div{margin-right:calc(-1 * var(--spacer-5));margin-left:calc(-1 * var(--spacer-5));>div{padding-right:var(--spacer-5);padding-left:var(--spacer-5)}}select{height:52px;color:$color-text;@include heading-type-2;cursor:pointer;padding-inline:var(--spacer-4) calc(20px + var(--spacer-4));margin-bottom:var(--spacer-8);border:1px solid $color-text;border-radius:$border-radius;background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.6923 7.94217L10.4423 14.1922C10.3842 14.2503 10.3153 14.2964 10.2394 14.3278C10.1636 14.3593 10.0822 14.3755 10.0001 14.3755C9.91797 14.3755 9.83664 14.3593 9.76077 14.3278C9.68489 14.2964 9.61596 14.2503 9.55792 14.1922L3.30792 7.94217C3.19064 7.82489 3.12476 7.66583 3.12476 7.49998C3.12476 7.33413 3.19064 7.17507 3.30792 7.05779C3.42519 6.94052 3.58425 6.87463 3.7501 6.87463C3.91596 6.87463 4.07502 6.94052 4.19229 7.05779L10.0001 12.8664L15.8079 7.05779C15.866 6.99972 15.9349 6.95366 16.0108 6.92224C16.0867 6.89081 16.168 6.87463 16.2501 6.87463C16.3322 6.87463 16.4135 6.89081 16.4894 6.92224C16.5653 6.95366 16.6342 6.99972 16.6923 7.05779C16.7504 7.11586 16.7964 7.1848 16.8278 7.26067C16.8593 7.33654 16.8755 7.41786 16.8755 7.49998C16.8755 7.5821 16.8593 7.66342 16.8278 7.73929C16.7964 7.81516 16.7504 7.8841 16.6923 7.94217Z' fill='%23000308'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--spacer-4) center;background-size:20px}.btn{@include center;height:52px;color:$color-white;@include heading-type-3;padding:0 10px;background-color:#001B48;border-radius:$border-radius;margin-bottom:var(--spacer-9);@include min($lg){&:hover{background-color:$color-secondary}}}}}.default-products{margin-bottom:calc(var(--spacer-18) + var(--spacer-19));&.discounted-products{position:relative;padding-block:var(--spacer-25);background-color:$color-sub-text;&:before{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:url("{{ themeAsset(theme.settings.discounted_products_bg_image) }}");background-size:cover;background-position:center;opacity:.3}.products-header{position:relative;color:$color-white}}.products-header{@include center;gap:var(--spacer-4);color:$color-text;@include heading-type-5;margin-bottom:var(--spacer-10)}.products-content{height:0;overflow:hidden;&.slick-slider{height:auto;overflow:visible;.slick-list{padding-block:var(--gutter);margin-inline:calc(-1*var(--gutter))}}>.slick-arrow{position:absolute;opacity:1;top:50%;z-index:2;transform:translateY(-50%);width:32px;height:64px;cursor:pointer;background:#E6E6E6;border-radius:$border-radius;&.slick-prev{left:-48px;@include max(1750){left:0}}&.slick-next{right:-48px;@include max(1750){right:0}}&.slick-disabled{opacity:.5}}>.slick-dots{display:flex;flex-wrap:wrap;justify-content:center;width:100%;padding-top:20px;>li{margin:0 5px;>button{position:relative;overflow:hidden;display:block;width:12px;height:12px;text-indent:-9999px;padding:0;margin-bottom:5px;border:none;border-radius:50%;background-color:$color-border}&.slick-active{>button{background-color:$color-primary}}}}}}.showcase{position:relative;background-color:$color-white;border:1px solid $color-border;padding:var(--spacer-6);border-radius:$border-radius;transition:$transition;@include min($lg){&:hover{border-color:$color-secondary;box-shadow:0 2px 10px 0 rgb(54 50 50 / .1)}}.showcase-image-container{position:relative;a.showcase-label-container{.showcase-label-group{position:absolute;left:0;top:var(--spacer-1);z-index:20;display:flex;flex-direction:column;align-items:flex-start;>div{display:flex;align-items:center;@include heading-type-2;color:#012936;padding:var(--spacer-2) var(--spacer-3);border-radius:$border-radius;margin-bottom:var(--spacer-2);&:last-child{margin-bottom:0}&.discount-label{background-color:#3BD775}&.new-label{background-color:#F5F7F8;border:1px solid #012936}}}.sold-out-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:20;display:flex;align-items:center;height:24px;color:$color-white;padding:0 var(--spacer-2);background-color:$color-text}}}.showcase-favorites{position:absolute;right:0;top:0;z-index:10;>a.add-my-favorites{@include center;width:48px;height:48px;border:1px solid $color-border;background-color:#fff;@include border-radius(50%);transition:$transition;@include svg;.showcase-icon-favori-add{display:none}&.favorite-product{background-color:$color-secondary;border-color:$color-secondary;@include svghover($color-white);.showcase-icon-favori{display:none}.showcase-icon-favori-add{display:block}}@include min($lg){&:hover{background-color:$color-secondary;border-color:$color-secondary;@include svghover($color-white)}}}}.showcase-image{a{position:relative;display:block;overflow:hidden;aspect-ratio:$aspect-ratio;background:$color-white;@include imgcenter}}.showcase-content{padding-top:var(--spacer-6);.showcase-brand{position:relative;overflow:hidden;height:calc(var(--font-size-18) + 8px);margin-bottom:var(--spacer-3);a{display:block;color:$color-secondary;@include heading-type-3}}.showcase-title{margin-bottom:var(--spacer-8);a{overflow:hidden;display:block;height:calc((var(--font-size-16) + 8px) * 2);@include text-type-4;color:$color-text;@include max($sm){height:calc((var(--font-size-16) + 8px) * 3)}}}.showcase-price{display:flex;align-items:baseline;@include max($xlg){@include min($lg){flex-direction:column;align-items:flex-start;justify-content:center;height:calc(var(--font-size-20) + 8px + var(--font-size-20) + 8px)}}@include max($md){flex-direction:column;align-items:flex-start;justify-content:center;height:calc(var(--font-size-20) + 8px + var(--font-size-20) + 8px)}.showcase-price-new{color:$color-text;@include heading-type-4}.showcase-price-old{color:$color-sub-text;@include heading-type-4;text-decoration:line-through;margin-left:var(--spacer-3);@include max($xlg){@include min($lg){margin-left:0}}@include max($md){margin-left:0}}}}}.theme-banner-wrapper{&.theme-banner-double-wrapper{margin-bottom:calc(var(--spacer-14) + var(--spacer-15));.theme-banner{margin-bottom:var(--spacer-8);>a{position:relative;overflow:hidden;display:flex;@include border-radius(10px);@include min($lg){&:hover{.theme-banner-content{border-color:$color-text;@include box-shadow(0,0,0,1px,$color-text,true);.theme-banner-button{color:$color-white;background-color:$color-secondary;border-color:$color-secondary;@include svghover($color-white)}}.theme-banner-image{img{transform:scale(1.05)}}}}@include max($lg){flex-direction:column-reverse}.theme-banner-content{flex:1 0 0%;display:flex;flex-direction:column;gap:var(--spacer-6);padding:var(--spacer-8);background-color:$color-youtube;border:1px solid $color-border;border-right:none;@include border-radius(10px 0 0 10px);transition:$transition;@include max($lg){border-top:none;border-right:1px solid $color-border;@include border-radius(0 0 10px 10px)}.theme-banner-content-top{flex:1 0 0%}.theme-banner-title{position:relative;overflow:hidden;height:calc((var(--font-size-24) + 8px) * 2);@include heading-type-5;color:$color-text;margin-block:var(--spacer-15) var(--spacer-6);@include max($lg){margin-top:0}}.theme-banner-sub-title{position:relative;overflow:hidden;max-height:calc((var(--font-size-16) + 8px) * 3);@include heading-type-2;color:$color-text}.theme-banner-button{display:flex;align-items:center;justify-content:space-between;@include heading-type-3;color:$color-text;padding:var(--spacer-4);background-color:$color-white;border:1px solid #000;border-radius:$border-radius;transition:$transition;@include svg;@include min($lg){&:hover{background-color:$color-secondary-darken;border-color:$color-secondary-darken}}}}.theme-banner-image{flex:0 0 52%;position:relative;overflow:hidden;aspect-ratio:408/400;@include imgcenter;@include fit;img{transition:$transition}@include max($xs){padding-top:100%}}}}}&.theme-banner-single-wrapper{margin-bottom:calc(var(--spacer-18) + var(--spacer-19));.theme-banner{>a{position:relative;overflow:hidden;display:flex;@include border-radius(10px);@include min($lg){&:hover{.theme-banner-content{border-color:$color-text;@include box-shadow(0,0,0,1px,$color-text,true);.theme-banner-button{color:$color-white;background-color:$color-secondary;border-color:$color-secondary;@include svghover($color-white)}}.theme-banner-image{img{transform:scale(1.05)}}}}@include max($sm){flex-direction:column-reverse}.theme-banner-content{flex:1 0 0%;display:flex;flex-direction:column;gap:var(--spacer-8);padding:var(--spacer-11) var(--spacer-8);background-color:$color-youtube;border:1px solid $color-border;border-right:none;@include border-radius(10px 0 0 10px);transition:$transition;@include max($lg){padding:var(--spacer-8)}@include max($sm){border-top:none;border-right:1px solid $color-border;@include border-radius(0 0 10px 10px)}.theme-banner-content-top{flex:1 0 0%}.theme-banner-title{position:relative;overflow:hidden;height:calc(var(--font-size-24) + 8px);@include heading-type-5;color:$color-text;margin-bottom:var(--spacer-5)}.theme-banner-sub-title{position:relative;overflow:hidden;max-height:calc((var(--font-size-16) + 8px) * 7);@include heading-type-2;color:$color-text}.theme-banner-button{display:flex;align-items:center;justify-content:space-between;max-width:313px;@include heading-type-3;color:$color-text;padding:var(--spacer-4);background-color:$color-white;border:1px solid #000;border-radius:$border-radius;transition:$transition;@include svg;@include min($lg){&:hover{background-color:$color-secondary-darken;border-color:$color-secondary-darken}}}}.theme-banner-image{flex:0 0 66%;position:relative;overflow:hidden;aspect-ratio:1056/400;@include imgcenter;@include fit;img{transition:$transition}&:after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(90deg,#fff0 0%,#000000 136.88%)}@include max($lg){flex:0 0 50%}}}}}}#footer{position:relative;background-color:$color-white;&:before{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:url("{{ themeAsset(theme.settings.footer_bg_image) }}");background-size:cover;background-position:center;opacity:.05}.footer-row-1{position:relative;padding-block:var(--spacer-25) var(--spacer-20);>div{display:flex;flex-direction:column;gap:var(--spacer-25);>.row{row-gap:var(--spacer-20)}}}.footer-row-2{position:relative;padding-block:var(--spacer-3);background-color:$color-white}}.shopping-banners{background-image:url("{{ themeAsset('images/shopping-banner-bg-image.png') }}");background-size:cover;background-position:center;padding-block:var(--spacer-10) var(--spacer-2);.shopping-banner{display:block;height:calc(100% - var(--spacer-8));text-align:center;padding:var(--spacer-8) var(--spacer-14);background-color:$color-white;box-shadow:0 2px 10px 0 rgb(54 50 50 / .1);@include border-radius(15px);margin-bottom:var(--spacer-8);@include svghover($color-text);svg{max-width:80px;max-height:80px;margin-bottom:var(--spacer-3)}.shopping-banner-content{.shopping-banner-title{color:$color-text;@include heading-type-3;margin-bottom:var(--spacer-3)}.shopping-banner-sub-title{color:$color-text;@include text-type-3}}@include max($xxs){padding:var(--spacer-8)}}}.newsletter{max-width:467px;margin-bottom:var(--spacer-6);@include max($lg){margin-inline:auto}.newsletter-title{margin-bottom:var(--spacer-6);>div{color:$color-text;@include heading-type-4;margin-bottom:var(--spacer-6)}>span{@include text-type-4}}.newsletter-content{form{position:relative;input{width:100%;height:48px;color:$color-text;@include text-type-3;padding:8px 130px 8px 52px;border:2px solid $color-text;background-color:$color-white;@include border-radius(4px);background-image:url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 4.5H3C2.80109 4.5 2.61032 4.57902 2.46967 4.71967C2.32902 4.86032 2.25 5.05109 2.25 5.25V18C2.25 18.3978 2.40804 18.7794 2.68934 19.0607C2.97064 19.342 3.35218 19.5 3.75 19.5H20.25C20.6478 19.5 21.0294 19.342 21.3107 19.0607C21.592 18.7794 21.75 18.3978 21.75 18V5.25C21.75 5.05109 21.671 4.86032 21.5303 4.71967C21.3897 4.57902 21.1989 4.5 21 4.5ZM19.0716 6L12 12.4828L4.92844 6H19.0716ZM20.25 18H3.75V6.95531L11.4928 14.0531C11.6312 14.1801 11.8122 14.2506 12 14.2506C12.1878 14.2506 12.3688 14.1801 12.5072 14.0531L20.25 6.95531V18Z' fill='%23000308'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 16px center;&::placeholder{color:$color-text;opacity:1}}button{position:absolute;top:0;right:0;@include center;width:120px;height:100%;color:$color-white;@include heading-type-3;padding:0 var(--spacer-3);border:2px solid $color-text;background:$color-secondary;@include border-radius(0 4px 4px 0);transition:$transition;@include min($lg){&:hover{background-color:$color-secondary-darken}}}}}.newsletter-bottom-title{@include text-type-3;color:$color-text;margin-top:var(--spacer-6)}@include max($lg){text-align:center}}.footer-menu-container{.footer-menu{.footer-menu-title{color:$color-text;@include heading-type-4;margin-bottom:var(--spacer-6)}.footer-menu-content{>ul{>li{margin-bottom:var(--spacer-5);&:last-child{margin-bottom:0}>a{display:inline-block;color:$color-text;@include text-type-3;transition:$transition;@include min($lg){&:hover{color:$color-secondary}}}}}}}@include max($sm){text-align:center;&[data-menu-type="accordion"]{text-align:left;.footer-menu{.footer-menu-title{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;cursor:pointer;color:$color-white;padding:var(--spacer-8);margin-bottom:var(--spacer-8);background-color:$color-secondary;border-radius:$border-radius;&:after{content:'\f067';font-size:var(--font-size-12);font-weight:900;font-family:"Font Awesome 5 Free"}}.footer-menu-content{padding:0 var(--spacer-8) var(--spacer-8);display:none;>ul{>li{color:$color-text;>a{color:$color-text}}}}&.active{.footer-menu-title{&:after{content:'\f068'}}.footer-menu-content{display:block}}}}}}.footer-social{.footer-social-title{text-align:center;display:flex;flex-direction:column;gap:var(--spacer-3);margin-bottom:var(--spacer-5);>div{color:$color-text;@include heading-type-4}>span{@include text-type-3}}.footer-social-content{@include center;flex-wrap:wrap;gap:var(--spacer-6);div{a{@include center;width:40px;height:40px;background-color:$color-white;@include border-radius(50%);transition:$transition;@include svg;@include svghover($color-text);@include min($lg){&:hover{background-color:$color-secondary;@include svghover($color-white)}}@include max($xxxs){width:36px;height:36px}}}@include max($xxxs){gap:var(--spacer-4)}}}.copyright{display:flex;align-items:center;gap:var(--spacer-3);@include text-type-3;color:$color-text;@include max($lg){justify-content:center;margin-bottom:var(--spacer-3)}}.footer-ssl{img{max-height:34px}@include max($lg){text-align:center}}@include min($md){.section-sorting-view{display:flex;align-items:center;gap:calc(var(--gutter) * 2);margin-bottom:var(--spacer-8);border:1px solid $color-border;border-radius:$border-radius;padding:0 var(--spacer-4);#filter-wrapper{flex:1 0 0%;#sorting-options{border:none;padding:0;margin-bottom:0}}}.section-container{display:grid;align-items:flex-start;column-gap:calc(var(--gutter) * 2);grid-template-columns:minmax(0,267px) minmax(0,1fr);@include min($xlg){grid-template-columns:minmax(0,376px) minmax(0,1fr)}}}@include max($lg){@include min($md){.section-container{grid-template-columns:minmax(0,216px) minmax(0,1fr)}}}@mixin filter-order-button{align-items:center;gap:var(--spacer-3);>span{display:flex;align-items:center;height:32px;cursor:pointer;svg{path,rect{stroke:$color-text;fill:#fff0;transition:$transition}}&:hover,&.active{svg{path,rect{stroke:$color-text;fill:$color-primary}}}}}.filter-order-button{display:flex;@include filter-order-button;@include max($lg){>span{&[data-selector="quintuple-sorting"],&[data-selector="quadruple-sorting"]{display:none}}}@include max($md){display:none}}.mobile-filter-order-button{display:none;@include filter-order-button;@include max($sm){gap:var(--spacer-6)}}@include max($md){#filter-wrapper{.filter-wrapper-header{display:flex;align-items:center;border:1px solid $color-border;border-radius:$border-radius;>div{position:relative;flex:1 0 0%;display:flex;align-items:center;justify-content:center;height:40px;color:$color-text;font-size:var(--font-size-12);padding-inline:var(--spacer-2);svg{margin-right:var(--spacer-3)}&:nth-child(2),&:nth-child(3){&:after{content:'';position:absolute;left:-1px;top:50%;transform:translateY(-50%);width:1px;height:20px;@include border-radius(2px);background-color:$color-border}}}}}}.showcase-container{display:grid;gap:calc(var(--gutter) * 2);{% set showcaseRepeatColumns=theme.settings.showcase_repeat_columns %}{% if showcaseRepeatColumns==2 %}grid-template-columns:minmax(0,1fr) minmax(0,1fr);{% elseif showcaseRepeatColumns==3 %}grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);{% elseif showcaseRepeatColumns==4 %}grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);{% elseif showcaseRepeatColumns==5 %}grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);{% endif %}&.quintuple-sorting{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)}&.quadruple-sorting{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);.showcase{.showcase-content{.showcase-price{flex-direction:column;align-items:flex-start;justify-content:center;height:calc(var(--font-size-20) + 8px + var(--font-size-20) + 8px);.showcase-price-old{margin-left:0}}}}}&.triple-sorting{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);.showcase{.showcase-content{.showcase-price{@include max($xlg){@include min(1330){flex-direction:row;align-items:baseline;justify-content:flex-start;height:auto;.showcase-price-old{margin-left:var(--spacer-3)}}}@include max($lg){@include min($md){flex-direction:column;align-items:flex-start;justify-content:center;height:calc(var(--font-size-20) + 8px + var(--font-size-20) + 8px);.showcase-price-old{margin-left:0}}}}}}}&.dual-sorting{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}&.single-sorting{grid-template-columns:minmax(0,1fr)}@include max($lg){grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);&.quintuple-sorting,&.quadruple-sorting{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)}}@include max($md){grid-template-columns:minmax(0,1fr) minmax(0,1fr);&.quintuple-sorting,&.quadruple-sorting,&.triple-sorting{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}}.block-item{background:$color-white;margin-bottom:var(--spacer-6);border:1px solid $color-border;border-radius:$border-radius;a{color:$color-text;transition:$transition;&:hover{color:$color-primary}}.block-item-title{display:flex;align-items:center;justify-content:space-between;color:$color-text;@include heading-type-1;padding:var(--spacer-3);border-bottom:1px solid $color-border;background-color:$color-background;>i{display:none;@include max($sm){display:block}}}.block-item-content{padding:var(--spacer-3)}&[data-type="filter-product-groups"]{border:none;.block-item-title{@include heading-type-3;color:$color-text;gap:var(--spacer-2);margin-bottom:var(--spacer-8);border:none;background-color:$color-background;border-radius:$border-radius;i{display:block;width:16px;height:16px;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.3535 8.35375L6.35354 13.3538C6.30708 13.4002 6.25193 13.4371 6.19124 13.4622C6.13054 13.4873 6.06549 13.5003 5.99979 13.5003C5.93409 13.5003 5.86904 13.4873 5.80834 13.4622C5.74764 13.4371 5.69249 13.4002 5.64604 13.3538C5.59958 13.3073 5.56273 13.2521 5.53759 13.1915C5.51245 13.1308 5.49951 13.0657 5.49951 13C5.49951 12.9343 5.51245 12.8693 5.53759 12.8086C5.56273 12.7479 5.59958 12.6927 5.64604 12.6463L10.2929 8L5.64604 3.35375C5.55222 3.25993 5.49951 3.13269 5.49951 3C5.49951 2.86732 5.55222 2.74007 5.64604 2.64625C5.73986 2.55243 5.86711 2.49973 5.99979 2.49973C6.13247 2.49973 6.25972 2.55243 6.35354 2.64625L11.3535 7.64625C11.4 7.69269 11.4369 7.74783 11.4621 7.80853C11.4872 7.86923 11.5002 7.9343 11.5002 8C11.5002 8.06571 11.4872 8.13077 11.4621 8.19147C11.4369 8.25217 11.4 8.30732 11.3535 8.35375Z' fill='white'/%3E%3C/svg%3E");display:none;&:before{content:none}}}.block-item-content{padding:0}}&.active{.block-item-title{>i.fa-angle-down{&:before{content:'\f106';@include min($lg){content:none}}}}}&[data-type="no-frame"]{.block-item-title{display:none}}}@include max($md){.block-item{display:none;padding:0!important;&[data-type="filter-product-groups"]{display:block;margin-bottom:0;border:none;.block-item-title{display:none}.block-item-content{display:block;padding:0}}&[data-type="product-groups"]{display:none}&[data-type=member-menu]{display:block;.block-item-title{border-bottom:none;border-radius:$border-radius;cursor:pointer;i{display:block}}.block-item-content{display:none}&.active{.block-item-title{@include border-radius($border-radius $border-radius 0 0);border-bottom:inherit}.block-item-content{display:block}}}}.filter-menu,.horizontal-filter-menu{position:fixed;width:280px;height:100%;left:-280px;top:0;background:#fff;z-index:100;padding:var(--spacer-4);transition:$transition;overflow-y:auto;-webkit-overflow-scrolling:touch;.filter-menu-category{display:none}}.filter-menu-active{left:280px;overflow:hidden;position:fixed;height:100%;width:100%;.filter-menu,.horizontal-filter-menu{left:0!important}}#filter-wrapper{display:none;margin-bottom:var(--spacer-8);&.has-sorting-option:not(.has-filter-option){display:block;.filter-wrapper-header{display:none}.filter-wrapper-content{#sorting-options{display:block}}}&.has-filter-option{display:block;.filter-wrapper-content{#sorting-options{display:none}}}}.sorting-options-content-active{#filter-wrapper{.filter-wrapper-content{#sorting-options{display:block}}}}}@include min($md){.filter-menu-overlay,.filter-wrapper-header{display:none!important}}.filter-menu{.filter-menu-box{margin-top:var(--spacer-8);margin-bottom:0;border:1px solid $color-border;border-radius:$border-radius;&.filter-menu-category{margin-top:0}&.filter-menu-selected-items{margin-top:0;margin-bottom:var(--spacer-8)}}.filter-menu-category{.filter-menu-category-title{display:flex;align-items:center;justify-content:space-between;gap:var(--spacer-2);color:$color-text;@include heading-type-2;padding:var(--spacer-3);border-bottom:1px solid $color-border;background-color:$color-background;@include border-radius($border-radius $border-radius 0 0);i{display:block;order:2;width:16px;height:16px;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.3535 8.35372L6.35354 13.3537C6.30708 13.4002 6.25193 13.437 6.19124 13.4622C6.13054 13.4873 6.06549 13.5003 5.99979 13.5003C5.93409 13.5003 5.86904 13.4873 5.80834 13.4622C5.74764 13.437 5.69249 13.4002 5.64604 13.3537C5.59958 13.3073 5.56273 13.2521 5.53759 13.1914C5.51245 13.1307 5.49951 13.0657 5.49951 13C5.49951 12.9343 5.51245 12.8692 5.53759 12.8085C5.56273 12.7478 5.59958 12.6927 5.64604 12.6462L10.2929 7.99997L5.64604 3.35372C5.55222 3.2599 5.49951 3.13265 5.49951 2.99997C5.49951 2.86729 5.55222 2.74004 5.64604 2.64622C5.73986 2.5524 5.86711 2.49969 5.99979 2.49969C6.13247 2.49969 6.25972 2.5524 6.35354 2.64622L11.3535 7.64622C11.4 7.69266 11.4369 7.7478 11.4621 7.8085C11.4872 7.8692 11.5002 7.93427 11.5002 7.99997C11.5002 8.06568 11.4872 8.13074 11.4621 8.19144C11.4369 8.25214 11.4 8.30729 11.3535 8.35372Z' fill='%23000308'/%3E%3C/svg%3E");&:before{display:none}}}.filter-menu-category-content{border-bottom:none;a{color:$color-text;@include heading-type-1;padding:var(--spacer-4) var(--spacer-6);border-bottom:1px solid $color-border;transition:$transition;&:hover{color:$color-primary}i{display:none}}}.filter-menu-category-top{a{justify-content:flex-start;color:$color-text;@include heading-type-2;padding:var(--spacer-4) var(--spacer-6);background-color:$color-background;@include border-radius(0 0 $border-radius $border-radius);transition:$transition;i{@include center;width:20px;height:20px;background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.9422 15.8078C13.0003 15.8659 13.0463 15.9348 13.0777 16.0107C13.1092 16.0865 13.1254 16.1679 13.1254 16.25C13.1254 16.3321 13.1092 16.4134 13.0777 16.4893C13.0463 16.5652 13.0003 16.6341 12.9422 16.6922C12.8841 16.7502 12.8152 16.7963 12.7393 16.8277C12.6634 16.8592 12.5821 16.8753 12.5 16.8753C12.4179 16.8753 12.3366 16.8592 12.2607 16.8277C12.1848 16.7963 12.1159 16.7502 12.0578 16.6922L5.80782 10.4422C5.74971 10.3841 5.70361 10.3152 5.67215 10.2393C5.6407 10.1634 5.62451 10.0821 5.62451 9.99998C5.62451 9.91785 5.6407 9.83652 5.67215 9.76064C5.70361 9.68477 5.74971 9.61584 5.80782 9.55779L12.0578 3.30779C12.1751 3.19052 12.3342 3.12463 12.5 3.12463C12.6659 3.12463 12.8249 3.19052 12.9422 3.30779C13.0595 3.42507 13.1254 3.58413 13.1254 3.74998C13.1254 3.91583 13.0595 4.07489 12.9422 4.19217L7.1336 9.99998L12.9422 15.8078Z' fill='%23000308'/%3E%3C/svg%3E");margin-right:var(--spacer-2);&:before{content:none}}}}}.filter-menu-groups{.filter-menu-group-title{color:$color-text;@include heading-type-2;padding:var(--spacer-3);border-bottom:1px solid $color-border;background-color:$color-background}.filter-menu-group-content{padding:0;.checkbox-custom{padding:8px 12px;margin-bottom:0}label{line-height:22px;color:$color-text;font-size:var(--font-size-14);font-weight:500;transition:$transition;&:hover{color:$color-primary}}.filter-menu-box-image{padding:1rem 12px 0;.filter-menu-image-checkbox{input[type=checkbox]{+label{border:none;transition:$transition;&:hover{opacity:.6}}}img{max-width:100%;max-height:100%}}}input[type=checkbox]{&+label{line-height:22px;color:$color-text;font-size:var(--font-size-14);font-weight:500;padding-left:28px;&:before{width:20px;height:20px;border:2px solid $color-text;@include border-radius(2px);top:1px}}&:checked{&+label{color:$color-primary;&:before{background-image:none;border-color:$color-primary;background-color:$color-white}&:after{content:'';position:absolute;left:7px;top:3px;display:inline-block;width:6px;height:12px;border-bottom:2px solid $color-primary;border-right:2px solid $color-primary;transform:rotate(45deg)}}}}.scrollbar-inner{max-height:152px;>.scroll-element{width:4px;box-sizing:border-box;div{box-sizing:border-box}.scroll-element_track{background-color:$color-background}.scroll-bar{background-color:$color-primary}.scroll-bar,.scroll-element_track,.scroll-element_outer{opacity:1;@include border-radius(0)}&:hover,&.scroll-draggable{.scroll-bar{background-color:$color-primary-darken}}&.scroll-y{right:0}}}}}.filter-menu-selected-items{.filter-menu-selected-items-title{color:$color-text;@include heading-type-2;padding:var(--spacer-3);border-bottom:1px solid $color-border;background-color:$color-background}.filter-menu-selected-items-content{padding:var(--spacer-3);.filter-menu-selected-group{margin-bottom:var(--spacer-8);.filter-menu-selected-group-title{color:$color-text;@include heading-type-1;margin-bottom:var(--spacer-2)}.filter-menu-selected-group-content{.filter-menu-selected-item{margin-bottom:var(--spacer-3);a{color:$color-text;@include heading-type-1;padding:var(--spacer-3);background:#fff0;border:1px solid $color-border;@include border-radius(2px);gap:var(--spacer-2);i{flex:0 0 24px;height:24px;background-image:url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.5 3H4.5C4.10218 3 3.72064 3.15804 3.43934 3.43934C3.15804 3.72064 3 4.10218 3 4.5V19.5C3 19.8978 3.15804 20.2794 3.43934 20.5607C3.72064 20.842 4.10218 21 4.5 21H19.5C19.8978 21 20.2794 20.842 20.5607 20.5607C20.842 20.2794 21 19.8978 21 19.5V4.5C21 4.10218 20.842 3.72064 20.5607 3.43934C20.2794 3.15804 19.8978 3 19.5 3ZM19.5 19.5H4.5V4.5H19.5V19.5ZM15.5306 9.53063L13.0603 12L15.5306 14.4694C15.6003 14.5391 15.6556 14.6218 15.6933 14.7128C15.731 14.8039 15.7504 14.9015 15.7504 15C15.7504 15.0985 15.731 15.1961 15.6933 15.2872C15.6556 15.3782 15.6003 15.4609 15.5306 15.5306C15.4609 15.6003 15.3782 15.6556 15.2872 15.6933C15.1961 15.731 15.0985 15.7504 15 15.7504C14.9015 15.7504 14.8039 15.731 14.7128 15.6933C14.6218 15.6556 14.5391 15.6003 14.4694 15.5306L12 13.0603L9.53063 15.5306C9.46094 15.6003 9.37822 15.6556 9.28717 15.6933C9.19613 15.731 9.09855 15.7504 9 15.7504C8.90145 15.7504 8.80387 15.731 8.71283 15.6933C8.62178 15.6556 8.53906 15.6003 8.46937 15.5306C8.39969 15.4609 8.34442 15.3782 8.3067 15.2872C8.26899 15.1961 8.24958 15.0985 8.24958 15C8.24958 14.9015 8.26899 14.8039 8.3067 14.7128C8.34442 14.6218 8.39969 14.5391 8.46937 14.4694L10.9397 12L8.46937 9.53063C8.32864 9.38989 8.24958 9.19902 8.24958 9C8.24958 8.80098 8.32864 8.61011 8.46937 8.46937C8.61011 8.32864 8.80098 8.24958 9 8.24958C9.19902 8.24958 9.38989 8.32864 9.53063 8.46937L12 10.9397L14.4694 8.46937C14.5391 8.39969 14.6218 8.34442 14.7128 8.3067C14.8039 8.26899 14.9015 8.24958 15 8.24958C15.0985 8.24958 15.1961 8.26899 15.2872 8.3067C15.3782 8.34442 15.4609 8.39969 15.5306 8.46937C15.6003 8.53906 15.6556 8.62178 15.6933 8.71283C15.731 8.80387 15.7504 8.90145 15.7504 9C15.7504 9.09855 15.731 9.19613 15.6933 9.28717C15.6556 9.37822 15.6003 9.46094 15.5306 9.53063Z' fill='%23880911'/%3E%3C/svg%3E");&:before{display:none}}}}}}}}}.horizontal-filter-menu{margin-bottom:var(--spacer-5);.horizontal-filter-menu-title{line-height:20px;color:$color-text;font-size:var(--font-size-16);font-weight:600;margin-bottom:var(--spacer-5);@include max($md){display:none}}.horizontal-filter-menu-content{padding:var(--spacer-4);padding-bottom:0;margin-bottom:var(--spacer-5);border:1px solid $color-border;border-radius:$border-radius;background-color:$color-white;@include max($md){display:flex;flex-direction:column-reverse;padding:0;border:none}}.filter-menu-groups-wrapper{@include min($md){display:flex;flex-wrap:wrap;margin-right:calc(-1*var(--gutter));margin-left:calc(-1*var(--gutter))}@include max($md){padding:var(--spacer-4);border:1px solid $color-border}}.filter-menu-groups{padding-right:var(--gutter);padding-left:var(--gutter);@include max($md){flex:0 0 100%;padding:0}.filter-menu-group-selectbox{position:relative;margin-bottom:var(--spacer-4);>a{display:flex;align-items:center;justify-content:space-between;height:44px;line-height:20px;color:$color-text;font-size:var(--font-size-14);font-weight:400;padding:4px 4px 4px 16px;border-radius:$border-radius;border:1px solid $color-border;background-color:#fff;span{padding-right:16px}@include max($md){font-size:var(--font-size-16);font-weight:600;pointer-events:none;padding:4px 0;border:none;border-bottom:1px solid $color-border;svg{display:none}}}.filter-menu-group-selectbox-content{position:absolute;top:calc(100% - 1px);left:0;z-index:101;overflow:auto;display:none;width:220px;max-height:174px;padding:var(--spacer-4);background-color:#fff;border-radius:$border-radius;border:1px solid $color-border;&::-webkit-scrollbar{width:5px}&::-webkit-scrollbar-track{background:lighten($color-border,5%)}&::-webkit-scrollbar-thumb{background:darken($color-border,5%)}@include max($md){position:static;top:0;display:block;width:100%;padding-left:0;border:none;border-radius:0;margin-top:var(--spacer-4)}>div>a{position:relative;display:block;line-height:20px;color:$color-text;font-size:var(--font-size-14);padding-left:36px;margin-bottom:var(--spacer-5);transition:$transition;span{color:$color-sub-text;padding-left:4px}&:last-child{margin-bottom:0}&:after{content:'';position:absolute;left:0;top:0;width:20px;height:20px;border-radius:$border-radius;border:1px solid $color-border;background-color:#fff;transition:$transition}&:before{content:'';position:absolute;left:7px;top:2px;z-index:1;opacity:0;visibility:hidden;display:inline-block;width:6px;height:12px;border-bottom:2px solid $color-primary;border-right:2px solid $color-primary;transform:rotate(45deg);transition:$transition}&:hover,&.checked{color:$color-primary;span{color:$color-primary}&:after{border-color:$color-primary}&:before{opacity:1;visibility:visible}}}}>a.active+.filter-menu-group-selectbox-content{display:block}}}.filter-menu-selected-items{@include min($md){display:flex;align-items:center;flex-wrap:wrap;>div{margin-right:var(--spacer-4);&:last-child{margin-right:0}}}@include max($md){display:flex;flex-direction:column;>div{margin-bottom:var(--spacer-4);&.clear-filters{order:1}&.filter-menu-selected-group{order:2}}}.filter-menu-selected-group{@include min($md){display:flex;align-items:center;flex-wrap:wrap}.filter-menu-selected-item{@include min($md){margin-bottom:var(--spacer-4);margin-right:var(--spacer-4);&:last-child{margin-right:0}}a{display:flex;align-items:center;line-height:20px;color:$color-text;font-size:var(--font-size-14);font-weight:400;background-color:#fff;border-radius:$border-radius;border:1px solid $color-border;transition:$transition;svg{path{transition:$transition}}span{position:relative;margin:0 12px;&:after{content:'';position:absolute;left:0;right:0;top:50%;transform:translateY(-51%);width:0;height:1px;margin:0 auto;background-color:$color-primary;transition:$transition}}i{@include center;width:34px;height:34px;background-color:$color-background;border-right:1px solid $color-border}&:hover{color:$color-primary;svg{path{stroke:$color-primary}}span{&:after{width:100%}}}}}}.clear-filters{margin-left:var(--spacer-2);margin-bottom:var(--spacer-4);@include max($md){display:flex;align-items:center;justify-content:space-between}>span{line-height:20px;color:$color-text;font-size:var(--font-size-16);font-weight:600;@include min($md){display:none}}@include max($md){margin-left:0}a{display:flex;align-items:center;height:36px;line-height:20px;color:$color-text;font-size:var(--font-size-14);font-weight:400;transition:$transition;&:hover{color:$color-primary}@include max($md){color:$color-primary;font-weight:600}}}}}#sorting-options{margin-bottom:var(--spacer-8);@include min($md){background:$color-white;border:1px solid $color-border;padding:var(--spacer-5) var(--spacer-4)}.row{align-items:center}select.form-control:not([size]):not([multiple]),select:not([size]){height:48px;color:$color-text;font-size:var(--font-size-14);font-weight:500;cursor:pointer;padding:4px 46px 4px 24px;border:none;@include border-radius(0);background-size:20px;background-position:right 26px center;background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.692 7.9422L10.442 14.1922C10.384 14.2503 10.3151 14.2964 10.2392 14.3279C10.1633 14.3593 10.082 14.3755 9.99986 14.3755C9.91772 14.3755 9.8364 14.3593 9.76052 14.3279C9.68465 14.2964 9.61572 14.2503 9.55767 14.1922L3.30767 7.9422C3.1904 7.82492 3.12451 7.66586 3.12451 7.50001C3.12451 7.33416 3.1904 7.1751 3.30767 7.05782C3.42495 6.94055 3.58401 6.87466 3.74986 6.87466C3.91571 6.87466 4.07477 6.94055 4.19205 7.05782L9.99986 12.8664L15.8077 7.05782C15.8657 6.99976 15.9347 6.95369 16.0105 6.92227C16.0864 6.89084 16.1677 6.87466 16.2499 6.87466C16.332 6.87466 16.4133 6.89084 16.4892 6.92227C16.565 6.95369 16.634 6.99976 16.692 7.05782C16.7501 7.11589 16.7962 7.18483 16.8276 7.2607C16.859 7.33657 16.8752 7.41789 16.8752 7.50001C16.8752 7.58213 16.859 7.66345 16.8276 7.73932C16.7962 7.81519 16.7501 7.88413 16.692 7.9422Z' fill='%23363232'/%3E%3C/svg%3E");@include min($lg){min-width:212px!important}}.record-count{line-height:22px;color:$color-text;font-size:var(--font-size-14);font-weight:500}.checkbox-custom{line-height:24px;input[type=checkbox]{&+label{line-height:24px;color:$color-text;font-size:var(--font-size-14);font-weight:500;padding-left:34px;&:before{width:24px;height:24px;border:2px solid $color-text;@include border-radius(2px)}}&:checked{&+label{&:before{background-image:none;border-color:$color-primary;background-color:$color-white}&:after{content:'';position:absolute;left:9px;top:4px;display:inline-block;width:6px;height:12px;border-bottom:2px solid $color-primary;border-right:2px solid $color-primary;transform:rotate(45deg)}}}}}}.product-category-and-brand-list{margin-bottom:var(--spacer-4);.product-category-and-brand-list-header{line-height:20px;color:$color-text;font-size:var(--font-size-16);font-weight:600;margin-bottom:var(--spacer-5)}.product-category-and-brand-list-content{padding:var(--spacer-4) var(--spacer-4) 0;background-color:$color-white;border:1px solid $color-border;border-radius:$border-radius;>div{display:flex;flex-wrap:wrap;margin-right:calc(-1*var(--gutter));margin-left:calc(-1*var(--gutter));>div{flex:0 0 auto;max-width:none;padding-right:var(--gutter);padding-left:var(--gutter);margin-bottom:var(--spacer-4);>a{display:flex;align-items:center;height:40px;line-height:20px;color:$color-text;font-size:var(--font-size-14);font-weight:400;padding:0 var(--spacer-5);background-color:$color-white;border:1px solid $color-border;transition:$transition;border-radius:$border-radius;span{color:$color-sub-text;font-weight:500}&:hover{border-color:$color-primary;background-color:$color-white}}}&.product-category-and-brand-list-content-image{margin-right:calc(-1*var(--gutter));margin-left:calc(-1*var(--gutter));>div{flex:0 0 calc(100% / 7);max-width:calc(100% / 7);padding-right:var(--gutter);padding-left:var(--gutter);@include max($lg){flex:0 0 calc(100% / 5);max-width:calc(100% / 5)}@include max($md){flex:0 0 calc(100% / 4);max-width:calc(100% / 4)}@include max($sm){flex:0 0 calc(100% / 3);max-width:calc(100% / 3)}@include max($xxs){flex:0 0 calc(100% / 2);max-width:calc(100% / 2)}>a{display:block;height:100%;text-align:center;padding:var(--spacer-3);.product-list-image{position:relative;overflow:hidden;aspect-ratio:$aspect-ratio;margin-bottom:var(--spacer-3);@include imgcenter}}}}{% if theme.settings.display_category_brands_logo_mobile %}@include max($lg){flex-wrap:nowrap;overflow-x:auto}&.product-category-and-brand-list-content-image{>div{@include max($lg){flex:0 0 calc(100% / 5.5);max-width:calc(100% / 5.5)}@include max($md){flex:0 0 calc(100% / 4.5);max-width:calc(100% / 4.5)}@include max($sm){flex:0 0 calc(100% / 3.5);max-width:calc(100% / 3.5)}@include max($xxs){flex:0 0 calc(100% / 2.5);max-width:calc(100% / 2.5)}}}{% endif %}}}}.cascade-menu{.parent-item{a.selected-item{color:$color-primary}}}@include min($md){#sorting-options{select.form-control:not([size]):not([multiple]),select:not([size]){min-width:160px}}}.paginate-wrapper{position:relative;padding-top:var(--spacer-14);.paginate{display:flex;justify-content:center;@include max($sm){justify-content:space-between}a{display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;color:$color-text;@include heading-type-3;background:$color-background;border:none;@include border-radius(4px);margin-inline:calc(var(--spacer-3) / 2);@include max($sm){min-width:32px;height:32px}@include max($xs){min-width:28px;height:28px;margin:0 var(--spacer-1)}@include max($xxxs){min-width:24px;height:24px}}.paginate-content{display:flex}.paginate-left{a{i{width:10px;height:18px;background-image:url("data:image/svg+xml,%3Csvg width='10' height='18' viewBox='0 0 10 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.53073 15.9693C9.60041 16.039 9.65568 16.1217 9.6934 16.2128C9.73111 16.3038 9.75052 16.4014 9.75052 16.4999C9.75052 16.5985 9.73111 16.6961 9.6934 16.7871C9.65568 16.8781 9.60041 16.9609 9.53073 17.0306C9.46104 17.1002 9.37832 17.1555 9.28727 17.1932C9.19623 17.2309 9.09865 17.2503 9.0001 17.2503C8.90156 17.2503 8.80397 17.2309 8.71293 17.1932C8.62188 17.1555 8.53916 17.1002 8.46948 17.0306L0.969476 9.53055C0.899744 9.4609 0.844425 9.37818 0.806682 9.28713C0.768939 9.19608 0.749512 9.09849 0.749512 8.99993C0.749512 8.90137 0.768939 8.80377 0.806682 8.71272C0.844425 8.62168 0.899744 8.53896 0.969476 8.4693L8.46948 0.969304C8.61021 0.828573 8.80108 0.749512 9.0001 0.749512C9.19912 0.749512 9.39 0.828573 9.53073 0.969304C9.67146 1.11003 9.75052 1.30091 9.75052 1.49993C9.75052 1.69895 9.67146 1.88982 9.53073 2.03055L2.56041 8.99993L9.53073 15.9693Z' fill='%23000308'/%3E%3C/svg%3E");&:before{display:none}}}}.paginate-right{a{i{width:10px;height:18px;background-image:url("data:image/svg+xml,%3Csvg width='10' height='18' viewBox='0 0 10 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.03055 9.53055L1.53055 17.0306C1.46087 17.1002 1.37815 17.1555 1.2871 17.1932C1.19606 17.2309 1.09847 17.2503 0.999929 17.2503C0.901383 17.2503 0.803801 17.2309 0.712756 17.1932C0.621712 17.1555 0.538986 17.1002 0.469303 17.0306C0.399621 16.9609 0.344345 16.8781 0.306633 16.7871C0.268921 16.6961 0.249512 16.5985 0.249512 16.4999C0.249512 16.4014 0.268921 16.3038 0.306633 16.2128C0.344345 16.1217 0.399621 16.039 0.469303 15.9693L7.43962 8.99993L0.469303 2.03055C0.328573 1.88982 0.249512 1.69895 0.249512 1.49993C0.249512 1.30091 0.328573 1.11003 0.469303 0.969304C0.610034 0.828573 0.800906 0.749512 0.999929 0.749512C1.19895 0.749512 1.38982 0.828573 1.53055 0.969304L9.03055 8.4693C9.10029 8.53896 9.15561 8.62168 9.19335 8.71272C9.23109 8.80377 9.25052 8.90137 9.25052 8.99993C9.25052 9.09849 9.23109 9.19608 9.19335 9.28713C9.15561 9.37818 9.10029 9.4609 9.03055 9.53055Z' fill='%23000308'/%3E%3C/svg%3E");&:before{display:none}}}}.paginate-passive{a{opacity:.5}}.paginate-active{a{}}.paginate-element-active{color:$color-white;background:$color-secondary}}}#breadcrumbs{margin-bottom:var(--spacer-3);padding-bottom:var(--spacer-3);@include max($lg){overflow-x:auto;scroll-snap-type:x mandatory}ol{display:flex;align-items:center;padding:0;margin:0;li{i{width:20px;height:20px;background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.1925 10.4422L7.94254 16.6922C7.88447 16.7503 7.81553 16.7963 7.73966 16.8278C7.66379 16.8592 7.58247 16.8754 7.50035 16.8754C7.41823 16.8754 7.33691 16.8592 7.26104 16.8278C7.18517 16.7963 7.11623 16.7503 7.05816 16.6922C7.00009 16.6341 6.95403 16.5652 6.9226 16.4893C6.89117 16.4135 6.875 16.3321 6.875 16.25C6.875 16.1679 6.89117 16.0866 6.9226 16.0107C6.95403 15.9348 7.00009 15.8659 7.05816 15.8078L12.8668 10L7.05816 4.1922C6.94088 4.07492 6.875 3.91586 6.875 3.75001C6.875 3.58416 6.94088 3.4251 7.05816 3.30782C7.17544 3.19055 7.3345 3.12466 7.50035 3.12466C7.6662 3.12466 7.82526 3.19055 7.94254 3.30782L14.1925 9.55782C14.2506 9.61587 14.2967 9.6848 14.3282 9.76067C14.3597 9.83655 14.3758 9.91788 14.3758 10C14.3758 10.0821 14.3597 10.1635 14.3282 10.2393C14.2967 10.3152 14.2506 10.3842 14.1925 10.4422Z' fill='%23171717'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:50%;margin:0 var(--spacer-3)}span{display:flex;align-items:center;white-space:nowrap;line-height:24px;color:$color-text;font-size:var(--font-size-16);font-weight:600}a{color:$color-text}&:last-child{span{span{color:$color-secondary}}}}}}.product-left,.product-right{margin-bottom:var(--spacer-25)}.product-right{display:flex;flex-direction:column;height:calc(100% - var(--spacer-25))}.product-left-grid{&:not(:last-child){margin-bottom:var(--spacer-6)}@include min($md){display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr;grid-template-rows:1fr;gap:0 var(--spacer-8);grid-template-areas:"first second second second second second second"}@include max($md){display:flex;flex-direction:column;gap:var(--spacer-8)}}.product-left-grid-first{grid-area:first;@include min($md){margin-bottom:calc(-1*var(--spacer-8))}@include max($md){order:2}}.product-left-grid-second{grid-area:second;@include max($md){order:1}}.product-label-group{position:absolute;left:10px;top:10px;z-index:20;display:flex;flex-direction:column;align-items:flex-start;>div{display:flex;align-items:center;@include heading-type-2;color:#012936;padding:var(--spacer-2) var(--spacer-3);border-radius:$border-radius;&.new-label{background-color:#F5F7F8;border:1px solid #012936}@include max($sm){height:20px;padding:0 6px}}@include max($sm){left:5px;top:5px}}.product-image{#product-primary-image{position:relative;overflow:hidden;aspect-ratio:$aspect-ratio;border:1px solid $color-border;border-radius:$border-radius;@include imgcenter;@include max($md){margin-bottom:var(--spacer-4)}}}.zoomContainer{overflow:hidden;border-radius:$border-radius}#product-thumb-image{height:0;overflow:hidden;&.slick-slider{height:auto;overflow:visible;@include max($sm){padding-right:2px}}.thumb-item{&:not(:last-child){margin-bottom:var(--spacer-6)}>a{position:relative;overflow:hidden;display:block;aspect-ratio:$aspect-ratio;border:1px solid $color-border;border-radius:$border-radius;@include imgcenter;&:after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;@include box-shadow(0,0,0,0,$color-secondary,inset);@include border-radius(4px);transition:$transition}&.zoomGalleryActive{border-color:$color-secondary;&:after{@include box-shadow(0,0,0,1px,$color-secondary,inset)}}}}.slick-dots{display:flex;justify-content:center;flex-wrap:wrap;padding-top:var(--spacer-8);width:100%;>li{margin:0 3px;>button{width:10px;height:10px;border:none;position:relative;overflow:hidden;text-indent:-9999px;border-radius:100%;background-color:$color-border;padding:0;display:block;margin-bottom:5px;transition:$transition}&.slick-active{>button{background-color:$color-primary}}}}.slick-arrow{position:absolute;opacity:1;top:50%;z-index:2;transform:translateY(-50%);width:40px;height:40px;cursor:pointer;background:$color-white;&.slick-prev{left:12px}&.slick-next{right:12px}&.slick-disabled{opacity:.5}}}.product-list-group{flex:0 0 auto;padding:var(--spacer-8);border:1px solid $color-border;border-bottom:none;@include border-radius($border-radius $border-radius 0 0);&.product-list-group-last{flex:1 0 0%;border-bottom:1px solid $color-border;@include border-radius(0 0 $border-radius $border-radius)}}.product-brand{margin-bottom:var(--spacer-3);a{color:$color-secondary;@include heading-type-3;transition:$transition;@include min($lg){&:hover{color:$color-primary}}}&.product-brand-image{padding-top:10px;a{position:relative;display:block;width:120px;height:50px;border:1px solid $color-border;border-radius:$border-radius;transition:$transition;@include imgcenter;img{max-width:80%;max-height:80%}&:hover{border-color:$color-primary}}}}.product-title{max-width:480px;h1{color:$color-text;@include heading-type-4;margin-bottom:0}}.product-price-and-lowest-price{display:flex;align-items:center;margin-bottom:var(--spacer-8);.product-lowest-price{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:var(--spacer-4);@include text-type-4;color:$color-text;span{@include min($xlg){width:164px}}}@include max($xlg){flex-direction:column;align-items:start;gap:var(--spacer-6)}}.product-price{flex:1 0 0%;.product-price-content{display:flex;align-items:center}.product-price-new{color:$color-text;@include heading-type-5}.product-price-old{color:$color-sub-text;@include heading-type-4;text-decoration:line-through;padding-left:var(--spacer-3)}.discount-label{display:inline-flex;align-items:center;justify-content:center;color:$color-text;@include heading-type-2;background-color:#F5F6FA;border:1px solid $color-text;padding:var(--spacer-2) var(--spacer-3);border-radius:$border-radius;margin-bottom:var(--spacer-4)}}.product-list-container{margin-bottom:var(--spacer-8);.product-list-row{display:flex;align-items:baseline;font-size:var(--font-size-14);padding:3px 0;a{color:$color-text;transition:$transition;&:hover{color:$color-primary}}.product-list-title{flex:0 0 auto;width:20%;color:$color-text;@include max($sm){width:30%}}.product-list-content{flex:1 1 auto;display:flex;align-items:baseline;word-break:break-word;color:$color-text;&:before{content:':';margin-right:16px}}}}.product-options{.variant-group-title{display:block;color:$color-text;@include heading-type-2;margin-bottom:var(--spacer-4)}select.form-control:not([size]):not([multiple]),select:not([size]){height:48px;color:$color-text;@include heading-type-1;cursor:pointer;padding:6px 36px 6px 16px;border:1px solid $color-border;background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.6925 7.94217L10.4425 14.1922C10.3845 14.2503 10.3156 14.2964 10.2397 14.3278C10.1638 14.3593 10.0825 14.3755 10.0003 14.3755C9.91821 14.3755 9.83688 14.3593 9.76101 14.3278C9.68514 14.2964 9.61621 14.2503 9.55816 14.1922L3.30816 7.94217C3.19088 7.82489 3.125 7.66583 3.125 7.49998C3.125 7.33413 3.19088 7.17507 3.30816 7.05779C3.42544 6.94052 3.5845 6.87463 3.75035 6.87463C3.9162 6.87463 4.07526 6.94052 4.19253 7.05779L10.0003 12.8664L15.8082 7.05779C15.8662 6.99972 15.9352 6.95366 16.011 6.92224C16.0869 6.89081 16.1682 6.87463 16.2503 6.87463C16.3325 6.87463 16.4138 6.89081 16.4897 6.92224C16.5655 6.95366 16.6345 6.99972 16.6925 7.05779C16.7506 7.11586 16.7967 7.1848 16.8281 7.26067C16.8595 7.33654 16.8757 7.41786 16.8757 7.49998C16.8757 7.5821 16.8595 7.66342 16.8281 7.73929C16.7967 7.81516 16.7506 7.8841 16.6925 7.94217Z' fill='%23000308'/%3E%3C/svg%3E");background-size:20px;background-position:right 16px center;@include border-radius(4px)}.variant-plural{margin-bottom:var(--spacer-4)}}.variant-select{margin-bottom:var(--spacer-6);.variant-list{margin-bottom:var(--spacer-4);&:last-child{margin-bottom:0}select{width:200px!important;@include max($xs){width:100%!important}}}}.variant-plural{.variant-list{flex:0 0 100%;display:flex;flex-wrap:wrap}span{position:relative;flex:0 0 auto;cursor:pointer;padding:7px 10px;margin:0 var(--spacer-4) var(--spacer-4) 0;border:1px solid $color-border;background-color:$color-white;border-radius:$border-radius;transition:$transition;&:last-child{margin-right:0}&:hover,&.variant-selected{border-color:$color-text}&.variant-selected{&:before{content:'\f00c';position:absolute;right:-8px;top:-8px;z-index:1;width:16px;height:16px;@include center;color:$color-white;font-size:9px;font-weight:900;font-family:"Font Awesome 5 Free";padding-top:1px;background-color:$color-primary;border-radius:100%}}&.variant-passive,&.variant-no-stock,&.variant-passive:hover,&.variant-no-stock:hover{cursor:no-drop;background-color:$color-border}&.variant-image{max-width:32px;max-height:32px;padding:0;border:none;&:hover,&.variant-selected{border:none}&:hover{opacity:.6}&.variant-passive{opacity:.4;background-color:#fff0}}}}.variant-singular{margin-bottom:var(--spacer-4);.radio-custom{margin-bottom:var(--spacer-4)}}.product-cart-buttons{display:flex;flex-wrap:wrap;gap:var(--spacer-4);max-width:565px;margin-bottom:var(--spacer-10);>div{flex:1 0 0%;max-width:none;&.product-qty{flex:0 0 200px;max-width:200px;margin-right:var(--spacer-2);@include max($xlg){@include min($lg){flex:0 0 120px;max-width:120px;margin-right:0}}}&.product-get-information{flex:0 0 132px;max-width:132px}}@include max($lg){@include min($md){>div{&.product-qty{flex:0 0 100%;max-width:100%;margin-right:0}}}}@include max($sm){>div{&.product-qty{flex:0 0 100%;max-width:100%;margin-right:0}}}}.product-qty{position:relative;height:48px;@include max($lg){width:100%}@include max($md){width:100px}>a{position:absolute;top:0;z-index:1;display:flex;align-items:center;width:36px;height:100%;&.product-qty-minus{left:0;justify-content:flex-end}&.product-qty-plus{right:0}}input{width:100%;height:100%;color:$color-text;@include heading-type-2;text-align:center;padding:0;border:1px solid $color-border;background-color:$color-white;border-radius:$border-radius}select.form-control:not([size]):not([multiple]),select:not([size]){height:100%;color:$color-text;@include line-rule(16);font-weight:600;cursor:pointer;padding:6px 36px 6px 12px;border:1px solid $color-border;border-radius:$border-radius;background-color:$color-white;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.64645 4.64645C1.84171 4.45118 2.15829 4.45118 2.35355 4.64645L8 10.2929L13.6464 4.64645C13.8417 4.45118 14.1583 4.45118 14.3536 4.64645C14.5488 4.84171 14.5488 5.15829 14.3536 5.35355L8.35355 11.3536C8.15829 11.5488 7.84171 11.5488 7.64645 11.3536L1.64645 5.35355C1.45118 5.15829 1.45118 4.84171 1.64645 4.64645Z' fill='black'/%3E%3C/svg%3E%0A");background-size:16px}}.product-cart-buttons{a.add-to-cart-button,a.no-stock-button,a.get-information,a.remind-me-button{@include center;height:48px;@include heading-type-3;text-align:center;padding:0 var(--spacer-4);transition:$transition;border-radius:$border-radius}a.add-to-cart-button,a.remind-me-button{color:$color-white;background-color:$color-secondary;@include min($lg){&:hover{background-color:$color-secondary-darken}}}a.get-information{color:$color-white;background-color:$color-sub-text;@include min($lg){&:hover{background-color:$color-text}}}a.no-stock-button{color:$color-white;background-color:$color-fifth}}.product-whatsapp{margin-bottom:var(--spacer-8);>a{display:flex;align-items:center;max-width:529px;color:#01202A;background-color:$color-whatsapp;padding:var(--spacer-5) var(--spacer-10);@include border-radius(15px);transition:$transition;div{flex:1 0 0%;display:flex;flex-direction:column;gap:var(--spacer-3);padding-left:var(--spacer-10);>span{@include heading-type-2;&:first-child{@include heading-type-5}}}@include min($lg){&:hover{background-color:darken($color-whatsapp,$percentage-ratio)}}}}#product-user-buttons{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacer-6) var(--spacer-10);>div{a{display:flex;align-items:center;flex-wrap:wrap;color:$color-text;@include heading-type-1;transition:$transition;>div{@include center;width:40px;height:40px;background-color:$color-background;@include border-radius(50%);transition:$transition}@include svg;span{padding-left:var(--spacer-4)}@include min($lg){&:hover{color:$color-secondary;>div{background-color:$color-secondary}@include svghover($color-white)}}&.add-my-favorites{span{&:before{content:attr(data-add-to-favorites)}}.icon-favori-add{display:none}&.favorite-product{.icon-favori{display:none}.icon-favori-add{display:flex;background-color:$color-secondary;transition:$transition;@include svghover($color-white)}span{&:before{content:attr(data-favorite-product)}}@include min($lg){&:hover{.icon-favori-add{background-color:$color-secondary;@include svghover($color-white)}}}}}}}}.product-social{position:relative;>a{svg{path{transition:$transition}}@include min($lg){&:hover{color:$color-secondary!important;@include svg}}&.active{color:$color-secondary!important;@include svghover($color-secondary)}}.product-social-content{position:absolute;top:150%;left:var(--gutter);z-index:11;display:none;padding:5px;box-shadow:0 0 5px rgb(0 0 0 / .2);background-color:#fff;>div{display:flex;>div{margin-right:5px;&:last-child{margin-right:0}>a{@include center;width:26px;height:26px;svg{path{fill:$color-white!important}}&.product-social-facebook{background-color:#3b5998}&.product-social-twitter{background-color:#1da1f2}&.product-social-pinterest{background-color:#bd081c}&.product-social-whatsapp{background-color:#128c7e}}}}}}.product-detail-tab{margin-bottom:calc(var(--spacer-18) + var(--spacer-19));@include min($sm){border:1px solid $color-border;border-radius:$border-radius;overflow:hidden}.product-detail-tab-header{align-items:center;background-color:$color-background;[data-tab-index]{>a{position:relative;@include center;height:89px;color:$color-text;@include heading-type-3;white-space:nowrap;padding-inline:var(--spacer-10);transition:$transition;@include min($sm){&:after{content:'';position:absolute;left:var(--spacer-10);bottom:19px;width:0;height:5px;background-color:$color-secondary;@include border-radius(30px);transition:$transition}}}@include min($sm){&:not(:first-child){>a{&:before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:22px;background-color:$color-youtube}}}}&.active{>a{color:$color-secondary;@include min($sm){&:after{width:68px}}}}}}.product-detail-tab-content{[data-tab-content]{height:0;overflow:hidden;>div{@include text-type-4;padding:var(--spacer-8) var(--spacer-10);border-top:1px solid $color-border;@include border-radius(0 0 $border-radius $border-radius)}&.active{height:auto;overflow:visible;@include min($sm){display:block!important}}}}@include max($lg){.product-detail-tab-header{overflow-x:auto;scroll-snap-type:x mandatory}}@include max($sm){.product-detail-tab-content{.product-detail-tab-row{margin-bottom:var(--spacer-8);[data-tab-index]{>a{position:relative;display:flex;align-items:center;justify-content:space-between;height:50px;color:$color-text;font-size:var(--font-size-20);padding:0 var(--spacer-8);background-color:$color-border;border-radius:$border-radius;&:after{content:'\f078';font-weight:900;font-size:var(--font-size-24);font-family:"Font Awesome 5 Free";transition:$transition}}}[data-tab-content]{height:0!important;overflow:hidden!important;>div{padding:var(--spacer-6) 0 0 0;border:none}}&.active{[data-tab-index]{>a{color:$color-white;background-color:$color-secondary;&:after{transform:rotate(-180deg)}}}[data-tab-content]{&.active{height:auto!important;overflow:visible!important}}}}}}}.product-customization{padding:var(--spacer-8) 0 var(--spacer-3);margin:var(--spacer-8) 0;border-top:1px solid $color-border;border-bottom:1px solid $color-border;.product-customization-group{.product-customization-group-title{@include line-rule(14);margin-bottom:var(--spacer-4)}.product-customization-field{.form-group{.control-label{color:$color-text;@include line-rule(12);font-weight:600;margin-bottom:0;@include max($sm){margin-bottom:var(--spacer-3)}}}}}.form-control{height:44px;border:1px solid $color-border;border-radius:$border-radius}textarea.form-control{height:120px}.form-group select.form-control:not([size]):not([multiple]),.form-group select:not([size]){height:44px;cursor:pointer;border:1px solid $color-border;border-radius:$border-radius;background-size:36px;background-position:right center;background-image:url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24 16.0005L18 22L12 16.0005L12.9999 15L18 20.0004L23.0001 15L24 16.0005Z' fill='%232B2D42'/%3E%3C/svg%3E%0A")}.form-horizontal .form-question{top:5px;right:-4px;width:15px;height:15px;border-radius:100%}}@include max($lg){.idea-promotion-bar{{% if theme.settings.idea_popup_bar_control %}display:block!important;{% else %}display:none!important;{% endif %}}}:root{--gutter:#{$gutter};{% for i in 1..40 %}--spacer-{{i}}:{{i*4}}px;{% endfor %}{% for i in 10..120 %}--font-size-{{i}}:{{i}}px;{% endfor %}}@include max($lg){:root{{% for i in 1..20 %}--spacer-{{i}}:{{i*3}}px;{% endfor %}{% for i in 21..29 %}--spacer-{{i}}:{{i*(2.5)}}px;{% endfor %}{% for i in 30..40 %}--spacer-{{i}}:{{i*2}}px;{% endfor %}{% for i in 10..14 %}--font-size-{{i}}:{{i*(.95)}}px;{% endfor %}{% for i in 15..18 %}--font-size-{{i}}:{{i*(.9)}}px;{% endfor %}{% for i in 19..28 %}--font-size-{{i}}:{{i*(.8)}}px;{% endfor %}{% for i in 29..36 %}--font-size-{{i}}:{{i*(.75)}}px;{% endfor %}{% for i in 37..84 %}--font-size-{{i}}:{{i*(.65)}}px;{% endfor %}{% for i in 85..120 %}--font-size-{{i}}:{{i*(.55)}}px;{% endfor %}}}@include max($sm){:root{{% for i in 1..20 %}--spacer-{{i}}:{{i*2}}px;{% endfor %}{% for i in 21..29 %}--spacer-{{i}}:{{i*(1.5)}}px;{% endfor %}{% for i in 30..40 %}--spacer-{{i}}:{{i*1}}px;{% endfor %}{% for i in 10..14 %}--font-size-{{i}}:{{i*(.85)}}px;{% endfor %}{% for i in 15..18 %}--font-size-{{i}}:{{i*(.8)}}px;{% endfor %}{% for i in 19..28 %}--font-size-{{i}}:{{i*(.75)}}px;{% endfor %}{% for i in 29..36 %}--font-size-{{i}}:{{i*(.7)}}px;{% endfor %}{% for i in 37..84 %}--font-size-{{i}}:{{i*(.55)}}px;{% endfor %}{% for i in 85..120 %}--font-size-{{i}}:{{i*(.45)}}px;{% endfor %}}}.row{&.no-gutters{margin-right:0;margin-left:0;>.col,>[class*="col-"]{padding-right:0;padding-left:0}}}#footer-content{margin-top:var(--spacer-14)}.entry-video-banner{position:relative;min-height:460px;margin-bottom:var(--spacer-18);.background-video{@include min($md){position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1}width:100%;height:100%;object-fit:cover}.embed-responsive{&:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000;opacity:.3;z-index:1}iframe{pointer-events:none}}.video-banner-content{@include min($md){position:absolute;left:0;top:0;z-index:10;width:100%;height:100%;color:$color-white}display:flex;align-items:flex-end;justify-content:center;flex-direction:column;padding:var(--spacer-30);@include max($md){color:$color-text;align-items:center;padding:var(--spacer-10)}}}.contentbox-header{margin-bottom:var(--spacer-8);p{display:block;font-size:var(--font-size-12);margin-bottom:0}h4{color:$color-text;font-size:var(--font-size-24);margin-bottom:0}}body[class*="checkout-page"],body[class*="current-page-cart"]{.contentbox-header{text-align:left;margin-bottom:var(--spacer-1);border-bottom:none;h4{font-size:var(--font-size-18)}}}{% if not theme.settings.detail_search_form %}.current-page-product-list-search{.contentbox-body,.contentbox-header{display:none!important}}{% endif %}.user-login-page-wrapper{position:relative;display:flex;justify-content:center;.user-login-page-container{position:relative;z-index:2;width:460px;@include max($sm){width:380px}@include max($xxs){width:330px}@include max($xxxs){width:280px}.user-login-page-logo{display:flex;align-items:center;justify-content:center;min-height:56px;padding:var(--spacer-5);img{max-height:56px}}}.user-login-page-content{padding:var(--spacer-10);margin-bottom:var(--spacer-8);background-color:#fff;border:1px solid $color-border;border-radius:$border-radius}.user-login-page-title{text-align:center;margin-bottom:var(--spacer-7);span{line-height:28px;font-size:var(--font-size-24);font-weight:700}&.user-login-page-sub-title{padding-top:var(--spacer-7)}}.user-login-page-order-registration{display:flex;align-items:center;justify-content:center;height:52px;color:$color-text;font-size:var(--font-size-16);font-weight:600;text-align:center;margin-top:var(--spacer-9);background-color:rgb(220 53 69 / .3)}.user-login-page-row{position:relative;margin-bottom:var(--spacer-5);.password-toggle{position:absolute;right:var(--gutter);top:0;@include center;width:20px;height:100%;cursor:pointer;@include svghover($color-sub-text)}&.user-login-page-button-social{display:flex;align-items:center;flex-wrap:wrap;@include max($sm){display:block}>div{flex:0 0 50%;&:first-child{padding-right:var(--spacer-5)}@include max($sm){flex:0 0 100%;&:first-child{padding-right:0}}}}input.form-control{height:52px;color:$color-text;font-size:var(--font-size-14);padding:var(--spacer-2) var(--spacer-4)}.btn{@include center;height:52px;font-size:var(--font-size-18);font-weight:600;padding:0;@include max($xxxs){height:48px}&.btn-green{color:$color-white;font-weight:400;margin-bottom:var(--spacer-8);border:1px solid $color-border;background-color:$color-whatsapp}&.btn-google{color:$color-text!important;font-size:var(--font-size-15);font-weight:400;background:#fff!important;border:1px solid $color-border;span{padding-left:10px}&:hover{color:$color-text!important;background:#fff!important}@include max($sm){margin-bottom:var(--spacer-5)}}&.btn-facebook{color:$color-text!important;font-size:var(--font-size-15);font-weight:400;background:#fff!important;border:1px solid $color-border;span{padding-left:10px}&:hover{color:$color-text!important;background:#fff!important}}}}.checkbox-custom,.user-login-forgot-pass{margin-bottom:var(--spacer-9)}.checkbox-custom{input[type=checkbox]{&+label{line-height:20px;color:$color-text;font-size:var(--font-size-14);padding-left:36px;&:before{width:20px;height:20px;border:1px solid $color-border}}&:checked{&+label{&:before{background-image:none;border-color:$color-border;background-color:$color-white}&:after{content:'';position:absolute;left:7px;top:2px;display:inline-block;width:6px;height:12px;border-bottom:2px solid $color-primary;border-right:2px solid $color-primary;transform:rotate(45deg)}}}}}.user-login-forgot-pass{a{display:block;color:$color-text;font-size:var(--font-size-14)}}}.signup-page-logo{display:flex;align-items:center;justify-content:center;min-height:56px;padding:var(--spacer-5);img{max-height:56px}}.signup-container{width:580px;margin:0 auto var(--spacer-4);padding:var(--spacer-6) var(--spacer-10) var(--spacer-5);border:1px solid $color-border;border-radius:$border-radius;background-color:$color-white;@include max($sm){width:calc(100% - 8px)}&.signup-container-information{width:100%;.information-content{border:none}}.contentbox-header{text-align:center!important;margin:0 0 var(--spacer-7)!important;padding:0!important;border:none!important;h4{line-height:28px;font-size:var(--font-size-24)!important;font-weight:700!important;margin-bottom:0!important}}.alert.alert-primary{margin-bottom:var(--spacer-5)}.form-group{margin-bottom:var(--spacer-5);&.signup-campaign-status,&.signup-agreement,&.signup-personal-data-agreement{.col-12.col-lg-4.control-label{display:none}}.col-12.col-lg-5,.col-12.col-lg-8,.col-12.col-lg-9.text-right{flex:1 0 0%;max-width:none}.col-12.col-lg-4.control-label{&+.col-6.col-lg-5{flex:1 0 0%;max-width:none}}.security-code{height:48px}input.form-control{height:48px;color:$color-text;font-size:var(--font-size-14);padding:var(--spacer-2) var(--spacer-4);&::placeholder{opacity:.5}}select.form-control:not([size]):not([multiple]),select:not([size]){height:48px}.form-question{top:14px!important}.btn{height:48px}.btn-group-binary{display:flex;align-items:center;justify-content:space-between;&:before,&:after{display:none}>button{flex:0 0 48%;max-width:48%;&.mr-2{margin-right:0!important}}}}.form-horizontal{.toggle-password{top:0;right:calc(var(--gutter) * 1.5);@include center;width:20px;height:48px;color:$color-sub-text;background-color:#fff0}}}