:root{--primary: #14c270;--primary-dark: #0e8a4a;--primary-light: #4cde94;--secondary: #4a90e2;--secondary-dark: #2c6bb8;--accent: #ff6b6b;--text-light: #f5f5f5;--text-dark: #333333;--bg-light: linear-gradient(135deg, #f0f8ff 0%, #e6f7ff 100%);--bg-dark: linear-gradient(135deg, #1a2a3a 0%, #0d1825 100%);--card-light: rgba(255, 255, 255, .95);--card-dark: rgba(36, 52, 71, .95);--shadow-light: rgba(149, 157, 165, .2);--shadow-dark: rgba(0, 0, 0, .3);--glow: rgba(20, 194, 112, .3)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;margin:0;font-family:Segoe UI,system-ui,-apple-system,sans-serif;overflow-x:hidden}.home{min-height:100vh;width:100%;display:flex;flex-direction:column;transition:all .5s cubic-bezier(.4,0,.2,1)}.light-mode{background:var(--bg-light);color:var(--text-dark);animation:fadeIn .8s ease-out}.light-mode .nav-container{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);box-shadow:0 4px 20px #14c27033}.light-mode .duration{background:linear-gradient(90deg,var(--primary-dark) 0%,var(--primary) 100%)}.light-mode .weather-container{background:var(--card-light);box-shadow:0 10px 40px var(--shadow-light);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.light-mode .info-card{background:linear-gradient(135deg,#ffffffe6,#f0f8ffe6);box-shadow:0 5px 20px #00000014;border:1px solid rgba(255,255,255,.3)}.dark-mode{background:var(--bg-dark);color:var(--text-light);animation:fadeIn .8s ease-out}.dark-mode .nav-container{background:linear-gradient(135deg,#0a4b2a,#06331d);box-shadow:0 4px 20px #0000004d}.dark-mode .duration{background:linear-gradient(90deg,#06331d,#0a4b2a)}.dark-mode .weather-container{background:var(--card-dark);box-shadow:0 10px 40px #0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.dark-mode .info-card{background:linear-gradient(135deg,#243447e6,#1a2a3ae6);box-shadow:0 5px 20px #0006;border:1px solid rgba(255,255,255,.1)}.dark-mode .footer{background:linear-gradient(135deg,#0c111a,#1a2a3a)}.nav-container{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:15px 30px;position:sticky;top:0;z-index:1000;animation:slideDown .6s cubic-bezier(.4,0,.2,1);transition:all .3s ease}.nav-container:hover{box-shadow:0 6px 30px #14c27040}.home-logo{display:flex;align-items:center;font-size:1.8rem;font-weight:800;gap:12px;background:linear-gradient(135deg,#fff,#e6ffe6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:glow 2s ease-in-out infinite alternate}.home-logo svg{font-size:2.2rem;animation:float 6s ease-in-out infinite}.search-container{flex-grow:1;max-width:600px;padding:0 25px;position:relative}.search-box{position:relative;width:100%}.search-box input{width:100%;height:50px;border-radius:30px;padding:12px 60px 12px 25px;border:2px solid transparent;background:#ffffff26;color:#fff;font-size:1.1rem;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1)}.search-box input:focus{outline:none;border-color:#ffffff80;box-shadow:0 0 20px #fff3;background:#ffffff40;transform:translateY(-2px)}.search-box input::placeholder{color:#fffc}.search-icon,.location-icon{position:absolute;top:50%;transform:translateY(-50%);font-size:2.4rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);padding:8px;border-radius:50%}.search-icon{right:60px}.location-icon{right:15px}.search-icon:hover,.location-icon:hover{background:#fff3;transform:translateY(-50%) scale(1.1);color:gold;box-shadow:0 0 15px #ffd7004d}.controls{display:flex;align-items:center;gap:20px}.country{display:flex;align-items:center;gap:8px;font-size:1.1rem;font-weight:600;padding:8px 16px;border-radius:25px;background:#ffffff1a;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:all .3s ease}.country:hover{background:#fff3;transform:translateY(-2px)}.unit-toggle{cursor:pointer;padding:4px 8px;border-radius:20px;background:#fff3;transition:all .3s ease}.unit-toggle:hover{background:#ffffff4d;transform:scale(1.1)}.theme-toggle{font-size:1.6rem;cursor:pointer;padding:10px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#ffffff1a;transition:all .3s cubic-bezier(.4,0,.2,1);animation:rotate 20s linear infinite paused}.theme-toggle:hover{background:#fff3;transform:rotate(180deg) scale(1.1);box-shadow:0 0 20px #ffffff4d;animation-play-state:running}.suggestions-container{position:absolute;width:100%;max-height:300px;overflow-y:auto;background:#0e8a4af2;border-radius:15px;box-shadow:0 10px 40px #0003;z-index:10;margin-top:10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:slideUp .3s cubic-bezier(.4,0,.2,1)}.suggestion-item{padding:15px 20px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.1);transition:all .2s ease}.suggestion-item:hover{background:#ffffff1a;padding-left:30px}.description{padding:20px;text-align:center;font-size:1rem;background:linear-gradient(90deg,transparent,rgba(20,194,112,.1),transparent);margin:10px 0;font-weight:500;animation:fadeInUp .8s ease-out .3s both}.duration{padding:20px;font-size:1rem;animation:fadeInUp .8s ease-out .4s both}.duration ul{list-style:none;display:flex;justify-content:space-between;flex-wrap:wrap;gap:15px}.duration li{cursor:pointer;font-weight:600;padding:10px 20px;border-radius:25px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.duration li:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.duration li:hover:before{left:100%}.duration li:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0003}.duration li.active{background:#ffffff4d;box-shadow:0 5px 15px #0003}.weather-container{flex-grow:1;padding:30px;border-radius:30px;margin:20px;display:flex;flex-direction:column;gap:30px;animation:scaleIn .8s cubic-bezier(.4,0,.2,1) .5s both;border:1px solid rgba(255,255,255,.1)}.current-weather{display:flex;flex-direction:column;gap:25px;padding-bottom:25px;border-bottom:2px solid rgba(20,194,112,.2)}.location-info h2{font-size:2.2rem;margin-bottom:10px;background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:slideInLeft .8s ease-out}.location-info .date{font-size:1.1rem;color:#777;margin-bottom:15px;animation:slideInLeft .8s ease-out .1s both}.location-info .description{font-size:1.3rem;font-weight:600;text-transform:capitalize;padding:0;margin:0;background:none;animation:slideInLeft .8s ease-out .2s both}.weather-main{display:flex;flex-wrap:wrap;justify-content:space-between;gap:30px}.temperature{display:flex;align-items:center;gap:30px;animation:fadeIn 1s ease-out .3s both}.temperature .icon{font-size:4.5rem;filter:drop-shadow(0 0 10px rgba(255,180,0,.3));animation:float 3s ease-in-out infinite}.temp-value{font-size:4rem;font-weight:800;background:linear-gradient(135deg,#ff8c00,#ffb400);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:pulse 2s ease-in-out infinite}.feels-like{font-size:1.1rem;color:#777;padding:8px 16px;background:#0000000d;border-radius:20px;animation:fadeIn 1s ease-out .4s both}.weather-details{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;animation:fadeIn 1s ease-out .5s both}.detail{display:flex;align-items:center;gap:15px;padding:20px;border-radius:20px;background:#14c2701a;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.detail:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(180deg,var(--primary) 0%,var(--secondary) 100%)}.detail:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 10px 25px #14c27033;background:#14c27026}.detail svg{font-size:2rem;color:var(--primary);transition:all .3s ease}.detail:hover svg{transform:scale(1.2);color:var(--secondary)}.detail div span{font-size:.9rem;color:#777;text-transform:uppercase;letter-spacing:.5px}.detail div p{font-weight:700;font-size:1.3rem}.additional-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px;animation:fadeInUp 1s ease-out .6s both}.info-card{padding:25px;border-radius:25px;display:flex;flex-direction:column;gap:20px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.info-card:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,transparent 30%,rgba(255,255,255,.1) 100%);opacity:0;transition:opacity .3s ease}.info-card:hover:after{opacity:1}.info-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 15px 35px #0003}.info-card h3{font-size:1.4rem;margin-bottom:15px;color:var(--primary);position:relative;display:inline-block}.info-card h3:after{content:"";position:absolute;bottom:-5px;left:0;width:40px;height:3px;background:linear-gradient(90deg,var(--primary) 0%,var(--secondary) 100%);border-radius:2px}.sun-times{display:flex;justify-content:space-between}.sun-time{display:flex;flex-direction:column;align-items:center;gap:10px;padding:15px;border-radius:15px;background:#ff8c001a;transition:all .3s ease}.sun-time:hover{background:#ff8c0033;transform:scale(1.05)}.sun-time svg{font-size:1.8rem;color:#ff8c00;animation:bounce 2s infinite}.pressure{display:flex;flex-direction:column;align-items:center;gap:15px}.pressure-value{font-size:2.2rem;font-weight:800;color:var(--primary);position:relative}.pressure-value:after{content:"";position:absolute;bottom:-5px;left:50%;transform:translate(-50%);width:60px;height:4px;background:linear-gradient(90deg,transparent,var(--primary),transparent);border-radius:2px}.forecast-days{display:flex;justify-content:space-between}.day{display:flex;flex-direction:column;align-items:center;gap:15px;padding:15px;border-radius:15px;background:#4a90e21a;transition:all .3s ease}.day:hover{background:#4a90e233;transform:translateY(-5px)}.day svg{font-size:2.5rem;color:var(--secondary);animation:swing 3s ease-in-out infinite}.footer{width:100%;padding:60px 0 30px;line-height:1.8;margin-top:auto;position:relative;overflow:hidden}.footer:before{content:"";position:absolute;top:0;left:0;width:100%;height:5px;background:linear-gradient(90deg,var(--primary) 0%,var(--secondary) 100%)}.row{width:90%;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:40px;animation:fadeInUp 1s ease-out .8s both}.column{padding:15px}.footer-logo{display:flex;align-items:center;font-size:1.8rem;gap:12px;margin-bottom:20px;font-weight:800;color:var(--primary)}.footer p{font-size:1rem;margin-bottom:20px;opacity:.9}.email{margin:15px 0;padding-bottom:8px;border-bottom:2px solid rgba(255,255,255,.2);width:fit-content;transition:all .3s ease}.email:hover{border-color:var(--primary);transform:translate(10px)}.social h3{margin-bottom:20px;font-size:1.4rem}.social ul{display:flex;gap:20px;list-style:none}.social li{font-size:1.8rem;transition:all .3s ease}.social li:hover{transform:translateY(-5px)}.social a{color:inherit;transition:all .3s ease;display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;background:#ffffff1a}.social a:hover{color:#fff;background:var(--primary);box-shadow:0 0 20px var(--glow)}hr{width:90%;max-width:1200px;margin:30px auto;border:0;border-bottom:2px solid rgba(255,255,255,.1);animation:expandWidth 1s ease-out}.copyright{text-align:center;font-size:.9rem;color:#ffffffb3;margin-top:20px;animation:fadeIn 1s ease-out 1s both}.loading-container,.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-grow:1;gap:30px;padding:60px;animation:fadeIn .8s ease-out}.loading-spinner{width:80px;height:80px;border:6px solid rgba(0,0,0,.1);border-top-color:var(--primary);border-right-color:var(--secondary);border-radius:50%;animation:spin 1s cubic-bezier(.4,0,.2,1) infinite;box-shadow:0 0 30px #14c2704d}.error-container p{font-size:1.4rem;text-align:center;padding:20px;border-radius:15px;background:#ff6b6b1a;border-left:4px solid var(--accent);animation:shake .5s ease-in-out}.error-container button{padding:15px 30px;background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);border:none;border-radius:30px;color:#fff;cursor:pointer;font-weight:700;font-size:1.1rem;letter-spacing:.5px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.error-container button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.error-container button:hover:before{left:100%}.error-container button:hover{transform:translateY(-3px);box-shadow:0 10px 25px #14c2704d}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes swing{0%,to{transform:rotate(0)}25%{transform:rotate(5deg)}75%{transform:rotate(-5deg)}}@keyframes glow{0%{text-shadow:0 0 10px rgba(20,194,112,.5)}to{text-shadow:0 0 20px rgba(20,194,112,.8),0 0 30px rgba(20,194,112,.6)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes expandWidth{0%{width:0}to{width:90%}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (max-width: 900px){.weather-main{flex-direction:column}.temperature{justify-content:center;text-align:center}.temp-value{font-size:3.5rem}}@media (max-width: 768px){.nav-container{flex-direction:column;gap:20px;padding:20px}.search-container{width:100%;padding:0}.controls{width:100%;justify-content:center;gap:15px}.duration ul{justify-content:center;gap:10px}.weather-details{grid-template-columns:repeat(4,1fr)}.location-info h2{font-size:1.8rem}}@media (max-width: 600px){.weather-container{margin:15px;padding:20px}.additional-info{grid-template-columns:1fr}.weather-details{grid-template-columns:repeat(2,1fr)}.temp-value{font-size:3rem}.temperature .icon{font-size:3.5rem}}@media (max-width: 480px){.footer .row{grid-template-columns:1fr}.duration li{padding:8px 15px;font-size:.9rem}.weather-details{gap:15px}.detail{padding:15px}.social ul{justify-content:center}}.suggestions-container::-webkit-scrollbar{width:8px}.suggestions-container::-webkit-scrollbar-track{background:#ffffff1a;border-radius:4px}.suggestions-container::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.suggestions-container::-webkit-scrollbar-thumb:hover{background:#ffffff80}input,button,.detail,.info-card,.suggestion-item{cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}input:focus,button:focus{outline:2px solid var(--primary);outline-offset:2px}:root{--hour-primary: #14c270;--hour-primary-dark: #0e8a4a;--hour-secondary: #4a90e2;--hour-accent: #ff6b6b;--hour-bg-light: rgba(255, 255, 255, .95);--hour-bg-dark: rgba(36, 52, 71, .95);--hour-card-light: rgba(255, 255, 255, .8);--hour-card-dark: rgba(255, 255, 255, .1);--hour-shadow-light: rgba(149, 157, 165, .2);--hour-shadow-dark: rgba(0, 0, 0, .3);--hour-text-light: #333;--hour-text-dark: #fff}.hour-container{width:100%;max-width:1200px;margin:20px auto;padding:30px;border-radius:25px;background:var(--hour-bg-light);box-shadow:0 15px 50px var(--hour-shadow-light);animation:slideInUp .8s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.dark-mode .hour-container{background:var(--hour-bg-dark);box-shadow:0 15px 50px var(--hour-shadow-dark);color:var(--hour-text-dark)}.hour-container:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--hour-primary) 0%,var(--hour-secondary) 100%);animation:expandWidth 1s ease-out}.hour-header{text-align:center;margin-bottom:30px;animation:fadeIn .8s ease-out .2s both}.hour-title{font-size:2.2rem;font-weight:800;margin-bottom:10px;background:linear-gradient(135deg,var(--hour-primary) 0%,var(--hour-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hour-subtitle{font-size:1.1rem;color:#777;opacity:.9}.hour-scroll-container{overflow-x:auto;padding:20px 10px;margin:0 -10px;scroll-behavior:smooth;animation:fadeIn .8s ease-out .4s both}.hour-scroll-container::-webkit-scrollbar{height:8px}.hour-scroll-container::-webkit-scrollbar-track{background:#14c2701a;border-radius:10px}.hour-scroll-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--hour-primary) 0%,var(--hour-secondary) 100%);border-radius:10px}.hour-scroll-container::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--hour-primary-dark) 0%,var(--hour-secondary) 100%)}.hour-timeline{display:flex;gap:15px;min-width:min-content;padding:10px}.hour-card{min-width:120px;padding:20px 15px;border-radius:20px;background:var(--hour-card-light);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);box-shadow:0 5px 15px #00000014;text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;position:relative;overflow:hidden}.dark-mode .hour-card{background:var(--hour-card-dark);border:1px solid rgba(255,255,255,.1);box-shadow:0 5px 15px #0000004d}.hour-card:hover{transform:translateY(-10px) scale(1.05);box-shadow:0 15px 30px #14c27033;background:linear-gradient(135deg,#14c2701a,#4a90e21a)}.hour-card.selected{transform:translateY(-10px) scale(1.05);background:linear-gradient(135deg,var(--hour-primary) 0%,var(--hour-secondary) 100%);color:#fff;box-shadow:0 15px 30px #14c2704d;animation:pulseSelected 2s infinite}.hour-card.selected .hour-time,.hour-card.selected .hour-temp{color:#fff}.hour-time{font-size:1.1rem;font-weight:600;margin-bottom:15px;transition:color .3s ease}.hour-card.selected .hour-time{color:#fff}.hour-icon{font-size:2.5rem;margin:15px 0;filter:drop-shadow(0 0 10px rgba(255,180,0,.3))}.hour-card.selected .hour-icon{filter:drop-shadow(0 0 15px rgba(255,255,255,.5))}.hour-temp{font-size:1.5rem;font-weight:700;margin:10px 0;transition:color .3s ease}.hour-pop{margin-top:15px;display:flex;flex-direction:column;align-items:center;gap:5px}.pop-bar{width:4px;height:30px;background:#4a90e233;border-radius:2px;position:relative;overflow:hidden}.pop-fill{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,#4a90e2,#2c6bb8);border-radius:2px;transition:height .5s ease}.hour-card[data-pop="0"] .pop-bar{opacity:.3}.hour-card[data-pop="0"] .pop-fill{background:transparent}.pop-text{font-size:.8rem;font-weight:600;color:#4a90e2}.hour-card.selected .pop-text{color:#ffffffe6}.hour-details{margin-top:30px;padding:25px;border-radius:20px;background:linear-gradient(135deg,#14c2700d,#4a90e20d);border:1px solid rgba(20,194,112,.2);animation:scaleIn .5s cubic-bezier(.4,0,.2,1)}.dark-mode .hour-details{background:linear-gradient(135deg,#14c2701a,#4a90e21a);border:1px solid rgba(20,194,112,.3)}.details-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid rgba(20,194,112,.3)}.details-header h3{font-size:1.6rem;font-weight:700;color:var(--hour-primary)}.details-date{font-size:1rem;color:#777;font-weight:500}.details-content{display:grid;grid-template-columns:1fr 2fr;gap:30px}.details-main{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.details-icon{font-size:4rem;filter:drop-shadow(0 0 15px rgba(255,180,0,.3))}.details-temp{text-align:center}.temp-value{font-size:3rem;font-weight:800;background:linear-gradient(135deg,#ff8c00,#ffb400);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.temp-feels{font-size:1.1rem;color:#777;margin-top:5px}.details-description{font-size:1.3rem;font-weight:600;text-transform:capitalize;padding:15px;background:#ffffff80;border-radius:15px;display:flex;align-items:center;justify-content:center;animation:fadeIn .8s ease-out}.dark-mode .details-description{background:#ffffff1a}.details-stats{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:20px}.stat{display:flex;align-items:center;gap:15px;padding:20px;border-radius:15px;background:#ffffff80;transition:all .3s ease}.dark-mode .stat{background:#ffffff1a}.stat:hover{transform:translateY(-5px);background:#14c2701a;box-shadow:0 10px 20px #0000001a}.stat-icon{font-size:2rem;color:var(--hour-primary);min-width:40px}.pop-icon{font-size:1.8rem}.stat-content{display:flex;flex-direction:column}.stat-label{font-size:.9rem;color:#777;text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}.stat-value{font-size:1.4rem;font-weight:700;color:var(--hour-text-light)}.dark-mode .stat-value{color:var(--hour-text-dark)}.hour-legend{display:flex;justify-content:center;gap:30px;margin-top:30px;padding:20px;background:#14c2700d;border-radius:15px;flex-wrap:wrap;animation:fadeIn .8s ease-out .6s both}.dark-mode .hour-legend{background:#14c2701a}.legend-item{display:flex;align-items:center;gap:10px;font-size:.9rem;color:#777}.legend-color{width:20px;height:20px;border-radius:4px}.precip-low{background:linear-gradient(to top,#4a90e24d,#4a90e21a)}.precip-medium{background:linear-gradient(to top,#4a90e299,#4a90e24d)}.precip-high{background:linear-gradient(to top,#4a90e2,#2c6bb8)}.loading,.error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:20px}.loading-spinner{width:60px;height:60px;border:4px solid rgba(20,194,112,.2);border-top-color:var(--hour-primary);border-radius:50%;animation:spin 1s linear infinite}.error-message{font-size:1.2rem;color:var(--hour-accent);text-align:center;padding:20px;border-radius:15px;background:#ff6b6b1a;border-left:4px solid var(--hour-accent)}.retry-btn{padding:12px 30px;background:linear-gradient(135deg,var(--hour-primary) 0%,var(--hour-secondary) 100%);border:none;border-radius:25px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s ease}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes pulseSelected{0%,to{box-shadow:0 15px 30px #14c2704d}50%{box-shadow:0 15px 40px #14c27080}}.animated-icon{animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@media (max-width: 1024px){.hour-container{padding:20px;margin:15px}.hour-title{font-size:1.8rem}.details-content{grid-template-columns:1fr;gap:20px}.details-stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media (max-width: 768px){.hour-card{min-width:100px;padding:15px 10px}.hour-time{font-size:.9rem}.hour-temp{font-size:1.3rem}.hour-icon{font-size:2rem}.details-stats{grid-template-columns:1fr}.hour-legend{flex-direction:column;align-items:flex-start;gap:15px}}@media (max-width: 480px){.hour-container{padding:15px;margin:10px}.hour-title{font-size:1.5rem}.hour-timeline{gap:10px}.hour-card{min-width:80px;padding:10px 5px}.hour-icon{font-size:1.5rem;margin:10px 0}.temp-value{font-size:2rem}.details-header{flex-direction:column;align-items:flex-start;gap:10px}}:root{--weekly-primary: #14c270;--weekly-primary-dark: #0e8a4a;--weekly-secondary: #4a90e2;--weekly-accent: #ff6b6b;--weekly-warning: #ff9800;--weekly-success: #4caf50;--weekly-bg-light: rgba(255, 255, 255, .95);--weekly-bg-dark: rgba(36, 52, 71, .95);--weekly-card-light: rgba(255, 255, 255, .9);--weekly-card-dark: rgba(255, 255, 255, .1);--weekly-shadow-light: rgba(149, 157, 165, .2);--weekly-shadow-dark: rgba(0, 0, 0, .3);--weekly-text-light: #333;--weekly-text-dark: #fff}.weekly-container{width:100%;max-width:1200px;margin:20px auto;padding:30px;border-radius:25px;background:var(--weekly-bg-light);box-shadow:0 15px 50px var(--weekly-shadow-light);animation:slideInUp .8s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.dark-mode .weekly-container{background:var(--weekly-bg-dark);box-shadow:0 15px 50px var(--weekly-shadow-dark);color:var(--weekly-text-dark)}.weekly-container:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--weekly-primary) 0%,var(--weekly-secondary) 100%);animation:expandWidth 1s ease-out}.weekly-header{text-align:center;margin-bottom:40px;animation:fadeIn .8s ease-out .2s both}.weekly-title{font-size:2.2rem;font-weight:800;margin-bottom:10px;background:linear-gradient(135deg,var(--weekly-primary) 0%,var(--weekly-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.weekly-subtitle{font-size:1.1rem;color:#777;opacity:.9}.weekly-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-bottom:40px;animation:fadeIn .8s ease-out .4s both}.day-card{background:var(--weekly-card-light);border-radius:20px;padding:20px;box-shadow:0 5px 20px #00000014;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid rgba(255,255,255,.3);position:relative;overflow:hidden;cursor:pointer}.dark-mode .day-card{background:var(--weekly-card-dark);border:1px solid rgba(255,255,255,.1);box-shadow:0 5px 20px #0000004d}.day-card:hover{transform:translateY(-5px);box-shadow:0 15px 30px #14c27026}.day-card.selected{box-shadow:0 0 0 2px var(--weekly-primary),0 15px 30px #14c27033;animation:pulseGlow 2s infinite}.day-card.expanded{grid-column:1 / -1}.day-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid rgba(20,194,112,.1);cursor:pointer}.day-info{display:flex;flex-direction:column;gap:5px}.day-name{font-size:1.3rem;font-weight:700;color:var(--weekly-primary);margin:0}.day-date{font-size:.9rem;color:#777;font-weight:500}.expand-toggle{width:32px;height:32px;border-radius:50%;background:#14c2701a;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.expand-toggle:hover{background:#14c27033;transform:rotate(90deg)}.expand-icon{font-size:1.5rem;font-weight:700;color:var(--weekly-primary)}.day-content{display:flex;flex-direction:column;gap:20px}.weather-summary{display:flex;align-items:center;gap:20px;padding:15px;background:#ffffff80;border-radius:15px}.dark-mode .weather-summary{background:#ffffff0d}.weather-icon-large{font-size:3.5rem;color:#ff8c00;min-width:60px}.temperature-range{display:flex;flex-direction:column;gap:10px;flex-grow:1}.high-temp,.low-temp{display:flex;align-items:center;gap:10px}.temp-arrow{font-size:1rem;color:#ff8c00}.low-temp .temp-arrow{color:#4a90e2}.temp-value{font-size:1.5rem;font-weight:700}.weather-description{font-size:1.1rem;font-weight:600;color:#777;margin:0;text-transform:capitalize}.weather-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;padding:15px;background:#ffffff4d;border-radius:15px}.dark-mode .weather-stats{background:#ffffff0d}.stat-item{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center}.stat-icon{font-size:1.5rem;color:var(--weekly-primary);margin-bottom:5px}.stat-label{font-size:.8rem;color:#777;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:1.1rem;font-weight:700}.day-details{margin-top:20px;padding:20px;background:#ffffff4d;border-radius:15px;animation:slideDown .5s cubic-bezier(.4,0,.2,1)}.dark-mode .day-details{background:#ffffff0d}.detail-section{margin-bottom:25px}.detail-section:last-child{margin-bottom:0}.detail-section h4{font-size:1.1rem;font-weight:600;margin-bottom:15px;color:var(--weekly-primary);padding-bottom:8px;border-bottom:2px solid rgba(20,194,112,.2)}.detail-row{display:flex;gap:20px;margin-bottom:15px}.detail-item{display:flex;align-items:center;gap:15px;padding:12px;background:#ffffff80;border-radius:12px;flex:1;transition:all .3s ease}.dark-mode .detail-item{background:#ffffff1a}.detail-item:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000001a}.detail-icon{font-size:1.8rem;min-width:40px}.sunrise{color:#ff9800}.sunset{color:#4a90e2}.uv-icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.9rem}.detail-label{display:block;font-size:.8rem;color:#777;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}.detail-value{display:block;font-size:1.1rem;font-weight:700}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.hourly-preview{display:flex;gap:15px;overflow-x:auto;padding:10px 5px;scrollbar-width:thin}.hourly-preview::-webkit-scrollbar{height:6px}.hourly-preview::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}.hourly-preview::-webkit-scrollbar-thumb{background:var(--weekly-primary);border-radius:3px}.hour-preview{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px;background:#ffffff80;border-radius:12px;min-width:80px}.dark-mode .hour-preview{background:#ffffff1a}.hour-time{font-size:.9rem;font-weight:600}.hour-icon-small{font-size:1.8rem;color:#ff8c00}.hour-temp{font-size:1.1rem;font-weight:700}.hour-pop{font-size:.8rem;color:#4a90e2;font-weight:600;background:#4a90e21a;padding:2px 6px;border-radius:10px}.day-footer{margin-top:20px;padding-top:15px;border-top:2px solid rgba(20,194,112,.1)}.precipitation-chance{display:flex;flex-direction:column;gap:10px}.precip-bar-container{height:8px;background:#4a90e21a;border-radius:4px;overflow:hidden}.precip-bar{height:100%;background:linear-gradient(90deg,#4a90e24d,#4a90e2);border-radius:4px;transition:width 1s ease;position:relative}.precip-bar[data-precip="0"]{background:#9b9b9b4d}.precip-text{font-size:.9rem;color:#777;text-align:center}.weekly-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:30px;margin-top:40px;animation:fadeIn .8s ease-out .6s both}.summary-card,.trends-card{background:var(--weekly-card-light);border-radius:20px;padding:25px;box-shadow:0 5px 20px #00000014;border:1px solid rgba(255,255,255,.3)}.dark-mode .summary-card,.dark-mode .trends-card{background:var(--weekly-card-dark);border:1px solid rgba(255,255,255,.1);box-shadow:0 5px 20px #0000004d}.summary-card h3,.trends-card h3{font-size:1.5rem;font-weight:700;margin-bottom:20px;color:var(--weekly-primary);padding-bottom:10px;border-bottom:2px solid rgba(20,194,112,.2)}.summary-content{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.summary-item{display:flex;align-items:center;gap:15px;padding:15px;background:#ffffff4d;border-radius:15px;transition:all .3s ease}.dark-mode .summary-item{background:#ffffff0d}.summary-item:hover{transform:translateY(-3px);background:#14c2701a}.summary-icon{font-size:2rem;color:var(--weekly-primary);min-width:40px}.summary-label{display:block;font-size:.9rem;color:#777;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}.summary-value{display:block;font-size:1.3rem;font-weight:700}.trends-chart{width:100%;height:200px}.chart-container{width:100%;height:100%;padding:20px 0;display:flex;align-items:flex-end}.chart-bars{display:flex;justify-content:space-between;align-items:flex-end;width:100%;height:100%;gap:10px}.chart-column{display:flex;flex-direction:column;align-items:center;gap:5px;flex:1;height:100%;position:relative}.chart-high{width:12px;background:linear-gradient(to top,#ff8c00,#ffb400);border-radius:6px 6px 0 0;position:relative;transition:height 1s ease}.chart-low{width:12px;background:linear-gradient(to top,#4a90e2,#2c6bb8);border-radius:0 0 6px 6px;position:relative;transition:height 1s ease}.chart-value{position:absolute;top:-25px;left:50%;transform:translate(-50%);font-size:.8rem;font-weight:700;white-space:nowrap}.chart-low .chart-value{top:auto;bottom:-25px}.chart-label{font-size:.9rem;font-weight:600;color:#777;margin-top:5px}.loading,.error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:500px;gap:20px}.loading-spinner{width:60px;height:60px;border:4px solid rgba(20,194,112,.2);border-top-color:var(--weekly-primary);border-radius:50%;animation:spin 1s linear infinite}.error-message{font-size:1.2rem;color:var(--weekly-accent);text-align:center;padding:20px;border-radius:15px;background:#ff6b6b1a;border-left:4px solid var(--weekly-accent)}.retry-btn{padding:12px 30px;background:linear-gradient(135deg,var(--weekly-primary) 0%,var(--weekly-secondary) 100%);border:none;border-radius:25px;color:#fff;font-weight:600;cursor:pointer;transition:all .3s ease}.retry-btn:hover{transform:translateY(-3px);box-shadow:0 10px 20px #14c2704d}@keyframes slideInUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes expandWidth{0%{width:0}to{width:100%}}@keyframes pulseGlow{0%,to{box-shadow:0 0 0 2px var(--weekly-primary),0 15px 30px #14c27033}50%{box-shadow:0 0 0 3px var(--weekly-primary),0 15px 40px #14c2704d}}@media (max-width: 1024px){.weekly-container{padding:20px;margin:15px}.weekly-title{font-size:1.8rem}.weekly-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.weekly-summary,.summary-content{grid-template-columns:1fr}}@media (max-width: 768px){.day-card{padding:15px}.weather-summary{flex-direction:column;text-align:center}.weather-stats{grid-template-columns:repeat(2,1fr)}.detail-row{flex-direction:column;gap:10px}.detail-grid{grid-template-columns:1fr}.hourly-preview{flex-wrap:wrap;justify-content:center}}@media (max-width: 480px){.weekly-container{padding:15px;margin:10px}.weekly-title{font-size:1.5rem}.weekly-grid,.weather-stats{grid-template-columns:1fr}.day-name{font-size:1.1rem}.temp-value{font-size:1.3rem}.weather-icon-large{font-size:2.5rem}.chart-bars{gap:5px}.chart-high,.chart-low{width:8px}}