@import"https://fonts.googleapis.com/css2?family=Assistant:wght@200..800&display=swap";table{border-collapse:collapse;border-spacing:0;box-shadow:0 2px 10px #0000001a;text-align:left;margin-bottom:15px;border-radius:var(--table-radius);overflow:hidden}th,td{padding:10px;border:1px solid #d1d1d1;text-align:left}th{background-color:var(--primary-color);font-weight:500;border:0;color:#fff;font-size:18px;padding:20px}th[colspan="2"]{text-align:center}a{text-decoration:none;color:#007bff}ul{list-style-type:none;padding:0}table tbody tr:hover{background-color:#d6e1ff}.table-header,table{margin:0 auto;width:100%}.table-header{padding-inline:5px;display:flex;align-items:center;justify-content:space-between}.table-title{text-align:center}.shifts-field{margin-bottom:10px;display:flex;align-items:center}.shifts-field:before{content:"•";display:inline-block;width:.7em;font-size:1.5em;color:var(--hover-color);transition:transform .3s,color .3s}.empty-field{display:block;width:100%;font-size:14px;text-align:center;color:red}.no-data{position:relative;text-align:center;height:50px}tbody p.empty-table{position:absolute;left:50%;transform:translate(-50%);line-height:50px;text-align:center;font-size:16px;font-weight:600;color:red;margin:0}@media screen and (max-width: 768px){table{width:100%}th{font-size:14px;padding:10px}th,td{padding:5px;font-size:12px;text-wrap:wrap}.shifts-time{min-width:100px}table .btn{margin:0;padding:5px}}@media screen and (min-width: 480px) and (max-width: 768px){th,td{font-size:14px}table .btn{font-size:13px}}@media screen and (max-width: 480px){th,td,table .btn{font-size:12px}.table-header{justify-content:center;flex-direction:column-reverse}.table-header .btn{margin:20px 0}}header{background:linear-gradient(-90deg,#f6f9ff,#ebf1ff);box-shadow:0 2px 10px #0000001a;position:sticky;left:0;top:0;width:100%;z-index:2}header .main{margin:0 20px}header .header-container{max-width:1300px;display:flex;justify-content:space-between;align-items:center;margin-inline:auto;min-height:65px}header .header-container .logo{flex:1;max-width:fit-content}header .header-container .nav-btn.btn{display:none}header .header-container .header-links{padding:0 15px;display:flex;justify-content:space-between;align-items:center;flex:1}header h1{font-size:26px;text-align:left}header h1 a{color:var(--hover-color)}.nav-menu{flex:1}.nav-menu ul{display:flex;justify-content:center}.nav-menu ul li a{padding:10px 15px;font-size:18px;font-weight:600;color:#000}.nav-menu ul li a:hover{background-color:var(--hover-color);border-radius:8px;box-shadow:0 0 10px #0000001a;border:none;cursor:pointer;color:#fff;transition:var(--transition)}@media screen and (max-width: 1024px){header .header-container h1{font-size:22px}}@media screen and (max-width: 768px){header .main{margin:0 10px}header .header-container .logo{flex:1}header .header-container h1{font-size:20px;text-align:center}header .header-container .nav-btn.btn{display:block;cursor:pointer;padding:8px 13px;flex:0}header .header-container .header-links{position:fixed;left:-50%;bottom:0;height:100%;width:30%;flex-direction:column;align-items:flex-start;background-color:#fff;z-index:5;padding:55px 5px 0;box-shadow:7px -4px 10px #0000001a;transition:all .4s ease-out;opacity:0;visibility:hidden}header .header-container .header-links.active{left:0;opacity:1;visibility:visible}header .header-links .nav-btn.btn.close-nav{position:absolute;top:0;left:0;padding:5px 10px;width:fit-content}header .header-links .nav-menu{width:100%}header .header-links .main-nav ul{border-top:1px solid #000;flex-direction:column;padding-top:10px}header .header-links .main-nav ul li{margin-bottom:15px}.header-links-overlay{position:fixed;width:100%;height:100%;top:0;left:0;background-color:#0000004d;transition:all .4s ease-out;opacity:0;visibility:hidden}.header-links-overlay.active{opacity:1;visibility:visible}header .header-container .header-links .auth{width:90%;margin:0 auto}header .header-container .header-links .auth button{margin:10px 0}}@media screen and (max-width: 480px){header .main{margin:0 5px}}.login-page{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 90px)}.login-container{position:relative;width:850px;height:550px;background:#fff;border-radius:30px;box-shadow:0 0 30px #0000001a;margin:0 15px}.login-overlay{position:fixed;width:100%;height:100%;top:0;left:0;background-color:var(--primary-color);transition:all .4s .4s ease-out;opacity:0;z-index:-1}.login-overlay.active{opacity:1;z-index:3}.form-box{position:absolute;right:0;width:50%;height:100%;display:flex;align-items:center;color:#333;text-align:center;padding:40px;z-index:1}.input-box{position:relative;margin:30px 0}.input-box i{position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:18px;color:#888}.btn{width:100%;background-color:var(--primary-color);border-radius:8px;box-shadow:0 0 10px #0000001a;border:none;cursor:pointer;font-size:18px;font-weight:700;color:#fff}.container p{font-size:16px;margin:15px 0}.social-icons{display:flex;justify-content:center}.social-icons a{display:inline-flex;padding:10px;box-shadow:1px 1px 8px #0003;border-radius:8px;font-size:24px;color:#333;text-decoration:none;margin:0 8px}.toggle-box{position:absolute;width:100%;height:100%;overflow:hidden}.toggle-box:before{content:"";position:absolute;left:-50%;width:100%;height:100%;background-color:var(--primary-color);border-radius:150px;z-index:1;transition:.4s all ease-in}.toggle-box.active:before{left:0;border-radius:0}.toggle-panel *{color:#fff}.toggle-panel{position:absolute;width:50%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1;transition:.3s all ease-in}.toggle-box.active .toggle-panel{width:100%;z-index:4}.loading{height:21px;font-size:22px;transition:.5s all ease-in}.not-found{text-align:center;margin-top:50px}.not-found h1{font-size:2.5em;color:#333}.not-found p{font-size:1.2em;color:#666}.not-found button{margin-top:20px;padding:10px 20px;font-size:1em;color:#fff;background-color:#007bff;border:none;border-radius:5px;cursor:pointer}.not-found button:hover{background-color:#0056b3}@media screen and (max-width: 768px){.login-container{height:calc(100vh - 100px)}.form-box{bottom:0;width:100%;height:70%}.toggle-box:before{left:0;top:-270%;width:100%;height:300%}.toggle-panel{width:100%;height:30%}.toggle-box.active .toggle-panel{height:100%;z-index:6}.toggle-box.active:before{top:0}}*{margin:0;padding:0;box-sizing:border-box;font-family:Assistant,sans-serif}:root{--transition: .3s all ease-in-out;--primary-color: #7494ec;--hover-color: #597ee5;--hover-effect: .5;--table-radius: 1.5rem}html{scroll-behavior:smooth}body{min-height:100vh}li{list-style-type:none}h1,h2,h3,h4,h5,h6{margin:2rem 1rem}button,select{padding:10px;margin:10px 0;width:100%;max-width:200px}form{max-width:600px;text-align:center;margin:20px auto}input{outline:none;width:100%;color:#000;padding:1rem;border:1px solid #9e9e9e;border-radius:10px;transition:.15s cubic-bezier(.4,0,.2,1);font-size:16px}select:is(:focus):after{display:none}input:is(:focus)~label,select:is(:focus)~label,label.selected{transform:translateY(-130%) scale(.9);background-color:#fff;padding-inline:.3rem;color:var(--hover-color)}input:focus{border:1px solid var(--hover-color)}label{position:absolute;top:1rem;left:1rem;color:#a6a6a6;pointer-events:none;transition:.15s cubic-bezier(.4,0,.2,1)}select{padding:1rem 40px 1rem 1rem;margin:0;font-size:16px;border:2px solid var(--primary-color);border-radius:8px;color:#000;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url(../images/chevron-down-solid.svg);background-repeat:no-repeat;background-position:right 10px center;background-size:13px;line-height:100%;min-width:100%}select:focus{border-color:var(--hover-color);outline:none}select option{padding:10px;background-color:#fff;color:#333}select option:hover{background-color:var(--hover-color);color:#000}select option:checked{background-color:var(--hover-color);color:#fff}section{padding:50px 0 0}.container{margin:0 30px;max-width:1300px;min-height:inherit}main{max-width:1000px;margin:0 auto}.app-content{min-height:calc(100vh - 105px);margin:auto;max-width:1300px}h1{text-align:center;font-size:36px;margin-bottom:15px}.nav-btn{display:flex;justify-content:center;column-gap:20px;margin:20px 0}.buttons{text-align:center;padding:1.5rem 1rem}.btn{width:100%;border-radius:8px;box-shadow:0 0 10px #0000001a;border:none;cursor:pointer;font-size:18px;font-weight:700;color:#fff;margin:10px}.btn:hover{opacity:var(--hover-effect)}.btn.submit-button{background-color:var(--primary-color)}.btn.cancel-button{background-color:red}.btn.delete-button{background-color:orange}.btn:disabled{opacity:.5;cursor:not-allowed}.select-data:after{content:"";position:absolute;top:50%;right:10px;width:0;height:0;pointer-events:none;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid black;transform:translateY(-50%)}.select-data label{margin-right:10px}.input-field,.select-data{position:relative;margin:20px 0}.message{font-size:14px;font-weight:500;margin:0;text-align:center}.message.error{color:red}.message.success{color:green}.home-page{display:grid;min-height:inherit;place-items:center;height:inherit}.header{display:flex;justify-content:space-between;align-items:center;padding:20px;background-color:#333;color:#fff}.login-button{padding:10px 20px;background-color:#007bff;color:#fff;border:none;cursor:pointer;border-radius:5px}.content{display:flex;align-items:center}.text-content{flex:1;padding:20px}.image-content{flex:1;display:flex;justify-content:center;align-items:center}.dashboard-image{max-width:100%;height:auto}.time-container{display:grid;align-items:center;margin:20px 0;gap:15px;grid-template-columns:1fr .3fr 1fr}.form-group input:focus{outline:none;border:none}.MuiInputBase-root{border-radius:10px!important}.start-year-label label{color:#a6a6a6}.time-container .time-label,.time-container .date-label,.form-group .start-year-label,.MuiInputLabel-root.MuiFormLabel-filled{text-transform:capitalize;color:var(--primary-color)!important}.MuiInputLabel-root.Mui-error{color:red!important}.time-container .date-label,.form-group .start-year-label{width:100%}.MuiDateCalendar-root{height:100%!important}.footer{display:block;text-align:center;padding:10px;background-color:#333;color:#fff;width:100%;position:relative}@media screen and (max-width: 1024px){.container{margin:0 15px}.content{text-align:center;flex-direction:column-reverse}.image-content{width:60%}.empty-field{font-size:16px}}@media screen and (max-width: 768px){.container{margin:0 15px}h1{font-size:28px}input,select,.btn{font-size:15px}.image-content{width:85%}.empty-field{font-size:12px}}@media screen and (max-width: 480px){.time-container{place-items:center;grid-template-columns:1fr}}