@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,sans-serif}.container{width:100vw;height:100vh;display:flex;flex-direction:column}.flex{flex:1;display:flex;justify-content:space-between;align-items:stretch}.left_section{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem;border-right:2px solid #ccc;background-color:#fff}.left_section .title{font-size:2.2rem;font-weight:600;text-align:center;margin-bottom:1.5rem;color:#222}.img_container{width:100%;display:flex;justify-content:center;align-items:center}.img_container img{width:100%;max-width:400px;height:auto;object-fit:contain;transition:transform .3s ease}.img_container img:hover{transform:scale(1.02)}.right_section{flex:1;padding:2rem;background-color:#fefefe;display:flex;flex-direction:column;justify-content:center;align-items:center}.right_section .title{font-size:2rem;font-weight:600;margin-bottom:.5rem;color:#222}.sub_title{font-size:1rem;font-weight:500;margin-bottom:2rem;color:#666}.bold{font-weight:600;color:#007bff;cursor:pointer;text-decoration:underline}.bold:hover{color:#0056b3}@media screen and (max-width: 768px){.flex{flex-direction:column}.left_section,.right_section{width:100%;height:auto;padding:1.5rem;border-right:none;border-bottom:1px solid #ccc}.img_container img{width:90%;max-width:300px}.left_section .title,.right_section .title{font-size:1.6rem}.sub_title{font-size:.95rem}}form{display:flex;flex-direction:column;gap:1rem;max-width:500px;width:100%;margin-inline:auto;margin-block:1rem;padding:2rem;border:1px solid #ccc;border-radius:8px;background-color:#f9f9f9}label{display:flex;flex-direction:column;font-weight:500;font-size:1rem}input{padding:.6rem;font-size:1rem;margin-top:.5rem;border:1px solid #ccc;border-radius:4px;outline:none;transition:border-color .3s}input:focus{border-color:#007bff}button{padding:.7rem;font-size:1rem;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:600;transition:background-color .3s ease}button:hover{background-color:#0056b3}@media screen and (max-width: 480px){form{padding:1rem;max-width:90%}input,button{font-size:.95rem}}.spinner{width:40px;height:40px;border:4px solid #ccc;border-top:4px solid #007bff;border-radius:50%;animation:spin 1s linear infinite;margin:auto}@keyframes spin{to{transform:rotate(360deg)}}.side_box{width:16rem;height:100%;display:flex;flex-direction:column;justify-content:space-between;border-right:2px solid #ccc;padding:20px}.title{display:flex;justify-content:space-between}.cross{display:none}.side_box .buttons div{padding:10px;margin:20px 0;cursor:pointer;transition:background-color .1s ease-in-out}.side_box .buttons div:hover{border:1px solid #ccc;border-radius:8px}.side_box .buttons .active{background-color:#007bff;color:#fff;border-radius:8px;font-weight:600}.logout{cursor:pointer;font-weight:500}.logout:hover{font-weight:600}@media (max-width: 768px){.cross{display:block}}.dashboard{display:flex;height:100vh;width:100vw;background-color:#f8f8f8}.sidebar{width:16rem;height:100%;padding:20px;border-right:2px solid #ccc}.task_container{flex:1;padding:20px}.star{cursor:pointer}.add-task-btn{background-color:#007bff;color:#fff;padding:10px 20px;border:none;border-radius:4px;font-size:1rem;cursor:pointer;margin-bottom:20px}.add-task-btn:hover{background-color:#0056b3}.task_grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:20px}.box{background-color:#fff;padding:15px;border-radius:8px;box-shadow:0 2px 5px #0000001a;border:1px solid #ddd}.box h1{font-size:1.25rem;margin-bottom:10px}.box p{font-size:1rem;margin-bottom:10px}.box button{background-color:#007bff;color:#fff;padding:5px 10px;border:none;border-radius:4px;cursor:pointer;margin-top:20px;margin-right:5px}.box button:hover{background-color:#0056b3}.modal-box{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:999}.modal{background-color:#ddd;width:600px;height:auto;padding:20px;border-radius:8px}.modal h3{font-size:1.5rem;margin-bottom:10px}.modal form{display:flex;flex-direction:column}.modal label{font-size:1rem;margin-bottom:8px}.modal input{padding:10px;margin-bottom:15px;border-radius:4px;border:1px solid #ccc}.modal-actions{display:flex;justify-content:space-between;margin-top:20px}.modal-actions button{background-color:#c82333;color:#fff;padding:10px 15px;border:none;border-radius:4px;cursor:pointer;width:45%}.modal-actions button:hover{background-color:#990511}.modal-actions button:first-of-type{background-color:#0056b3}.modal-actions button:first-of-type:hover{background-color:#003c82}