*{font-family:arial,sans-serif;margin:0;padding:0;box-sizing:border-box}:root{--primary:#ab1f1e;--blue: #2a2185;--white: #fff;--gray: #f5f5f5;--black1: #222;--black2: #999;--bs-btn-bg:#ab1f1e;--bs-btn-active-bg: #ab1f1e}body{min-height:100vh;overflow-x:hidden;margin:0}.navigation{position:fixed;width:300px;height:100%;background:var(--primary);border-left:10px solid var(--primary);transition:.5s;overflow:clip}.navigation.active{width:80px}.navigation .nav{position:absolute;top:0;left:0;width:100%}.navigation .nav li{position:relative;width:100%;list-style:none;border-top-left-radius:30px;border-bottom-left-radius:30px}.navigation .brand{margin-bottom:40px;pointer-events:none}.navigation .nav li a{position:relative;display:block;width:100%;display:flex;text-decoration:none;color:var(--white)}.navigation .nav li .sub-menu{display:none;margin-bottom:10px;padding:0 0 0 40px;font-size:1.2rem}.navigation .nav li .sub-menu li a{color:var(--white);background-color:var(--primary)}.navigation .nav li .sub-menu li a:hover,.navigation .nav li.active .sub-menu li a{color:var(--primary);background-color:var(--white)}.navigation .nav li.active .sub-menu li a:hover{color:var(--white);background-color:var(--primary)}.navigation .nav li a .icon{position:relative;display:flex;justify-content:center;align-items:center;min-width:60px;text-align:center}.navigation .nav li a .icon .bi{font-size:1.75rem}.navigation .nav li a .title{position:relative;display:block;padding:0 10px;height:60px;line-height:60px;text-align:start;white-space:nowrap;font-size:1.4rem}.sub-menu .bi{margin-right:1rem!important}.main{position:absolute;width:calc(100% - 300px);left:300px;min-height:100vh;background:var(--white);transition:.5s}.main.active{width:calc(100% - 80px);left:80px}.topbar{width:100%;height:60px;display:flex;justify-content:space-between;align-items:center;padding:0 10px}.toggle{position:relative;width:60px;height:60px;display:flex;justify-content:center;align-items:center;font-size:2.5rem;cursor:pointer}.search{position:relative;width:400px;margin:0 10px}.search label{position:relative;width:100%}.search label input{width:100%;height:40px;border-radius:40px;padding:5px 20px 5px 35px;font-size:18px;outline:none;border:1px solid var(--black2)}.search label ion-icon{position:absolute;top:0;left:10px;font-size:1.2rem}.user{position:relative;width:40px;height:40px;border-radius:50%;overflow:hidden;cursor:pointer}.user img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.cardBox{position:relative;width:100%;padding:20px;display:grid;grid-template-columns:repeat(3,1fr);grid-gap:30px}.nav li.active{background-color:var(--white)!important}.navigation .nav li.active a{color:var(--primary)}.cardBox .card{position:relative;background:var(--white);padding:30px;border-radius:20px;display:flex;justify-content:space-between;flex-direction:row;cursor:pointer;box-shadow:0 7px 25px #00000014}.cardBox .card .numbers{position:relative;font-weight:500;font-size:2.5rem;color:var(--primary)}.cardBox .card .cardName{color:var(--black2);font-size:1.1rem;margin-top:5px}.cardBox .card .iconBx{font-size:3.5rem;color:var(--black2)}.cardBox .card:hover{background:var(--primary)}.cardBox .card:hover .numbers,.cardBox .card:hover .cardName,.cardBox .card:hover .iconBx{color:var(--white)}.details{position:relative;width:100%;padding:20px;display:grid;grid-template-columns:1fr 1fr;grid-gap:30px}.details .recentOrders{position:relative;display:grid;background:var(--white);padding:20px;box-shadow:0 7px 25px #00000014;border-radius:20px}.details .cardHeader{display:flex;justify-content:space-between;align-items:flex-start}.cardHeader h2{font-weight:600;color:var(--primary)}.cardHeader .btn{position:relative;padding:5px 10px;background:var(--primary);text-decoration:none;color:var(--white);border-radius:6px}.details table{width:100%;border-collapse:collapse;margin-top:10px}.details table thead td{font-weight:600}.details .recentOrders table tr{color:var(--black1);border-bottom:1px solid rgba(0,0,0,.1)}.details .recentOrders table tr:last-child{border-bottom:none}.details .recentOrders table tbody tr:hover{background:var(--primary);color:var(--white)}.details .recentOrders table tr td{padding:10px}.details .recentOrders table tr td:last-child{text-align:end}.details .recentOrders table tr td:nth-child(2){text-align:end}.details .recentOrders table tr td:nth-child(3){text-align:center}.status.delivered{padding:2px 4px;background:#8de02c;color:var(--white);border-radius:4px;font-size:14px;font-weight:500}.status.pending{padding:2px 4px;background:#e9b10a;color:var(--white);border-radius:4px;font-size:14px;font-weight:500}.status.return{padding:2px 4px;background:red;color:var(--white);border-radius:4px;font-size:14px;font-weight:500}.status.inProgress{padding:2px 4px;background:#1795ce;color:var(--white);border-radius:4px;font-size:14px;font-weight:500}.recentCustomers{position:relative;display:grid;min-height:500px;padding:20px;background:var(--white);box-shadow:0 7px 25px #00000014;border-radius:20px}.recentCustomers .imgBx{position:relative;width:40px;height:40px;border-radius:50px;overflow:hidden}.recentCustomers .imgBx img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.recentCustomers table tr td{padding:12px 10px}.recentCustomers table tr td h4{font-size:16px;font-weight:500;line-height:1.2rem}.recentCustomers table tr td h4 span{font-size:14px;color:var(--black2)}.recentCustomers table tr:hover{background:var(--primary);color:var(--white)}.recentCustomers table tr:hover td h4 span,.c-white{color:var(--white)}.menu a ion-icon{color:#fff!important}@media (max-width: 991px){.navigation{right:-800px}.navigation.active{width:300px;left:0}.main{width:100%;left:0}.main.active{width:calc(100% - 300px);left:300px}.cardBox{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.details{grid-template-columns:1fr}.recentOrders{overflow-x:auto}.status.inProgress{white-space:nowrap}}@media (max-width: 480px){.navigation{left:-100%;z-index:1000;position:fixed;font-size:30px}.navigation.active{width:auto;left:0}.toggle{z-index:10001}.main.active .toggle{color:#fff;position:fixed;right:0;font-size:30px}.main.active{left:0}.cardBox{grid-template-columns:repeat(1,1fr);width:100%}}.login-container{background-color:var(--white);padding:2rem;border-radius:10px;box-shadow:0 7px 25px #00000014;width:100%;max-width:400px}.login-header{text-align:center;margin-bottom:2rem}.login-header img{height:250px;margin-bottom:1rem}.login-header h1{color:var(--primary);font-size:2rem;margin-bottom:.5rem}.login-form input{width:100%;padding:10px;margin-bottom:1rem;border:1px solid var(--black2);border-radius:5px;font-size:1rem}.login-form button{width:100%;padding:10px;background-color:var(--primary);color:var(--white);border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s}.login-form button:hover{background-color:#8a1918}.forgot-password{text-align:center;margin-top:1rem}.forgot-password a{color:var(--primary);text-decoration:none}@media (max-width: 480px){.login-container{width:90%}}.dt-scroll-headInner{width:auto!important}
