:root{--bg-color: #1a4329;--container-bg: rgba(19, 51, 31, .4);--container-border: #285a3a;--text-main: #f4f9f5;--text-muted: #5c856c;--text-accent: #b2d2bd;--input-bg: #13331f}body.light-theme{--bg-color: #f2f7f4;--container-bg: #ffffff;--container-border: #b2d2bd;--text-main: #0b1d12;--text-muted: #5c856c;--text-accent: #285a3a;--input-bg: #e4eee7}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);transition:background-color .3s ease,color .3s ease;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale;min-height:100vh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:60px 20px}.App{width:100%;max-width:440px;margin:0 auto}.todo-container{display:flex;flex-direction:column;min-height:550px;width:100%;border:2px solid var(--container-border);background-color:var(--bg-color);transition:background-color .3s ease,border-color .3s ease;padding:24px;border-radius:16px;box-shadow:0 12px 32px #0003}.todo-container h2{font-size:1.4rem;font-weight:700;color:#b2d2bd;margin-bottom:16px;text-align:left;letter-spacing:.5px}.app-header{margin-bottom:35px;text-align:center}.app-header h1{font-size:2.2rem;font-weight:700;color:var(--text-main);letter-spacing:.5px}.app-header p{font-size:1rem;color:var(--text-muted);font-weight:500;margin-top:6px;letter-spacing:.5px}.todo-header{margin-bottom:25px;text-align:center}.todo-header h2{font-size:1.4rem;font-weight:700;color:var(--text-accent)!important;margin-bottom:16px;text-align:center;letter-spacing:.5px;display:block}.todo-header p{font-size:1rem;color:#b2d2bd;font-weight:600}.todo-form{display:flex;margin-bottom:25px;border:1px solid #4a6b56;border-radius:6px;overflow:hidden;width:100%}.todo-form input{flex:1;background-color:var(--input-bg);border:none;padding:14px 16px;color:var(--text-main);transition:background-color .3s ease,color .3s ease;font-size:1rem}.todo-form input:focus{outline:none}.todo-form input::placeholder{color:#5c856c}.add-btn{background-color:#7da087;color:#0b1d12;border:none;padding:0 20px;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .2s ease}.add-btn:hover{background-color:#6c8f76}.complete-all-btn{background:none;border:1px solid #4a6b56;color:#b2d2bd;margin-top:12px;padding:6px 12px;border-radius:6px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .2s ease}.complete-all-btn:hover{background-color:#4a6b5633;color:#f4f9f5;border-color:#5c856c}.complete-all-btn:active{transform:scale(.95)}.todo-list{list-style:none;flex:1;overflow-y:auto;margin-bottom:25px}.todo-list p{font-size:1rem;font-weight:700;color:#5c856c}.todo-item{display:flex;justify-content:space-between;align-items:center;background-color:#7da087;padding:16px 20px;border-radius:10px;margin-bottom:14px;transition:transform .2s ease}.todo-item:hover{transform:translateY(-1px)}.todo-content{display:flex;align-items:center;gap:14px;flex:1;cursor:pointer}.todo-checkbox{width:22px;height:22px;border:2px solid #0b1d12;border-radius:6px;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:transparent;flex-shrink:0;transition:background-color .2s ease}.todo-item.completed .todo-checkbox{background-color:#0b1d12}.checkmark{font-size:.9rem;font-weight:900;color:#0b1d12}.todo-item.completed .checkmark{color:#7da087}.todo-text{font-size:1.1rem;color:#0b1d12;font-weight:600}.todo-item.completed{background-color:#5d7a66;opacity:.7}.todo-item.completed .todo-text{text-decoration:line-through;color:#fff9}.delete-btn{background:none;border:none;cursor:pointer;font-size:1rem;padding:4px;filter:brightness(0) invert(1);opacity:.8;transition:opacity .2s ease}.delete-btn:hover{opacity:1}.theme-toggle-btn{position:absolute;top:20px;right:20px;background-color:var(--container-bg);border:1px solid var(--container-border);color:var(--text-main);padding:8px 14px;border-radius:20px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #0000000d;z-index:10}.theme-toggle-btn:hover{transform:translateY(-1px);filter:brightness(1.1)}.theme-toggle-btn:active{transform:scale(.98)}.app-footer{margin-top:40px;text-align:center;padding:15px}.app-footer p{font-size:1rem;color:#5c856c;font-weight:500;letter-spacing:.5px}
