body{margin:0;background-color:#1e1e2f;min-height:100vh}:root{--light-bg-primary: #f8f9fa;--light-bg-secondary: #ffffff;--light-text-primary: #212529;--light-text-secondary: #495057;--light-accent: #4a90e2;--light-accent-dark: #357abd;--light-border: #dee2e6;--light-card-bg: #ffffff;--light-input-bg: #f8f9fa;--light-nav-bg: #343a40;--light-nav-text: #f8f9fa;--light-error: #dc3545;--light-error-bg: #ffe6e6;--light-success: #28a745;--light-success-bg: #e6ffe6;--light-warning: #ffc107;--light-disabled: #6c757d;--dark-bg-primary: #1e1e2f;--dark-bg-secondary: #1E2525;--dark-text-primary: #f8f9fa;--dark-text-secondary: #adb5bd;--dark-accent: #5a9dee;--dark-accent-dark: #357abd;--dark-border: #3e3e5a;--dark-card-bg: #2A3232;--dark-input-bg: #3A4242;--dark-nav-bg: #252538;--dark-nav-text: #e9ecef;--dark-error: #ff6b6b;--dark-error-bg: #330000;--dark-success: #51cf66;--dark-success-bg: #003300;--dark-warning: #f1c40f;--dark-disabled: #495057}body.light{--bg-primary: var(--light-bg-primary);--bg-secondary: var(--light-bg-secondary);--text-primary: var(--light-text-primary);--text-secondary: var(--light-text-secondary);--accent: var(--light-accent);--accent-dark: var(--light-accent-dark);--border: var(--light-border);--card-bg: var(--light-card-bg);--input-bg: var(--light-input-bg);--nav-bg: var(--light-nav-bg);--nav-text: var(--light-nav-text);--error: var(--light-error);--error-bg: var(--light-error-bg);--success: var(--light-success);--success-bg: var(--light-success-bg);--warning: var(--light-warning);--disabled: var(--light-disabled)}body.dark{--bg-primary: var(--dark-bg-primary);--bg-secondary: var(--dark-bg-secondary);--text-primary: var(--dark-text-primary);--text-secondary: var(--dark-text-secondary);--accent: var(--dark-accent);--accent-dark: var(--dark-accent-dark);--border: var(--dark-border);--card-bg: var(--dark-card-bg);--input-bg: var(--dark-input-bg);--nav-bg: var(--dark-nav-bg);--nav-text: var(--dark-nav-text);--error: var(--dark-error);--error-bg: var(--dark-error-bg);--success: var(--dark-success);--success-bg: var(--dark-success-bg);--warning: var(--dark-warning);--disabled: var(--dark-disabled)}.navbar{width:220px;background:var(--nav-bg);padding:20px 0;border-right:1px solid var(--border);position:fixed;top:60px;left:0;height:calc(100vh - 60px);z-index:1000;color:#fff}@media (min-width: 769px){.navbar{transform:translate(0)}.page-content{margin-left:200px}}@media (max-width: 768px){.navbar{top:50px;height:calc(100vh - 50px);transform:translate(-100%)}.navbar.open{transform:translate(0)}.page-content{margin-left:0}}.navbar ul{list-style:none;padding:0;margin:0}.navbar li{margin:0}.navbar a{display:flex;align-items:center;gap:10px;padding:15px 20px;color:var(--nav-text);text-decoration:none;font-size:1.1rem;transition:background .2s ease,color .2s ease}.navbar a:hover{background:var(--input-bg);color:var(--text-primary)}.navbar a.active{background:var(--accent);color:var(--nav-text)}.navbar .logout-button button{display:flex;align-items:center;gap:10px;padding:15px 20px;color:var(--nav-text);font-size:1.1rem;border:none;background:transparent;cursor:pointer;width:100%;text-align:left;transition:background .2s ease,color .2s ease}.navbar .logout-button button:hover{background:var(--input-bg);color:var(--text-primary)}.navbar .logout-button button svg{font-size:1.2rem;color:var(--nav-text)}.app-header{position:fixed;top:0;left:0;width:100%;height:60px;display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background:var(--nav-bg);color:var(--nav-text);border-bottom:1px solid var(--border);z-index:1001}.header-left{display:flex;align-items:center;gap:15px}.app-header h1{font-size:1.5rem;margin:0;color:var(--nav-text)}.route-title{font-size:1.2rem;color:var(--accent)}.menu-toggle{display:none;background:none;border:none;color:var(--nav-text);font-size:1.5rem;cursor:pointer}@media (max-width: 768px){.menu-toggle{display:block}.app-header{height:50px}.app-header h1{font-size:1.2rem}.route-title{font-size:1rem}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,sans-serif;line-height:1.6;padding:0 40px;overflow-x:hidden}a{text-decoration:none;color:inherit}.transaction-buttons{display:flex;justify-content:flex-start;gap:12px;margin-top:12px}.transaction-buttons button{padding:6px 12px;font-weight:600;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s ease,color .3s ease}.transaction-buttons .edit-btn,.transaction-buttons .delete-btn{background-color:transparent}.app-container{max-width:1200px;margin:0 auto;padding:40px;border-radius:12px;box-shadow:0 8px 32px #0000004d}header{text-align:center;margin-bottom:40px}.app-title{font-size:3rem;font-weight:700;text-transform:uppercase;letter-spacing:1px}.section-title{font-size:2rem;font-weight:500;margin-bottom:20px;text-transform:uppercase;letter-spacing:1px}.transactions-container,.categories-container{margin-bottom:40px}.transactions-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.transaction-item{padding:20px;border-radius:10px;box-shadow:0 4px 12px #0003;transition:transform .3s ease,box-shadow .3s ease}.transaction-item:hover{transform:translateY(-10px);box-shadow:0 10px 25px #0000004d}.app{display:flex;flex-direction:column;min-height:100vh;background:var(--bg-secondary)}.main-content{display:flex;flex:1;position:relative}.page-content{flex:1;padding:20px;margin-top:60px}.navbar-overlay{display:none}.loading{display:flex;justify-content:center;align-items:center;height:100%;color:var(--text-primary);font-size:1.2rem}@media (max-width: 768px){.page-content{width:100%;margin-top:50px}.navbar-overlay{display:block;position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:999}}
