@import"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";:root{--ff-primary: "Roboto", sans-serif}:root{--fs-100: 1rem;--fs-200: 1.2rem;--fs-300: 1.4rem;--fs-400: 1.6rem;--fs-500: 1.8rem;--fs-600: 2.4rem;--fs-700: 3.2rem}:root{--clr-body-primary: #211ED0;--clr-button-secondary: #F36767;--clr-body-secondary: #A9A8D4;--clr-body-text: #364770;--clr-black: #000;--clr-blue: #237cee;--clr-white: #fff;--clr-grey-1: #F3F3FB;--clr-grey-2: #A7A7A7;--clr-indicator-warning: #EF1616;--clr-indicator-clear: #559EFC}:root{--space-1: .4rem ;--space-2: .8rem ;--space-3: calc(.4rem * 3);--space-4: 1.6rem ;--space-5: 2rem ;--space-6: calc(.4rem * 6);--space-7: calc(.4rem * 7);--space-8: 3.2rem ;--space-9: 3.6rem ;--space-10: 4rem }.layout main,.sidenav,.stepper .date,.selectBox,.input--date .input__fields,.input--group,.stats,.stats__numbers,.stats .card,.details .actions,.create-new .form,.create-new .form .product,.create-new .form .product__row,.create-new .form .dropdowns,.create-new .form__footer,.login .modal,.login .modal__header,.login .modal__form,.home .content,.home .tabs,.home .actions,.page.two-col .content,.page.two-col .content__left{display:flex;gap:var(--gap, 0)}.stepper .date,.selectBox,.input--group,.no-access .content,.stats,.stats .card,.details .actions,.create-new .form,.create-new .form .product,.login .modal,.login .modal__header,.login .modal__form,.home .content,.page.two-col .content__left{flex-direction:column}.header__content,.header .notifications span,.header .profile,.chart,.loader,.logo,.button--upload label,.no-access,.no-access .content,.stats__numbers,.stats .card__img,.login,.home .title,button,.btn{display:flex;align-items:center;justify-content:center;gap:var(--gap, 0)}.header .container,.pill,.stepper__header,.home .header{display:flex;align-items:center;justify-content:space-between;gap:var(--gap, 0)}.page{-ms-overflow-style:none;scrollbar-width:none}.page::-webkit-scrollbar{display:none}html{font-size:62.5%}body{background-color:var(--clr-white)}.page{background-color:var(--clr-grey-1);overflow:auto;flex:1;padding:4rem;box-shadow:-2px -2px 3.4px #00000040}.page.two-col .content{--gap: 3.6rem }.page.two-col .content__left{--gap: 3.2rem;flex:3}.page.two-col .content__right{flex:7}.page.home{background-color:transparent}fieldset{border:none}label,legend{margin-bottom:1.2rem;display:inline-block;color:var(--clr-body-text)}.seperator{display:block;height:1px;margin-block:var(--space-10);border:none}.seperator--1{background:linear-gradient(90deg,#fff0,#fffecc 50.62%,#81efef 53.61%,#fff0)}body{font-size:1.6rem;font-family:var(--ff-primary)}h1,.heading-1{font-size:var(--fs-600);font-weight:700}h2,.heading-2{font-size:var(--fs-500)}h3,.heading-3{font-size:var(--fs-400)}h4,.heading-4{font-size:var(--fs-300)}h5,.heading-5{font-size:var(--fs-200)}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0;flex-wrap:wrap;font:inherit}img,picture,svg{display:block;max-width:100%}a{text-decoration:none;color:inherit}ul{list-style:none}button{background:none;border:none;cursor:pointer}input,button,textarea,select{font-family:inherit}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.home .header{background-color:var(--clr-grey-1);border-radius:1.6rem}.home .content{align-items:flex-start;--gap: 4.8rem}.home .tabs{--gap: 0}.home .tabs button{padding:1.2rem 3.6rem;border:2px solid var(--clr-body-primary);border-top-left-radius:1.6rem;border-top-right-radius:1.6rem;--gap: 1rem;z-index:calc(4 - var(--i));position:relative;z-index:1}.home .tabs button:after{content:"";height:calc(100% + 2px);width:2rem;clip-path:polygon(0 15%,0% 100%,100% 100%);background-color:transparent;position:absolute;right:-2rem;bottom:-2px;border:none;z-index:2}.home .tabs button.active{background-color:var(--clr-body-primary);color:var(--clr-white)}.home .tabs button.active img{filter:invert(1) sepia(1) saturate(10000%) hue-rotate(180deg)}.home .tabs button.active:after{background-color:var(--clr-body-primary);border:2px solid var(--clr-body-primary)}.home .tabs button:not(:first-child){border-left:0}.home__body{margin-top:4rem}.home .selectBox select{background-color:var(--clr-white);max-width:28rem}.home .actions{--gap: 2.4rem}.home .title{--gap: 0;font-size:var(--fs-700);color:var(--clr-indicator-clear);text-transform:uppercase;font-weight:500}.home .title__img{width:15rem;height:15rem}.login{--gap: 2.4rem;background-color:var(--clr-grey-1);padding:var(--gap);height:100dvh}.login .modal{max-width:44rem;background-color:var(--clr-white);padding:2.4rem 4.8rem;border-radius:1.6rem}.login .modal__header{align-items:center}.login .modal__heading{color:var(--clr-body-secondary)}.create-new .form{--gap: 2.4rem;padding:6rem 2.4rem;background-color:var(--clr-white);border-radius:1.6rem}.create-new .form .product{border:none;--gap: 1.2rem}.create-new .form .product__row{--gap: 2.4rem;flex-wrap:nowrap;align-items:center;justify-content:flex-start}@media (max-width: 1200px){.create-new .form .product__row{--gap: 1.6rem}}@media (max-width: 900px){.create-new .form .product__row{--gap: 1.2rem}}@media (max-width: 768px){.create-new .form .product__row{--gap: .6rem}}@media (max-width: 600px){.create-new .form .product__row{--gap: .4rem}}@media (max-width: 1000px){.create-new .form .product__row .input--group{min-width:80px}.create-new .form .product__row .selectBox{min-width:120px}}.create-new .form .product__row .product-delete-btn{flex-shrink:0;flex-grow:0;flex-basis:auto;min-width:2.4rem;max-width:2.4rem;width:2.4rem;height:2.4rem;margin-left:.8rem;align-self:center}@media (max-width: 900px){.create-new .form .product__row .product-delete-btn{min-width:2rem;max-width:2rem;width:2rem;height:2rem;margin-left:.6rem}}@media (max-width: 768px){.create-new .form .product__row .product-delete-btn{min-width:1.8rem;max-width:1.8rem;width:1.8rem;height:1.8rem;margin-left:.4rem}}.create-new .form .product__row:not(:first-child) label{display:none}.create-new .form .product__row:first-child .product-delete-btn{margin-top:3rem}.create-new .form .product__row .selectBox{flex:1;min-width:200px;align-self:center}@media (max-width: 1000px){.create-new .form .product__row .selectBox{min-width:140px}}@media (max-width: 900px){.create-new .form .product__row .selectBox{min-width:120px}}@media (max-width: 768px){.create-new .form .product__row .selectBox{min-width:100px}}.create-new .form .product__row .input--group{flex:0 0 auto;min-width:120px;align-self:center}@media (max-width: 1000px){.create-new .form .product__row .input--group{min-width:90px}}@media (max-width: 900px){.create-new .form .product__row .input--group{min-width:80px}}@media (max-width: 768px){.create-new .form .product__row .input--group{min-width:70px}}.create-new .form .product__row .product-total{flex:0 0 auto;min-width:120px;align-self:center}@media (max-width: 1000px){.create-new .form .product__row .product-total{min-width:100px}}@media (max-width: 900px){.create-new .form .product__row .product-total{min-width:90px}}@media (max-width: 768px){.create-new .form .product__row .product-total{min-width:80px}}@media (max-width: 1200px){.create-new .form .product__row .product-total,.create-new .form .product__row .product-delete-btn{flex-shrink:0}}@media (max-width: 1200px){.create-new .form .product__row .product-delete-btn{flex-shrink:0;flex-grow:0}}.create-new .form .product__row .product-delete-btn{flex:0 0 auto;min-width:2.4rem;align-self:center;margin-left:.8rem}@media (max-width: 900px){.create-new .form .product__row .product-delete-btn{min-width:2rem;margin-left:.6rem}}@media (max-width: 768px){.create-new .form .product__row .product-delete-btn{min-width:1.8rem;margin-left:.4rem}}.create-new .form .product input{width:auto}.create-new .form .product input[type=number]{max-width:10rem;-moz-appearance:textfield}.create-new .form .product input[type=number]::-webkit-inner-spin-button,.create-new .form .product input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}@media (max-width: 1000px){.create-new .form .product input[type=number]{max-width:6rem}}@media (max-width: 900px){.create-new .form .product input[type=number]{max-width:5rem}}@media (max-width: 768px){.create-new .form .product input[type=number]{max-width:4rem}}.create-new .form .product__add{margin-block:1.2rem}.create-new .form .product .product-delete-btn{height:2.4rem;width:2.4rem;line-height:2.4rem;background-color:var(--clr-indicator-warning);border-radius:2.4rem;position:relative;align-self:center;transition:opacity .3s ease-in;flex-shrink:0;margin-left:auto}@media (max-width: 900px){.create-new .form .product .product-delete-btn{height:2rem;width:2rem;line-height:2rem}}@media (max-width: 768px){.create-new .form .product .product-delete-btn{height:1.8rem;width:1.8rem;line-height:1.8rem}}.create-new .form .product .product-delete-btn:hover{opacity:.8}.create-new .form .product .product-delete-btn span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#fff;font-weight:700;font-size:1.2rem}@media (max-width: 900px){.create-new .form .product .product-delete-btn span{font-size:1rem}}@media (max-width: 768px){.create-new .form .product .product-delete-btn span{font-size:.9rem}}.create-new .form__footer{--gap: 2.4rem}.create-new .form__footer .button{min-width:15rem}.create-new table.bill{max-width:60rem}.create-new table.bill .selectBox{max-width:27rem;margin-left:auto}.create-new table.bill tr:nth-child(odd){background-color:#211ed033}.create-new table.bill tr:last-child{background-color:var(--clr-black);color:var(--clr-white);font-weight:700}.create-new table.bill td{padding:1.2rem;text-align:end}.create-new table.bill td:first-child{font-weight:700}.create-new table.bill td:has(.selectBox){padding-right:0}.create-new.new-product .form,.create-new.new-user .form{display:grid;grid-template-columns:repeat(2,1fr)}.create-new.new-product .form__footer,.create-new.new-user .form__footer{grid-column:span 2}.create-new.new-user .banner__img{top:50%;right:2rem;transform:translateY(-50%)}.create-new.new-product .form-flex{display:flex;flex-direction:column}.details .content__right{background-color:var(--clr-white);padding:4.8rem}.details .actions{padding:6rem 2.4rem;background-color:var(--clr-white);border-radius:1.6rem}.details .table{width:100%;border-collapse:collapse;margin-bottom:6rem;font-size:var(--fs-300)}.details .table tr:nth-child(odd){background-color:var(--clr-grey-1)}.details .table td{padding:1.2rem;width:50%}.details .table td:first-child{padding-left:4rem;font-weight:600}.details .table td.status{font-weight:600}.details .table td.status--created{color:var(--clr-body-primary)}.stats{--gap: 2.4rem}.stats>div{background-color:var(--clr-white);padding:4rem;border-radius:1.6rem}.stats__header{background-color:var(--clr-body-primary)!important;text-align:center;color:var(--clr-white);font-weight:600}.stats__numbers{align-items:stretch;--gap: 4rem}.stats .card{align-items:center;--gap: 1.6rem;padding:1.6rem;box-shadow:0 3.2px 3.2px #00000040;border-radius:1.6rem}.stats .card__img{font-size:var(--fs-300);font-weight:600;color:var(--clr-body-primary);min-height:4.5rem}.stats .card__img h6{white-space:pre-wrap;word-break:break-all}.stats .card__number{font-size:var(--fs-600);font-weight:600}.stats__block h3{font-weight:600;margin-bottom:2.4rem}.no-access .content{--gap: 2.4rem}.button{font-size:1.6rem;padding:1.2rem;border-radius:1.6rem;text-transform:uppercase;transition:all .3s ease-in;cursor:pointer}.button:disabled{background-color:var(--clr-grey-2);color:var(--clr-grey-1);cursor:not-allowed}.button:disabled:hover{scale:initial}.button:hover{scale:.9;filter:brightness(85%)}.button--primary{color:var(--clr-white);background-color:var(--clr-body-primary)}.button--secondary{color:var(--clr-white);background-color:var(--clr-button-secondary)}.button--cancel{color:var(--clr-white);background-color:var(--clr-indicator-warning)}.button--confirm{color:var(--clr-white);background-color:var(--clr-indicator-clear)}.button--blue{color:var(--clr-white);background-color:var(--clr-blue)}.button--upload{border:none;border-radius:1.6rem;background-color:var(--clr-grey-1);width:100%;height:10rem;padding:0}.button--upload label{--gap: 1.2rem;height:100%;width:100%;margin:0}.button--loading{position:relative;cursor:not-allowed}.button--loading:hover{scale:initial}.button--loading:after{content:"";position:absolute;top:50%;left:50%;width:20px;height:20px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;transform:translate(-50%,-50%);animation:spin 1s linear infinite;z-index:2}.button--loading :before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1;border-radius:1.6rem}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.input__label{color:var(--clr-body-text);margin-bottom:1.2rem;display:inline-block}.input input{padding:1.6rem 2.4rem;border:none;border-radius:1.6rem;background-color:var(--clr-grey-1);width:100%}.input input::placeholder{color:var(--clr-grey-2)}.input--date label{margin-bottom:1.2rem;display:inline-block}.input--date .input__fields{--gap: 1.2rem}.input--date input{max-width:10rem}.input--group{--gap: 0}@media (max-width: 1000px){.input--group input{padding:1.4rem 1.8rem}}@media (max-width: 900px){.input--group input{padding:1.2rem 1.4rem}}@media (max-width: 768px){.input--group input{padding:1rem}}.logo{--gap: 1.2rem}.logo__text{border-left:1px solid var(--clr-body-primary);padding-left:1.2rem;color:var(--clr-body-primary)}.banner{min-height:20rem;background:var(--background-color, #fff);position:relative;overflow:visible;border-radius:1.6rem}.banner__text{text-transform:uppercase;font-weight:700;color:var(--clr-black);padding:4.8rem 3.2rem}.banner .highlight{display:block;color:var(--highlight-color, #fff)}.banner__img{position:absolute;top:0;right:0}.selectBox{--gap: 1.2rem;min-width:27.5rem}@media (max-width: 1200px){.selectBox{min-width:18rem}}@media (max-width: 1000px){.selectBox{min-width:14rem}}@media (max-width: 900px){.selectBox{min-width:12rem}}@media (max-width: 768px){.selectBox{min-width:10rem}}.selectBox label{margin-bottom:0}.selectBox select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url('data:image/svg+xml;utf8,<svg fill="gray" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');background-repeat:no-repeat;background-position:right 10px center;background-size:16px;border:1px solid #ccc;border-radius:4px;padding:1.6rem 2.4rem;border:none;border-radius:1.6rem;background-color:var(--clr-grey-1);width:100%}@media (max-width: 900px){.selectBox select{padding:1.2rem 1.6rem}}@media (max-width: 768px){.selectBox select{padding:1rem 1.2rem}}.selectBox select::placeholder{color:var(--clr-grey-2)}.loader{height:100dvh;width:100dvw;position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0003;z-index:10}.loader__content{width:50px;aspect-ratio:1;display:grid;border-radius:50%;background:linear-gradient(0deg,#00000080 30%,#0000 0,#0000 70%,#000 0) 50%/8% 100%,linear-gradient(90deg,#00000040 30%,#0000 0,#0000 70%,#000000bf 0) 50%/100% 8%;background-repeat:no-repeat;animation:rotate 1s infinite steps(12)}.loader__content:before,.loader__content:after{content:"";grid-area:1/1;border-radius:50%;background:inherit;opacity:.915;transform:rotate(30deg)}.loader__content:after{opacity:.83;transform:rotate(60deg)}@keyframes rotate{to{transform:rotate(1turn)}}.table table{width:100%;border-collapse:collapse}.table thead{background-color:var(--clr-body-primary);color:var(--clr-white);font-weight:700;font-size:var(--fs-400);text-transform:uppercase}.table thead th:first-child{border-top-left-radius:1.6rem;border-bottom-left-radius:1.6rem}.table thead th:last-child{border-top-right-radius:1.6rem;border-bottom-right-radius:1.6rem}.table thead th:has(select){padding-block:0}.table thead th:has(select) select{padding-block:2rem;background:transparent;color:var(--clr-white);text-transform:uppercase;border:none;min-width:15rem}.table thead th:has(select) option{color:var(--clr-body-primary);background-color:var(--clr-white)}.table th,.table td{border:none;padding:2rem 6rem;text-align:left}.table tbody tr:nth-child(odd):not(:first-child){background-color:var(--clr-grey-1);cursor:pointer}.table tbody tr:nth-child(odd):not(:first-child):hover{background-color:#211ed033}.table tbody tr:nth-child(2n){cursor:pointer}.table tbody tr:nth-child(2n):hover{background-color:#211ed033}.stepper{--theme: var(--clr-body-primary);background-color:var(--clr-white);padding:3.2rem;border-top-left-radius:1.6rem;border-top-right-radius:1.6rem;cursor:pointer}.stepper:hover{background-color:#0003}.stepper:not(:last-child){margin-bottom:2.4rem}.stepper__header{margin-bottom:4rem}.stepper__body a,.stepper__body span{line-height:3.2rem!important}.stepper .info__number{font-size:var(--fs-600);font-weight:700;color:var(--theme);margin-bottom:1.6rem}.stepper .info li{font-weight:600}.stepper .info li:not(:last-child){margin-bottom:.8rem}.stepper .info li span{margin-left:.8rem;font-weight:400}.stepper .progress{min-width:10.4rem;text-align:center;position:relative}.stepper .progress:after{content:"";height:4px;width:100%;position:absolute;left:0;bottom:0;background-color:#b8b8b8}.stepper .progress__number{font-size:var(--fs-700);color:var(--theme);font-weight:700;margin-bottom:1.2rem}.stepper .progress__bar{height:4px;background-color:var(--theme);position:relative;z-index:1}.stepper .date{align-items:flex-end;--gap: .4rem}.stepper .date__heading{color:var(--theme);font-weight:600}.pill{--bg-clr: initial;padding:8px 12px;border-radius:8px;font-size:var(--fs-200);color:var(--clr-white);background-color:var(--bg-clr);width:max-content;min-width:12.5rem;--gap: 1.2rem}.pill.pending{--bg-clr: #FF0303}.pill.preparation{--bg-clr: #D79511}.pill.transit{--bg-clr: #FFA600}.pill.delivered{--bg-clr: #0B9A7D}.pill.delay{--bg-clr: #7016EE}.chart{height:60rem;width:100%}.header{padding:2.4rem}.header__content{--gap: 2.4rem}.header .notifications{position:relative}.header .notifications span{--size: 1.8rem;position:absolute;top:0;right:-6px;height:var(--size);width:var(--size);background-color:#ef1616;color:var(--clr-white);border-radius:10px;font-size:var(--fs-300)}.header .profile{--gap: 4px;position:relative;cursor:pointer}.header .profile__dropdown{position:absolute;right:1rem;top:100%;background-color:var(--clr-white);min-width:16rem;border:1px solid var(--clr-body-secondary)}.header .profile__dropdown li{padding:1.2rem 1.6rem;cursor:pointer}.header .profile__dropdown li:hover{background-color:#211ed033}.header .profile__dropdown li:not(:last-child){border-bottom:1px solid var(--clr-body-secondary)}.sidenav{flex-direction:column;padding:3rem 0rem;width:6.4rem}.sidenav li{position:relative;padding:2rem;cursor:pointer}.sidenav li:hover{background-color:#0003}.sidenav li:hover:after,.sidenav li:hover .tooltip{visibility:visible;opacity:1}.sidenav li:after{content:"";position:absolute;top:50%;left:calc(100% - 3px);transform:translateY(-50%) rotate(-90deg);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #333;pointer-events:none;visibility:hidden;opacity:0}.sidenav .tooltip{visibility:hidden;opacity:0;position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:10px;background-color:#333;color:#fff;padding:4px 8px;border-radius:4px;white-space:nowrap;transition:opacity .2s ease,visibility .2s ease;z-index:1}.sidenav li:not(:last-child){margin-bottom:3.6rem}.sidenav .logout{margin-top:auto}.layout main{min-height:calc(100dvh - 9.9rem)}
