.header-main{display:flex;flex-direction:row;justify-content:space-between;padding:20px;font-weight:lighter}.user-icon{border-radius:50%}.search-icon{padding:4px 8px}.search-user{display:flex;flex-direction:row;gap:20px;align-items:center}.search-bar-dark,.search-bar-light{position:relative;transition:all 1s;width:50px;height:50px;box-sizing:border-box;border-radius:10px;border:3px solid var(--mid-gray);padding:5px 0;box-shadow:0 0 50px -21px rgba(0,0,0,.1);color:var(--dark-gray)}.search-bar-dark input,.search-bar-light input{position:absolute;top:0;left:0;width:100%;height:42.5px;line-height:30px;outline:0;border:0;display:none;font-size:14px;font-weight:lighter;border-radius:20px;padding:0 20px}.search-bar-dark .fa,.search-bar-light .fa{box-sizing:border-box;padding:10px;width:42.5px;height:42.5px;position:absolute;top:0;right:0;text-align:center;font-size:1.2em;transition:all 1s}.search-bar-light:hover,.search-bar-light:valid{width:170px;cursor:pointer;border:2px solid #c0ced8;transition:all .2s ease-in-out}.search-bar-dark:hover,.search-bar-dark:valid{width:170px;cursor:pointer;border:2px solid #c0ced8;transition:all .2s ease-in-out}.search-bar-light:hover input,.search-bar-light:valid input{display:block;transition:all .2s ease-in-out;background-color:transparent;padding-left:70px;font-size:16px;color:var(--dark-gray)}.search-bar-dark:hover input,.search-bar-dark:valid input{display:block;transition:all .2s ease-in-out;background-color:transparent;padding-left:70px;font-size:16px;color:var(--white)}@media (min-width:768px){.menu-icon{display:none}.header-wrapper{align-items:flex-start}.header-main,.header-wrapper{display:flex;flex-direction:row}.header-main{justify-content:space-between;width:100%;font-size:20px}.search-icon{width:30px;height:25px}.user-icon{width:40px;height:40px}.search-bar-dark,.search-bar-light{width:390px}.search-bar-light:hover,.search-bar-light:valid{width:500px;transition:all .8s ease-in-out}.search-bar-dark:hover,.search-bar-dark:valid{width:500px;transition:all .8s ease-in-out}}.sidebar-main{width:100vw;transition:all .7s ease-in-out;display:flex;align-items:center;justify-content:space-evenly;flex-direction:row;position:absolute;bottom:-140px}.dark-sidebar{background-color:var(--dark-lighter)}.dark-sidebar p{color:#fff!important}.light-sidebar{background-color:var(--white);box-shadow:0 8px 24px hsla(210,8%,62%,.2)}.light-sidebar p{color:var(--dark-gray)!important}.light-sidebar div:hover{background-color:var(--gray)}.dark-sidebar div:hover{background-color:var(--darker)}.sidebar-main p{font-size:smaller;font-weight:700}.sidebar-main a{text-decoration:none}.icon-name-wrap:hover{background-color:var(--gray);cursor:pointer}.icon-name-wrap-overview{color:var(--green)!important;flex-direction:row;align-items:center;padding:10px;position:relative;display:flex;flex-direction:column}.icon-name-wrap-overview:hover{background-color:var(--gray);cursor:pointer}.overview-text{color:var(--green)!important}.icon-name-wrap{flex-direction:row;align-items:center;justify-content:flex-start;margin:0;display:flex;flex-direction:column}.close-sidebar{display:none}@media (min-width:768px){.sidebar-main{min-height:100vh;top:0;width:300px;bottom:0;left:0;margin-right:20px;align-items:center;position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:100px 5px 5px;z-index:100}.close,.sidebar-main{transition:all .7s ease-in-out;overflow:hidden}.close{width:60px}.icon-rotate{transition:transform .3s ease-in-out;transform:rotate(180deg);z-index:1;position:absolute}.sidebar-main p{padding:20px 30px;font-size:smaller;font-weight:700}.icon-name-wrap:hover{background-color:var(--gray);cursor:pointer}.icon-name-wrap-overview{display:flex;flex-direction:row;align-items:center;padding:10px 0 10px 10px;position:relative;width:300px}.icon-name-wrap-overview:hover{background-color:var(--gray);cursor:pointer}.overview-text{color:var(--green)!important}.icon-name-wrap{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;padding:10px 0 10px 10px;margin:0;position:relative;width:300px}.close-sidebar{display:inline;position:absolute;left:20px;top:-70px}.sidebar-main-close{margin-right:20px;padding-top:40px;padding-left:5px;height:100vh;width:2vw;background-color:var(--white);cursor:pointer;box-shadow:0 8px 24px hsla(210,8%,62%,.2);animation:fadeIn 2s .5s forwards;transition:.5s}.sidebar-main-close:hover{background-color:var(--mid-gray)}.dark-light-mode{height:100px;position:absolute;left:15px;top:750px;width:200px;display:flex;flex-direction:row;justify-content:space-between}.theme-switch{display:inline-block;height:34px;position:relative;width:60px}.theme-switch input{display:none}.slider{background-color:var(--gray);border:.3px solid #d5dce3;bottom:0;cursor:pointer;left:0;right:0;top:0}.slider,.slider:before{position:absolute;transition:.4s}.slider:before{background-color:var(--green);bottom:4px;content:"";height:26px;left:4px;width:26px}input:checked+.slider{background-color:var(--white)}input:checked+.slider:before{transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}}.chart-main{border:1px solid var(--mid-gray);border-radius:10px;display:flex;flex-direction:column;justify-content:center}p{text-align:center}.bar-chart{width:300px}.table-main{margin-top:30px;border-radius:10px;box-shadow:0 0 50px -21px rgba(0,0,0,.1);overflow-y:auto;height:350px;padding:20px 0}.table{width:100%}.table-body-dark,.table-body-light{font-size:12px}.client-invoiceNo{display:flex;flex-direction:column;align-items:flex-start}.table thead th{text-align:left;padding:20px 10px;font-size:14px}.table-body-dark td,.table-body-light td{padding:20px 10px;border-top:1px solid var(--mid-gray)}.table-body-light tr:hover{background-color:var(--gray);cursor:pointer;transition:all .2s ease-in-out}.table-body-dark tr:hover{background-color:var(--darker);cursor:pointer;transition:all .2s ease-in-out}.td-client{font-size:12px;font-weight:600}.td-invoice-no{font-size:10px}.status-pending span{color:var(--lighter-blue);border:1px solid var(--lighter-blue);border-radius:20px;padding:5px 10px;font-weight:bolder}.status-sent span{color:var(--test1);border:1px solid var(--test1);border-radius:20px;padding:5px 10px;font-weight:bolder}.status-paid span{color:var(--green);border:1px solid var(--green);border-radius:20px;padding:5px 10px;font-weight:bolder}.sum{font-size:10px}@media (min-width:768px){.table-main{overflow-y:auto;height:350px;padding:20px 0}.table thead th{font-size:16px}.td-client{font-size:14px}.td-invoice-no{font-size:12px}.status-paid,.status-pending,.status-sent,.sum{font-size:14px}}.main-section{margin:25px}.main-section h1{font-size:larger;font-weight:500}.main-body{border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 0 50px -21px rgba(0,0,0,.1)}.chart{width:300px;position:relative}.chart p{text-align:center}.total-invoices{position:absolute;top:50%;left:48%;font-weight:600;font-size:20px}.charts-icons-wrapper{display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;gap:90px;padding:10px;margin-bottom:20px;cursor:pointer;border-bottom:1px solid var(--mid-gray)}.icon-title{display:flex;flex-direction:row-reverse;justify-content:center;align-items:center;gap:5px}.icon-title p{text-align:center;font-size:12px;font-weight:lighter}@media (min-width:768px){.main-body{display:flex;flex-direction:column;justify-content:space-between}.charts-icons-wrapper{gap:60vw}.charts-display{display:flex;flex-direction:row;gap:20vw}}