*{margin:0;padding:0;box-sizing:border-box}*::-webkit-scrollbar{display:none}a{text-decoration:none;color:inherit}html,body{width:100%;height:100%}.header{display:flex;justify-content:space-between;align-items:center;background-color:#181c2f;color:#fff;padding:16px 32px;box-shadow:0 2px 6px #0000001a;position:sticky;top:0;z-index:100}.header-title{font-size:1.8rem;font-weight:600;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;letter-spacing:1px}.back-btn,.logout-btn{background-color:#ff4b5c;margin-left:1rem;color:#fff;padding:10px 18px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:500;transition:transform .2s ease,background-color .3s ease;animation:inout ease-in .2s}@keyframes inout{0%{transform:translate(110%);opacity:0}to{transform:translate(0);opacity:1}}.back-btn:hover,.logout-btn:hover{background-color:#ff1f38;transform:scale(1.05)}.back-btn:active,.logout-btn:active{transform:scale(.95)}.login-form{width:320px;margin:50px auto;padding:30px;border-radius:10px;background:#f9f9f9;box-shadow:0 0 12px #0000004d;font-family:Arial,sans-serif;min-width:40%;min-height:50%;transform:translateY(50%)}h2{text-align:center;margin-bottom:20px}.form-group{margin-bottom:26px}label{font-weight:700;display:block;margin-bottom:6px}.input{width:100%;padding:10px;border:2px solid #ccc;border-radius:6px;transition:.3s all;outline:none;font-size:16px}.input:focus{border-color:#888}.input.error{border-color:red;background-color:#ffe5e5}.error-msg{color:red;font-size:13px;margin-top:4px;display:block}.login-btn{width:100%;padding:12px;background:#2c3e50;color:#fff;border:none;border-radius:6px;font-weight:700;font-size:16px;cursor:pointer;transition:.2s}.login-btn:hover{background:#1a242f}.shake{animation:shake .3s ease-in-out}@keyframes shake{0%{transform:translate(0)}25%{transform:translate(-5px)}50%{transform:translate(5px)}75%{transform:translate(-5px)}to{transform:translate(0)}}.admin-container{display:flex;justify-content:center;align-items:center;height:100vh;background:linear-gradient(135deg,#eef2f3,#8e9eab);font-family:Segoe UI,sans-serif;padding:20px}.admin-left{flex:1;display:flex;justify-content:center;align-items:center;padding:40px}.admin-right{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:40px;padding:40px}.admin-button{width:70%;padding:25px;font-size:1.5rem;font-weight:700;border:none;border-radius:12px;background:linear-gradient(to right,#00c6ff,#0072ff);color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 10px 20px #0072ff33;animation:fadeInUp .6s ease-in-out}.admin-button:hover{transform:scale(1.05);box-shadow:0 12px 24px #0072ff66}.admin-button:active{transform:scale(.98);box-shadow:0 4px 10px #0072ff4d}@media (max-width: 768px){.admin-container{flex-direction:column;text-align:center}.admin-left,.admin-right{width:100%}.admin-button{width:80%}.welcome-text{font-size:2.2rem}}.user-container{display:flex;justify-content:center;align-items:center;height:100vh;background:linear-gradient(135deg,#eef2f3,#8e9eab);font-family:Segoe UI,sans-serif;padding:20px}.user-left{flex:1;display:flex;justify-content:center;align-items:center;padding:40px}.welcome-text{font-size:3rem;font-weight:800;color:#2c3e50;text-shadow:2px 2px 6px rgba(0,0,0,.2);animation:fadeInLeft .7s ease-out}.user-right{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:40px;padding:40px}.user-button{width:70%;padding:25px;font-size:1.5rem;font-weight:700;border:none;border-radius:12px;background:linear-gradient(to right,#00c6ff,#0072ff);color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 10px 20px #0072ff33;animation:fadeInUp .6s ease-in-out}.user-button:hover{transform:scale(1.05);box-shadow:0 12px 24px #0072ff66}.user-button:active{transform:scale(.98);box-shadow:0 4px 10px #0072ff4d}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.user-container{flex-direction:column;text-align:center}.user-left,.user-right{width:100%}.user-button{width:80%}.welcome-text{font-size:2.2rem}}.create-task-container{display:flex;justify-content:space-between;gap:2rem;width:100%;max-width:1200px;margin:3rem auto;padding:2rem;background-color:#f9f9f9;border-radius:16px;box-shadow:0 6px 20px #0003;flex-wrap:wrap}.create-task-left,.create-task-right{flex:1;min-width:300px}input,select,textarea{padding:.8rem 1rem;border:2px solid #ccc;border-radius:8px;font-size:1rem;transition:border .3s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:#4f46e5}textarea{resize:none;min-height:150px;width:100%}.create-btn{padding:1rem 2rem;font-size:1.1rem;background-color:#4f46e5;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:transform .2s ease,background-color .3s ease;margin-top:1rem}.create-btn:hover{background-color:#3730a3;transform:scale(1.05)}.create-btn:active{transform:scale(.95);background-color:#312e81}.desc-label{font-weight:600;display:block;margin-bottom:.5rem;color:#333}@media (max-width: 768px){.create-task-container{flex-direction:column;padding:1.5rem}.create-task-left,.create-task-right,.create-btn{width:100%}}select.ccerror,input.ccerror,textarea.ccerror{border-color:#dc2626;background-color:#fff1f2}.create-new-container{display:flex;justify-content:space-between;gap:2rem;width:100%;max-width:1200px;margin:3rem auto;padding:2rem;background-color:#f9f9f9;border-radius:16px;box-shadow:0 6px 20px #00000014;flex-wrap:wrap}.create-new-left{flex:1;min-width:300px}.eye{font-size:x-large;transform:translate(-180%,25%)}.form-group{display:flex;flex-direction:column;margin-bottom:1.5rem}label{font-weight:600;margin-bottom:.5rem;color:#333}input{width:90%;padding:.8rem 1rem;border:2px solid #ccc;border-radius:8px;font-size:1rem;transition:border .3s ease}input:focus{outline:none;border-color:#4f46e5}.new-btn{padding:1rem 2rem;font-size:1.1rem;background-color:#4f46e5;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:transform .2s ease,background-color .3s ease}.new-btn:hover{background-color:#3730a3;transform:scale(1.05)}.new-btn:active{transform:scale(.95);background-color:#312e81}@media (max-width: 768px){.create-new-container{flex-direction:column;padding:1.5rem}.new-btn{width:100%}}input.ccerror{border-color:#dc2626;background-color:#fff1f2}.ccerror-msg{color:#dc2626;font-size:.875rem;margin-top:.4rem}.employees-container{padding:5rem}.emp-card{display:flex;background-color:#f9f9f9;border-radius:16px;box-shadow:0 8px 24px #0000004d;overflow:hidden;margin:1rem 0;transition:transform .2s ease}.emp-card:hover{transform:translateY(-5px)}.emp-card-img{flex:1;max-width:33.33%;max-height:200px;overflow:hidden;display:flex;align-items:center;justify-content:center}.emp-card-img img{max-height:200px;object-fit:cover;border-radius:8px}.emp-card-info{flex:2;padding:1.5rem;display:flex;flex-direction:column;justify-content:space-between}.emp-card-details p{margin:.5rem 0;font-size:1rem;color:#333}.emp-card-taskcounts{display:flex;justify-content:space-between;margin-top:1.5rem}.task-box{text-align:center;flex:1}.task-box h2{font-size:2rem;margin-bottom:.5rem;color:#0a66c2}.task-box p{font-size:.9rem;color:#555}@media (max-width: 768px){.emp-card{flex-direction:column}.emp-card-img{max-width:100%}.emp-card-taskcounts{flex-direction:column;gap:1rem}.task-box{padding:.5rem 0}}.edit-btn{background-color:#ff4b5c;color:#fff;padding:10px 18px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:500;transition:transform .2s ease,background-color .3s ease;animation:inout ease-in .2s;width:fit-content}.edit-btn:hover{background-color:#ff1f38;transform:scale(1.05)}.edit-btn:active{transform:scale(.95)}.task-card{background:#fff;border-left:.5rem solid;padding:1rem;margin:1rem 0;box-shadow:0 2px 8px #0003;border-radius:10px;transition:transform .2s ease;display:flex;flex-direction:column;max-width:100%}.task-card:hover{transform:translateY(-4px)}.task-status{font-size:.85rem;font-weight:600;color:#555;margin-bottom:.5rem;text-transform:uppercase}.task-info .task-title{font-size:1.25rem;font-weight:700;margin:.2rem 0}.task-info .task-desc{font-size:1rem;color:#444;margin-bottom:.5rem}.task-meta{display:flex;justify-content:space-between;font-size:.85rem;color:#666}.task-category{font-style:italic}.task-status.active{color:orange}.task-card.active{border-color:orange}.task-status.newTask{color:#0af}.task-card.newTask{border-color:#0af}.task-status.completed{color:#2ecc71}.task-card.completed{border-color:#2ecc71}.task-status.failed{color:#e74c3c}.task-card.failed{border-color:#e74c3c}.task-btn{background-color:#ff4b5c;color:#fff;padding:10px 18px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:500;transition:transform .2s ease,background-color .3s ease;width:fit-content}.task-btn:hover{background-color:#ff1f38;transform:scale(1.05)}.task-btn:active{transform:scale(.95)}.emp-detail-layout{padding:2rem}.task-list{height:390px;overflow-y:auto;overflow-x:hidden;padding:2rem;border:1px solid #ccc;background-color:#181c2f;border-radius:15px}.task-filter-nav{display:flex;gap:1rem;justify-content:center;align-items:center;margin-bottom:1.5rem;padding:.5rem 1rem;border-radius:12px}.filter-btn{padding:.5rem 1.2rem;background-color:#fff;border:1px solid #d0d7de;border-radius:8px;font-size:.95rem;color:#333;cursor:pointer;transition:all .2s ease}.filter-btn:hover{background-color:#eef2f7;border-color:#b0b8c1}.filter-btn.active{background-color:#2563eb;color:#fff;border-color:#2563eb;box-shadow:0 0 0 2px #2563eb33}.no-tasks{text-align:center;color:#fff;font-size:x-large}.x-user-tasks-container{padding:3rem;font-family:Arial,sans-serif}.x-task-dashboard{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin-bottom:1rem}.x-user-header{color:#797575}.x-task-card{height:100px;width:150px;padding:1rem;border-radius:8px;color:#fff;text-align:center}.x-task-card>h3{font-size:xx-large;margin-bottom:3px;font-weight:bolder}.x-task-card.newTask{background-color:#0af}.x-task-card.active{background-color:orange}.x-task-card.completed{background-color:#2ecc71}.x-task-card.failed{background-color:#e74c3c}.x-task-filter-nav{display:flex;justify-content:center;gap:.75rem;margin-top:1.2rem;margin-bottom:1rem;flex-wrap:wrap}.x-filter-btn{padding:.5rem 1rem;border:none;background-color:#eee;cursor:pointer;border-radius:5px;transition:background-color .3s ease}.x-filter-btn:hover,.x-filter-btn.active{background-color:#007bff;color:#fff}.x-task-card-scroll-container{overflow-x:auto;padding-bottom:2rem;margin-top:3rem}.x-task-cards-scroll{display:flex;gap:3rem;min-width:max-content}.x-task-item{display:flex;gap:2rem;flex-direction:column;justify-content:space-between;background:#f9f9f9;padding:2rem;border:1px solid #eee;border-radius:6px;width:500px;height:300px;box-shadow:0 2px 4px #0101014d}.x-task-actions{margin-top:1rem;display:flex;gap:.5rem}.x-task-actions button{padding:.4rem .8rem;border:none;border-radius:4px;font-weight:700;cursor:pointer}.x-task-actions .complete{background-color:#2ecc71;color:#fff}.x-task-actions .fail{background-color:#e74c3c;color:#fff}.x-task-actions .accept{background-color:#0af;color:#fff}button:hover{opacity:.85;transform:scale(1.05)}button:active{transform:scale(.98);opacity:.7}.empty-msg{position:absolute;left:45%;font-size:x-large;color:#797575}.y-user-dashboard{padding:1.5rem;max-width:900px;margin:0 auto;color:#514e4e}.y-user-header h2{margin:0;font-size:1.8rem;color:#6c6767}.y-user-header p{margin-top:.4rem;color:#555}.y-user-filter-nav{display:flex;justify-content:center;gap:.75rem;margin-top:1.2rem;margin-bottom:1rem;flex-wrap:wrap}.y-filter-btn{padding:.5rem 1rem;border:none;background-color:#eee;cursor:pointer;border-radius:5px;transition:background-color .3s ease}.y-filter-btn.active,.y-filter-btn:hover{background-color:#007bff;color:#fff}.y-user-scroll-container{max-height:550px;overflow-y:auto;display:flex;flex-direction:column;gap:1rem;padding:.25rem}.no-tasks-msg{text-align:center;font-size:x-large;color:#838181}
