html,body{height:100%;margin:0;padding:0;width:100%}body{display:flex;justify-content:center;align-items:flex-start}.task-input-section{display:flex;justify-content:center}.title-text{font-size:35px;display:block;margin-bottom:30px;margin-top:10px;border-bottom:3px solid gray;padding-bottom:7px}.app-container{display:grid;place-items:center}.task-input-container{display:flex;flex-direction:row;align-items:center;column-gap:7px;margin-bottom:10px}.input-task-bar,.input-description-bar{padding:12px 16px;font-size:1rem;border:1px solid #d1d5db;border-radius:8px;background-color:#fff;transition:all .2s ease;outline:none}.task-status-checkbox{display:flex;border:solid;border:1px solid #d1d5db;border-radius:8px;padding:11px 12px}.task-status-checkbox label{display:flex;align-items:center;gap:15px;cursor:pointer;width:fit-content}.task-status-checkbox label span{font-family:sans-serif;font-size:1.2rem;order:1}.task-status-checkbox input[type=checkbox]{cursor:pointer;transform:scale(1.6);order:2;margin:0}.add-button{padding:10px 24px;font-size:1rem;font-weight:600;font-family:sans-serif;background-color:#06256e;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;height:46px}.single-task{display:flex;flex-direction:row;align-items:center;column-gap:10px}.edit-and-delete-buttons-container{display:flex;flex-direction:row;column-gap:10px}.single-task-name-description{flex:1;border:1px solid #d1d5db;border-radius:8px;padding:12px 16px;font-size:1.3rem}.edit-button,.delete-button,.save-button{padding:10px 24px;font-size:1rem;font-weight:600;font-family:sans-serif;background-color:#e3994b71;color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;height:46px}.delete-button{background-color:#28323090}.save-button{background-color:#4fe763}.task-status-value{padding:2px 5px;border-radius:6px;font-size:1.3rem;transition:all .2s ease}.task-status-value.completed{background-color:#dcfce7;color:#166534}.task-status-value.pending{background-color:#fee2e2;color:#991b1b}.task-status-label{border:1px solid #d1d5db;border-radius:8px;padding:2px 5px;background-color:#d3d3d3}.task-title{font-size:1rem}.task-description{color:gray;font-size:1.1rem}.tasks-lists-container{display:flex;flex-direction:column;row-gap:10px}
