:root{font-family:Inter,sans-serif;--button-width: fit-content;--button-size: 30px;--primary: #F2F2F2;--secondary: #FF8C42;--tertiary: #CC5803;--accent: #2E2E2E;--success: #4CAF50;--danger: #A41623;--neutral: #E0E0E0;--dm-primary: #121212;--dm-secondary: #FF8C42;--dm-tertiary: #CC5803;--dm-accent: #E1E1E1;--dm-success: #1B9AAA;--dm-danger: #A41623;--dm-neutral: #1E1E1E;--dm-spark-accent: #FF9E22;--dm-button-text: #121212}/*!* Theme 2: Forest Greens *!*//*!* Theme 3: Royal Purples *!*//*!* Theme 4: Berry Reds *!*//*!* Theme 5: Sunset Magenta *!*//*!* Theme 6: Golden Sunrise *!*//*!* Theme 7: Teal Lagoon *!*//*!* Theme 8: Sunset Orange *!*//*!* Theme 9: Lavender Mist *!*//*!* Theme 10: Minty Fresh *!*/.dark-mode{--primary: var(--dm-primary);--secondary: var(--dm-secondary);--tertiary: var(--dm-tertiary);--accent: var(--dm-accent);--success: var(--dm-success);--danger: var(--dm-danger);--neutral: var(--dm-neutral)}body{min-width:300px;margin:0}main{display:flex;flex-direction:column;padding:0 5px}.global-error{position:fixed;top:20%;left:31.5%;right:20%;z-index:101;height:10%;width:40%;border-radius:8px;background-color:#ffc8c8cc;display:flex;flex-direction:column;align-items:center;justify-content:center}.global-error>h3{margin:0;text-align:center}.global-error>p{font-weight:bolder;color:var(--danger);text-align:center}.notification{z-index:150;position:fixed;top:50px;left:15px;opacity:0;width:0;background-color:var(--tertiary);border-right:3px solid var(--secondary);border-radius:5px;text-align:center;color:#f0f8ff;transition:width .1s;overflow:hidden}.notification__active{max-height:70px;opacity:1;display:block;height:fit-content;min-height:50px;width:200px;padding:0 5px}.disabled-button{pointer-events:none;cursor:not-allowed;opacity:.65}.warning{display:flex;align-items:center;justify-content:center;width:100%;color:var(--danger)}.general-button{width:fit-content;max-width:100px;line-break:loose;font-weight:700;font-size:25px;border-radius:5px;border:none;outline:none;background-color:var(--tertiary);cursor:pointer}.dark-mode{color-scheme:dark}.dark-mode .about>p,.dark-mode .data-container>p,.dark-mode .profile>.user-info>.details>div>.bio,.dark-mode .profile>.user-info>.details>div>.email,.dark-mode .data-container>textarea,.dark-mode .task-header>input,.dark-mode .details>input,.dark-mode .details>textarea,.dark-mode .newTaskForm>input[type=text],.dark-mode .newTaskForm>textarea,.dark-mode .Login_page__form>input{background-color:#2d2d2d;color:var(--dm-accent);border-color:#444}.dark-mode .task{border-bottom-color:#444}.dark-mode .about,.dark-mode .menu,.dark-mode .header,.dark-mode .task,.dark-mode .newTaskForm,.dark-mode .profile,.dark-mode .add-group__form{box-shadow:0 2px 8px #00000080}.dark-mode .menu{border-right-color:var(--dm-tertiary)}.dark-mode .controls{border-left-color:var(--dm-tertiary)}.dark-mode .about,.dark-mode .addTask,.dark-mode .group-button{border-bottom-color:var(--dm-tertiary)}.dark-mode .title-header{border-bottom-color:var(--dm-secondary)}.dark-mode .profile{border-bottom-color:var(--dm-tertiary)}.dark-mode .user-info>img{border-color:var(--dm-tertiary);box-shadow:0 0 50px #00000080}.add-group__form{z-index:100;height:150px;width:auto;min-width:400px;background-color:var(--primary);border-radius:10px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0000004d}.add-group-container{position:fixed;top:200px;left:0;right:0;z-index:100;width:100%;display:flex;justify-content:center;align-items:center}.add-group__form>form{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;width:100%}.add-group__form>form>div>button[type=submit]{border-radius:5px;border:none;box-shadow:none;width:var(--button-width);font-size:var(--button-size);font-family:inherit,sans-serif;font-weight:700;color:var(--accent);background-color:var(--success);cursor:pointer}.add-group__form>form>div>button{border-radius:5px;border:none;box-shadow:none;outline:none;width:var(--button-width);font-size:var(--button-size);font-family:inherit,sans-serif;font-weight:700;color:var(--accent);background-color:var(--danger);cursor:pointer}.add-group__form>form>div{display:flex;align-items:center;justify-content:center;flex-direction:row;gap:10px}.add-group__form>form>input[type=text]{width:70%;padding:1.5%;font-family:Inter,sans-serif;border:1px solid var(--tertiary);border-radius:8px;background-color:var(--neutral);color:var(--accent)}.section-container>.group-button{padding:10px}.groups-container{flex-direction:column;background-color:var(--primary);display:flex;margin-top:158px;justify-content:center;align-items:center;height:auto;padding:8px;gap:20px;z-index:90}.groups{border-radius:10px;width:98.5%;display:flex;justify-content:space-evenly;align-items:center;overflow:auto;scrollbar-width:none;gap:4px;scroll-behavior:smooth}.addGroup{border:3px solid var(--success);border-radius:5px;padding:.3%;color:var(--accent);cursor:pointer;transition:background-color,.3s ease-in-out;font-weight:700}.addGroup>img{height:40px;width:40px}.addGroup:hover{background-color:var(--success);color:#fff}.deleteGroup{border:3px solid var(--danger);border-radius:5px;padding:.3%;color:var(--accent);cursor:pointer;transition:background-color,.3s ease-in-out;font-weight:700;background-color:var(--primary)}.deleteGroup>img{height:40px;width:40px}.deleteGroup:hover{background-color:var(--danger);color:#fff}.group-controls{display:flex;align-items:center;justify-content:center;flex-direction:row;gap:10px;width:175px;border:2px solid var(--neutral);border-radius:10px;padding:10px}.groups::-webkit-scrollbar{display:none}.task-container__groups{padding:10px}.group-button{text-align:center;display:flex;align-items:center;justify-content:center;min-width:20%;max-width:20%;height:40px;border-bottom:2px solid var(--tertiary);border-radius:10px;background-color:var(--neutral);margin-top:10px;cursor:pointer;transition:background-color,.3s ease-in-out;color:var(--accent)}.group-Clicked{background-color:var(--secondary);color:#fff}@media (max-width: 700px){.add-group__form>form>input[type=text]{font-size:25px}.add-group__form{width:90%;min-width:280px}.groups-container{margin-top:0}.group-button{min-width:45%;padding:5px}.group-button>p{font-size:20px}}@media (max-width: 1000px) and (min-width: 700px){.groups-container{margin-top:0}}.task{width:100%;background-color:var(--primary);display:flex;border-radius:8px;margin-top:10px;border-bottom:var(--neutral) solid 2px;opacity:1;transition:height 1s ease;overflow:hidden;position:relative;height:230px}.task__expand{height:400px}.expand-collapse-img{position:relative;left:20px;cursor:pointer;height:40px}.removing{background-color:var(--primary);display:flex;align-items:stretch;border-radius:8px;margin-top:1%;transition:all .4s ease;transform:translate(1500px)}.task-title{margin:0;padding:0;display:flex;color:var(--accent);max-height:100%;overflow:auto}.task-error{overflow:hidden;background-color:#ffc8c8cc;border:10px solid var(--primary);margin:0;border-radius:15px;opacity:0;width:0;height:0;text-align:center;align-items:center;justify-content:center;transition:width .4s ease-in-out}.task-error__show{display:flex;margin:40px 0;height:auto;opacity:1;width:30%;transition:width .4s ease-in-out}.task-error>p{font-weight:bolder;color:var(--danger)}.data-container{padding:8px;width:100%;height:100%}.data-header>h3{color:var(--danger);margin-left:10%}.task-header h2,.task-header h3,.task-header p{margin:0;padding:0}.task-header>.date{color:var(--accent)}.task-header>h2{color:var(--accent);margin-right:5%}.task-header{flex-direction:column;align-items:flex-start;text-align:left;gap:4px;margin:8px 0 8px 16px;padding:0;width:100%}.reminder-button{border:none;outline:none;padding:5px;margin:5px;border-radius:5px;background-color:var(--tertiary);font-weight:700;color:var(--accent);cursor:pointer}.reminder__wrapper{display:flex;justify-content:center;position:fixed;z-index:100;height:100%;width:calc(100% - 10px)}.reminder__container{position:relative;margin-top:200px;max-height:200px;width:400px;min-width:290px;background-color:var(--primary);border-radius:10px;box-shadow:0 2px 3px #646464cc;border-bottom:2px solid var(--secondary)}.reminder__container>h2{width:100%;text-align:center}.reminder__input-container{display:flex;justify-content:center;align-items:center;flex-direction:row;gap:10px}.reminder__input-container>p{padding:10px;background-color:var(--neutral);width:fit-content;border-radius:10px}.reminder__input{outline:none;border:none;padding:10px;font-size:14px;font-family:inherit;border-radius:10px;background-color:var(--neutral)}.reminder__input-buttons{display:flex;justify-content:center;align-items:center;gap:20px}.data-container>p{white-space:pre-line;height:100px;border-radius:10px;padding:8px;background-color:var(--neutral);line-height:1.6;margin:0 0 0 12px;overflow-y:scroll;transition:height 1s ease}.data-container>.description-expand{height:265px;overflow-y:auto}.data-container>textarea{height:225px;width:96%;font:inherit;line-height:1.6;resize:none;border-radius:8px;outline:none;border:1px solid var(--accent);color:inherit;margin-left:12px}.task-header>textarea{width:40%;font:inherit;font-weight:700;font-size:22px;line-height:1.6;resize:none;height:fit-content;border-radius:8px;outline:none;border:1px solid #444;background-color:var(--neutral);color:inherit}.data-container>textarea:focus,.task-header>input:focus{box-shadow:0 0 0 3px var(--secondary)}.group-image{display:flex;justify-content:center;align-items:center;margin:10px 0 10px 10px;width:70px;height:70px;border-radius:5px;border:2px solid green}.controls{display:flex;overflow:hidden;gap:10px;flex-direction:column;justify-content:center;align-items:center;border-left:1px solid var(--tertiary);max-width:500px;opacity:0;width:0;transition:opacity .3s ease,max-width .3s ease;pointer-events:none;cursor:none;flex-shrink:0}.controls-visible{display:flex;margin:12px 0 12px 8px;padding:8px;max-width:150px;width:auto;opacity:1;cursor:pointer;pointer-events:auto}.controls>button{display:flex;justify-content:center;align-items:center;padding:16px}.controls>.delete{font:inherit;font-size:var(--button-size);color:var(--accent);font-weight:700;background-color:var(--danger);border-radius:5px;cursor:pointer;width:var(--button-width);border:1px solid var(--danger)}.controls>.complete{font:inherit;font-size:var(--button-size);color:var(--accent);font-weight:700;background-color:var(--success);border-radius:5px;width:var(--button-width);cursor:pointer;border:1px solid var(--success)}.controls>.edit{width:var(--button-width);font:inherit;font-size:var(--button-size);color:var(--accent);font-weight:700;background-color:var(--tertiary);border-radius:5px;cursor:pointer;border:1px solid var(--tertiary)}.task-container{margin-top:165px;padding:10px}@media (max-width: 1000px){.task{transition:none!important;flex-direction:column;height:auto}.task__expand{height:auto!important;transition:none}.expand-collapse-img{right:5px;bottom:0;left:0}.task-container{margin:0;width:auto}.task-header{height:fit-content}.data-container{padding:0 12px 12px 0;height:auto}.data-container>p{margin:0 12px;height:auto;max-height:500px;font-size:18px;width:auto}.group-image{width:50px;height:50px}.data-container>textarea{margin:0 12px;max-height:500px;width:calc(100% - 30px);font-size:18px}.task-header>textarea{width:auto;font-weight:700;min-height:50px;height:fit-content;font-size:22px;max-width:200px;overflow-wrap:break-word;white-space:pre-wrap}.data-container>.description-expand{height:auto}.controls{border:none;flex-direction:row;opacity:0;max-width:100%;height:0;transition:height 1s ease,opacity 1s ease}.controls-visible{gap:7px;opacity:1;border:none;height:50px;width:calc(100% - 16px);min-width:250px;margin:0;transition:height .3s ease,opacity .3s ease,max-width .3s ease}.controls>.delete,.controls>.complete,.controls>.edit{flex:1;min-width:80px;max-width:80px}.controls>button{height:100%}.task-error{border:none}.task-error__show{border:10px solid var(--primary);width:97.5%;margin:0}.reminder__input-container>p{font-size:20px}.reminder__input{font-size:20px}}.addTask{text-align:center;display:flex;align-items:center;justify-content:center;width:20%;min-height:40px;border-bottom:2px solid var(--tertiary);border-radius:10px;margin-left:40%;background-color:var(--primary);margin-top:10px;cursor:pointer;transition:background-color,.3s ease-in-out;color:var(--accent);padding:10px}.addTask:hover,.group-button:hover{background-color:var(--secondary);border-bottom:2px solid var(--accent);color:#fff}.newTaskForm{display:flex;flex-direction:column;align-items:center;margin-top:15px;border-bottom:1px solid var(--tertiary);width:40%;margin-left:30%;border-radius:10px;background-color:var(--primary)}.newTaskForm>input{margin:10px}.newTaskForm>a{margin:10px}.newTaskForm>h3{margin:2%;color:var(--accent)}.newTaskForm>input[type=text],.newTaskForm>textarea{color:var(--accent);padding:.5%;border-radius:5px;border:1px solid var(--tertiary);font:var(--accent) 14px "Inter",sans-serif;outline:inherit;background-color:var(--neutral)}.newTaskForm>textarea{width:80%;height:150px;resize:none}.newTaskForm>input[type=text]:focus,.newTaskForm>textarea:focus{box-shadow:0 0 0 3px var(--secondary)}.cancel{display:flex;flex-grow:1;font:inherit;color:var(--accent);font-size:var(--button-size);font-weight:700;border:1px solid var(--danger);background-color:var(--danger);border-radius:5px;cursor:pointer;padding:1px}.newTaskForm__buttonContainer{padding:2%;display:flex;align-items:center;gap:10px;justify-content:center;flex-grow:1}.newTaskForm__buttonContainer>button[type=submit]{font:inherit;font-weight:700;color:var(--accent);border:1px solid var(--tertiary);border-radius:5px;background-color:var(--tertiary);padding:1px;cursor:pointer;outline:inherit;font-size:var(--button-size)}@media (max-width: 850px){.addTask{margin:0;width:inherit;font-weight:700;font-size:25px}.newTaskForm{width:100%;margin:0;gap:10px}.newTaskForm>.newTaskForm__input[type=text]{font-size:30px;width:90%;padding:5px}.newTaskForm>textarea{font-size:30px;height:300px;width:90%;padding:5px}}.nav-items{display:flex;flex-direction:row;align-items:center;justify-content:center}.nav-item{text-align:center;display:flex;align-items:center;font-weight:700;color:var(--accent);padding:10px;border-right:1px solid var(--tertiary);height:50px;width:fit-content;cursor:pointer}.nav-item__end{border-right:none}.nav-item__alone{padding:0 2px;border:1px solid var(--tertiary);margin-bottom:3px}.nav-item:hover{background-color:var(--secondary);color:#fff}.title-header{display:inline-flex;align-items:center;justify-content:center;width:100%}.title-header>h1{text-align:center}.title-header>h2{text-align:center}.header{z-index:100;position:fixed;top:0;left:0;right:1px;color:var(--accent);background-color:var(--primary);display:flex;flex-direction:column;align-items:center;border-bottom:var(--secondary) solid 2px;border-radius:8px;box-shadow:0 4px 4px #0000004d}@media (max-width: 1000px){.header{position:static}}.profile>.user-info>.details>div>.bio{background-color:var(--neutral);padding:1.5%;border-radius:5px;margin-left:10px;width:60%}.profile>.user-info>.details>div>.email{background-color:var(--neutral);padding:1.5%;border-radius:5px;margin-left:10px;width:40%}.profile>.user-info>.details>div{display:flex;align-items:center;flex-direction:row;justify-content:center;width:100%}.profile{border-radius:10px;width:60%;border-bottom:var(--tertiary) solid 2px;box-shadow:2px 4px 10px #000000b3;background-color:var(--primary)}.profile>h1{display:flex;align-items:center;justify-content:center}.user-info{display:flex;flex-direction:column;align-items:center;border:2px solid var(--neutral);border-radius:5px;margin:10px;padding:15px}.profile>h1{color:var(--accent)}.profile_container{position:relative;top:200px;height:100vh;display:flex;align-items:center;flex-direction:column;width:100%}.user-info>button{font-weight:700;font-size:var(--button-size);background-color:var(--secondary);border-radius:5px;cursor:pointer;margin:10px;border:1px solid var(--secondary);color:var(--accent);outline:none}.user-info>img{width:20%;height:20%;border-radius:10px;border:2px solid var(--tertiary);box-shadow:0 0 50px #0000004d}.details>h2{color:var(--accent)}.details{display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%;border:none}.details>input,.details>textarea{color:inherit;padding:.5%;border-radius:5px;border:1px solid var(--tertiary);font:var(--accent) 14px "Inter",sans-serif;outline:inherit;margin-top:2%;background-color:var(--neutral)}.details>input:focus,.details>textarea:focus{box-shadow:0 0 0 3px var(--secondary);outline:none}.details>input{width:40%}.details>textarea{resize:none;width:60%;height:100px}.themes-container{height:auto;border:2px solid var(--neutral);border-radius:5px;width:calc(100% - 60px);padding:15px;margin:15px;display:grid;grid-template-columns:repeat(10,1fr);justify-content:space-between;align-items:center;flex-direction:row;gap:10px}.theme-container{border:1px solid var(--neutral);height:30px;width:30px;display:flex;justify-content:center;align-items:center;padding:1px;border-radius:5px;cursor:pointer}.theme_wrapper{max-width:50px;display:flex;justify-content:space-between;align-items:center;flex-direction:column}.theme_wrapper_clicked{border:2px solid var(--secondary)}.theme{height:25px;width:25px;border-radius:50px}.theme-form{display:flex;flex-direction:column;align-items:center;justify-content:center}.theme-form__buttons{display:flex;align-items:center;justify-content:space-around;flex-direction:row}.theme-form__buttons>button{font-weight:700;font-size:var(--button-size);border-radius:5px;cursor:pointer;margin:10px;border:none;color:var(--accent);outline:none}.theme_save{background-color:var(--success)}.theme_cancel{background-color:var(--danger)}@media (max-width: 1200px){.themes-container{grid-template-columns:repeat(7,1fr)}}@media (max-width: 1000px){.profile_container{top:20px;height:80vh}}@media (max-width: 700px){.theme{height:40px;width:40px;border-radius:50px}.themes-container{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);justify-items:center;align-items:center}.theme-container{height:50px;width:50px}.profile_container{top:50px;height:80vh}.profile>.user-info>.details>div{width:95%;padding:10px}.profile>.user-info>.details>div>.email,.profile>.user-info>.details>div>.bio{width:100%;height:auto;font-size:20px}.bio{text-align:center}.details{width:92%}.details>h2{font-size:30px}.details>textarea{width:100%}.details>input{width:80%}.details>div>.label{color:var(--accent);font-size:22px;font-weight:700}.profile{width:95%}}.Login_page__container{position:relative;top:20px;display:flex;flex-direction:column;align-items:center;width:30%;max-width:800px;min-width:400px;justify-content:center;border-bottom:2px solid var(--tertiary);box-shadow:2px 4px 10px #00000040;border-radius:8px;background-color:var(--primary);padding:0 35px 50px}.Login_page{height:100vh;position:inherit;width:100%;display:flex;align-items:center;justify-content:center}.Login_page__form{display:flex;flex-direction:column;align-items:center;justify-content:center;width:80%;margin:0 30px}.Login_page__container>p{font-size:35px;font-weight:bolder;color:var(--accent);margin:60px 0}.Login_page__form>input{margin-bottom:20px;margin-top:0;color:var(--accent);border-radius:10px;border:2px solid var(--neutral);font:var(--accent) 14px "Inter",sans-serif;font-size:20px;outline:inherit;padding:8px;width:100%;background-color:#fff}.Login_page__form>label{align-self:flex-start;margin-bottom:5px;font-size:20px;color:var(--accent)}.login_page__links{text-align:left;width:100%;margin-top:10px}.login_page__links_container{display:flex;align-items:center;flex-direction:row;align-self:flex-start}.login_page__links_container>p{margin-right:2px;color:var(--accent);font-size:17px}.login_page__links_container>a{text-decoration:none;color:var(--tertiary);font-weight:700;font-size:17px}.Login_page__form>button[type=submit]{margin-top:20px;padding:10px;font-weight:700;border:none;color:var(--accent);border-radius:10px;cursor:pointer;outline:inherit;font-size:var(--button-size);width:100%;background-color:var(--tertiary)}.Login_page__form>button[type=submit]:hover{background-color:var(--accent);color:var(--neutral);border:none}@media (max-width: 700px){.Login_page{height:auto;align-items:unset}.Login_page__container{min-width:90%;padding:0 20px 20px}.Login_page__container>p{font-size:30px;margin:35px 0}.login_page__links_container>p,.login_page__links_container>a{font-size:14px}.Login_page__form{width:100%;margin:0 10px}.Login_page__form>button[type=submit]{margin-top:10px;padding:8px}}@media (max-width: 1000px){.Login_page{height:auto;align-items:unset}}.about-container{height:100vh;width:100%;display:flex;align-items:center;justify-content:center}.about{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--primary);color:var(--accent);border-radius:15px;padding:30px;border-bottom:2px solid var(--tertiary);width:60%}.about>p{text-align:center;border-radius:15px;padding:20px;background-color:var(--neutral)}@media (max-width: 700px){.about-container{position:relative;height:auto;top:20px}.about>p{font-size:15px;padding:10px;background-color:var(--neutral)}.about{padding:10px;width:95%}}@media (max-width: 1000px){.about-container{position:relative;height:auto;top:20px}.about{width:100%}}