
@keyframes cover_fade_in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 0.8;
    }
}

@keyframes fade_in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fade_out {
    0% {
        opacity: 0.8;
    }

    100% {
        opacity: 0;
    }
}

/*loader*/
.loader {
    background-color: #141010;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
    opacity: 0.9;
}

.lds-ellipsis {
    display: inline-block;
    position: absolute;
    width: 80px;
    height: 80px;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}

.lds-ellipsis div {
    position: absolute;
    top: 33px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #fff;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}
@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(24px, 0);
    }
}
/*loader end*/


/*scroll*/
.nicescroll-rails{
    z-index: 100000 !important;
}

.nicescroll-rails-hr {
    visibility: hidden;
}
.nicescroll-rails-vr {
    /*background-color: #323232;*/
    opacity: 0.5;
}
.nicescroll-cursors {
    border: none !important;
    background-color: #323232 !important;
}
/*end scroll*/


/*helper*/
label.error {
    font-size: 12px;
    color: #fff;
    float: inherit;
    position: absolute;
    right: 0px;
    background-color: #d24555;
    padding: 5.5px;
}
label.error::before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid #d24555;
    left: -7px;
}

.spacer{
    margin-bottom: 10%;
}


.del_margin{
    margin: 0 !important;
}

.del_padding{
    padding: 0 !important;
}

.mb_none{
    display: none;
}

.click_wpr{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
    cursor: pointer;
}

.mb_silent_tbl{
    width: 68%;
    visibility: hidden;
}
/*helper end*/


/* fonts */
@font-face{
    font-family: "Bebas Neue Regular";
    src: url("../fonts/Dharma Type - Bebas Neue Regular.otf");
}

@font-face{
    font-family: "Myriad Pro Regular";
    src: url("../fonts/MyriadPro-Regular.otf");
}
/* end fonts */


/* globals — REMOVED: body, a { all: unset }, fiv_grid selectors → now in SCSS */

input:active, input:focus{
    appearance: none;
}

.wpr{
    width: 100%;
    margin: 0 auto;
}

.wpr_lft{
    float: left;
}

.wpr_rgt{
    float: right;
}

.wpr_cntr{
    position: relative;
    width: max-content;
    margin: 0 auto;
}

.flex_wpr{
    position: absolute;
    display: table;
    width: 100%;
    bottom: 51px;
    left: 8%;
}

.chkout_wpr .hdl_mid{
    font-size: 32px;
}

.chkout_wpr .flex_wpr, .neutral .flex_wpr{
    position: relative;
    left: unset !important;
    bottom: unset !important;
}

.chkout_wpr .tbl .label_wpr .label{
    font-size: 16px !important;
    letter-spacing: 1px;
    margin-bottom: 10px !important;
}

.chkout_wpr .tbl .label_wpr .label::before{
    height: 16px;
}

.ico_wpr{
    width: 100%;
}

.ico{
    width: 33%;
}

.uni_width_10{
    text-align: unset !important;
}


.uni_width_30{
    width: max-content;
}

.uni_width_40{
    width: max-content;
}

.uni_width_50{
    width: max-content;
}
/* end globals */


/* search breadcrumb */
.srh_crumb{
    color: #fff;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 14px;
    width: max-content;
    text-align: center;
    text-decoration: underline solid #e85224;
    text-decoration-thickness: 0px;
    text-underline-offset: 5px;
    position: fixed;
    bottom: 72px;
    left: 50%;
    transform: translate(-50%,0);
    background-color: #141010;
    padding: 14px;
    z-index: 100;
}

/* header — now handled by mobile-header SCSS component */

/* filter + dropdown */

/* hgroup — now handled by Tailwind responsive */

.fltr{
    position: fixed;
    display: none;
    max-height: 692px;
    overflow: auto;
    background-color: #141010;
    top: 0;
    width: 90%;
    height: 87%;
    left: 5%;
    border: 1px solid #39b3a8;
    padding: 5% 5% 10% 5%;
    margin-top: 5%;
}

.fltr_hover{
    width: 40px;
    height: 40px;
}

.fltr_hoverbox{
    position: fixed;
    right: 7% !important;
    bottom: 32px !important;
    z-index: 100000 !important;
    height: 35px !important;
    width: 35px !important;
}

.fltr_hoverbox_wpr{
    width: 100%;
    height: 100%;
    position: absolute;
}

.fltr_box_home{
    position: fixed;
    width: 35px;
    height: 35px;
    right: 3%;
    bottom: 33px;
    z-index: 100;
}

.fltr_box_home .fltr_ico {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-size: 24px;
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(2%) hue-rotate(200deg) brightness(103%) contrast(101%);
}

.fltr_ico{
    background-image: url("../img/fltr_w.svg");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    z-index: 100;
    width: 35px;
    height: 35px;
}

.fltr_hoverbox:hover .fltr_ico{
    background-color: #39b3a8;
    cursor: pointer;
}


.fltr_wpr{
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10000;
}

.option:hover{
    color: #39b3a8;
}

.select_wpr{
    display: flex;
    flex-direction: column;
    position: relative;
    float: left;
    width: 100%;
    margin-bottom: 25px;
}

.select{
    width: 100%;
    color: #fff;
    font-family: "Bebas Neue Regular","impact";
    text-align: center;
    position: relative;
    letter-spacing: 0.5px;
    word-wrap: anywhere;
    font-size: 15px;
    min-height: 55px;
    justify-content: center;
    align-items: center;
    border-bottom: 2px solid transparent;
    padding-top: 19px;
    cursor: pointer;
    border-bottom: 1px dotted #fff;
}

.fltr_selected_wpr{
    float: left;
    color: #fff;
    position: relative;
    width: 100%;
}

.fltr_selected{
    position: relative;
    width: 100%;
    height: 100%;
    float: left;
    font-family: "Myriad Pro Regular", "Calibri";
    background-color: #212121;
    padding-bottom: 15px;
    margin-bottom: 15px;
}


.fltr_selected_box{
    float: left;
    border: #fff 1px solid;
    padding: 5px;
    position: relative;
    margin: 15px 15px 0 15px;
    font-size: 15px;
    padding-right: 26px;
}

.fltr_selected_box .fltr_del_ico{
    position: absolute;
    top: 5px;
    right: 5px;
}

/*.fltr_selected_box:first-child{*/
/*    position: relative;*/
/*    width: 60%;*/
/*    float: left;*/
/*}*/

.fltr_btn{
    display: none;
    position: relative;
    width: 100%;
    float: left
}

.fltr_btn_del{
    position: relative;
    background-color: #d24555;
    border: solid thin transparent;
    text-align: center;
    padding: 5px 30px 5px 30px;
    text-transform: uppercase;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 18px;
    color: #FFFFFF;
    cursor: pointer;
    width: 100%;
}

.fltr_btn_itm{
    position: relative;
    /*background-color: #000000;*/
    border: solid thin #ffffff;
    text-align: center;
    padding: 5px 30px 5px 30px;
    text-transform: uppercase;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 18px;
    color: #FFFFFF;
    width: 100%;
    margin-bottom: 15px;
}

.fltr_btn_del:hover{
    border: solid thin #FFFFFF;
    background-color: transparent;
}


.select_hdl{
    float: left;
    color: #fff;
    font-family: "Bebas Neue Regular","impact";
    font-size: 15px;
    letter-spacing: 0.5px;
}

.select:hover{
    color:#39B3A8;
    border-bottom: 1px solid #39B3A8;
}

.select:first-child:hover{
    color: #fff !important;
}

.select .sort_option:hover{
    color:#39B3A8;
}

.drp_wpr:hover{
    border-bottom: 2px solid #39B3A8;
}

.drp_subline:hover::before{
    transform: rotate(90deg);
}

.select:hover .drp{
    display: block;
    z-index: 1;
}

.drp_wpr:hover .drp{
    display: table;
    z-index: 1;
}

/* old mobile menu dropdown — replaced by mobile-nav-drawer */

.drp .fltr_option::before,
.drp .sort_option::before,
.drp .option::before{
    content: "";
    background-color: #39B3A8;
    width: 2px;
    height: 64%;
    position: absolute;
    top: 18%;
    left: 0;
    display: none;
}

/* nav input — replaced by mobile-header search */

.input_box{
    float: left;
    margin-top: 5px;
    position: relative;
}

.chkout_wpr .input_box{
    display: flex;
    margin-bottom: 20px;
    width: 100%;
    flex-direction: column;
    border-bottom: 1px dotted #fff;
    padding-bottom: 5px;
}

.input_box span{
    display: none;
}

.input_active span{
    background-color: #D24555;
    width: 20px;
    height: 100%;
    position: absolute;
    right: 0px;
    top: 0px;
    line-height: 170%;
    display: block;

}

/* .search — replaced by mobile-header search */

/*.input_ico:hover + .search{*/
/*    display: block;*/
/*}*/

/* .client_logo — replaced by mobile-header */


/* sidebar + cart — asides hidden on mobile via Tailwind, cart in mobile-header */

.cart_empty{
    background-color: #d24555;
    font-family: "Bebas Neue Regular","impact";
    font-size: 20px;
    color: #fff;
    padding: 2%;
    margin-bottom: 5%;
    text-align: center;
}

.cart_checkout_empty{
    width: 60%;
    background-color: #d24555;
    font-family: "Bebas Neue Regular","impact";
    font-size: 20px;
    padding: 1%;
    color: #fff;
    width: 60%;
    margin: 0 auto 1%;
    text-align: center;
}

/* .cart_cntr, .cart_tot — REMOVED → handled by Vue scoped styles + SCSS */


/* main — REMOVED → now in SCSS */

/* .fiv_grid — REMOVED (not used in templates, replaced by Tailwind grid) */

/* .itm, .itm:hover — REMOVED → handled by Tailwind in _product_card.html.twig */

.itm_hit{
    border: #39b3a8 4px solid;
    box-shadow: inset gray 0px 0px 60px -12px;
}

.itm_hit_box{
    position: absolute;
    height: 30px;
    background-color: #39b3a8;
    font-family: "Bebas Neue Regular","impact";
    color: #fff;
    padding-left: 28px;
    line-height: 180%;
    padding-right: 8px;
    left: 50%;
    transform: translateX(-50%)
}

.itm_hit_ico_wpr{
    position: absolute;
    width: 17px;
    top: 5px;
    left: 6px;
}

.itm_btn{
    cursor: pointer;
}

.itm_hdr{
    width: 100%;
    display: table;
    padding: 2%;
}

.itm_hdr .wpr_lft{
    width: 50%;
}

.itm_hdr .wpr_rgt{
    width: 50%;
}

.itm_thumb_eco{
    position: absolute;
    width: 0px;
    height: 0px;
    -webkit-transform: rotate(360deg);
    border-style: solid;
    border-width: 0 0 70px 70px;
    border-color: transparent transparent #32AC5C transparent;
    bottom: 0;
    right: 0;
}

.thumb_eco_wpr{
    position: absolute;
    width: 40px;
    bottom: -60px;
    right: 6px;
    cursor: pointer;
}

.pkg{
    width: 100%;
    display: table;
}

.window .row_cnt_cntr .pkg{
    width: 32%;
    margin: 0 34% 0 0 !important;
    float: right !important;
}

.pkg span{
    font-family: "Bebas Neue Regular","impact";
    color: #212121;
    float: left;
    padding-top: 2%;
    margin-left: 3%;
    font-size: 20px;
}

.prc{
    background-color: #212121;
    font-family: "Bebas Neue Regular","impact";
    color: #fff;
    text-align: center;
    padding: 7px 12px 6px 12px;
    margin-bottom: 5px;
    font-size: 18px;
}

.dlv_date{
    font-family: "Myriad Pro Regular","Calibri";
    font-size: 8px;
    width: 100%;
    position: relative;
    text-transform: uppercase;
    padding: 2px 0;
}

.dlv_date .ico{
    width: 6%;
    margin-top: 1px;
    filter: brightness(0) saturate(100%) invert(0%) sepia(94%) saturate(7457%) hue-rotate(127deg) brightness(90%) contrast(91%);
}

.dlv_date span{
    float: right;
    margin-right: 3%;
    color: #000000;
}

.itm_img{
    padding: 10% 20%;
}

.itm_img img {
    aspect-ratio: 1 / 1;
}

.itm_sub{
    width: 100%;
    padding: 2%;
    display: table;
    font-family: "Bebas Neue Regular","impact";
    position: relative;
}

.itm_btm_text{
    width: 75%;
    font-size: 22px;
    text-align: center;
    position: absolute;
    bottom: 5px;
    transform: translateX(-50%);
    left: 50%;
}

.itm_btm_lft, .itm_btm_rgt{
    width: 10%;
    position: relative;
    cursor: pointer;
}

.itm_btm_rgt{
    float: right;
}

.window .itm_wpr_lft .itm_btm_lft{
    position: absolute;
    bottom: 8%;
	left: 8%;
    width: 35px !important;
	margin: 0 !important;
    max-width: 30px !important;
}

.window .itm_wpr_lft .itm_btm_lft:nth-child(3){
    left: unset;
    right: 8%;
    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(211deg) brightness(89%) contrast(103%);
}

.window .itm_wpr_lft .itm_btm_lft:nth-child(4){
    left: unset;
    right: 20%;
    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(211deg) brightness(89%) contrast(103%);
}


/*.window .itm_wpr_lft .itm_btm_lft:has(img[alt="Price Icon"]){*/
/*    position: absolute;*/
/*    left: unset;*/
/*    right: 8% !important;*/
/*}*/

/*.itm_btm_lft:has(img[alt="Price Icon"]){*/
/*    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(211deg) brightness(89%) contrast(103%);*/
/*}*/

.window .tbl .itm_btm_lft{
    margin: 0 6% 0 0 !important;
}

.window .tbl .ico_box .ico{
    float: left !important;
}

.window .tbl .ico_box .pkg .ico{
    float: left !important;
    margin: 0 !important;
}

.itm_btm_lft{
    float: left;
}

.fav_blk:hover img{
    filter: brightness(0) saturate(100%);

}

.fav_blk_active img{
    filter: brightness(0) saturate(100%);

}

.window .fav_wht img{
    filter:invert(100%) sepia(100%) saturate(1%) hue-rotate(274deg) brightness(107%) contrast(101%);
}

.fav_wht:hover img{
    filter:brightness(0) saturate(100%) invert(0%) sepia(99%) saturate(0%) hue-rotate(7deg) brightness(102%) contrast(101%);
}

.fav_wht_active img{
    filter:brightness(0) saturate(100%) invert(0%) sepia(99%) saturate(0%) hue-rotate(7deg) brightness(102%) contrast(101%);
}

.conm_fav_tbl .fav_wht_active img{
    filter:brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(4486%) hue-rotate(71deg) brightness(116%) contrast(101%);
}

.conm_cart .fav_wht_active, .chkout_wpr .fav_wht_active{
    filter:brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(4486%) hue-rotate(71deg) brightness(116%) contrast(101%);
}

.conm_cart .fav_wht{
    filter: invert(100%) sepia(1%) saturate(4486%) hue-rotate(71deg) brightness(116%) contrast(101%);
}

.chkout_wpr .fav_wht:hover{
    filter:brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(4486%) hue-rotate(71deg) brightness(116%) contrast(101%);
}

/*.itm_btm_lft:hover .heart_bl{*/
/*	display: block;*/
/*}*/

.itm_desc{
    width: 100%;
    background-color: #212121;
    color: #fff;
    text-align: center;
    font-family: "Myriad Pro Regular","Calibri";
    font-size: 11px;
    padding: 4% 6%;
    height: 38px;
}

.itm_ftr{
    width: 100%;
    background-color: #39b3a8;
    text-align: center;
    padding: 1.5% 0;
    font-family: "Bebas Neue Regular","impact";
    color: #fff;
    font-size: 18px;
}

.wpr_rgt{
    float: right;
    width: 30%;
}

.wpr_rgt div{
    float: right;
}

.wpr_lft{
    float: left;
    width: 30%;
}

.wpr_lft div{
    float: left;
}

/* footer */
.size{
    width: 100%;
    position: fixed;
    z-index: 100000;
    display: none;
    height: 100%;
    overflow-y: scroll;
}

.cover{
    width: 100%;
    position: fixed;
    background-color: #141010;
    opacity: 0.8;
    z-index: 1000;
    cursor: pointer;
    height: 100%;
}


/* item details window */
.window{
    position: relative;
    width: 90%;
    border: 1px solid #39b3a8;
    display: none;
    animation: fade_in 1s;
    min-width: 300px;
    background-color: #141010;
    z-index: 10000;
    margin-top: 5%;
    height: auto;
    min-height: 692px;
    margin-bottom: 90px;
}

.window_mid{
    transform: translate(-50%, 0);
    top: 0;
    left: 50%;
}

.window_top{
    transform: translate(-50%, 0%);
    top: 0;
    left: 50%;
}

.window_content{
    position: relative;
    min-height: 692px;
    height: auto;
}

.conm_item_detail .window_cnt_wpr{
    min-height: 692px;
    height: auto;
}

.window_cnt_wpr{
    position: relative;
    display: table;
    width: 100%;
    padding: 5% 5% 10% 5%;
}

.itm_dtl_info .unit_cnt_wpr{
    margin: 0;
}

.itm_wpr{
    position: relative;
    width: 100%;
    background-color: #FFFFFF;
    margin: 0 0 5% 0 !important;
}

.window .itm_wpr .itm_img{
    padding: 20% !important;
}

.itm_dtl_head{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    aspect-ratio: 1/1;
    max-height: 100%;
    margin: auto;
}


.itm_dtl_head .itm_nmbr{
    font-size: 6px;
    color: #000000;
}


.itm_wpr_lft{
    position: absolute;
    float: left;
    height: 100%;
    width: 100%;
}

.itm_wpr_lft .pkg{
    position: absolute;
    top: 8%;
    left: 8%;
    width: 50%;
}

.itm_wpr_lft .pkg .ico{
    position: unset;
    float: left;
    filter: brightness(0) saturate(100%) invert(0%) sepia(94%) saturate(7457%) hue-rotate(127deg) brightness(90%) contrast(91%);
}

.itm_wpr_lft .pkg span{
	color: #000000 !important;
}

.itm_wpr_lft .ico {
    position: absolute;
	bottom: 8%;
    right: 8%;
    filter: brightness(0) saturate(100%) invert(0%) sepia(94%) saturate(7457%) hue-rotate(127deg) brightness(90%) contrast(91%);
	width: 35px !important;
}

.itm_wpr_rgt{
    width: 50%;
    color: #FFFFFF;
    position: absolute;
    right: 8%;
    top: 8%;
}

.itm_wpr_lft .ico{
    max-width: 30px;
}

.itm_wpr_rgt .ico{
    float: right;
}

.itm_wpr_rgt .prc{
    font-size: 18px;
    padding: 7px 12px 4px 12px;
    margin-bottom: 5px;
    float: right;
}

.itm_wpr_rgt .dlv_date::after{
    content: " ";
    position: absolute;
    display: block;
    height: 1px;
    width: 30px;
    bottom: -5px;
    right: 0px;
    border-bottom: 1px dotted #000;
}

.itm_nmbr{
    font-size: 11px;
    font-family: "Myriad Pro Regular", "Calibri";
    font-style: italic;
    margin-top: 10px;
    width: 100%;
    text-align: right;
    float: right;
    text-transform: uppercase;
}

.itm_brk{
    font-size: 10px;
    color: #000;
    font-family: "Myriad Pro Regular", "Calibri";
    font-style: italic;
    margin-bottom: 4px;
    width: 100%;
    text-align: right;
    float: right;
}

.brk_active{
    color: #39B3A8;
}

.itm_extra{
    font-size: 12px;
    color: #39B3A8;
    font-family: "Myriad Pro Regular", "Calibri";
    margin: 7px 0 0 10px;
    font-style: italic;
    text-align: left;
    float: left;
}

.itm_extra_card{
    font-size: 10px;
    color: #fff;
    font-family: "Myriad Pro Regular", "Calibri";
    font-style: italic;
    text-align: center;
    width: max-content;
}

.itm_dtl_info{
    width: 100%;
    position: relative;
}

.itm_dtl_fltr{
    margin-bottom: 20px;
}

.fltr_hdl{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 20px;
    color: #FFFFFF;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.itm_dtl_fltr .select{
    border-right: 1px dotted #FFFFFF;
    border-left: none;
    width: 25%;
    display: block;
}

.itm_dtl_fltr .select_wpr::before {
    content: "";
    position: absolute;
    width: 4px;
    height: 38px;
    background-color: #39b3a8;
    z-index: 90;
}

.itm_dtl_fltr .select .drp{
    top: 40px;
    max-height: 17vh;
    z-index: 1;
}

.itm_dtl_desc{
    width: 100%;
    color: #FFFFFF;
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 12px;
    max-height: 300px;
    min-height: 140px;
}

.itm_dtl_hdl{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 30px;
    text-transform: uppercase;
}

.fltr_amount{
    width: 100%;
    height: 40px;
    background-color: #212121;
    position: relative;
    color: #FFFFFF;
    padding: 6px 18px;
    margin-bottom: 20px;
    cursor: pointer;
    border: 1px solid #39b3a8;
}

.fltr_amount:hover{
    background-color: #39b3a8;
}

.fltr_amount span{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 24px;
}

.fltr_amount:hover .drp{
    display: block;
    z-index: 1;
}

.fltr_amount .drp::before {
    content: " ";
    position: absolute;
    width: 4px;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #39B3A8;
}

.fltr_amount::before{
    content: "";
    background-image: url("../img/arrow_w.svg");
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 12px;
    width: 12px;
    left: 5px;
    top: 14px;
}

.fltr_amount:hover::before{
    transform: rotate(90deg);
}

.itm_amount{
    width: 100%;
    height: 40px;
    background-color: #39b3a8;
    position: relative;
    color: #FFFFFF;
    padding: 6px 10px;
    margin-bottom: 20px;
    cursor: pointer;

}

.itm_amount span{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 24px;
}

/*.btn_pls_min_wpr{*/
/*	width: 100%;*/
/*	margin-bottom: 20px;*/
/*	display: table;*/
/*}*/

/*.btn_pls_min{*/
/*	display: flex;*/
/*	column-gap: 10px;*/
/*	float: left;*/
/*}*/


.window .btn_rgt{
    width: 100%;
}

.unit_cnt_wpr{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 25px;
    width: 100%;
    display: table;
    margin: 0 0 20px 9%;
}

.tbl .unit_cnt_wpr{
    color: #FFFFFF;
    float: left;
    width: max-content;
}

.unit_cnt{
    display: flex;
    column-gap: 10px;
    float: left;
}

.window .btn_pls_min_wpr span {
	float: right;
    font-size: 25px;
}

.chkout_wpr .btn_pls_min{
    width: 100%;
}

.chkout_wpr .wpr{
    width: 100% !important;
}

.chkout_wpr .unit_cnt{
    width: 100%;
}

.unit_cnt .ico{
    cursor: pointer;
}

.unit_cnt .ico:hover{
    cursor: pointer;
    border: 1px solid #39B3A8;
}

.unit_cnt .ico{
    width: 30px;
    height: 30px;
    border: 1px solid #FFFFFF;
    padding: 9px 0;
}

.window .unit_cnt .ico{
    width: 28px;
    height: 28px;
    padding: 8px 0;
}

.unit_cnt_wpr span{
    font-family: "Bebas Neue Regular", "Impact";
    color: #FFFFFF;
    margin: 0px 0 0 20px;
    font-size: 24px;
    float: right;
}

.cntr{
    width: 30px;
    height: 30px;
    border: 1px solid #39B3A8;
    background-color: #212121;
    font-family: "Bebas Neue Regular", "Impact";
    padding-top: 2px;
    font-size: 16px;
    text-align: center;
    color: #FFFFFF;
}

.cntr{
    width: 28px;
    height: 28px;
}

.chkout_wpr .cntr{
    width: 30px;
    height: 30px;
}

.cntr:focus{
    outline: none;
}

.btn_out{
    width: 100%;
    margin-top: 20px;
    position: relative;
    border: solid thin #fff;
    text-align: center;
    padding: 5px 0 3px 0;
    text-transform: uppercase;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 22px;
    float: left;
    color: #FFFFFF;
    cursor: pointer;
}

.btn_out:hover{
    border: solid thin #39B3A8;
    background-color: #39B3A8;
}

.btn_full, .btn_rgt, .btn_lft{
    width: 35%;
    position: relative;
    background-color: #39B3A8;
    border: solid thin transparent;
    text-align: center;
    padding: 5px 0 3px 0;
    text-transform: uppercase;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 22px;
    color: #FFFFFF;
    cursor: pointer;
}

.btn_max{
    width: 100%;
    position: relative;
    background-color: #39B3A8;
    border: solid thin transparent;
    text-align: center;
    padding: 5px 0 3px 0;
    text-transform: uppercase;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 22px;
    color: #FFFFFF;
    cursor: pointer;
}

.chkout_wpr .btn_full{
    width: 100%;
}

.btn_full, .btn_max{
    margin: 0 auto;
}

.btn_rgt{
    float: right;
}

.btn_lft{
    float: left;
}

.set_sign_wpr .btn_lft{
    width: 42%;
    padding: 10px 0 10px 0;
    float: right;
    margin-bottom: 20px;
}

.btn_max:hover,.btn_full:hover,.btn_lft:hover, .btn_rgt:hover{
    border: solid thin #FFFFFF;
    background-color: #141010;
}

.back_btn_mid{
    position: relative;
    background-color: #d24555;
    border: solid thin transparent;
    text-align: center;
    padding: 5px 30px 5px 30px;
    text-transform: uppercase;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 22px;
    color: #FFFFFF;
    cursor: pointer;
    width: 50%;
    margin: 0 auto;
    margin-top: 30px;
}

.back_btn_mid:hover{
    border: solid thin #FFFFFF;
    background-color: #141010;
}

.back_btn_mid svg{
    width: 20px;
    color: #fff;
}

.close{
    position: absolute;
    background-color: #fff;
    width: 35px;
    height: 35px;
    bottom: -18px;
    left: 50%;
    transform: translate(-50%,0);
    border-radius: 50%;
    border: 4px solid #141010;
    cursor: pointer;
    padding: 4px;
}

.close div{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

/* basket */
.sect_hdr{
    position: relative;
    width: 100%;
    display: table;
}

.sect_hdr_lft{
    position: relative;
    width: 100%;
    display: table;
}

.hdl_lft{
    color: #FFFFFF;
    font-size: 42px;
    font-family: "Bebas Neue Regular", "Impact";
    text-transform: uppercase;
    border-bottom: 4px solid #39B3A8;
    float: left;
    letter-spacing: 1px;
    margin-bottom: 30px;
    width: 100%;
    text-align: center;
}

.hdl_rgt{
    color: #FFFFFF;
    font-size: 42px;
    font-family: "Bebas Neue Regular", "Impact";
    text-transform: uppercase;
    border-bottom: 4px solid #39B3A8;
    float: right;
    letter-spacing: 1px;
    margin-bottom: 30px;
    width: max-content;
}

.hdl_mid{
    color: #FFFFFF;
    font-size: 20px;
    font-family: "Bebas Neue Regular", "Impact";
    text-transform: uppercase;
    border-bottom: 4px solid #39B3A8;
    letter-spacing: 1px;
    width: 100%;
    margin-top: 20px;
    text-align: center;
}

.overview_wpr .hdl_mid{
    margin-bottom: 20px;
}

.chkout_wpr .hdl_mid, .neutral .content .hdl_lft{
    width: 100%;
    text-align: center;
    border-bottom: 1px dotted #FFFFFF;
    margin-bottom: 20px;
}

.sbl_mid_sml{
    color: #FFFFFF;
    font-size: 18px;
    font-family: "Bebas Neue Regular", "Impact";
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 15px auto 15px auto;
    text-align: center;
}

.cost_centre{
    float: right;
    width: max-content;
}

.cost_centre .select{
    width: 140px;
    margin: 0 auto;
    border-right: 1px dotted #FFFFFF;
    padding: 0;
    font-size: 16px;
}

.tbl{
    position: relative;
    display: table;
    width: 100%;
}

.row{
    position: relative;
    display: table;
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dotted #fff;
}

.row:last-of-type{
    border: none;
}

.window .tbl .row:last-of-type{
    margin: 0 !important;
    padding: 0 !important;
}

.row_cntr{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 20px;
    color: #FFFFFF;
    width: 6%;
    text-align: center;
    border-top: 6px solid #39B3A8;
    padding-top: 2px;
    margin-right: 1%;
    position: absolute;
    top: 0;
    left: 0;
}

.row_cnt{
    float: right;
    width: 100%;
    display: flex;
    /*padding-bottom: 20px;*/
    align-items: center;
    justify-content: center;
}

.mb_row_cnt{
    float: left !important;
    width: 100%;
}

.neutral .content .row_cnt{
    display: unset !important;
}

.row_cnt_cntr{
    float: right;
    width: 91%;
    display: table;
    padding-bottom: 20px;
    align-items: center;
    position: relative;
}

.mb_tbl_ftr{
    width: 100%;
}

.tbl_ftr_row{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 70px;
}

.tbl_ftr_row .itm_prc{
    width: max-content !important;
    font-size: 26px;
    line-height: 26px;
}

.tbl_total{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 26px;
    color: #FFFFFF;
    padding: 26px 0px;
    line-height: 26px;
    margin-right: 10%;
}

.mb_itm_prc{
    text-align: left !important;
}

.mb_itm_sum_prc{
    float: right !important;
}

.tbl .row:last-child .row_cnt{
    border-bottom: none;
}

.row_head{
    float: left;
    width: 100%;
    position: absolute;
    left: 0;
    top: 62px;
    height: 56%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.itm_row_opt{
    color: #fff;
    font-family: "Bebas Neue Regular", "Impact";
    width: 34%;
    margin-top: 4px;
}

.opt_hdl{
    padding-left: 27px;
}

.opt_row{
    padding-left: 84px;
}

.opt_row::before{
    content: " ";
    display: block;
    position: relative;
    background-image: url("../img/arrow_tr.svg");
    width: 15px;
    height: 15px;
    float: left;
}

.tbl .itm_img{
    width: 30%;
    margin-right: 4%;
    padding: 0;
    float: left;
}

.itm_info{
    width: 66%;
    float: left;
    display: table;
}

.itm_num{
    font-size: 25px;
    color: #fff;
    font-family: "Bebas Neue Regular", "Impact";
    margin-bottom: 10px;
    line-height: 21px;
    letter-spacing: 1px;
}

.tbl .itm_desc{
    background-color: transparent;
    text-align: left;
    font-size: 8px;
    padding: 0;
}

.ico_box{
    width: 100%;
    float: left;
    padding-top: 4%;
    margin-bottom: 10%;
}

.itm_prc{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 22px;
    color: #FFFFFF;
    line-height: 26px;
    width: 25%;
    text-align: right;
    float: left;
}


.tbl .unit_cnt{
    float: left;
}

.content aside{
    position: absolute;
    width: max-content;
    top: 100px;
    left: 50%;
    transform: translate(-50%,-0%);
    text-align: center;
    color: #FFFFFF;
    font-size: 35px;
    font-family: "Bebas Neue Regular", "Impact";
    text-transform: uppercase;
    border-bottom: 4px solid #39B3A8;
    letter-spacing: 1px;
}

.content aside{
    width: 100%;
    position: relative;
    top: unset;
    left: unset;
    border-bottom: unset;
    text-decoration: underline;
    text-decoration-color: #39B3A8;
    text-decoration-thickness: 3px;
    text-underline-offset: 5px;
}

.del_ico_wpr{
    position: absolute;
    right: 0;
    bottom: 33%;
    border: 2px solid transparent;
}

.window .del_ico_wpr{
    bottom: 40%;
}

.del_ico_wpr:hover{
    cursor: pointer;
}

.del_ico{
    position: relative;
    width: 15px;
    height: 17px;
    padding: 0 !important;
    cursor: pointer;
    background-image: url("../img/delet_v2_red.svg");
    background-size: cover;
    background-repeat: no-repeat;
}

.check_ico_wpr{
    display: none;
    position: absolute;
    right: -8px;
    top: -7px;
}

.fltr_del_ico{
    width: 15px;
    height: 17px;
    cursor: pointer;
    background-image: url("../img/delet_v2_red.svg");
    background-size: cover;
    background-repeat: no-repeat;
    float: right;
    margin-left: 10px;
}

.border_box{
    position: relative;
    width: 32px;
    height: 32px;
    border: 2px solid #d24555;
}

.check_ico_box{
    position: relative;
    background-color: #d24555;
    width: 32px;
    height: 32px;
    transform-origin: top;
    animation: slideaway 200ms;
}

@keyframes slideaway {
    from { transform: ScaleY(0); opacity: 0;}
    to { transform: ScaleY(1); opacity: 1;}
}

.check_ico{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 17px;
    height: 17px;
    padding: 0 !important;
    cursor: pointer;
    background-image: url("../img/check.svg");
    background-size: contain;
    background-repeat: no-repeat;
    transform: translate(-50%,-50%);
}

.basket_ico{
    width: 2%;
    position: relative;
    right: 0;
    padding: 27px 0;
    cursor: pointer;
    filter: brightness(0) saturate(100%) invert(59%) sepia(20%) saturate(1143%) hue-rotate(125deg) brightness(98%) contrast(93%);
    margin: 0 auto;
    /*filter: brightness(0) saturate(100%) invert(36%) sepia(59%) saturate(1513%) hue-rotate(320deg) brightness(87%) contrast(88%);*/
}

.tbl .basket_ico{
    width: 28px;
    position: absolute;
    bottom: 22%;
    right: 45%;
}

.overview_wpr .tbl .basket_ico{
    bottom: 25%;
    right: 0;
}

.basket_ico:hover{
    filter: brightness(100%) saturate(100%) ;

}

/* overview */
.overview_wpr{
    display: table;
    width: 100%;
    padding:4%;
}

.overview_wpr .flex_wpr{
    position: relative;
    left: unset;
}

/* checkout */
.chkout_wpr{
    position: relative;
    display: table;
    width: 100%;
    margin: 0 auto;
}

.chkout_nav{
    display: flex;
    justify-content: space-between;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    padding: 3%;
    background-color: #141010;
}

.chkout_box{
    position: relative;
    width: 30%;
    display: table;
    padding: 1.5%;
}

.chkout_box:hover{
    cursor: pointer;
}

.chkout_box:hover .chkout_ico{
    opacity: 1;
}

.chkout_box:hover .chkout_sub{
    opacity: 1;
}

.chkout_box::after {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    top: 35%;
    right: -15%;
    background-image: url("../img/tracking_arw.svg");
}

.chkout_box:last-child::after{
    display: none;
}

.chkout_check{
    position: absolute;
    width: 35px;
    left: 50%;
    z-index: 10;
}

.chkout_ico{
    margin: 0px auto 10px auto;
    width: 40px;
    opacity: 0.2;
    transition: 250ms ease-in;
}

.chkout_box:hover .chkout_ico{
    transform: translateY(-6px);
}

.chkout_sub{
    color: #fff;
    text-align: center;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 16px;
    opacity: 0.2;
    transition: 250ms ease-in;
}

.opacity_full{
    opacity: 1 !important;
    transition: 100ms ease-in-out;
}

.chkout_cart{
    display: block;

}

.chkout_accounting{
    display: block;
}

.notes{
    position: relative;
    width: 100%;
    margin: 0 auto 5% auto;
}

.textarea{
    width: 100%;
    height: 100px;
    background-color: #212121;
    margin-bottom: 20px;
    resize: none;
    border: 1px solid #39B3A8;
    color: #fff;
    padding: 5px;
    outline: none;
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 14px;
}

.notes input{
    width: 100%;
    background-color: #212121;
    border: 1px solid #39B3A8;
    color: #fff;
    padding-left: 5px;
    height: 25px;
    outline: none;
}

.label{
    font-size: 20px;
    font-family: "Bebas Neue Regular","impact";
    margin-left: 10px;
    position: relative;
    width: 100%;
    float: left;
    margin-bottom: 6px;
    color: #FFFFFF;
    text-transform: uppercase;
}

.label, .label_chk_box, .label_rdo_box{
    font-size: 20px;
    font-family: "Bebas Neue Regular","impact";
    margin-left: 10px;
    position: relative;
    width: 100%;
    margin-bottom: 6px;
    color: #FFFFFF;
    text-transform: uppercase;
    display: table;
}

.label_chk_box{
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 16px;
    width: max-content;
    margin: unset;
    padding-bottom: 3px;
}

.label_rdo_box{
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 16px;
    width: max-content;
    margin: unset;
    padding-bottom: 3px;
    margin-left: 10px;
    float: left;
}

.label::before{
    width: 1px;
    height: 22px;
    border-left: 2px dotted #FFFFFF;
    position: absolute;
    left: -10px;
    top: 2px;
    content: "";
}

.address{
    width: 100%;
    display: table;
    position: relative;
}

.address_box {
    column-gap: 20px;
    margin-bottom: 10px;
    display: flex;
}

.mb_user{
    display: block !important;
    margin-bottom: 20px;
}

.mb_passwort_reset{
    width: 100% !important;
    float: unset !important;
}

.set_sign_wpr .address_box{
    display: unset;
}

.conm_reset_pw .address_box{
    width: 100% !important;
    float: unset !important;
}

.input{
    width: 100%;
    background-color: #212121;
    border: 1px solid #39b3a8;
    margin-bottom: 10px;
    outline: none;
    color: #fff;
    padding-left: 5px;
    height: 25px;
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 14px;
}

.label_wpr{
    margin-bottom: 20px;
    width: 100%;
    display: table;
}

.chkout_wpr .tbl .label_wpr .label_subline{
    font-size: 12px;
}

.label_subline{
    font-size: 14px;
    color: #39b3a8;
    font-family: "Myriad Pro Regular", "Calibri";
    letter-spacing: .5px;
    display: table;
    width: max-content;
    text-transform: uppercase;
    border-left: 2px solid #39b3a8;
    padding-left: 10px;
}

.eye_icon{
    position: absolute;
    width: 8%;
    top: 57%;
    right: 4%;
}

.chkout_order_top{
    display: table;
    width: 100%;
    margin-bottom: 30px;
}

.overview_wpr .chkout_order_top .flex_wpr{
    bottom: unset;
}

.address_wpr{
    position: relative;
    width: 100%;
    margin-bottom: 10px;
}

/*.separator{*/
/*    border-right: 1px solid #39b3a8;*/
/*}*/

.summary_accounting{
    position: relative;
    width: 100%;
}

.input:disabled{
    border: none;
}

.textarea:disabled{
    border: none;
}

.pen_ico{
    float: left;
    width: 20px;
    margin: 3px 0px 0px 5px;
}

.pen_ico:hover{
    cursor: pointer;
}

/*.btn_pls_min_sumup{*/
/*	font-family: "Bebas Neue Regular", "Impact";*/
/*	font-size: 25px;*/
/*	color: #FFFFFF;*/
/*	line-height: 26px;*/
/*	text-align: center;*/
/*	width: 100%;*/
/*}*/

.unit_cnt_sumup{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 25px;
    color: #FFFFFF;
    line-height: 26px;
    text-align: center;
    width: 8%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,0);
}

/* Summary extra costs */
.row_ec_cnt_cntr{
    width: 100%;
    position: relative;
}

.row_ec_cnt{
    width: 100%;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.row_ec_cnt div{
    width: unset !important;
}

.tbl .reg_label{
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 14px;
    color: #FFFFFF;
    margin-right: 5%;
}

.extra_costs{
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 14px;
    color: #FFFFFF;
}
/* END Summary extra costs */


/* .neutral — REMOVED → now in SCSS */

.content{
    width: 100%;
    position: relative;
    display: table;
    color: #fff;
    font-family: "Myriad Pro Regular", "Calibri";
}

.set_wpr{
    margin-bottom: 50px;
    display: table;
    width: 100%;
}

.set_sign_wpr{
    width: 100%;
    display: table;
    position: relative;
}

.set_sign{
    width: 100%;
    margin-bottom: 20px;
    float: unset !important;
}

.set_btm_box{
    position: absolute;
    bottom: 0;
}

.hdl_wpr{
    width: 100%;
    margin-bottom: 30px;
}

.hdl_wpr .sect_hdl{
    width: max-content;
    float: none;
}

.date{
    font-family: "Bebas Neue";
    font-size: 20px;
}

.wpr:last-child{
    border-bottom: none;
}

.clm_hdl{
    color: #FFFFFF;
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 12px;
    text-transform: uppercase;
    font-weight: lighter;
    width: max-content;
}

.clm{
    position: relative;
    display: table;
}

.clm_spacer{
    display: none;
    width: unset;
    visibility: hidden;
}

.mb_clm{
    float: right;
    clear: right;
}

.mb_clm .tbl_prc{
    text-align: right;
}

.mb_clm_mode{
    width: 100% !important;
    margin-bottom: 15px;
}



.mb_thr_grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-gap: 1em;
    align-items: start;
    grid-template-areas: "ordernumber ordernumber user"
                         "costcenter costcenter dlv"
                         "date date invoice"
                         "price price tracking";
}

.mb_thr_grid > .clm:nth-child(2){
    grid-area: ordernumber;
}

.mb_thr_grid > .clm:nth-child(2){
    text-align: right;
}

.mb_thr_grid > .clm:nth-child(3){
    grid-area: costcenter;
}
.mb_thr_grid > .clm:nth-child(4){
    grid-area: date;
}

.mb_thr_grid > .clm:nth-child(5){
    grid-area: user;
}

.mb_thr_grid > .clm:nth-child(6){
    grid-area: price;
}

.mb_thr_grid > .clm:nth-child(7){
    grid-area: dlv;
}

.mb_thr_grid > .clm:nth-child(8){
    grid-area: invoice;
}

.mb_thr_grid > .clm:nth-child(9){
    grid-area: tracking;
}



.conm_order_history .row_cntr{
    top: 24px;
}

.conm_order_history .row_head{
    display: none;
}

.conm_order_history .row{
    padding: 20px 0;
    border-top: 1px solid transparent;
}

.conm_order_history .row:hover{
    border-top: 1px solid #39b3a8;
    border-bottom: 1px solid #39b3a8;
}

.mode_ico{
    width: 35px;
    float: right;
    padding: 1%;
}

.mode_info{
    float: left;
}

.mode_slct{
    color: #fff;
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 12px;
    font-weight: lighter;
    text-transform: uppercase;
    text-align: right;
}

.mode_txt{
    position: relative;
    font-size: 20px;
    font-family: "Bebas Neue Regular", "Impact";
    letter-spacing: .5px;
}

.tbl_prc{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 25px;
    color: #FFFFFF;
}

.tbl_date{
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 20px;
    color: #FFFFFF;
}

.order_num{
    font-size: 20px;
    font-family: "Bebas Neue Regular", "Impact";
    letter-spacing: .5px;
}

.tbl_select::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background-color: #39b3a8;
    z-index: 90;
}

.tbl_select{
    width: 100%;
    position: relative;
    margin-bottom: 30px;
    float: left;
    padding-left: 10px;
}

.tbl_select .wpr{
    float: left;
}

.tbl_select .select{
    float: left;
    height: 100%;
    min-height: unset;
    padding: unset;
    border-bottom: unset;
}

.tbl_select .select:first-child{
    margin-bottom: 20px;
}

.tbl_select .select:first-child > .wpr .input_box{
    padding-bottom: 20px;
    border-bottom: 1px dotted #fff;
}

.tbl_select .select:nth-child(2){
    margin-bottom: 20px;
}

.tbl_select .select .wpr:nth-child(2){
    width: 100%;
    position: relative;
    float: left;
    clear: unset;
}

.tbl_select .input_box, .tbl_select .input_box div{
    width: 100%;
}

.input_box_four{
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px;
    margin-bottom: 20px;
}

.input_box_four div{
    flex: 1 0 21% !important;
}

.input_big{
    width: 100%;
    background-color: #141010;
    border: 1px solid #ffffff;
    outline: none;
    color: #fff;
    padding: 5px;
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 18px;
}

.input[type=file]{
    float: right;
    padding-left: 0;
}

.input::file-selector-button {
    border-radius: 0;
    border: 1px solid transparent;
    padding: 2px 6px;
    margin-right: 10px;
    background-color: #39b3a8;
    color: #fff;
    font-family: "Myriad Pro Regular", "Calibri";
}

.input::file-selector-button:hover{
    background-color: transparent;
    color: #fff;
    cursor: pointer;
    border: 1px solid #fff;
}

.input_img{
    width: 500px;
}

.wpr:has([type=checkbox]){
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: flex-end;
}

.input[type=checkbox]{
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    padding: unset;
}

.input[type=checkbox]:checked{
    background-image: url("../img/cb_icon_checked.svg");
    background-repeat: no-repeat;
    background-position: center;
}


input[type=radio] {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    float: left;
    margin-right: 5px;
    cursor: pointer;
}

input[type=radio]:hover{
    background-color: #39b3a8;

}

input[type=radio]:checked{
    background-color: #39b3a8;
    border: 1px solid #FFF;

}

.validate_box{
    position: relative;
    width: 100%;
}

.validate_box:has([type=checkbox]){
    width: max-content;
    display: flex;
    margin-right: 10px;
}

.empty{
    border: none;
    width: 40px;
}

.order .fltr{
    display: block;
    top: 0;
    left: 0;
    position: relative;
    padding: 0;
    margin-bottom: 40px;
}
.order .select{
    width: 170px;
    text-align: center;
    border-right: 1px dotted #fff;
    border-left: none;
}

.order .drp{
    z-index: 90;
}

#conm_order{
    margin-top: 80px;
    margin-bottom: 80px;
}

.select p{
    position: relative;
    width: max-content;
    margin: 0 auto;
}

.select p::before {
    content: "";
    background-image: url("../img/arrow_tr.svg");
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    height: 12px;
    width: 12px;
    left: -15px;
    top: 2px;
}


/* login */
.window_mid_login{
    width: 100%;
    border: none;
    margin: unset;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.window_mid_login .close{
    bottom: -250px;
}

.login_wpr{
    width: 200px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.con_market_logo{
    width: 100%;
}

.token{
    width: 100%;
    border: none;
    color: #fff;
    padding: 10px;
    border-bottom: 1px solid #39b3a8;
    outline: none;
    margin-bottom: 15px;
    background-color: #141010;
    letter-spacing: 16px;
    text-indent: 12px;
    font-size: 25px;
}

.conm_registration{
    margin-bottom: 10px;
}

.window:has(.login_wpr){
    height: unset;
    min-height: unset;
}

.window_content:has(.login_wpr){
    height: unset;
    min-height: unset;
}

.login_input{
    width: 100%;
    padding: 10px;
    border: 1px solid #151515;
    outline: none;
    color: #fff;
    background-color: #151515;
    text-align: center;
    font-family: "Myriad Pro Regular", "Calibri";
    font-size: 12px;
    margin-bottom: 3px;
}

.login_input:hover, .login_input:focus{

    border: 1px solid #39b3a8;
    background-color: #0f0f0f;
}

.login_wpr::placeholder{

    color: #585858;
}

.login_wpr .submit{
    background-color: #39b3a8;
    color: #fff;
    margin-top: 15px;
    width: 100%;
    height: 30px;
    outline: none;
    border: none;
    text-align: center;
    text-transform: uppercase;
    font-family: "Bebas Neue Regular", "Impact";
    font-size: 20px;
}

.submit:hover{
    background-color: #277D75;
    cursor: pointer;
}


.password{
    display: block;
    text-align: center;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    font-family: "Myriad Pro Regular", "Calibri";
}

.password:hover{
    color: #39b3a8;
    cursor: pointer;
}

.msg{
    position: fixed;
    top: 0;
    height: 100px;
    text-align: center;
    width: 100%;
    padding: 39px 0;
    text-transform: uppercase;
    color: #fff;
    font-size: 25px;
    font-family: "Bebas Neue Regular", "Impact";

}

.login_wpr .msg{
    position: fixed;
    top: -50px;
    font-size: 20px;
    height: unset;
    padding: 10px;
}

.main_msg{
    display: none;
    margin-bottom: 25px;
    text-align: center;
    line-height: 100%;
    width: 100%;
    padding: 7px;
    box-sizing: border-box;
    text-transform: uppercase;
    color: #fff;
    font-size: 15px;
    font-family: "Myriad Pro Regular", "Calibri";

}

.tbl_msg{
    display: none;
    margin-bottom: 25px;
    text-align: left;
    line-height: 100%;
    width: 100%;
    padding: 7px;
    box-sizing: border-box;
    text-transform: uppercase;
    color: #fff;
    font-size: 14px;
    font-family: "Myriad Pro Regular", "Calibri";

}

.msg span, .tbl_msg span{
    display: block;
    width: 100%;
    margin: 0 auto;
}

.succ{
    background-color: #39b3a8;
}

.err {
    background-color: #d24555;
}

.succ span::before{
    content: url("/market/view/content/img/success.svg");
    position: relative;
    float: left;
    width: 15px;
    margin-right: 5px;
}

.err span::before{
    content: url("/market/view/content/img/error.svg");
    position: relative;
    float: left;
    width: 15px;
    margin-right: 5px;
    margin-bottom: 30px;
}

.login_wpr .err span::before{
    margin: unset;
    width: 18px;
}

.sect_user form{
    max-width: 50%;
}

.sect_user input{
    width: 100%;
    background-color: #212121;
    border: 1px solid #39b3a8;
    margin-bottom: 10px;
    outline: none;
    color: #fff;
    padding-left: 5px;
    height: 25px;
}

.sect_user span{
    font-size: 11px;
    float: left;
    clear: left;
    margin-bottom: 10px;
}
.sect_user .button{
    margin-top: 33px;
}


/* skeleton loader */
.skeleton-loader:empty {
    width: 100%;
    height: 15px;
    display: block;
    background: linear-gradient(
            to right,
            rgba(255, 255, 255, 0),
            rgba(255, 255, 255, 0.5) 50%,
            rgba(255, 255, 255, 0) 80%
    ),
    lightgray;
    background-repeat: repeat-y;
    background-size: 50px 500px;
    background-position: 0 0;
    animation: shine 1s infinite;
}

@keyframes shine {
    to {
        background-position: 100% 0;
    }
}

/* fav animation */

.fav_blk_active, .fav_wht_active{
    animation: cart 1s cubic-bezier(0.17, 0.89, 0.32, 1.49);
    position: relative;
}

.fav_blk_active::after, .fav_wht_active::after {
    animation: inherit;
    animation-timing-function: ease-out;
}

.fav_blk_active::after, .fav_wht_active::after {
    will-change: opacity, box-shadow;
    animation-name: particles;
}

.fav_blk_active::after, .fav_wht_active::after, .fav_blk_active::before, .fav_wht_active::before {
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    content: '';
}

.fav_blk_active::after, .fav_wht_active::after {
    margin: -0.1875rem;
    width: 0.4rem;
    height: 0.4rem;
    box-shadow: 0.32476rem -4rem 0 -0.20625rem #ff8080, -1.32476rem -3.625rem 0 -0.20625rem #ffed80, 3.54798rem -2.61656rem 0 -0.20625rem #ffed80, 3.84982rem -0.89057rem 0 -0.20625rem #a4ff80, 3.85252rem 1.98418rem 0 -0.20625rem #a4ff80, 2.63145rem 1.2675rem 0 -0.20625rem #80ffc8, 2.00905rem 3.84381rem 0 -0.20625rem #80ffc8, 2.43154rem 3.22414rem 0 -0.20625rem #80c8ff, -2.59425rem 3.562rem 0 -0.20625rem #80c8ff, -3.84635rem 1.50595rem 0 -0.20625rem #a480ff, -3.99705rem -1.35095rem 0 -0.20625rem #a480ff, -3.48692rem -2.90073rem 0 -0.20625rem #ff80ed, -3.14301rem -4.12438rem 0 -0.20625rem #ff80ed, -5.25479rem -2.38275rem 0 -0.20625rem #ff8080;
}

.fav_blk_active, .fav_wht_active {
    animation: rotate 650ms 1 ease-in-out;

}


/* ===================================
   LEGACY: Cart Icon Styles
   DEPRECATED - Now handled by:
   - CartIcon.vue (scoped styles)
   - assets/scss/components/_cart-icon.scss (keyframes)
   =================================== */

/* Basic cart_ico styles kept for legacy compatibility */
.cart_ico{
    position: relative;
}

.toggle_cart {
    align-self: center;
    color: #aab8c2;
    font-size: 2em;
    user-select: none;
    cursor: pointer;
}

/* Rotate animation - used by favorites (.fav_blk_active, .fav_wht_active) */
@keyframes rotate {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }
    30%, 50%, 70% {
        transform: translate3d(-3px, 0, 0);
    }
    40%, 60% {
        transform: translate3d(3px, 0, 0);
    }
}


/* Homepage (slider, thr_grid, cat_box) — REMOVED → now in SCSS */

/* Ecolabel */
.eco_wpr{
    position: relative;
    width: 100%;
    float: left;
}

.eco_logo {
    width: 70px;
    float: left;
}

.eco_wpr .hdl_lft{
    float: right;
    margin-top: 18px;
    margin-bottom: unset;
}

.txt_wpr{
    position: relative;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    float: left;
    clear: left;
}

.txt_box{
    display: table;
    width: 100%;
    padding: 20px 0;
    border-bottom: 1px solid #39b4a9;
}

.txt_box:last-child{
    border: none;
}


.hdl_full{
    font-family: "Bebas Neue Regular", "Impact";
    color: #39b4a9;
    font-size: 30px;
    text-align: left;
    margin-bottom: 10px;
}

.txt_gen{
    font-family: "Myriad Pro Regular","Calibri";
    font-size: 14px;
    color: #fff;
    text-align: justify;
    hyphens: auto;
}

/* footer area */
footer{
    position: relative;
    display: table;
    padding: 0 8%;
    width: 100%;
    margin: 0 0 100px 0;
}

footer .logo_box{
    width: 50%;
    transform: unset !important;
}

.logo_box_ftr{
    width: 50%;
    margin-bottom: 40px;
}

.ftr_info_wpr{
    position: relative;
    float: right;
    width: 100%;
}

.ftr_info_box{
    width: 100%;
    float: left;
}

.ftr_info_hdl{
    font-family: "Bebas Neue Regular", "Impact";
    color: #39b4a9;
    font-size: 25px;
    text-align: left;
    margin-bottom: 20px;
}

.ftr_info_txt{
    display: table;
    float: left;
    width: 45%;
}

.ftr_info_txt:nth-child(2n){
    margin-right: 10%;
}

.ftr_info_txt span, .ftr_info_box a{
    float: left;
    clear: left;
    color: #686868;
    font-family: "Myriad Pro Regular","Calibri";
    font-size: 12px;
}

.ftr_info_txt span{
    margin-bottom: 5px;
}

.ftr_info_txt a{
    margin-bottom: 10px;
    transition: color 200ms ease-in-out;
}

.ftr_info_txt{
    margin-bottom: 20px;
}

.mail{
    clear: unset !important;
    color: #39b4a9 !important;
}

.ftr_info_box a:hover{
    color: #39b4a9;
    cursor: pointer;
}

.mail:hover{
    border-bottom: 1px solid #39b4a9;
}

/* .dot_spacer — REMOVED → now in SCSS */
