:root{--spacing-1: 8px;--spacing-1s: 12px;--spacing-2: 16px;--spacing-3: 24px;--spacing-4: 32px;--spacing-5: 40px;--spacing-6: 48px;--spacing-7: 56px;--spacing-8: 64px}:root{--font-size-1: .8rem;--font-size-2: 1rem;--font-size-3: 1.5rem;--font-size-4: 2rem;--font-size-5: 2.5rem;--font-size-6: 3rem;--font-size-7: 3.5rem;--font-size-8: 4rem;--font-size-9: 4.5rem;--font-family-logo: "Lobster", cursive}:root{--max-image-card-size: 300px;--max-product-card-size: 600px;--max-product-card-size-mobile: 900px;--max-image-card-size-mobile: 200px;--button-height-1: 40px;--button-height-2: 50px;--button-height-3: 60px;--button-height-4: 70px;--button-height-5: 80px;--button-height-6: 90px;--button-height-7: 100px;--button-height-8: 110px;--button-height-9: 120px;--button-height-10: 150px;--button-height-11: 200px;--button-height-12: 250px;--button-height-13: 300px;--button-height-14: 350px;--button-height-15: 400px;--load-spinner-size-1: 50px;--load-spinner-size-2: 100px;--image-size-productPage: 750px;--image-size-productMainPage: 450px;--image-size-product-mobile: 300px;--image-size-product-tablet: 500px;--image-size-cart: 150px;--image-logo: 80px;--navbar: 90px;--cart-panel: 350px;--mobile-menu-height: 400px}:root{--primary-color: #353134;--secondary-color: #272526;--accent-color: #D92B4D;--success-color: #28a745c1;--warning-color: #ffc107c1;--purple-color: #6f42c1;--error-color: #5a0214c1;--text-color: #F5F5F4;--background-color: #1D1D20;--shadow-box-color-1: rgba(0, 0, 0, .1);--shadow-box-color-2: rgba(0, 0, 0, .2)}:root{--layer-1: 1;--layer-2: 2;--layer-super: 1000;--layer-toast: 1001}:root{--border-radius-1: 5px;--border-radius-2: 10px}:root{font-size:16px;line-height:1.5}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{min-height:100vh;display:flex;flex-direction:column;background-color:var(--background-color);color:var(--text-color);font-family:Arial,sans-serif;overflow-x:hidden}#root{flex-grow:1}h1,h2,h3,h4,h5,h6{font-weight:700}a{color:var(--text-color);text-decoration:none}button{cursor:pointer;border:none;outline:none}.toast{display:none;position:fixed;bottom:var(--spacing-3);left:50%;transform:translate(-50%);background:var(--accent-color);color:var(--text-color);padding:var(--spacing-1) var(--spacing-2);border-radius:var(--border-radius);font-size:var(--font-size-2);opacity:0;transform:translate(-50%) translateY(10px);z-index:var(--layer-toast);transition:opacity .5s ease-in-out,transform .5s ease-in-out;box-shadow:0 2px 10px #0003;width:fit-content;max-width:90%}.toast--visible{display:block;opacity:1;transform:translate(-50%) translateY(0)}.loginForm{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh}.loginForm__input{width:var(--button-height-15);padding:var(--spacing-2);margin:var(--spacing-2) 0;border:1px solid var(--background-color);border-radius:var(--border-radius-1)}.loginForm__button{width:var(--button-height-14);padding:var(--spacing-2);margin:var(--spacing-2) 0;background-color:var(--accent-color);color:var(--text-color);border-radius:var(--border-radius-1);cursor:pointer;transition:all .3s ease-in-out;box-shadow:0 4px 6px var(--shadow-box-color-1)}.loginForm__button:hover{background-color:var(--primary-color);transform:scale(1.02) translateY(-5px)}.home{padding-top:var(--spacing-2)}.home__hero{text-align:center;padding:var(--spacing-3);background:var(--background-color);color:var(--text-color)}.home__hero_product{margin:var(--spacing-4)}.home__products{display:grid;grid-template-columns:repeat(auto-fill,minmax(20%,1fr));gap:var(--spacing-2);padding:0 var(--spacing-3);justify-content:center;margin:0 5% var(--spacing-4) 5%}@media (max-width: 768px){.home__products{grid-template-columns:repeat(auto-fill,minmax(50%,1fr))}}.home__title{font-size:var(--font-size-4);margin:var(--spacing-4);text-align:center;color:var(--text-color)}.home__goUp{position:fixed;bottom:7%;left:50%;transform:translate(-50%);padding:var(--spacing-2);box-shadow:0 2px 10px #0006;background:var(--accent-color);color:var(--text-color);font-size:var(--font-size-3);cursor:pointer;z-index:var(--layer-super);border-radius:5%;width:var(--button-height-7);height:var(--button-height-1);display:flex;align-items:center;justify-content:center}.home__goUp:hover{animation:bounce .5s ease-in-out;animation-iteration-count:infinite}@keyframes bounce{0%{transform:translate(-50%,-5px)}50%{transform:translate(-50%)}to{transform:translate(-50%,-5px)}}.loading{display:flex;justify-content:center;align-items:center;margin:var(--spacing-4)}.loading__spinner{width:var(--load-spinner-size-2);height:var(--load-spinner-size-2);border:4px solid rgba(0,0,0,.1);border-left-color:var(--accent-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.order{display:flex;flex-direction:column;gap:var(--spacing-3);padding:var(--spacing-4);border:1px solid var(--accent-color);border-radius:var(--border-radius-1);background-color:var(--background-color);box-shadow:0 4px 6px var(--shadow-box-color-1);transition:all .3s ease-in-out}.order:hover{transform:scale(1.02) translateY(-5px);box-shadow:0 6px 8px var(--shadow-box-color-2)}.order__details{font-size:var(--font-size-2);font-weight:700;color:var(--text-color)}.order__details--title{font-size:var(--font-size-3);margin-bottom:var(--spacing-2)}.order__status{font-size:var(--font-size-2);font-weight:700;padding:var(--spacing-1);border-radius:var(--border-radius-1);color:var(--text-color)}.order__status[data-status=PENDING]{background-color:var(--error-color)}.order__status[data-status=COMPLETED]{background-color:var(--success-color)}.order__status[data-status=CANCELLED]{background-color:var(--warning-color)}.order__status[data-status=SHIPPED]{background-color:var(--purple-color)}.navbar{position:sticky;top:0;width:100%;height:var(--navbar);background:var(--primary-color);color:var(--text-color);display:flex;align-items:center;justify-content:center;padding:var(--spacing-2);z-index:1000}@media (max-width: 768px){.navbar{justify-content:flex-end;padding-right:30%}}.navbar__logo{font-size:var(--font-size-3);display:flex;align-items:center;gap:var(--spacing-2);text-decoration:none;color:var(--text-color);position:absolute;left:var(--spacing-2);font-family:var(--font-family-logo)}.navbar__logo img{width:var(--image-logo);border-radius:50%}.navbar__menuButton{display:none;background:none;border:none;color:var(--text-color);font-size:var(--font-size-3);cursor:pointer;z-index:1001}.navbar__links{display:flex;gap:var(--spacing-3);transition:max-height .15s ease-out;justify-content:center;align-items:center}@media (max-width: 768px){.navbar__links{position:absolute;top:var(--navbar);left:0;width:100%;background:var(--primary-color);flex-direction:column;gap:var(--spacing-2);align-items:center;justify-content:center;max-height:0;overflow:hidden}}.navbar__links--open{max-height:var(--mobile-menu-height);padding-bottom:var(--spacing-2);transition:max-height .25s ease-in}.navbar__link{color:var(--text-color);background-color:var(--accent-color);text-decoration:none;font-size:var(--font-size-2);padding:var(--spacing-1);border-radius:var(--border-radius-1);transition:transform .2s}.navbar__link:hover{transform:scale(1.05);transform:translateY(-2px)}.navbar__cart{background:var(--accent-color);color:var(--text-color);font-weight:700;padding:var(--spacing-1);border-radius:50px;font-size:var(--font-size-2);display:flex;align-items:center;justify-content:center;gap:var(--spacing-1);position:absolute;right:var(--spacing-2)}.navbar__cart:hover{transform:scale(1.25)}@media (max-width: 768px){.navbar__menuButton{display:block}}.customNavbar{position:fixed;top:calc(var(--navbar) + var(--spacing-2));left:0;gap:var(--spacing-2);display:flex;justify-content:center;align-items:center;width:100%;margin-bottom:var(--spacing-4)}.customNavbar__button{padding:var(--spacing-2);background-color:var(--accent-color);color:var(--text-color);border:none;border-radius:var(--border-radius-1);cursor:pointer;font-size:var(--font-size-2);transition:transform .2s}.customNavbar__button:hover{transform:scale(1.05);transform:translateY(-2px)}.customNavbar__button--red{background-color:var(--error-color)}.customNavbar__button--green{background-color:var(--success-color)}.customNavbar__button--purple{background-color:var(--purple-color)}.orderPage{display:flex;align-items:center;padding:var(--spacing-3);height:100%;border-radius:var(--border-radius-2);margin:5% 15%;gap:var(--spacing-8);width:60%}.orderPage__details{display:flex;flex-direction:column;gap:var(--spacing-2);width:100%}.orderPage__infoContainer{display:flex}@media (max-width: 768px){.orderPage{flex-direction:column;width:100%;margin:0;gap:var(--spacing-2)}}.orderPage__container{display:flex;flex-direction:column;gap:var(--spacing-4);width:100%}.orderPage__itemsContainer{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--button-height-13),1fr));gap:var(--spacing-3);width:100%;max-width:1200px}.orderPage__item{display:flex;flex-direction:column;gap:var(--spacing-2);padding:var(--spacing-3);border:1px solid var(--accent-color);border-radius:var(--border-radius-1);background-color:var(--background-color);box-shadow:0 4px 6px var(--shadow-box-color-1);transition:all .3s ease-in-out}.orderPage__item:hover{transform:scale(1.02) translateY(-5px);box-shadow:0 6px 8px var(--shadow-box-color-2)}.product{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-gap:var(--spacing-1);background:var(--primary-color);border-radius:var(--border-radius-2);text-align:center;box-shadow:0 2px 5px var(--shadow-box-color-1);width:100%;height:100%;padding:var(--spacing-2);transition:.3s ease-in;height:var(--max-product-card-size)}@media (max-width: 768px){.product{max-height:var(--max-product-card-size-mobile)}}.product:hover{box-shadow:0 5px 10px var(--accent-color)}.product--featured{border:2px solid var(--purple-color);background-color:var(--purple-light-color)}.product__imageContainer{position:relative;display:flex}.product__soldout{position:absolute;top:0;left:0;width:100%;z-index:var(--layer-2)}.product__image{max-height:var(--max-image-card-size);border-radius:var(--border-radius-1);object-fit:contain;width:100%}@media (max-width: 768px){.product__image{max-height:var(--max-image-card-size-mobile)}}.product__image--soldout{filter:sepia(100%);opacity:.7}.product__title{font-size:var(--font-size-3);margin:var(--spacing-1) 0}.product__description{font-size:var(--font-size-2);color:var(--text-color);overflow:auto;width:100%;text-overflow:ellipsis;margin:var(--spacing-1) 0}@media (max-width: 768px){.product__description{font-size:var(--font-size-1)}}.product__description::-webkit-scrollbar{width:var(--border-radius-1);height:var(--border-radius-1);border-radius:var(--border-radius-2);background-color:var(--secondary-color)}.product__description::-webkit-scrollbar-thumb{background-color:var(--accent-color);border-radius:var(--border-radius-1)}.product__price{font-size:var(--font-size-3);font-weight:700;color:var(--accent-color);margin:var(--spacing-2) 0}.product__shopButton{background-color:var(--accent-color);padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-2);font-weight:700;width:var(--button-height-1);max-height:var(--border-radius-3);display:flex;align-items:center;justify-content:center;justify-self:flex-end;--initial-gradient: linear-gradient(to right, transparent 0%, transparent 50%, var(--accent-color) 50%, var(--accent-color) 100%);--hover-gradient: linear-gradient(to right, var(--accent-color) 0%, var(--accent-color) 50%, transparent 50%, transparent 100%);--background-position-initial: 100%;--background-position-hover: 0%;background:var(--initial-gradient);background-size:200% 100%;background-position:var(--background-position-initial);border:1px solid var(--accent-color);color:var(--text-color);border-radius:var(--border-radius-1);transition:background-position .65s ease-in-out,color .5s ease-in-out,border .5s ease-in-out}.product__shopButton:hover{background-position:var(--background-position-hover);color:var(--accent-color)}.product__shopButtonIcon--small{font-size:var(--font-size-1)}.product__button{display:inline-block;color:var(--text-color);text-decoration:none;border-radius:var(--border-radius-1);font-size:var(--font-size-2);font-weight:700}.product__button--disabled{background:var(--secondary-color);cursor:not-allowed;opacity:.7}.product__button--disabled .product:hover{animation:none;transform:none}.productList{padding:var(--spacing-2)}.productList__actions{display:flex;justify-content:flex-end;margin:var(--spacing-2) 5%}.productList__add{background-color:var(--accent-color);color:var(--text-color);padding:var(--spacing-1) var(--spacing-2);border-radius:var(--border-radius-1)}.productList__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(20%,1fr));gap:var(--spacing-2);margin:0 5%;justify-content:center}@media (max-width: 768px){.productList__grid{grid-template-columns:repeat(auto-fill,minmax(45%,1fr))}}.productList__item{display:flex;flex-direction:column;gap:var(--spacing-2)}.productList__buttons{display:flex;gap:var(--spacing-2)}.productList__edit,.productList__delete{padding:var(--spacing-1) var(--spacing-2);border-radius:var(--border-radius-1);color:var(--text-color)}.productList__edit{background-color:var(--purple-color)}.productList__delete{background-color:var(--error-color)}.productList__featured{position:absolute;background-color:var(--purple-color);color:var(--warning-color);padding:var(--spacing-1);border-radius:var(--border-radius-1);font-size:var(--font-size-3);display:flex;align-items:center;justify-content:center}.productForm{display:flex;flex-direction:column;gap:var(--spacing-2);width:60%;margin:var(--spacing-4) auto}.productForm__input{padding:var(--spacing-2);border-radius:var(--border-radius-1)}.productForm__input[type=file]{padding:0;border:none;background-color:transparent;color:var(--text-color)}.productForm__label{display:flex;align-items:center;gap:var(--spacing-1)}.productForm__submit{background-color:var(--accent-color);color:var(--text-color);padding:var(--spacing-2);border-radius:var(--border-radius-1)}.checkboxWrapper8 .tgl{display:none}.checkboxWrapper8 .tgl,.checkboxWrapper8 .tgl:after,.checkboxWrapper8 .tgl:before,.checkboxWrapper8 .tgl *,.checkboxWrapper8 .tgl *:after,.checkboxWrapper8 .tgl *:before,.checkboxWrapper8 .tgl+.tglBtn{box-sizing:border-box}.checkboxWrapper8 .tgl::-moz-selection,.checkboxWrapper8 .tgl:after::-moz-selection,.checkboxWrapper8 .tgl:before::-moz-selection,.checkboxWrapper8 .tgl *::-moz-selection,.checkboxWrapper8 .tgl *:after::-moz-selection,.checkboxWrapper8 .tgl *:before::-moz-selection,.checkboxWrapper8 .tgl+.tglBtn::-moz-selection,.checkboxWrapper8 .tgl::selection,.checkboxWrapper8 .tgl:after::selection,.checkboxWrapper8 .tgl:before::selection,.checkboxWrapper8 .tgl *::selection,.checkboxWrapper8 .tgl *:after::selection,.checkboxWrapper8 .tgl *:before::selection,.checkboxWrapper8 .tgl+.tglBtn::selection{background:none}.checkboxWrapper8 .tgl+.tglBtn{outline:0;display:block;width:4em;height:2em;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.checkboxWrapper8 .tgl+.tglBtn:after,.checkboxWrapper8 .tgl+.tglBtn:before{position:relative;display:block;content:"";width:50%;height:100%}.checkboxWrapper8 .tgl+.tglBtn:after{left:0}.checkboxWrapper8 .tgl+.tglBtn:before{display:none}.checkboxWrapper8 .tgl:checked+.tglBtn:after{left:50%}.checkboxWrapper8 .tglSkewed+.tglBtn{overflow:hidden;transform:skew(-10deg);-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:all .2s ease;font-family:sans-serif;background:#888}.checkboxWrapper8 .tglSkewed+.tglBtn:after,.checkboxWrapper8 .tglSkewed+.tglBtn:before{transform:skew(10deg);display:inline-block;transition:all .2s ease;width:100%;text-align:center;position:absolute;line-height:2em;font-weight:700;color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.4)}.checkboxWrapper8 .tglSkewed+.tglBtn:after{left:100%;content:attr(data-tg-on)}.checkboxWrapper8 .tglSkewed+.tglBtn:before{left:0;content:attr(data-tg-off)}.checkboxWrapper8 .tglSkewed+.tglBtn:active{background:#888}.checkboxWrapper8 .tglSkewed+.tglBtn:active:before{left:-10%}.checkboxWrapper8 .tglSkewed:checked+.tglBtn{background:#86d993}.checkboxWrapper8 .tglSkewed:checked+.tglBtn:before{left:-100%}.checkboxWrapper8 .tglSkewed:checked+.tglBtn:after{left:0}.checkboxWrapper8 .tglSkewed:checked+.tglBtn:active:after{left:10%}