*{box-sizing:border-box;margin:0;padding:0}:root{font-family:Plus Jakarta Sans,sans-serif;line-height:1.5;font-weight:500;min-width:320px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color-scheme:light dark}body{width:100%;height:100vh;min-height:100vh;--color-background: #ffffff;--color-foreground: #000112;--color-bg: #f4f7fd;--color-bg-add-column: #e4ebfa;--main-purple: #635fc7;--main-purple-hover: #a8a4ff;--danger-red: #ea5555;--danger-red-hover: #ff9898;--items-color: #828fa3;--padding: 1.5rem;--box-shadow: 0px 10px 20px 0px rgba(54, 78, 126, .25);--border-radius: .5rem;--separator-border: .5px solid rgba(130, 143, 163, .3);--transition: all ease-in .5s;background-color:var(--color-background);color:var(--color-foreground)}body.dark{--color-background: #2b2c37;--color-foreground: #ffffff;--color-bg: #20212c;--color-bg-add-column: #ffffff}.danger{color:var(--danger-red)}.danger:hover{color:var(--danger-red-hover)}.dark-mode-toggle{margin-top:auto;margin-left:var(--padding);display:flex;align-items:center;justify-content:center;background:var(--color-bg);box-shadow:var(--box-shadow);gap:1rem;height:3rem;border-radius:var(--border-radius);box-shadow:0 10px 20px #364e7e40}.dark-mode-toggle .light,.dark-mode-toggle .dark{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem}.dark-mode-toggle label{display:flex;align-items:center;justify-content:center}.dark-mode-toggle input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none}.dark-mode-toggle .check{position:relative;display:block;width:50px;height:25px;background-color:var(--main-purple);cursor:pointer;border-radius:20px;transition:var(--transition)}.dark-mode-toggle .check:after{content:"";position:absolute;background-color:#fff;width:18px;height:18px;top:.2rem;left:4px;border-radius:50%;transition:var(--transition)}.dark-mode-toggle input[type=checkbox]:checked~.check:after{transform:translate(28px);transition:var(--transition);left:-0px}.App{width:100%;height:100vh;display:flex;overflow-y:hidden;position:relative}.sidebar-container{display:none;padding:var(--padding);padding-left:0;color:var(--items-color);box-shadow:var(--box-shadow);z-index:10;border-right:var(--separator-border)}.navbar-content{width:100%;display:flex;flex-direction:column}@media screen and (min-width: 576px){.sidebar-container{display:block;width:50%}.navbar-content{width:50%}}@media screen and (min-width: 976px){.sidebar-container{width:30%}.navbar-content{width:70%}}@media screen and (min-width: 1200px){.sidebar-container{width:25%}.navbar-content{width:75%}}.hide-button{gap:.5rem;background-color:transparent;font-size:1.2rem;border:none;color:var(--items-color);margin-top:auto;display:flex;align-items:center;width:100%;min-height:3rem;border-radius:0rem 6.25rem 6.25rem 0rem;padding-left:var(--padding);transition:var(--transition)}.hide-button:hover{background:var(--main-purple, #635fc7);color:#fff}.hide-button span{font-weight:700;line-height:normal}.hide.sidebar-container{transition:var(--transition);display:none}.hide.navbar-content{width:100%}.show-sidebar{position:absolute;bottom:3.5rem}@media screen and (max-width: 576px){.show-sidebar{display:none}}.nav{width:100%;display:flex;justify-content:space-between;height:5rem;box-shadow:var(--box-shadow);padding:0 var(--padding);border-bottom:var(--separator-border)}.nav__brand{display:flex;align-items:center;gap:.8rem}.nav__brand__desktop-logo{height:100%;display:flex;align-items:center;justify-content:center;gap:.8rem;font-weight:700;line-height:normal;border-right:var(--separator-border);letter-spacing:.1rem;padding-right:1rem;color:var(--color-foreground);transition:var(--transition)}.nav__brand__desktop-logo p{display:flex;align-items:center;font-size:1.5rem}.nav__board-name{display:flex;align-items:center}nav__board-name p{font-weight:700;font-size:1.2rem;line-height:1.5rem;color:var(--color-foreground);z-index:100}.nav__board-name__chevron{margin-left:.5rem}.nav__settings{display:flex;align-items:center;justify-content:center;gap:.8rem}.settings-modal button{background-color:transparent;border:none;align-items:center;font-weight:700;line-height:normal}.settings-edit{color:var(--items-color)}.nav__settings-ellipse{width:1.5rem;height:1.5rem;background-color:transparent;border:none;display:flex;align-items:center;justify-content:center}@media screen and (min-width: 576px){.nav__brand__mobile-logo,.nav__brand span{display:none}}@media screen and (max-width: 576px){.nav__brand__desktop-logo{display:none}}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0009;display:flex;align-items:center;justify-content:center;transition:all .5s ease-in-out;overflow:hidden;z-index:9999}.menu-modal{top:5rem;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;transition:var(--transition)}.modal-content{margin:0 auto;margin-top:1rem;min-width:90%;width:80%;height:auto;background-color:var(--color-background);color:#fff;display:flex;align-items:center;justify-content:center;font-size:2rem;padding:var(--padding);border-radius:.5rem;box-shadow:0 10px 20px #364e7e40;overflow:scroll}.menu-modal .modal-content{max-width:200px;padding:0 1rem 0 0}@media screen and (min-width: 576px){.modal-content{min-width:50%;max-width:25rem}}@media screen and (min-width: 976px){.modal-content{min-width:25rem}}.modal.settings-modal{justify-content:flex-end;align-items:flex-start;background-color:transparent}.settings-modal .modal-content{margin-left:84vw;margin-top:4.5rem;display:flex;padding:1rem;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:.8rem;min-width:200px;width:200px}.modal.task-settings-modal{bottom:8rem;justify-content:flex-end}.task-settings-modal .modal-content{position:absolute;right:10vw;top:42vh;min-width:200px;width:200px;gap:.8rem}@media screen and (min-width: 976px){.task-settings-modal .modal-content{right:32vw;top:35vh}}.label{display:flex;flex-direction:column;gap:.2rem;width:100%;height:auto}.label>input{outline:none;width:100%;height:2rem;border-radius:.25rem;border:2px solid rgba(130,143,163,.25);color:var(--items-color);background-color:inherit;padding:1rem;font-weight:500;line-height:1.4375rem}.label>input:focus{border-color:var(--main-purple)}.input-and-delete{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;height:2rem}.input-and-delete input{outline:none;width:95%;height:100%;border-radius:.25rem;border:2px solid rgba(130,143,163,.25);color:var(--color-foreground);background-color:inherit;padding:1rem;font-weight:500;line-height:1.4375rem}.input-and-delete input:focus{border-color:var(--main-purple)}.input-and-delete img{width:1rem;height:1rem;cursor:pointer}.button{width:-moz-fit-content;width:fit-content;height:2rem;border:1px solid transparent;padding:1rem;cursor:pointer;transition:all .25s;border-radius:1.5rem;background:var(--main-purple, #635fc7);transition:var(--transition);color:var(--White, #fff);font-family:Plus Jakarta Sans;font-size:.8rem;font-style:normal;font-weight:700;line-height:normal;display:flex;align-items:center;justify-content:center}.button:hover{background:var(--main-purple-hover, #a8a4ff)}.button:focus,.button:focus-visible{outline:4px auto -webkit-focus-ring-color}.custom-select{min-width:250px;width:100%;margin:0;display:flex;flex-direction:column;padding:0;position:relative;background:var(--color-background)}.custom-select label{margin:0;padding:0}select{margin-top:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;font-size:1.15rem;background-color:var(--color-background);color:var(--color-foreground);border:2px solid rgba(130,143,163,.25);border-radius:.25rem;cursor:pointer;padding:.5rem}.arrow{position:absolute;top:2.7rem;right:1.1rem}select:focus{outline:none}select:focus{border-color:var(--main-purple)}.add-new-task{width:100%;color:var(--items-color);display:flex;flex-direction:column;justify-content:center;gap:.7rem}.task-columns{display:flex;flex-direction:column;justify-content:center;gap:.4rem}.new-task-name input{color:var(--color-foreground)}.add-new-task h2{font-size:1.1rem;font-weight:700;line-height:normal;color:var(--color-foreground)}.add-new-task label{font-size:.8rem;font-style:normal;font-weight:700;line-height:normal}.add-new-task button{width:100%}.add-subtasks-button{background-color:var(--color-bg-add-column);color:var(--main-purple)}.task-description{display:flex;flex-direction:column;gap:.2rem;width:100%}.task-description textarea{width:100%;resize:none;border:2px solid rgba(130,143,163,.25);outline:none;line-height:normal;color:var(--color-foreground);background-color:var(--color-background);border-radius:.25rem;height:5rem;padding:.5rem;font-weight:500;letter-spacing:normal}.task-description textarea:focus{border-color:var(--main-purple)}.add-new-board{width:100%;color:var(--items-color);display:flex;flex-direction:column;justify-content:center;gap:.7rem}.board-columns{display:flex;flex-direction:column;justify-content:center;gap:.4rem}.new-board-name input{color:var(--color-foreground)}.add-new-board h2{font-size:1.1rem;font-weight:700;line-height:normal;color:var(--color-foreground)}.add-new-board label{font-size:.8rem;font-style:normal;font-weight:700;line-height:normal}.add-new-board button{width:100%}.add-column-button{background-color:var(--color-bg-add-column);color:var(--main-purple)}.menu{display:flex;flex-direction:column;justify-content:center;height:auto;gap:1rem;margin:1.5rem 0;color:var(--items-color);font-size:1.2rem;width:100%}.menu__count{font-weight:700;line-height:normal;letter-spacing:.1rem;padding-left:var(--padding)}.menu__item-container{display:flex;flex-direction:column;gap:.5rem;justify-content:center;font-weight:700;line-height:normal}.menu__item,.menu__item-add{display:flex;align-items:center;gap:.5rem;cursor:pointer;width:100%;height:3rem;border-radius:0rem 6.25rem 6.25rem 0rem;padding-left:var(--padding)}.menu__item span{display:flex;align-items:center;justify-content:center}.menu__item.active{background:var(--main-purple, #635fc7);color:#fff}.menu__item-add,.menu__item-add-text{color:var(--main-purple, #635fc7)}.menu__item-add-text{display:flex;font-size:1.2rem;border:none;background-color:transparent;gap:.2rem;justify-content:center;align-items:center}.menu__item:not(.active):hover{transition:var(--transition);background-color:var(--color-bg-add-column);color:var(--main-purple, #635fc7)}.confirm{background-color:var(--color-background);color:var(--color-foreground);display:flex;flex-direction:column;gap:1rem;font-size:1rem}.confirm h2{font-size:1.2rem;font-weight:700;line-height:normal;color:var(--danger-red)}.confirm p{font-weight:500;line-height:normal;color:var(--items-color)}.confirm .confirm__buttons{display:flex;justify-content:space-between}.confirm__buttons .button{width:45%}.confirm__buttons-danger{background-color:var(--danger-red);color:#fff}.confirm__buttons-danger:hover{background-color:var(--danger-red-hover)}.confirm__buttons-cancel{background-color:var(--color-bg-add-column);color:var(--main-purple)}.confirm__buttons-cancel:hover{background-color:var(--color-background)}.sidebar{height:90%;width:100%;color:var(--items-color);display:flex;flex-direction:column;transition:var(--transition);margin-bottom:0;padding-bottom:0;overflow:scroll}.sidebar__logo{display:flex;align-items:center;gap:.8rem;padding-left:var(--padding)}.sidebar__logo span{font-weight:700;line-height:normal;letter-spacing:.1rem;color:var(--color-foreground);font-size:2rem}.sidebar__menu .menu{min-height:67vh;height:100%;max-height:70vh}.content{display:flex;height:100%;width:100%;gap:1rem;padding:var(--padding);background-color:var(--color-bg);overflow-x:scroll;overflow-y:auto}.task{border-radius:.5rem;background:var(--color-background);box-shadow:0 4px 6px #364e7e1a;width:17rem;min-height:5.5rem;padding:var(--padding);display:flex;flex-direction:column;justify-content:center;gap:.3rem}.task:hover{transform:scale(1.05);transition:var(--transition)}.task__title{font-weight:700;line-height:normal;letter-spacing:.1rem;color:var(--color-foreground);font-size:1.1rem}.subTasks{color:var(--items-color);font-size:.8rem;font-weight:500}.add-column{margin-top:2.3rem;border-radius:var(--border-radius);background:var(--color-bg-add-column);color:var(--items-color);min-width:17.5rem;width:17.5rem;display:flex;justify-content:center;gap:.5rem;align-items:center}.add-column button{background:transparent;border:none;color:var(--items-color);font-size:1.5rem;font-style:normal;font-weight:700;line-height:normal}.task-settings-modal{width:100%;height:100%;background-color:transparent}.task-settings-modal button{background-color:transparent;border:none;align-items:center;font-weight:700;line-height:normal}.task-settings-modal .modal-content{width:auto;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}.task-settings-modal__edit{border:1px solid red;color:var(--items-color)}.input__checkbox{display:inline-flex;align-items:center;justify-content:center;gap:8px;background-color:var(--color-bg);padding:var(--padding)}.input__checkbox .checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;min-width:18px;height:18px;margin:0;border-radius:4px;background-color:#fff;border-radius:.25rem;border:1px solid rgba(130,143,163,.8)}.input__checkbox .checkbox:checked{background:var(--main-purple);border:1px solid var(--main-purple)}.input__checkbox .checkbox:checked:after,.input__checkbox .checkbox:checked:before{content:"";display:none;left:5px;top:2px;display:block;position:absolute;width:3px;height:8px;border-right:3px solid #fff;border-bottom:3px solid #fff;transform:rotate(35deg);border-top-right-radius:2px;border-bottom-left-radius:2px}.task-details{color:var(--items-color);font-size:.8rem;font-style:normal;font-weight:700;line-height:normal;width:100%;display:flex;flex-direction:column;gap:.7rem}.task-details__title{align-items:center;display:flex;justify-content:space-between}.task-details__title h2{width:95%;font-size:1.1rem;font-weight:700;line-height:normal;color:var(--color-foreground)}.task-details__title span{display:flex;align-items:center;justify-content:center}.task-details__subtasks{display:flex;flex-direction:column;gap:.4rem}.subtask{width:100%;display:flex;align-items:center;justify-content:flex-start;height:30px;padding:.5rem;height:fit-content;height:-moz-fit-content;border-radius:.25rem}.column{width:17.5rem;min-width:17.5rem;height:fit-content;height:--moz-fit-content}.column__title{font-size:.75rem;font-style:normal;font-weight:700;line-height:normal;letter-spacing:.15rem;color:var(--items-color);margin-bottom:1.3rem;display:flex;align-items:center}.column__title-icon{margin-right:.5rem;width:.93rem;height:.93rem;border-radius:50%;background:#49c4e5}.column__content{display:flex;flex-direction:column;gap:var(--padding)}
