.loading-icon{animation:spin 1s linear infinite;color:#2196f3}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dashboard{display:flex;flex-direction:column;align-items:center;width:100%;height:100vh;color:#333}.dashboard h1,.dashboard h2,.dashboard h3,.dashboard h4{color:#2d2d2d}@media (min-width: 921px){.goal-list{width:920px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px}}.progress-bar-container{margin-top:1rem;z-index:1}.progress-bar-container .bar-background{background-color:#e0e0e0;border-radius:4px;height:20px;margin:10px;overflow:hidden;position:relative}.progress-bar-container .bar-background .bar-fill{background-color:#4285f4;height:100%;border-radius:4px;transition:width .5s ease-in-out;position:relative}.progress-bar-container .bar-background .progress-text{position:absolute;right:5px;top:50%;transform:translateY(-50%);font-weight:bolder;-webkit-user-select:none;user-select:none}.goal-board{display:flex;flex-direction:column;border:1px solid rgb(235,235,235);border-radius:8px;width:600px;margin:50px 0 20px}.goal-board .header{display:flex;align-items:center;justify-content:space-between;font-size:28px;font-weight:bolder;margin:0 20px}.goal-board .header button{border:none;height:20px;height:30px;color:#fff;background-color:#4285f4;border-radius:4px;transition:.2s}.goal-board .header button:hover{background-color:#286ddb}.goal-board .text{display:flex;justify-content:space-between;margin:0 20px 20px}@media (max-width: 600px){.goal-board{width:300px}}@media (min-width: 921px){.goal-board{width:920px}}.goalCard{display:flex;flex-direction:column;width:600px;border:1px solid rgb(235,235,235);border-radius:8px;margin-bottom:10px}.goalCard .goalCard-header{display:flex;justify-content:space-between;margin:10px}.goalCard .body{margin:10px}.goalCard .body p{height:65px;overflow:auto;scrollbar-width:none}.goalCard .body p::-webkit-scrollbar{display:none}.goalCard .datas{display:flex;justify-content:space-between;margin:0 10px}.goalCard .tasks{margin:0 10px}.goalCard .tasks .header{display:flex;align-items:center;justify-content:space-between}.goalCard .tasks .tasks-list{height:100px;overflow:auto;scrollbar-width:none}.goalCard .tasks .tasks-list::-webkit-scrollbar{display:none}@media (max-width: 600px){.goalCard{width:300px}}@media (min-width: 921px){.goalCard{width:453px;margin-bottom:0}}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;opacity:0;visibility:hidden;display:flex;justify-content:center;align-items:center;transition:opacity .3s ease,visibility .3s ease;z-index:10}.modal-overlay.show{opacity:1;visibility:visible}.modal-content{background-color:#fff;padding:2rem;border-radius:8px;width:90%;max-width:400px;animation:slideIn .3s ease forwards}@keyframes slideIn{0%{transform:translateY(-30px);opacity:0}to{transform:translateY(0);opacity:1}}.add-goal{display:flex;flex-direction:column;gap:1.2rem;padding:2rem;background-color:#fff;border-radius:10px;max-width:500px;width:100%;box-shadow:0 8px 24px #0003;animation:slideIn .3s ease-out}.add-goal i{text-align:end}.add-goal label{display:flex;flex-direction:column;font-weight:600;color:#333}.add-goal label input,.add-goal label textarea{margin-top:.5rem;padding:.8rem 1rem;border:1px solid #ccc;border-radius:6px;font-size:1rem;transition:border .3s ease}.add-goal label input:focus,.add-goal label textarea:focus{outline:none;border-color:#007bff}.add-goal label textarea{resize:vertical;min-height:100px}.add-goal input[type=date]{padding:.8rem 1rem;border:1px solid #ccc;border-radius:6px;font-size:1rem;transition:border .3s ease}.add-goal input[type=date]:focus{border-color:#007bff}.add-goal button[type=submit]{padding:.8rem 1.2rem;background-color:#4285f4;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:700;cursor:pointer;transition:background-color .3s ease}.add-goal button[type=submit]:hover{background-color:#286ddb}.modal-content{display:flex;flex-direction:column;gap:1.2rem;padding:2rem;background-color:#fff;border-radius:10px;max-width:500px;width:100%;box-shadow:0 6px 20px #00000026;animation:slideIn .3s ease-out}.modal-content i{text-align:end}.modal-content h1{font-size:1.5rem;margin-bottom:1rem;color:#333;text-align:center}.modal-content label{display:flex;flex-direction:column;font-weight:500;color:#333}.modal-content label input,.modal-content label textarea{margin-top:.5rem;padding:.8rem;border:1px solid #ccc;border-radius:6px;font-size:1rem;transition:border-color .3s ease}.modal-content label input:focus,.modal-content label textarea:focus{border-color:#007bff;outline:none}.modal-content label textarea{resize:vertical;min-height:100px}.modal-content button[type=submit]{padding:.9rem 1.2rem;background-color:#4285f4;color:#fff;border:none;border-radius:6px;font-weight:700;font-size:1rem;cursor:pointer;transition:background-color .3s}.modal-content button[type=submit]:hover{background-color:#286ddb}button{margin-top:1rem;padding:.7rem 1rem;background-color:#dc3545;color:#fff;border:none;border-radius:6px;cursor:pointer;transition:background-color .3s}button:hover{background-color:#c82333}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 600px){.modal-content{padding:1.5rem;max-width:90%}h1{font-size:1.3rem}button[type=submit],button{font-size:.95rem;padding:.8rem}}.addTask-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:2000}.addTask-modal.show{opacity:1;visibility:visible}.addTask-modal input[type=text]{width:100%;max-width:400px;padding:1rem;border:1px solid #ccc;border-radius:8px;font-size:1rem;background-color:#fff;margin-bottom:1rem;margin-right:40px;box-shadow:0 4px 10px #0000001a}.addTask-modal input[type=text]:focus{outline:none;border-color:#007bff}.addTask-modal .buttons{display:flex;justify-content:center;gap:.4rem}.addTask-modal .buttons i{background-color:#007bff;color:#fff;padding:.6rem;border-radius:50%;cursor:pointer;font-size:1.5rem;transition:background-color .3s ease}.addTask-modal .buttons i:hover{background-color:#0056b3}.addTask-modal .buttons i.close{background-color:#dc3545}.addTask-modal .buttons i.close:hover{background-color:#a71d2a}@media (max-width: 480px){.addTask-modal{padding:1rem;flex-direction:column}.addTask-modal input[type=text]{width:80%;font-size:.95rem}.addTask-modal .buttons{gap:.8rem}.addTask-modal .buttons i{font-size:1.2rem;padding:.5rem}}.task-item{display:flex;align-items:center;justify-content:space-between;margin:5px;padding:2px}.task-item .buttons{opacity:0}.task-item:hover{background-color:#d3d3d3;border-radius:4px}.task-item:hover .buttons{opacity:1}body{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}.modal{border:1px solid #ccc;border-radius:4px;padding:20px;background-color:#fff}.material-icons,.material-icons-outlined{color:#333;cursor:pointer}