@import "https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap";.navbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;width:calc(100% - 48px);min-height:50px;margin:26px 24px;display:flex}.leftPanel,.rightPanel,.location,.btn-group,.moonDiv{align-items:center;display:flex}.leftPanel,.rightPanel{gap:14px}.btn-group{background-color:var(--bg-dark);cursor:pointer;border-radius:50%;flex-shrink:0;justify-content:center;width:48px;height:48px;transition:all .3s}.btn-group:hover{opacity:.8;transform:scale(1.05)}.btn-group img{width:22px;height:22px}.location{color:var(--text-white);gap:10px;min-width:0;font-size:15px;font-weight:500}.location span{white-space:nowrap}.searchBox{flex:1;align-items:center;min-width:250px;max-width:500px;display:flex;position:relative}.searchBox input{border:1px solid var(--bg-dark);background-color:var(--bg-dark);width:100%;height:44px;color:var(--text-white);border-radius:10px;outline:none;padding-left:63px;padding-right:20px;font-size:15px;transition:all .3s}.searchBox input:focus{border-color:#888}.searchBox input::placeholder{color:#9b9b9b}.searchBox img{cursor:pointer;width:22px;height:22px;position:absolute;top:50%;left:21px;transform:translateY(-50%)}.mod{border:1px solid var(--border-color);background-color:var(--bg-dark);cursor:pointer;border-radius:30px;flex-shrink:0;width:115px;height:46px;position:relative}.moonDiv{background-color:var(--light-bg);border-radius:50%;justify-content:center;width:40px;height:40px;transition:all .3s;position:absolute;top:3px;right:3px}.moonDiv:hover{transform:scale(1.05)}.moonDiv img{width:20px;height:20px}.profileImg{object-fit:cover;cursor:pointer;border-radius:50%;flex-shrink:0;width:40px;height:40px;transition:all .3s}.profileImg:hover{transform:scale(1.05)}@media (width<=992px){.navbar{justify-content:center}.searchBox{order:3;width:100%;max-width:100%}}@media (width<=576px){.navbar{gap:16px;width:calc(100% - 24px);margin:20px 12px}.leftPanel,.rightPanel{justify-content:space-between;width:100%}.location span{display:none}.searchBox{min-width:100%}.searchBox input{height:42px;font-size:14px}.btn-group{width:42px;height:42px}.mod{width:90px;height:42px}.moonDiv{width:34px;height:34px}.profileImg{width:36px;height:36px}}.topBar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;width:calc(100% - 48px);margin:0 24px;padding-bottom:10px;display:flex}.days{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.days span{color:#6b7280;cursor:pointer;white-space:nowrap;font-size:15px;transition:all .3s;position:relative}.days span:hover{color:#fff}.days .active{color:#fff;font-weight:500}.days .active:after{content:"";background:#fff;border-radius:10px;width:100%;height:2px;position:absolute;bottom:-9px;left:0}.weatherType{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.weatherType button{color:#6b7280;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:20px;outline:none;padding:6px 14px;font-size:11px;transition:all .3s}.weatherType .selected{color:#111827;background:#dbeafe;font-weight:600}.rainText{color:#fff;white-space:nowrap;font-size:26px;font-weight:300}@media (width<=768px){.topBar{flex-direction:column;align-items:flex-start;gap:14px}.days,.weatherType{justify-content:flex-start;width:100%}.rainText{font-size:22px}}@media (width<=576px){.topBar{width:calc(100% - 24px);margin:0 12px}.days{gap:10px}.weatherType{flex-wrap:wrap;gap:8px}.weatherType button{padding:5px 10px;font-size:10px}.rainText{width:100%;font-size:18px}}.map-banner{width:100%;margin-top:20px;padding:0 24px;overflow:hidden}.map-card{justify-content:space-around;align-items:stretch;gap:24px;display:flex;overflow-x:auto}.map-card::-webkit-scrollbar{display:none}.forecast-card{flex-shrink:0;align-items:center;gap:20px;display:flex}.forecast-icon{background-color:var(--bg-card);cursor:pointer;border-radius:28px;flex-direction:column;justify-content:center;align-items:center;gap:24px;min-width:120px;padding:20px;transition:all .3s;display:flex}.forecast-icon:hover{transform:translateY(-6px)scale(1.03)}.forecast-icon span:first-child{text-align:center;border-bottom:1px solid var(--border-color2);color:#fff;width:100%;padding-bottom:12px;font-size:15px;font-weight:600}.forecast-icon span:last-child{color:#fff;font-size:28px;font-weight:700}.forecast-icon img{object-fit:contain;width:60px;height:60px}.rain-graph{flex-shrink:0;align-items:center;display:flex}.rain-graph img{object-fit:contain;width:297px;height:226px}@media (width<=1200px){.map-card{gap:18px}.forecast-card{gap:16px}.forecast-icon{min-width:105px;padding:18px}.forecast-icon span:last-child{font-size:24px}.rain-graph img{width:240px;height:210px}}@media (width<=992px){.map-banner{padding:0 18px}.map-card{align-items:flex-start}.forecast-card{flex-wrap:wrap;gap:14px}.forecast-icon{border-radius:22px;flex:calc(33.333% - 10px);min-width:calc(33.333% - 10px)}.forecast-icon img{width:52px;height:52px}.forecast-icon span:first-child{font-size:14px}.forecast-icon span:last-child{font-size:22px}.rain-graph img{width:210px;height:190px}}@media (width<=576px){.map-banner{padding:0 12px}.map-card{flex-direction:column;gap:14px}.forecast-card{flex-wrap:wrap;justify-content:center;gap:12px;width:100%}.forecast-icon{border-radius:18px;flex:calc(33.333% - 8px);gap:18px;min-width:calc(33.333% - 8px);padding:14px}.forecast-icon img{width:42px;height:42px}.forecast-icon span:first-child{padding-bottom:10px;font-size:12px}.forecast-icon span:last-child{font-size:18px}.rain-graph{justify-content:center;width:100%}.rain-graph img{width:100%;height:auto}}.weather-card{color:#1a2a3a;background:linear-gradient(160deg,#c8dff5 0%,#a8c8e8 100%);border-radius:24px;flex-direction:column;flex-shrink:0;justify-content:space-between;width:320px;height:100%;padding:20px 22px;font-family:Segoe UI,sans-serif;display:flex;box-shadow:0 8px 24px #0000002e}.wc-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.wc-day,.wc-time{font-size:15px;font-weight:600}.wc-main{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.wc-temp{letter-spacing:-2px;font-size:56px;font-weight:700;line-height:1}.wc-icon img{object-fit:contain;width:72px;height:72px}.wc-details{gap:12px;display:flex}.wc-col{flex-direction:column;flex:1;gap:5px;display:flex}.wc-col--right{flex:none}.wc-row{align-items:baseline;gap:6px;font-size:13px;display:flex}.wc-label{color:#3a5068;white-space:nowrap}.wc-value{color:#1a2a3a;font-weight:500}.wc-bold{font-weight:700}@media (width<=1200px){.weather-card{width:280px}.wc-temp{font-size:48px}.wc-icon img{width:62px;height:62px}}@media (width<=992px){.weather-card{width:250px;padding:16px 18px}.wc-temp{font-size:42px}.wc-icon img{width:54px;height:54px}.wc-row{font-size:12px}}@media (width<=576px){.weather-card{border-radius:18px;width:220px;padding:14px 16px}.wc-temp{font-size:36px}.wc-day,.wc-time{font-size:13px}.wc-icon img{width:46px;height:46px}.wc-row{font-size:11px}}.chance{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;width:calc(100% - 48px);margin:30px 24px 20px;display:flex}.other span{color:#fff;font-size:20px;font-weight:600;transition:all .3s;position:relative}.weather{justify-content:space-between;align-items:center;width:325px;margin-left:auto;display:flex}.weather .rainText{color:#d1d5db;cursor:pointer;font-size:15px;transition:all .3s}.weather .rainText:hover{color:#fff}.weather .rainText:last-child{color:#8ab4ff;font-weight:600}@media (width<=768px){.chance{align-items:flex-start;gap:14px}.other span{font-size:18px}}@media (width<=576px){.chance{flex-direction:column;align-items:flex-start;width:calc(100% - 24px);margin:24px 12px}.weather{justify-content:space-between;width:100%}.other span{font-size:17px}.weather .rainText{font-size:14px}}.weatherContainer{grid-template-columns:2fr 1.2fr;gap:24px;width:calc(100% - 48px);margin:24px;display:grid}.weatherInfo{grid-template-columns:repeat(2,1fr);gap:24px;display:grid}.card{background:#18181b;border-radius:24px;flex-direction:column;justify-content:space-between;min-height:240px;padding:24px;transition:all .3s;display:flex}.card:hover{transform:translateY(-6px)}.card-head{color:#a1a1aa;font-size:14px;font-weight:500}.card-img{align-self:center;width:100%;max-width:140px}.card-footer{flex-direction:column;gap:10px;display:flex}.card-footer.row{flex-direction:row;justify-content:space-between;align-items:center}.value{color:#fff;font-size:28px;font-weight:700}.desc{color:#9ca3af;font-size:13px;line-height:1.4}.rightSide{gap:24px;display:flex}.imgDiv{background-image:linear-gradient(#0003,#000000a6),url(/images/started.jpg);background-position:50%;background-size:cover;border-radius:24px;flex:1;min-height:100%;position:relative;overflow:hidden}.overlay{flex-direction:column;justify-content:space-between;height:100%;padding:28px;display:flex}.bannerTitle{color:#fff;font-size:30px;font-weight:700;line-height:1.3}.overlay button{cursor:pointer;color:#000;background:#fff;border:none;border-radius:18px;outline:none;height:58px;font-size:16px;font-weight:700;transition:all .3s}.overlay button:hover{transform:scale(1.02)}.citiesWeather{flex-direction:column;flex:1;justify-content:space-between;display:flex}.cities-card{background:#18181b;border-radius:20px;justify-content:space-between;align-items:center;padding:18px;transition:all .3s;display:flex}.cities-card:hover{transform:translate(5px)}.cities-card.active{border:2px solid #3b82f6}.country{color:#71717a;font-size:12px}.cities-card h3{color:#fff;margin:4px 0;font-size:20px;font-weight:600}.cities-card p{color:#a1a1aa;font-size:13px}.cities-card img{width:56px;height:56px}@media (width<=992px){.weatherContainer{grid-template-columns:1fr}.rightSide{flex-direction:column}}@media (width<=576px){.weatherContainer{width:calc(100% - 24px);margin:12px}.weatherInfo{grid-template-columns:1fr}.bannerTitle{font-size:22px}.cities-card h3{font-size:18px}}:root{--bg-dark:#1e1e1e;--bg-main:#111015;--bg-card:#1b1b1d;--text-white:#fff;--border-color:#626161;--border-color2:#39393a;--light-bg:#d8e9f9}*{box-sizing:border-box;color:#fff;margin:0;padding:0}body{background-color:var(--bg-main);font-family:Montserrat,sans-serif;overflow-x:hidden}