@import "https://fonts.googleapis.com/css2?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=Inter:wght@300;400;500;600;700&display=swap";*{box-sizing:border-box;margin:0;padding:0;font-family:Poppins,sans-serif}.app{background:#e2d4ff;min-height:100vh;display:grid}.weather-container{background:linear-gradient(135deg,#0f0c29 0%,#302b63 50%,#24243e 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;position:relative;overflow:hidden}.background-orb{pointer-events:none;border-radius:50%;position:absolute}.orb-1{background:radial-gradient(circle,#6366f126 0%,#0000 70%);width:600px;height:600px;animation:8s ease-in-out infinite float;top:-200px;right:-200px}.orb-2{background:radial-gradient(circle,#8b5cf626 0%,#0000 70%);width:400px;height:400px;animation:10s ease-in-out 2s infinite float;bottom:-100px;left:-100px}.weather{-webkit-backdrop-filter:blur(30px)saturate(180%);backdrop-filter:blur(30px)saturate(180%);z-index:1;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:40px;width:100%;max-width:520px;padding:50px 40px;animation:.6s ease-out fadeIn;position:relative;box-shadow:0 20px 60px #00000080,inset 0 1px #ffffff1a}.search-bar{align-items:center;gap:15px;margin-bottom:50px;display:flex;position:relative}.search-input{color:#fff;background:#ffffff14;border:2px solid #ffffff1a;border-radius:30px;outline:none;width:100%;height:60px;padding:0 28px;font-size:16px;font-weight:500;transition:all .3s;box-shadow:0 4px 20px #0003}.search-input:focus{border-color:#6366f180;box-shadow:0 0 0 3px #6366f14d,0 8px 30px #0003}.search-input::placeholder{color:#ffffff80}.search-btn{cursor:pointer;background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);border-radius:50%;width:60px;height:60px;padding:18px;transition:all .3s;animation:2s ease-in-out infinite glow;box-shadow:0 8px 25px #6366f166}.search-btn:hover{transform:scale(1.1)rotate(5deg);box-shadow:0 10px 35px #6366f199}.loading{text-align:center;color:#fff;padding:60px 20px}.spinner{border:4px solid #ffffff1a;border-top-color:#6366f1;border-radius:50%;width:60px;height:60px;margin:0 auto 25px;animation:.8s linear infinite spin}.loading p{color:#fffc;font-size:16px;font-weight:500}.current-weather{background:linear-gradient(135deg,#6366f133 0%,#8b5cf633 100%);border:1px solid #ffffff26;border-radius:30px;justify-content:space-between;align-items:flex-start;margin-bottom:30px;padding:40px 35px;transition:all .4s cubic-bezier(.4,0,.2,1);animation:.6s ease-out slideIn;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #0000004d}.current-weather:hover{transform:translateY(-8px)scale(1.02)}.current-weather:before{content:"";pointer-events:none;background:linear-gradient(135deg,#0000 0%,#ffffff08 100%);height:100%;position:absolute;top:0;left:0;right:0}.weather-left{z-index:1;flex:1}.location{color:#ffffffe6;letter-spacing:.5px;margin-bottom:15px;font-size:20px;font-weight:500}.temperature{color:#fff;text-shadow:0 4px 20px #0000004d;margin-bottom:12px;font-size:88px;font-weight:200;line-height:1}.description{color:#ffffffbf;text-transform:capitalize;letter-spacing:.3px;font-size:18px;font-weight:400}.weather-right{z-index:1}.weather-icon{filter:drop-shadow(0 10px 30px #0000004d);width:120px;animation:3s ease-in-out infinite float}.weather-data{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:40px;display:grid}.stat-card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff14;border:1px solid #ffffff1f;border-radius:25px;align-items:flex-start;gap:15px;padding:28px 24px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 8px 30px #0003}.stat-card:hover{transform:translateY(-8px)scale(1.02)}.stat-gradient{pointer-events:none;border-radius:50%;width:150px;height:150px;position:absolute;top:-50%;right:-30%}.stat-card:first-child .stat-gradient{background:radial-gradient(circle,#6366f126 0%,#0000 70%)}.stat-card:nth-child(2) .stat-gradient{background:radial-gradient(circle,#8b5cf626 0%,#0000 70%)}.stat-card img{filter:drop-shadow(0 4px 10px #0003);z-index:1;width:38px}.stat-info{z-index:1}.stat-value{color:#fff;letter-spacing:-.5px;margin-bottom:6px;font-size:32px;font-weight:600}.stat-label{color:#fff9;text-transform:uppercase;letter-spacing:1px;font-size:14px;font-weight:500;display:block}.forecast-container h3{color:#fff;letter-spacing:-.3px;margin-bottom:25px;padding-left:5px;font-size:22px;font-weight:600}.forecast-items{scrollbar-width:thin;scrollbar-color:#ffffff4d transparent;gap:15px;padding-bottom:15px;display:flex;overflow-x:auto}.forecast-items::-webkit-scrollbar{height:8px}.forecast-items::-webkit-scrollbar-track{background:0 0}.forecast-items::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.forecast-item{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);text-align:center;cursor:pointer;background:#ffffff14;border:1px solid #ffffff1f;border-radius:25px;min-width:95px;padding:24px 16px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 8px 25px #0003}.forecast-item:hover{transform:translateY(-10px)}.forecast-item:hover .forecast-accent{opacity:1}.forecast-accent{opacity:0;background:linear-gradient(90deg,#6366f1,#8b5cf6);height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.forecast-day{color:#ffffffe6;letter-spacing:.3px;margin-bottom:14px;font-size:15px;font-weight:600}.forecast-icon{filter:drop-shadow(0 4px 10px #0003);width:44px;margin-bottom:10px}.forecast-temp{color:#fff;letter-spacing:-.5px;margin-bottom:6px;font-size:22px;font-weight:600}.forecast-desc{color:#fff9;text-transform:capitalize;letter-spacing:.2px;font-size:11px;font-weight:500}.empty-state{text-align:center;color:#fff;padding:80px 20px;animation:.5s ease-out fadeIn}.empty-icon{filter:drop-shadow(0 10px 30px #0000004d);margin-bottom:25px;font-size:80px;animation:3s ease-in-out infinite float}.empty-title{color:#ffffffe6;margin-bottom:10px;font-size:20px;font-weight:500}.empty-subtitle{color:#fff9;font-size:15px;font-weight:400}@keyframes fadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-20px)rotate(5deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes glow{0%,to{box-shadow:0 0 20px #6366f166,0 0 40px #8b5cf633}50%{box-shadow:0 0 30px #6366f199,0 0 60px #8b5cf666}}@media (max-width:600px){.weather{padding:40px 25px}.temperature{font-size:64px}.location{font-size:18px}.weather-icon{width:90px}.stat-value{font-size:26px}.forecast-item{min-width:85px;padding:20px 14px}}.last-searched{background:#6366f126;border:1px solid #6366f14d;border-radius:20px;align-items:center;gap:8px;margin-bottom:30px;padding:12px 20px;animation:.5s ease-out slideIn;display:flex}.last-searched-label{color:#fff9;text-transform:uppercase;letter-spacing:.5px;font-size:13px;font-weight:500}.last-searched-city{color:#fff;letter-spacing:.3px;font-size:15px;font-weight:600}