*,*:before,*:after{box-sizing:border-box}:root{--mg: .5rem;--mg-1: 1rem;--mg-x1: 1.5rem;--mg-2: 1.8rem;--mg-null: 0;--width: 100%;--overflow: hidden;--b-index: 1000;--transition: all ease-in-out .3s;--white-space: nowrap;--green: rgb(6, 226, 6);--magenta: rgb(255, 0, 64);--blue-l: rgba(0, 0, 255, .624);--dodger: rgb(0, 140, 255);--white:white;--primary-text-color: rgb(251, 185, 185);--input-background: rgb(168, 168, 238);--shaddow: rgba(31, 30, 30, .635);--gray:rgb(78, 76, 76)}html{font-size:62.5%}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;margin:var(--mg-null)}h1,h2,h3,h4,p{margin:var(--mg-null);font-size:var(--mg-2)}p{font-size:var(--mg-1)}@media screen and (min-width:1024px){h1,h2,h3,h4,p{font-size:calc(var(--mg-2) + .2rem)}p{font-weight:500;font-size:calc(var(--mg-x1) + .3rem)}}input,button{outline:none;border:0;padding:1rem;border-radius:8px;font-size:var(--mg-x1);color:#00f;white-space:var(--white-space)}input,select{background-color:var(--input-background);outline:none;border:0;white-space:var(--white-space);text-overflow:var(--text-overflow)}input:hover,select:hover,select:focus,input:focus{background-color:#fff}label{font-size:var(--mg-x1);margin:var(--mg);justify-self:flex-start}@media screen and (min-width:762px){input,button,label{font-size:1.8rem}}input:focus,textarea:focus,select:focus,input:hover,textarea:hover,select:hover{color:#000;background-color:#fff;cursor:pointer;outline:0}button{background-color:unset;white-space:var(--white-space);text-overflow:var(--text-overflow);cursor:pointer}img{width:var(--width);height:var(--width);cursor:pointer}::selection{background-color:#00f;color:#fff}::placeholder{color:var(--magenta);padding-left:var(--mg)}ul{margin:var(--mg-null);padding:unset}ul h2{margin-left:-2rem}li{list-style:none}.app{overflow:var(--overflow)}.null-mg{margin:--mg-null}.empty-p{font-size:1.5rem;font-weight:500}.sp-btm{margin-bottom:2rem}.load-btn{grid-column:1/-1;margin:2rem 0}.flex-bx{display:flex}.flex-b{display:flex;justify-content:center;align-items:center}.grid-x{display:grid}.grid{display:grid;justify-items:center;align-items:center}.fixed-full{position:fixed;right:0;left:0;bottom:0;top:0;width:var(--width);height:var(--width);background-color:#000000b6;z-index:2000}._link{text-decoration:none;font-size:var(--mg-x1);font-weight:600;margin:var(--mg-null);padding:var(--mg-null)}.point{cursor:pointer;transition:transform ease .2s}.point:hover{transform:scale(.9)}.active{background-color:var(--magenta);height:var(--width)}.img{object-fit:cover}.img-icon{padding:1rem;background-color:#1e90ff;width:8rem;border-radius:var(--field-border-radius)}.img-icon:hover{border-radius:18px;transition:all ease-in-out .2s}#full-img img{width:80}.full-img-cont{width:94%;max-height:95%;margin:2rem auto}.icon-sm{border-radius:var(--width);width:3rem;height:3rem;padding:.7rem;margin:var(--mg)}.copy-right{z-index:30000;text-align:center;font-size:1.5rem;color:var(--magenta)}.min-copy{min-height:50vh}.red-btn{background-color:var(--magenta)}.pagination-cont{grid-column:1/-1;margin:3.5rem 0;justify-content:space-between;overflow:var(--overflow);width:fit-content}.pagination-cont .form-btn.page-btn{margin:.4rem}.form-btn.prev{background-color:var(--magenta)}.form-btn.top{background-color:#ff4500}.form-btn.next{background-color:#00f}.page-title{color:var(--white)}.nav-cont{width:fit-content;justify-self:flex-end;width:14.5rem;justify-content:space-evenly;margin-right:.5rem}.admin-nav{width:31rem;z-index:10;background-color:#27272594;border-radius:20px;margin-top:.5rem}.cart{position:relative}.cart-badge{z-index:10;width:8px;height:8px;background-color:var(--magenta);border-radius:100%;position:absolute;right:0}@media screen and (min-width: 515px){.admin-nav{position:absolute;width:30rem;top:.2rem;left:1rem;justify-content:space-evenly}}@media screen and (min-width: 600px){.nav-cont{width:15rem;justify-content:space-evenly}}.cont ._link,.admin-nav ._link{color:var(--white);border:1px solid transparent;border-radius:30px;padding:.5rem 1.5rem;margin:.5rem;transition:all ease-in-out .4s}.admin-nav ._link{background-color:#1e90ff}._link.active{background-color:var(--gray)}.buy-btn{color:var(--white);background-color:#ff4500;border-radius:100%;width:3rem;height:3rem;font-weight:700;font-size:2rem;text-decoration:none}._link.out-of-stock{background-color:var(--magenta)}.search-cont{--bg: rgb(35, 140, 245) ;border-radius:5rem;position:relative;width:fit-content;grid-template:1fr/3rem 1fr;max-width:40%;background-color:var(--input-background);overflow:var(--overflow);height:3.4rem;margin:.4rem}.search-cont:hover{box-shadow:0 0 5px 1px #2c2c2c;cursor:pointer}.search-field{font-size:1.4rem;text-overflow:ellipsis;overflow:hidden;width:90%;height:2.5rem;border-radius:14px}.search-cont:hover{background-color:var(--white)}.search-icon-cont{background-color:#0a0aaaaf;position:relative;left:.6rem;top:-.2rem;height:2.8rem}.search-icon-cont:hover{background-color:#1e90ff;transform:scale(.8);transition:var(--transition)}.searching{position:absolute;left:.6rem}@media screen and (min-width:768px){.search-cont{height:4.2rem}.search-icon-cont{top:unset;height:3rem}}.cont{background-color:var(--dodger);position:relative;grid-template:auto/1fr 1fr;overflow:hidden}.page-title{padding:2rem 1rem;justify-self:flex-start}.nav-search{justify-content:space-between}.form-btn.transact-btn{font-size:5rem;background-color:#ff4500}.user-cont{grid-column:-1}.cart{grid-column:-2}.sub-menu{background-color:var(--white);width:100%;grid-column:1/-1;justify-content:space-between}@media screen and (min-width:650px){.cont{padding:1rem 0}.page-title{padding:1rem}.sub-menu{position:absolute;width:50%;background-color:unset}}._link.new-items{border:none;min-width:unset;background-color:#ff4500;height:unset;transition:transform linear .2s}.category-cont{width:11rem;font-size:1.3rem;padding:1rem;border-radius:4px;margin-right:1rem}.left-border{z-index:2;position:absolute;left:25.91rem;right:0;width:1px;background-color:#000;height:80%;border-left:1px solid gray}@keyframes chameleon{10%{background-color:#ffb300}20%{background-color:#f100c9}30%{background-color:#ff8503}40%{background-color:red}50%{background-color:#fff}70%{background-color:#cb0081}85%{background-color:#0ff}}@keyframes spin{0%{transform:rotate(360deg)}}.spin-cont{--line-x: 30px;--line-eye: calc(var(--line-x) / 2.2);--border: 5.2px;width:var(--line-x);height:var(--line-x);border:var(--border) solid gold;border-bottom-color:#00f;border-left-color:#00f;border-radius:100%;animation:spin 1.5s linear infinite forwards}.spin-eye{border-radius:inherit;width:var(--line-eye);height:var(--line-eye);background-color:gold;animation:chameleon 3s linear 4s infinite forwards}.card{width:20rem;height:20rem;border:1px solid rgb(221,224,221);margin:1rem;justify-items:stretch;align-items:stretch;grid-template:4rem 1fr 5rem/1fr;border-radius:10px;overflow:var(--overflow);position:relative}.card-header{background-color:#007bf7;color:var(--white)}.prod-name,.prod-genre{font-size:1.5rem}@media screen and (min-width:768px){.card{width:30rem;height:34rem;grid-template:5rem 3fr 5.5rem/1fr;border-radius:10px}.prod-name,.prod-genre{font-size:1.8rem}}.prod-name{justify-self:flex-start;margin:1rem 0 0 2rem;white-space:var(--white-space);overflow:var(--overflow);text-overflow:ellipsis}.prod-genre{justify-self:flex-end;margin-right:1rem;text-transform:capitalize}.card-body{background-color:#ffebcd;overflow:hidden;position:relative}.card-footer{grid-template:1fr 2fr /1fr 1fr;position:inherit}.card-footer .card-footer-title{grid-column:1/-1;font-size:1.5rem;justify-self:flex-start;margin-left:2rem;white-space:var(--white-space);max-width:16rem;text-overflow:var(--text-overflow);overflow:var(--overflow);color:#00f}.card-footer .stock{grid-column:span 1}.card-btn{background-color:var(--green);color:var(--white);width:5rem;height:5rem;border-radius:7px;font-size:4rem;margin:1rem;transition:transform ease-in-out .2s}.prod-sub{background-color:#ff5100}.form-btn.card-delete{grid-column:unset;padding:1.2rem;border-radius:7px;min-width:8rem;margin:unset;background-color:var(--magenta)}.card-delete p{margin:unset;z-index:100}.card-delete.add{background-color:var(--green)}.card:hover{box-shadow:0 0 6px 2px var(--shaddow)}.card .form-btn{padding:.6rem;height:unset;margin:.4rem}.selected{color:var(--white);position:absolute;background-color:#ff1493;top:-2.58rem;right:0;box-shadow:0 0 0 8px var(--white)}.badge-p{font-size:1.5rem}.prod-img{position:absolute;object-fit:contain;max-height:100%}.prod-img-bg{object-fit:cover;filter:blur(4px)}.preview-cont{width:64rem;height:64rem;z-index:1000;position:absolute;top:1rem;left:1rem;background-color:var(--shaddow);overflow:var(--overflow)}.preview-img{object-fit:contain;max-width:100%}.form-btn{min-width:8rem;background-color:var(--green);transition:transform linear .2s;color:#fff;height:4.2rem}.form-btn:hover,.card-btn:hover{transform:scale(.9)}.form-submit{font-size:1.5rem}.btn-cont{margin-top:1rem}.cart-head{z-index:2;position:absolute;top:0;left:0;background-color:#cbdbf4b8;padding:1rem;border-radius:26px}.error{background-color:#ea0404;color:#fdecec;width:fit-content;max-width:50rem;border-radius:8px;padding:.4rem;grid-column:1/-1;font-size:1.4rem}.error-p{white-space:var(--white-space);max-width:20ch;overflow:var(--overflow);text-overflow:ellipsis}.fixed-err{position:absolute;top:1.8rem;right:-1rem}.genre-form{transition:var(--transition);position:relative;background-color:#0f0feac4;width:28rem;height:26rem;color:var(--white);margin-top:1rem}@media screen and (min-width:768px){.genre-form{width:34rem;height:30rem}}.genre-form ._link.exit{position:absolute;top:1.2rem;left:1.2rem;cursor:pointer;width:4.2rem;min-width:unset;height:3.7rem;background-color:#000;border-radius:6px}.exit:before,.exit:after{content:"";position:absolute;top:1.6rem;width:3rem;height:.4rem;background-color:var(--white);border-radius:5px}.exit:before{transform:rotate(45deg)}.exit:after{transform:rotate(-45deg)}.home-page{height:90vh;overflow:scroll;grid-template:auto/1fr;width:100vw;position:relative}.home-scroll{grid-template:auto/1fr;min-height:90vh}@media screen and (min-width:660px){.home-page,.home-scroll{grid-template-columns:1fr 1fr}}@media screen and (min-width:980px){.home-page,.home-scroll{grid-template-columns:1fr 1fr 1fr}}@media screen and (min-width:1280px){.home-page,.home-scroll{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width:1480px){.home-page,.home-scroll{grid-template-columns:repeat(5,1fr)}}.new-prod{max-width:90%}.new-prod .field-control.form-select{padding:1rem;border-radius:8px}.form-g.grid{width:100%;grid-template:1fr /8rem 1fr}.form-g.grid .field-control{justify-self:flex-end;margin-bottom:1rem}.field-label{display:block;color:var(--primary-text-color);margin:1rem 0 0;color:#fff}.field-control{white-space:var(--white-space);margin:var(--mg-1) 1rem var(--mg)}.form-btn:disabled,.card-btn:disabled{background-color:#292929fb;opacity:.6;pointer-events:none}.products-page{padding:1rem;width:100%}.genre-cont{max-width:30rem;padding:1rem;justify-content:space-between;border-bottom:2px dashed blue}.genre-title{color:var(--gray)}.genre-cont ._link{border-radius:10px}.genre-table-cont{overflow:scroll;min-width:24rem;max-width:30rem;max-height:12rem;overflow-x:hidden}table{font-size:1.5rem;border-collapse:collapse}td{border-bottom:1px solid grey;padding:1rem}@media screen and (min-width:515px){.category-sect{margin-top:4rem}}@media screen and (min-width:768px){.products-page{margin-top:3rem;padding:1rem;grid-template:1fr/30rem 1fr}.genre-table-cont{max-height:30rem}.genre-cont{justify-self:start}}.create-form-cont{background-color:#d4e3fc;width:28rem;margin:1rem auto;padding:1rem;border-radius:var(--field-border-radius);position:relative}.create-form .prod-name{margin-bottom:2rem}.form-g{width:90%}.form-g-label{font-size:1.8rem;display:block}.tag-preview-cont{margin-top:2rem;height:fit-content;overflow:var(--overflow)}.select-img{position:absolute;padding:3rem;overflow:var(--overflow);max-width:10rem;bottom:0rem;left:30%;opacity:0}.update-img{z-index:10;height:10rem;right:0;left:0;max-width:unset}.tag-bg{filter:blur(4px);display:none}.create-genre-form{transition:var(--transition);position:fixed;background-color:#0000ffc4;padding:2rem;width:40rem;z-index:100;color:var(--white);overflow:var(--overflow);top:25%;left:35%}@media screen and (min-width:768px){.create-form-cont{width:34rem}.select-img{left:32%}}@media screen and (min-width:900px){.create-form-cont{width:70rem;grid-template:1fr/ 1fr 1fr}.tag-preview-cont{width:96%;height:45rem;border:1px solid grey;position:relative}.select-img{top:21rem;bottom:unset;left:unset}.tag-img.img{z-index:2;position:absolute;object-fit:contain}.tag-bg{display:block;z-index:1;object-fit:cover}.update-img{top:20%;bottom:10%;height:unset;right:0;left:50%}}.progress-cont{background-color:#000000d1;display:flex;align-items:center;justify-content:center;flex-direction:column;padding-top:13rem;height:var(--width);width:var(--width);position:absolute;z-index:200000}.upload-progress{background-color:#023507b7;position:relative;width:24rem;height:3rem;display:grid;justify-items:center;align-items:center;border-radius:40px;overflow:var(--overflow)}.progress-width{position:absolute;background-color:#00b206;height:3rem;max-width:100%;justify-self:flex-start}.progress-count{z-index:2}.upload-p{margin:1rem;color:#fff}.tag-error{position:absolute;z-index:10}.auth-cont{height:90vh;position:relative}.auth-links{width:20rem;grid-column:1/-1;justify-content:space-evenly}._link.auth{color:#1e90ff;transition:var(--transition)}._link.auth:hover{transform:scale(.9)}.login-cont{background-color:#edf5ec;min-width:30rem;padding:3rem 1rem;border-radius:5px;grid-template:1fr/1fr}.auth-form .field-control{justify-self:flex-end}@media screen and (min-width:700px){.login-cont{width:40rem;padding:1rem}}.login-title{margin:1rem;color:#1e90ff;font-weight:700}.auth-title{justify-self:flex-start}.form-g.auth-g{width:unset}.logout-cont{grid-template:2fr 1fr/repeat(2,1fr);height:40rem;position:relative;grid-column:1/-1}.user-tie-cont{grid-column:1/-1}.logout-btn.form-btn{padding:unset;min-width:unset;width:6rem;height:3.3rem;justify-self:flex-start}.logout-icon{justify-self:flex-end}.grid.login-cont.register{height:fit-content}.update-form{margin:1rem auto;width:28rem;background-color:#ae00ff;padding:2rem}@media screen and (min-width:500px){.update-form{margin:6rem auto;width:34rem}}.sales{--max-w:60rem}.date-cont{margin:1rem}.time-deltas{background-image:linear-gradient(to right,rgb(45,126,255),rgb(248,119,72));width:26rem;margin:.4rem auto;color:#fff;border-radius:5px}@media screen and (min-width:515px){.time-deltas{width:40rem;margin:6rem auto}}@media screen and (min-width:515px){.time-deltas{grid-template:1fr / repeat(3,1fr);width:50rem}}.sales-p{font-size:1.4rem;text-align:center;font-weight:500}.get-sales{grid-column:1/-1;height:unset;margin:1rem}.summary-cont{margin:2rem}.sales-cont{max-height:42rem;max-width:var(--max-w);overflow:scroll;margin-top:.5rem;overflow-x:hidden}.title-section{border:1px solid rgb(132,125,125);padding:1rem;width:var(--max-w);border-radius:4px;grid-template:1fr/1fr 2fr 1fr}.sale-spin{grid-column:1/-1;margin:.4rem}.sale-cont{border-bottom:1px solid blue;grid-template:1fr/1fr 1fr 1fr;margin-bottom:.5rem;justify-items:unset}.sales-cont .item{grid-template:1fr /repeat(2,1fr)}.item p,.item em{overflow:var(--overflow);white-space:nowrap;max-width:15ch;text-overflow:ellipsis;padding-inline-end:1rem}.item p{position:relative;justify-self:flex-start;color:#5d5a5a}.item em{position:relative;justify-self:flex-end}.sales-total{text-align:end;margin-right:1rem}.show-password{display:block}.order-details,.contact-details{grid-column:1/-1;width:80%;max-width:40rem;border-radius:10px}.contact-details{background-color:#d0d7fe;height:17rem;padding:.5rem}.phone-cont{margin:.5rem;width:16rem;justify-content:space-evenly;color:#ff1493}.contact{font-size:1.5rem}.sales-p.thanks{font-style:italic}.sales-p.info{color:#ff4500;font-weight:700}.order-details{position:relative;background-color:#e540fb;padding:1rem}.cart-err{margin:1rem 0}.success{background-color:var(--green);position:absolute;width:90%;padding:1rem;border-radius:10px;text-align:center}.success-p{font-size:1.5rem;color:#fff}
