@import"https://fonts.googleapis.com/css2?family=Battambang:wght@100;300;400;700;900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined";:root{--bg-color: #121212;--card-color: #1e1e1e;--text-color: #e0e0e0;--accent: #64ffda;--border-color: #333;--todo-item-hover-border-color: red;--btn-color: #292929;--btn-logout-border-color: red;--btn-logout-hover-color: #990000;--btn-google-hover-color: #00d3a1}body{font-family:Battambang,Poppins,Segoe UI,sans-serif;background:#111;color:#fff;margin:0;padding:0}.app{max-width:1400px;margin:auto;padding:1rem}.header{background:linear-gradient(217deg,#f00c,#f000 70.71%),linear-gradient(127deg,#0f0c,#0f00 70.71%),linear-gradient(336deg,#00fc,#00f0 70.71%);padding:1rem;border:double 5px var(--accent);border-radius:12px;align-items:center;justify-content:space-between;max-width:700px;margin:auto}.user-info{display:flex;align-items:center;gap:10px}.after-loggin-header{display:flex;flex-direction:column;align-items:center;gap:10px}.user-info img{width:50px;height:50px;border-radius:50%;object-fit:cover;border:1px solid var(--accent);box-shadow:0 0 10px 2px var(--accent)}.btn-logout{background-color:var(--btn-color);color:var(--text-color);border:1px solid var(--btn-logout-border-color);padding:4px;cursor:pointer;border-radius:8px;font-weight:700;transition:background .2s ease;display:inline-flex;align-items:center}.btn-logout span{margin-left:4px}.btn-logout:hover{background-color:var(--btn-logout-hover-color);box-shadow:0 0 10px 2px var(--btn-logout-border-color)}.note-editor input,.note-editor textarea{width:calc(100% - 20px);padding:.5rem;margin:.5rem 0;background:#222;color:#fff;font-weight:bolder;border:none;border-radius:8px;outline:none;border:solid 1px #222}.note-editor input:focus,.note-editor textarea:focus{outline:none;border:solid 1px #00ff00}.note-editor>input{font-family:Battambang,Poppins,Segoe UI,sans-serif}.note-editor>textarea{resize:vertical;font-family:Battambang,Poppins,Segoe UI,sans-serif}.note-editor{padding:10px;border:solid 1px #00ff00;border-radius:10px;margin-top:10px}.btn-save{margin-right:10px;padding:10px 20px;background:#222;border:solid 1px #0f0;border-radius:6px;color:#fff}.btn-save:hover{background:green;box-shadow:0 0 10px 5px green}.btn-cancel{margin-right:10px;padding:10px 20px;background:#222;border:solid 1px #f00;border-radius:6px;color:#fff}.btn-cancel:hover{background:#900;box-shadow:0 0 10px 5px #900}.notes .note{background:#333;margin-top:1rem;padding:1rem;border-radius:10px}.note h3{margin:0;padding:5px 10px;background:#222;border-radius:5px}.note .create-date{color:#ccc}.note>div>button{margin-right:10px;border-radius:10px;background:#222;color:#fff;padding:2px 10px}.btn-edit{border:solid 1px #dddd00;display:inline-flex;align-items:center}.btn-edit:hover{background-color:#d70;box-shadow:0 0 10px 2px #dd0}.btn-delete{border:solid 1px red;display:inline-flex;align-items:center}.btn-delete:hover{background-color:#900;box-shadow:0 0 10px 2px red}.btn-copy{border:solid 1px #00eeff;display:inline-flex;align-items:center}.btn-copy:hover{background-color:#09f;box-shadow:0 0 10px 2px #09f}.material-symbols-outlined{font-size:15px}.app-container{text-align:center;margin:2rem auto}.title{font-size:2rem;margin-bottom:1rem}.btn-google{background:#222;color:#fff;border:none;padding:0 20px;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;border:solid 2px #222;font-weight:bolder;transition:background .3s ease;transition:box-shadow .3s ease;border:solid 2px var(--accent)}.google-content{display:flex;align-items:center;gap:.5rem}.btn-google:hover{color:#222;background:var(--btn-google-hover-color);border:solid 2px var(--accent);box-shadow:0 0 20px 10px var(--btn-google-hover-color)}.btn-add-new-note{background:#222;color:#0f0;padding:8px 12px;margin-top:10px;border:solid 1px #00ff00;border-radius:10px;font-weight:bolder;display:inline-flex;align-items:center}.btn-add-new-note:hover{color:#222;background:green;box-shadow:0 0 10px 10px green}.btn-add-new-note>span{font-size:20px;margin-right:4px}.title-and-language-changer{justify-content:center;align-items:center;display:flex}.language-changer{margin-left:5px}select,::picker(select){appearance:base-select}selectedcontent,option{display:flex;gap:.5rem;align-items:center}.language-changer{background-color:#222}option{padding-block:.25rem;background-color:#222}.country-name{color:#fff}.flag{width:30px;height:20px}option::checkmark{color:#fff}