

product add-to-cart {
display: flex;
position: absolute;
/*bottom: calc(var(--margin) / 2 );
right: calc(var(--margin) / 2 );*/
bottom: 0;
right: 0;
width: 5.7rem;
height: 5.7rem;
}

product add-to-cart::after {
content: "+";
display: flex;
position: absolute;
top: 50%;
left: 50%;
width: 4.2rem;
height: 4.2rem;
transform: translate(-50%,-50%);
font-size: 4.2rem;
line-height: 4.2rem;
background-color: white;
border-radius: 100%;
justify-content: center;
}


p.price {
    font-size: 1.8rem;
}

.price {
color: var(--money)!important;
}


.button {
border-radius: 10rem;
font-size: 1.6rem;
background-color: var(--brand);
white-space: nowrap;
padding: calc(var(--margin) * 1.5);
text-transform: uppercase;
}

phone-access {
display: flex;
display: none;
position: relative;
/*flex: 0 0 100%;*/
width: calc(100% - calc(var(--margin) * 6 ));
/*height: fit-content;APPLESUX*/
margin-bottom: calc(var(--margin) * 1 );
/*padding: calc(var(--margin) * 2 );*/
padding: calc(var(--margin) * 2 );
background-color: var(--light);
background-color: white;
flex-direction: column;
box-shadow: var(--deep-shadow);
align-self: center;
border-radius: var(--rounded);
}

phone-access h1 {
font-size: 2.25rem;
text-align: center;
}

phone-access input {
font-size: 2rem;
}

phone-access form-wrapper {
margin-bottom: 0!important;
}

form-wrapper {
display: flex;
position: relative;
width: 100%;
margin-top: calc(var(--margin) * 2 );
margin-bottom: var(--margin);
}





categories-with-overflow {
display: flex;
position: relative;
/*flex: 0 0 100%;*/
width: calc(100% - var(--margin));

/*/*height: fit-content;APPLESUX*/*/

/*margin-top: calc(var(--margin) * 1 );*/
margin: calc(var(--margin) * 0.5 );
padding: var(--margin) 0;
padding: 0;
padding-right: 0;
overflow-x: auto;
flex-direction: column;
}

categories-with-overflow h:first-of-type {
/*margin-left: var(--margin);*/
text-align: center;
display: none;
}

categories-slider {
display: flex;
position: relative;
flex: 0 0 100%;
/*height: fit-content;APPLESUX*/
/*margin-right: var(--margin);*/
/*margin-top: calc(var(--margin) * 1 );*/
padding: 0 var(--margin);
padding-right: 0;
overflow-x: auto;
flex-direction: column;
}

categories-slider.centered {
align-items: center;
}

categories-slider::-webkit-scrollbar {
width: 0px;
height: 0px;
background: transparent; /* make scrollbar transparent */
}

categories-list {
display: flex;
position: relative;
/*width: fit-content;*/
width: 100%;;
/*margin-right: var(--margin);*/
margin-left: 0;
flex-direction: row;
}

categories-slider.centered categories-list {
width: calc(100% - (var(--margin) * 1));
}





categories-list category {
display: flex;
position: relative;
width: calc(50% - (var(--margin) * 2.5) - 0.6rem);
padding: calc(var(--margin) / 1) calc(var(--margin) / 1);
margin-left: calc(var(--margin) / 2);
margin-right: calc(var(--margin) / 2);
background-color: var(--dark);
background-color: var(--light);
background-color: white;
border-radius: var(--rounded-xs);
/*border: 0.2rem solid var(--brand);*/
flex-direction: column;
flex-direction: row;
align-items: center;
box-shadow: var(--shadow);
justify-content: left;
}

categories-list category {
width: calc(50% - (var(--margin) * 2.5) - 0.6rem);
padding: calc(var(--margin) / 1) calc(var(--margin) / 1);
flex-direction: row;
justify-content: left;
border: 0.3rem solid white;
}









categories-slider category {
display: flex;
position: relative;
width: 20vw;
flex-shrink: 0;
flex-grow: 0;
margin-right: var(--margin);
/*padding: calc(var(--margin) / 2 ) 0;*/
padding: calc(var(--margin) / 1) calc(var(--margin) / 1);
background-color: var(--dark);
background-color: var(--light);
background-color: white;
border-radius: var(--rounded-xs);
/*border: 0.2rem solid var(--brand);*/
flex-direction: column;
flex-direction: row;
align-items: center;
box-shadow: var(--shadow);
}

categories-slider.centered category {
width: calc(50% - (var(--margin) * 2.5) - 0.6rem);
padding: calc(var(--margin) / 1) calc(var(--margin) / 1);
flex-direction: row;
justify-content: left;
border: 0.3rem solid white;
}

categories-slider category:last-of-type {
margin-right: calc(var(--margin) * 2 );
}

categories-slider.centered category:last-of-type {
margin-right: 0!important;
}


categories-list category icon {
display: flex;
position: relative;
width: 69%;
width: 60%;
aspect-ratio: 1 / 1;
font-size: 3rem;
font-size: 2.5rem;
align-items: center;
justify-content: center;
}

categories-list category icon {
width: unset;
aspect-ratio: unset;
}

categories-list category span {
display: flex;
position: relative;
padding: calc(var(--margin) / 2 );
padding-top: 0.2rem;
/*color: var(--brand);*/
font-size: 1.5rem;
text-align: center;
}


categories-list category span {
padding: unset;
/*padding-top: 0.2rem;*/
padding-left: var(--margin);
/*color: var(--brand);*/
font-size: 2rem;
font-weight: 600;
}

categories-list category.active span {
color: var(--brand-sub);
}


subcats subcat.active h2 {
font-weight: bold;
}





invite-a-friend {
display: flex;
display: none;
position: relative;
flex: 1;
margin: /*calc(var(--margin) * 2 )*/ var(--margin);
margin-left: 0;
margin-top: calc(var(--margin) * 2 );
margin-right: calc(var(--margin) * 1 );
padding: calc(var(--margin) * 2 );
padding-left: calc(var(--margin) * 3 );
flex-direction: row-reverse;
background-color: var(--dark);
background-color: var(--brand-sub);
background-color: #840EE8;
border-radius: 0 var(--rounded) var(--rounded) 0;
color: var(--brand);
color: var(--light);
}

invite-a-friend icon {
display: flex;
position: relative;
height: 100%;
aspect-ratio: 1 / 1;
margin-left: calc(var(--margin) * 1 );
/*font-family: var(--subfont);*/
font-size: 4.2rem;
font-weight: bold;
align-self: center;
align-items: center;
color: var(--money);
color: var(--brand);
}

invite-a-friend content {
display: flex;
position: relative;
flex: 1;
margin-top: calc(var(--margin) / -2 );
flex-direction: column;
font-size: 1.8rem;
}

invite-a-friend content h1 {
font-size: 2.5rem;
color: whitesmoke;
}

invite-a-friend content p {
margin: calc(var(--margin) / 2 ) 0;
color: var(--light);
color: whitesmoke;
}

invite-a-friend content disclaimer {
margin-top: calc(var(--margin) / 2 );
color: var(--light);
color: whitesmoke;
}


disclaimer {
font-size: 1.5rem;
font-style: italic;
opacity: 0.69;
}






icon span {
font-size: 0.69em;
}







/*weekly-deals {
display: flex;
position: relative;
flex: 0 0 100%;
/*height: fit-content;APPLESUX*/
margin: var(--margin) 0;
padding: calc(var(--margin) * 1 );
flex-direction: column;
}*/

weekly-deals {
display: flex;
position: relative;
flex: 0 0 100%;
/*height: fit-content;APPLESUX*/
/*margin-top: var(--margin);*/
/*padding: var(--margin) 0;*/
padding-right: 0;
overflow-x: auto;
flex-direction: column;
}

weekly-deals h:first-of-type {
margin-left: var(--margin);
}

/*weekly-deals deals {
display: flex;
position: relative;
width: 100%;
margin-top: var(--margin);
flex-direction: row;
flex-wrap: wrap;
}*/

weekly-deals deals {
display: flex;
position: relative;
flex: 0 0 100%;
/*height: fit-content;APPLESUX*/
/*margin-right: var(--margin);*/
/*margin-top: calc(var(--margin) * 1 );*/
/*margin-top: calc(var(--margin) * 1 );*/
padding: var(--margin);
padding-right: 0;
overflow-x: auto;
flex-direction: column;
flex-direction: row;
}

weekly-deals deals::-webkit-scrollbar {
width: 0px;
height: 0px;
background: transparent; /* make scrollbar transparent */
}

weekly-deals deal {
display: flex;
position: relative;
flex-shrink: 0;
/*width: calc(50% - (calc(var(--margin) * 3.5 )) );*/
width: calc(42% - (calc(var(--margin) * 0.5 )) );
margin-right: var(--margin);
/*width: calc(42% - (calc(var(--margin) * 3.5 )) );
padding: calc(var(--margin) * 1.5 );*/
flex-direction: column;
background-color: var(--light);
border-radius: var(--rounded);

box-shadow: var(--shadow);
overflow: hidden;
}

weekly-deals deal:last-of-type {
margin-right: calc(var(--margin) * 3 );
}

/*weekly-deals deal:nth-of-type(2n) {
margin-right: 0;
}*/

weekly-deals deal icon {
display: flex;
position: relative;
width: calc(100% - (var(--margin) * 2) );
/*height: 6.9rem;*/
aspect-ratio: 1 / 1;
padding: calc(var(--margin) * 1 );
font-size: 4.2rem;
font-weight: bold;
align-self: center;
align-items: center;
color: var(--money);
/*background: url(/static/images/logo-1.png) 0 / auto calc(100% - (var(--margin) * 2 ));*/
background-position: center;
background-repeat: no-repeat;
background-color: white;
}

weekly-deals deal icon img {
width: 100%;
height: 100%;
object-fit: contain;
}

weekly-deals deal content {
display: flex;
position: relative;
flex: 1;
/*margin-top: calc(var(--margin) * 1 );*/
padding: calc(var(--margin) * 1.5 ) calc(var(--margin) * 1 );
flex-direction: column;
font-size: 1.8rem;
}

weekly-deals deal content p {
display: none;
margin: calc(var(--margin) / 2 ) 0;
opacity: 0.69;
}

weekly-deals deal content category {
    /*display: none;*/
/*margin-top: calc(var(--margin) / 2 );*/
margin-top: var(--margin);
}


content category {
font-size: 1.5rem;
font-style: italic;
opacity: 0.69;
margin-top: auto;
}






product-list {
display: flex;
position: relative;
flex: 0 0 100%;
/*height: fit-content;APPLESUX*/
/*margin: var(--margin) 0;*/
padding: calc(var(--margin) * 1 );
flex-direction: column;
}

/*product-list h1 {
text-align: center;
}*/

product-list products {
display: flex;
position: relative;
width: 100%;
/*margin-top: calc(var(--margin) * 1 );*/
flex-direction: column;
}

product-list product {
display: flex;
position: relative;
/*width: calc(100% - (calc(var(--margin) * 4 )) );*/
width: calc(100% - (calc(var(--margin) * 3 )) );
width: 100%;
flex: 1;
margin-bottom: calc(var(--margin) * 1.5 );
/*padding: calc(var(--margin) * 2 );*/
/*padding: calc(var(--margin) * 1.5 );*/
flex-direction: row;
background-color: var(--light);
border-radius: var(--rounded);

box-shadow: var(--shadow);
overflow: hidden;
}

product-list.variants product {
min-height: 12rem;
}

product-list product:last-of-type {
margin-bottom: 0;
}

product-list product icon {
display: flex;
position: relative;
/*height: 6.9rem;*/
width: 33%;
aspect-ratio: 1 / 1;
/*margin-right: calc(var(--margin) * 2 );*/
/*margin-right: calc(var(--margin) * 1.5 );*/
padding: calc(var(--margin) * 1 );
font-size: 4.2rem;
font-weight: bold;
align-self: center;
align-items: center;
color: var(--money);
background: url(/static/brands/VIHO_TURBO_10000_Puff_Disposable__59569.jpg) 0 / auto calc(100% - (var(--margin) * 2) );
background-position: center;
background-repeat: no-repeat;
background-color: white;
}

product-list.variants product icon {
display: none;
}

product-list product content {
display: flex;
position: relative;
flex: 1;
/*margin-top: calc(var(--margin) / -2 );*/

/*padding: calc(var(--margin) * 1.5 );*/
padding: calc(var(--margin) * 1.5 ) calc(var(--margin) * 1 );
flex-direction: column;
font-size: 1.8rem;
}

product-list.variants product content {
margin-left: calc(var(--margin) / 2 );
}

product-list.variants product content h2 {
font-size: 2rem;
}

product-list.folders product content h2 {
font-size: 2rem;
}

product-list product content h2 {
text-transform: capitalize;
}

product-list product content p {
/*font-size: 1.5rem;*/
/*margin: calc(var(--margin) / 2 ) 0;*/
margin-top: auto;
opacity: 0.69;
}

product-list product .price {
/*font-size: 1.5rem;*/
/*margin: calc(var(--margin) / 2 ) 0;*/
margin-top: auto;
opacity: 1;
}

product-list product content category {
margin-top: calc(var(--margin) / 2 );
}

product-list.variants product content category {
display: none;
}






page-cart {
z-index: 2500;
display: flex;
position: fixed;
right: calc(var(--margin) * 1.5);
bottom: calc(var(--margin) * 1.5);
width: 8rem;
height: 8rem;
background-color: var(--dark);
border-radius: 100%;
border: 0.1rem solid var(--brand);
/*box-shadow: rgba(69,69,69, 0.25) 0px 54px 55px, rgba(69,69,69, 0.12) 0px -12px 30px, rgba(69,69,69, 0.12) 0px 4px 6px, rgba(69,69,69, 0.17) 0px 12px 13px, rgba(69,69,69, 0.09) 0px -3px 5px;*/
/*box-shadow: rgba(90,180,90, 0.60) 0px 0rem 7rem 0.5rem;*/
}

page-cart::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 64%;
height: 64%;
background: var(--brand);
-webkit-mask:url('/static/images/shopping-cart.png') center/contain;
          mask:url('/static/images/shopping-cart.png') center/contain;
/*background-image: url('/static/images/shopping-cart.png');
background-size: 69%;
background-position: center;
background-repeat: no-repeat;*/
/*filter: invert();*/
}

page-cart cart-count {
    z-index: 1;
display: block;
position: absolute;
top: -1.5rem;
right: -1.5rem;
right: 0;
min-width: 3rem;
height: 3rem;
padding: 0 0.69rem;
background-color: var(--money);
font-family: var(--font);
font-size: 1.8rem;
line-height: 3rem;
/*font-weight: bold;*/
color: white;
border-radius: 10rem;
text-align: center;
align-self: center;
pointer-events: none;
}







added-to-cart {
display: none;
position: absolute;
top: 50%;
right: 100%;
width: fit-content;
height: 100%;
height: 4.2rem;
transform: translate(0,-50%);
}

added-to-cart cart-count {
display: flex;
position: relative;
min-width: 4.2rem;
/*margin-left: var(--margin);*/
font-family: var(--font);
font-size: 2rem;
font-weight: 600;
text-align: center;
align-self: center;
justify-content: center;
}


add-to-cart.in-cart {
margin-left: 10rem;
}


add-to-cart.in-cart added-to-cart {
display: flex;
}



add-to-cart::after {
content: "+";
position: absolute;
top: calc(50% - 0.4rem);
left: 50%;
transform: translate(-50%,-50%);
font-family: var(--font);
font-size: 5rem;
line-height: 5rem;
color: rgba(0,0,0,0.69);
}

/*.outofstock add-to-cart {
display: none!important;
}*/

sub-from-cart {
display: flex;
position: relative;
width: 5rem;
height: 5rem;
/*border: 0.3rem solid rgba(0,0,0,0.5);*/
background-color: rgba(0,0,0,0.075);
border-radius: 100%;
/*margin-left: var(--margin);*/

width: 4.2rem;
height: 4.2rem;
font-size: 4.2rem;
line-height: 4.2rem;
background-color: white;
border-radius: 100%;
justify-content: center;
}

sub-from-cart::after {
content: "-";
position: absolute;
top: calc(50% - 0.4rem);
left: 50%;
transform: translate(-50%,-50%);
font-family: var(--font);
font-size: 5rem;
line-height: 5rem;
color: rgba(0,0,0,0.69);
}







popper {
z-index: 9998;
display: flex;
display: none!important;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
max-height: unset!important;
background-color: rgba(0,0,0,0.2);
backdrop-filter: blur(3px);
}

popper.open {
display: flex!important;
}

pop-tab {
display: flex;
position: fixed;
bottom: 0;
left: 0;
top: 0;
right: 0;
width: 100%;
min-height: 20rem;
background-color: white;
/*border-radius: var(--rounded) var(--rounded) 0 0;*/
}


product-view {
display: flex;
display: none;
position: relative;
flex: 1;
flex-direction: column;
/*padding: calc(var(--margin) * 2);*/
}

product-view h2 {
text-align: center;
margin-bottom: var(--margin);
}

product-view.show {
display: flex;
}

product-view product-details {
display: flex;
position: relative;
/*margin: calc(var(--margin) / 2) 0;*/
margin: calc(var(--margin)* 2);
margin-bottom: calc(var(--margin) * 2);
flex-direction: column;
align-items: center;
}

product-details h1 { 
text-transform: capitalize;
}

product-view product-image {
display: flex;
position: relative;
width: 33%;
width: 50%;
/*height: 50%;*/
aspect-ratio: 1 / 1;
margin-bottom: var(--margin);
background-color: slategrey;
}

product-view product-image img {
width: 100%;
height: 100%;
/*background-size: auto 100%;*/
max-height: 50vw;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}


product-variations {
display: flex;
position: relative;
/*flex: 1;*/
/*margin-top: calc(var(--margin) * 1.5);*/
flex-direction: column;
overflow-y: auto;
}


product-view variation-list {
padding-left: 0!important;
padding-right: 0!important;
}

product-view box-list {
margin-bottom: 0!important;
/*max-height: 42vh;
overflow-y: scroll;*/
overflow-y: auto;
/*border-bottom: 0.1rem solid black;*/
/*overscroll-behavior: contain;*/
}

product-view box-list list-item {
/*padding: calc(var(--margin) * 1.5) var(--margin);*/
/*padding: var(--margin);*/
/*padding: calc(var(--margin) * 1.5) var(--margin);*/

/*width: calc(100% - ( var(--margin) * 3) - 0.2rem);*/
width: calc(100% - ( var(--margin) * 3) - ( var(--margin) * 4) - 0.4rem);
padding: calc(var(--margin) * 1.5);
border-radius: var(--rounded-xs);
border-radius: 10rem;

margin-left: calc(var(--margin) * 2);
margin-right: calc(var(--margin) * 2);
}

product-view box-list list-item:first-of-type {
margin-top: calc(var(--margin) * 1.5);
}

product-view box-list list-item * {
pointer-events: none;
}

product-view box-list list-item.active {
border-color: var(--brand);
background-color: rgba(107,196,12,0.21);
}

product-view box-list list-item.outofstock {
background-color: rgba(221,0,170,0.05);
background-color: rgba(232,126,14,0.09);
background-color: #FDF3E9;
background-color: var(--light);
opacity: 0.69;
}

.outofstock item-details .price {
    text-decoration: line-through;
}





variation-list {
display: flex;
position: relative;
flex: 0 0 100%;
/*height: fit-content;APPLESUX*/
/*margin: calc(var(--margin) * 0) 0;*/
/*margin-bottom: calc(var(--margin) * 10);*/
/*padding: calc(var(--margin) * 1);*/
flex-direction: column;
}

box-list {
display: flex;
position: relative;
/*width: 100%;*/
/*padding: calc(var(--margin) / 2) 0;*/

margin-bottom: calc(var(--margin) * 1.5);
background-color: white;
/*border-radius: var(--border-radius);*/
flex-direction: column;
/*border: 0.1rem solid black;
background-color: var(--light);
background-color: black;*/
}

box-list list-item {
display: flex;
position: relative;
width: calc(100% - ( var(--margin) * 2) - 0.2rem);
/*width: 100%;*/
padding: calc(var(--margin) * 1.5) var(--margin);
margin-bottom: var(--margin);
font-family: var(--font);
/*font-size: 1.6rem;*/
font-size: 1.8rem;
line-height: 2.4rem;
flex-direction: row;
border-bottom: 0.1rem solid black;
border: 0.2rem solid rgba(0,0,0,0.21);
background-color: white;
}

box-list list-item:last-of-type {
/*border-bottom: none;*/
/*margin-bottom: calc(var(--margin) * 2.5);*/
/*margin-bottom: var(--margin);*/
margin-bottom: calc(var(--margin) * 10);
}

list-item item-details {
display: flex;
position: relative;
width: fit-content;
/*min-width: 50%;*/
/*flex: 1;*/
/*width: calc(100% - 5rem);*/
width: 100%;
}

list-item.head {
padding: calc(var(--margin) * 1.5) var(--margin);
background-color: whitesmoke;
border-radius: var(--border-radius) var(--border-radius) 0 0;
}

list-item.head item-details {
font-weight: bold;
font-size: 1.8rem;
justify-content: center;
}

item-details .stock {
margin-left: auto;
color: var(--brand-sub);
}

item-details .price {
margin-left: auto;
color: var(--money);
}

list-item span {
display: flex;
position: relative;
/*white-space: nowrap;*/
text-transform: capitalize;
}

list-item.outofstock item-details span:first-of-type {
text-decoration: line-through;
opacity: 0.69;
}

item-stock {
display: flex;
display: none;
position: absolute;
width: fit-content;
top: 50%;
right: 0;
transform: translate(0,-50%);
align-items: center;
}


item-stock add-to-cart {
display: flex;
position: relative;
width: 5rem;
height: 5rem;
margin-left: var(--margin);
}

item-stock add-to-cart::after {
    --size: 4rem;
content: "+";
display: flex;
position: absolute;
top: 50%;
left: 100%;
width: var(--size);
height: var(--size);
transform: translate(-100%,-50%);
font-size: var(--size);
line-height: var(--size);
background-color: whitesmoke;
border-radius: 100%;
justify-content: center;
}





.header-button {
    display: flex;
    position: relative;
    margin-left: auto;
    padding: var(--margin);
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--brand);
    /*border: 0.1rem solid var(--brand);*/
    border-radius: 5rem;
    }





favorite {
z-index: 999;
display: flex;
position: absolute;
top: var(--margin);
right: var(--margin);
width: 4.2rem;
height: 4.2rem;
background-color: white;
border-radius: 100%;
border: 0.1rem solid var(--line);
border: 0.1rem solid black;
filter: grayscale(1);
}

favorite::after {
content: "❤️";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
font-size: 2rem;
}

favorite.active {
filter: grayscale(0);
}


product-close {
z-index: 999;
display: flex;
position: absolute;
top: var(--margin);
left: var(--margin);
width: 4.2rem;
height: 4.2rem;
background-color: white;
border-radius: 100%;
border: 0.1rem solid var(--line);
border: 0.1rem solid black;
opacity: 0.42;
}

product-close::after {
content: "+";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%) rotate(-45deg);
font-size: 4.2rem;
}






blackout {
    z-index: 2499;
display: none;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 100vw;
height: 100vh;
}

blackout.open {
display: block;
background-color: rgba(0,0,0,0.69);
}



modal,
cart {
z-index: 2500;
display: flex;
position: fixed;
top: 50%;
left: 50%;
width: 100vw;
/*height: 100vh;*/
/*height: fit-content;APPLESUX*/
/*padding: 0 calc(var(--margin) / 2);*/
transform: translate(-50%,-50%);
/*background-color: rgba(0,0,0,.16);
background-color: black;*/
/*border-radius: var(--border-radius);*/
opacity: 0;
transition: opacity 0.333s linear;
will-change: opacity;
pointer-events: none;
}

/*history product-list::after {
    z-index: 10;
content: "Customer History";
display: inline-block;
position: absolute;
bottom: 85%;
left: 50%;
transform: translate(-50%, -2rem);
font-family: var(--font);
font-size: 3rem;
}*/


modal.open,
cart.open {
display: flex;
opacity: 1;
pointer-events: all;
}

modal h2,
cart h2 {
position: absolute;
/*top: 0;
left: 50%;
transform: translate(-50%, 50%);
align-self: center;*/
left: 2rem;
top: 1rem;
transform: translate(0, 50%);
}


cart customer-cart {
z-index: 10;
display: flex;
position: absolute;
top: 50%;
left: 50%;
width: 89vw;
/*height: fit-content;APPLESUX*/
/*height: 69vh;*/
max-height: 69vh;
padding: calc(var(--margin) / 1);
padding-top: 5rem;
transform: translate(-50%,-50%);
background-color: white;
border-radius: var(--border-radius);
/*overflow-y: scroll;*/
flex-direction: column;
}

customer-cart #Clear-Cart {
display: flex;
position: absolute;
top: 0.5rem;
right: 2rem;
padding: 0.5rem 0;
transform: translate(0,50%);
font-size: 1.8rem;
color: var(--brand-alt);
}

cart customer-cart cart-button {
display: flex;
position: absolute;
top: 100%;
left: 50%;
transform: translate(-50%,0);
margin-top: calc(var(--margin) * 2);
}

cart customer-cart cart-button button {
padding: calc( var(--margin) / 0.75 ) calc( var(--margin) * 2 );
}

cart product-list {
max-height: 100%;
overflow-x: hidden;
overflow-y: scroll;
}

cart product-list span {
color: var(--dark);
}



/*.button-confirm {
    background-color: initial;
    background-image: none;
    border-style: none;
    overflow: visible;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    z-index: 0;
}

.button-confirm {
    background-color: var(--brand);
    border: 0.2rem solid var(--brand);
    font-weight: 400;
    text-transform: uppercase;
    /* box-shadow: 0 2px 4px -1px rgba(0,0,0,.16), 0 4px 5px 0 rgba(0,0,0,.05), 0 1px 10px 0 rgba(0,0,0,.08); *XXX/
    white-space: nowrap;
}*/



/*.button-confirm:before {
    content: "";
    /* background: linear-gradient(45deg, #E83E0E, #E87E0E, #fffb00, #7FE80E, #68933A, #0EAFE8, #6425E8, #CB0EE8, #E83E0E); *XXX/
    background: linear-gradient(45deg, #6BC40C, #559C09, #7FE80E, #3F7307, #284A04, #3F7307, #7FE80E, #559C09, #6BC40C);
    position: absolute;
    top: -2px;
    left: -2px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    -webkit-filter: blur(5px);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    animation: glowing-button-85 30s linear infinite;
    transition: opacity 0.3s ease-in-out;
    border-radius: 10rem;
}

.button-confirm:after {
    /* background-color: white; *XXX/
    background-color: initial;
    background-image: linear-gradient(92.83deg, var(--brand) 0, var(--brand) 100%);
    bottom: 0.6rem;
    content: "";
    display: block;
    left: 0.6rem;
    overflow: hidden;
    position: absolute;
    right: 0.6rem;
    top: 0.6rem;
    transition: all 100ms ease-out;
    z-index: -1;
}*/


button, .button {
    display: inline-block;
    position: relative;
    width: fit-content;
    /*height: fit-content;APPLESUX*/
    /*padding: calc(var(--margin) / 2);*/
    padding: calc( var(--margin) / 0.75 ) calc( var(--margin) * 2 );
    background-color: transparent;
    color: var(--dark);
    border: 0.2rem solid var(--dark);
    text-align: center;
    font-family: var(--font);
    font-size: 1.6rem;
    text-decoration: none;
    /* border-radius: calc(var(--border-radius) / 2); */
    /* border-radius: calc(var(--margin) / 2); */
    /* border-radius: 0.42rem calc(var(--margin) / 2); */
    border-radius: 0.69rem calc(var(--margin) / 1.25);
    border-radius: 10rem;

}


.button-confirm {
    background-color: var(--brand);

}


product-list {
display: flex;
position: relative;
flex: 1;
/*margin: var(--margin) calc( var(--margin) / 2 );*/
margin: var(--margin) 0;
flex-direction: column;
}

product-list points {
display: flex;
position: relative;
width: 100%;
flex-direction: row;
margin-top: calc( var(--margin) / 2 );
margin-top: 0;
}

product-list span {
/*line-height: 4rem;*/
color: white;
}

product-list span:last-of-type {
margin-left: auto;
color: var(--money);
}






product-list detailed-product {
display: flex;
position: relative;
width: 100%;
flex-direction: column;
margin-top: calc( var(--margin) / 2 );
margin-top: 0;
padding: calc( var(--margin) / 2 ) 0;
border-bottom: 0.1rem solid gray
}

detailed-product uncart {
display: flex;
position: relative;
height: 4.2rem;
aspect-ratio: 1 / 1;
margin-left: calc( var(--margin) );
}

detailed-product uncart::after {
content: "+";
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
transform: translate(-50%,-50%) rotate(45deg);
font-family: var(--font);
font-size: 4.2rem;
line-height: 4.2rem;
align-self: center;
text-align: center;
background-color: var(--light);
border-radius: 10rem;
box-shadow: 0 2px 4px -1px rgba(0,0,0,.16), 0 4px 5px 0 rgba(0,0,0,.05), 0 1px 10px 0 rgba(0,0,0,.08);
}

product-list span {
font-family: var(--font);
/*line-height: 4rem;*/
color: white;
}

product-list span:last-of-type {
margin-left: auto;
}

detailed-product product-details {
display: flex;
position: relative;
width: 100%;
/*height: fit-content;APPLESUX*/
flex-direction: row;
align-items: center;
}

detailed-product time {
display: flex;
position: relative;
width: 100%;
/*height: fit-content;APPLESUX*/
flex-direction: row;
margin-top: 0.5rem;
}

detailed-product product-details span {
font-size: 1.6rem;
font-weight: normal;
}

detailed-product product-details span:last-of-type {
/*margin-left: auto;*/
margin-left: 0!important;
font-weight: 600;
color: var(--dark);
}


detailed-product product-details main-details {
display: flex;
position: relative;
flex-direction: column;
flex: 1;
}

detailed-product product-details other-details {
display: flex;
position: relative;
flex-direction: row;
width: fit-content;
align-items: center;
}



detailed-product product-details {
flex-direction: row;
}


detailed-product time span {
font-size: 2rem;
font-weight: normal;
line-height: 2rem;
opacity: 0.66;
}

detailed-product time span:last-of-type {
margin-left: auto;
color: var(--dark);
font-style: italic;
}


span.category {
    font-style: italic;
    margin-right: auto;
    opacity: 0.69;
    margin-bottom: calc(var(--margin) / 2);
    }