@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-color:#0f172a;--panel-bg:#1e293bb3;--panel-border:#ffffff14;--text-primary:#f8fafc;--text-secondary:#94a3b8;--accent-color:#3b82f6;--accent-hover:#2563eb;--danger-color:#ef4444;--danger-hover:#dc2626;--temp-color:#ef4444;--dew-color:#10b981;--feels-color:#8b5cf6;--precip-color:#0ea5e9;--humid-color:#3b82f6;--cloud-color:#64748b;--wind-color:#06b6d4;--pressure-color:#f59e0b}.theme-light{--bg-color:#f8fafc;--panel-bg:#ffffffd9;--panel-border:#00000014;--text-primary:#0f172a;--text-secondary:#64748b;--accent-color:#2563eb;--accent-hover:#1d4ed8}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 0 0,#0f172a 0,#0000 50%),radial-gradient(at 100% 0,#1e3a8a66 0,#0000 50%),radial-gradient(at 100% 100%,#0f172a 0,#0000 50%),radial-gradient(at 0 100%,#581c8766 0,#0000 50%);background-attachment:fixed;min-height:100vh;font-family:Inter,sans-serif}body.theme-light{background-image:radial-gradient(at 0 0,#f1f5f9 0,#0000 50%),radial-gradient(at 100% 0,#bae6fd66 0,#0000 50%),radial-gradient(at 100% 100%,#f1f5f9 0,#0000 50%),radial-gradient(at 0 100%,#d8b8eb66 0,#0000 50%)}.glass-panel{background:var(--panel-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--panel-border);border-radius:16px;transition:transform .2s,box-shadow .2s;box-shadow:0 10px 25px -5px #0000004d,0 8px 10px -6px #0000004d}input,button{outline:none;font-family:inherit}button{cursor:pointer;border:none;border-radius:8px;font-weight:500;transition:all .2s}button:active{transform:scale(.97)}.btn-primary{background-color:var(--accent-color);color:#fff;padding:.5rem 1rem}.btn-primary:hover{background-color:var(--accent-hover)}.btn-danger{color:var(--danger-color);background-color:#0000;padding:.5rem}.btn-danger:hover{background-color:#ef44441a}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.theme-light ::-webkit-scrollbar-thumb{background:#0003}.theme-light ::-webkit-scrollbar-thumb:hover{background:#0000004d}.app-container{height:100vh;display:flex;overflow:hidden}.sidebar{z-index:50;background:var(--panel-bg);-webkit-backdrop-filter:blur(20px);border-top:none;border-bottom:none;border-left:none;border-radius:0;flex-direction:column;width:320px;height:100%;transition:left .3s;display:flex;position:fixed;top:0;bottom:0;left:-320px}.sidebar.open{left:0;box-shadow:4px 0 25px #00000080}.sidebar-overlay{z-index:40;opacity:0;pointer-events:none;background:#0006;transition:opacity .3s;position:fixed;inset:0}.sidebar-overlay.open{opacity:1;pointer-events:auto}.sidebar-header{border-bottom:1px solid var(--panel-border);padding:24px}.sidebar-header h1{letter-spacing:.025em;background:linear-gradient(90deg,#60a5fa,#c084fc);color:#0000;-webkit-background-clip:text;font-size:1.25rem;font-weight:600}.location-list{flex-direction:column;flex:1;gap:8px;padding:16px;display:flex;overflow-y:auto}.location-item{cursor:pointer;background:#ffffff08;border:1px solid #0000;border-radius:12px;justify-content:space-between;align-items:center;padding:12px 16px;transition:all .2s;display:flex}.location-item:hover{background:#ffffff0f}.location-item.active{background:#3b82f626;border-color:#3b82f64d}.location-item-name{font-size:1rem;font-weight:500}.sidebar-footer{border-top:1px solid var(--panel-border);padding:16px}.dashboard{flex-direction:column;flex:1;gap:8px;padding:12px 16px;display:flex;overflow-y:auto}.dashboard-header{margin-bottom:8px}.dashboard-header h2{margin-bottom:4px;font-size:2rem;font-weight:700}.dashboard-header p{color:var(--text-secondary)}.chart-container{width:100%;padding:4px}.chart-container h3{display:none}.add-location-form{flex-direction:column;gap:12px;display:flex}.input-group{flex-direction:column;gap:4px;display:flex}.input-group label{color:var(--text-secondary);font-size:.85rem}.input-group input{border:1px solid var(--panel-border);color:#fff;background:#0003;border-radius:8px;padding:10px 12px;transition:border-color .2s}.input-group input:focus{border-color:var(--accent-color)}
