@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded&icon_names=ac_unit,bedtime,clear_day,close,cloud,cloud_off,error,foggy,help,hourglass_empty,location_disabled,location_off,map_off,partly_cloudy_day,partly_cloudy_night,rainy,search,search_off,settings,thunderstorm&display=block";@import"https://fonts.googleapis.com/css2?family=Varela+Round&family=Manrope&display=swap";:root{--font-primary: "Varela Round", sans-serif;--font-secondary: "Manrope", sans-serif;--font-icons: "Material Symbols Rounded";--primary-color: #16191c;--secondary-color: #525252;--background-color: #ffffff;--text-color: #000000;--button-bg: #3498db;--button-text: white}body{background-image:url(/assets/b1-BQtxroPx.jpg);font-family:var(--font-primary);background-color:var(--background-color);color:var(--text-color);background-size:cover;background-position:center;background-attachment:fixed}.material-symbols-rounded{font-family:var(--font-icons);font-variation-settings:"FILL" 1,"wght" 700,"GRAD" 200,"opsz" 48}.search-bar{display:flex;flex:1;align-items:center;width:60%;padding:.3rem .6rem;background-color:#f0f0f0;border-radius:6px;gap:.5rem}.search-bar__icon{font-size:clamp(1.1rem,calc(2vw + .1rem),1.5rem);cursor:pointer}.search-bar__input{flex:1;border:none;outline:none;font-size:clamp(.8rem,calc(1.3vw + .1rem),1rem);background:none;color:var(--text-color)}.current-section__content{display:flex;flex-direction:column;border-radius:16px;justify-content:space-between;padding:16px;width:100%;height:100%;gap:16px}.current-section__main{display:flex;flex-grow:1;flex-direction:column;align-items:center;justify-content:center}.current-section__icon{font-size:clamp(5rem,calc(8vw + 1rem),7.5rem)}.current-section__details{display:flex;flex-direction:column;align-items:center}.current-section__temperature{font-size:clamp(1.4rem,calc(3vw + .1rem),2rem);font-weight:400}.current-section__condition{font-size:clamp(1rem,calc(1.7vw + .1rem),1.15rem);padding-top:.2rem}.weather-info{display:grid;grid-template-columns:repeat(2,1fr);height:clamp(1rem,calc(1.7% + .1rem),13rem);height:40%;position:relative}.weather-info__item{padding:16px;flex:1;display:flex;flex-direction:column;justify-content:space-between;align-items:start;text-align:center;position:relative}.weather-info__item:not(:nth-child(2n)):after{content:"";position:absolute;top:17%;bottom:17%;right:0;width:1px;background-color:#0000004e}.weather-info__item:nth-child(-n+2):before{content:"";position:absolute;left:10%;right:10%;bottom:0;height:1px;background-color:#0000004e}.weather-info__item h3{font-size:clamp(.9rem,calc(.9vw + .4rem),1.1rem)}.weather-info__item p{font-size:clamp(.8rem,calc(.9vw + .25rem),1rem)}@media (max-width: 768px){.current-section__content{padding:0;gap:0px}.current-section__main{flex-direction:row;height:auto;justify-content:space-between;padding:16px}.current-section__details{align-items:flex-end}}@media (max-width: 480px){.weather-info__item,.current-section__main{padding:10px}}.forecast-card{display:flex;flex-direction:column;padding:16px 0;text-align:center;justify-content:space-between;flex:0 0 14.3%;position:relative}.forecast-card:after{content:"";position:absolute;top:20%;bottom:20%;right:0;width:1px;background-color:#0000004e}.forecast-card:last-child:after{background-color:transparent}.forecast-card__label{font-size:clamp(.87rem,calc(1.3vw + .1rem),1rem);margin-bottom:8px}.forecast-card__sublabel{font-size:clamp(.77rem,calc(1.2vw + .1rem),.9rem)}.forecast-card__temperature{font-size:clamp(.87rem,calc(1.3vw + .1rem),1rem);margin:4px 0}.forecast-card__icon{font-size:clamp(2.5rem,calc(4.5vw + .1rem),3.3rem);display:block;margin:8px auto}@media (max-width: 768px){.forecast-card{flex:0 0 12.5%}}@media (max-width: 580px){.forecast-card{flex:0 0 calc(100% / 6)}}@media (max-width: 480px){.forecast-card{flex:0 0 20%;padding:10px 0}.forecast-card__icon{margin:4px auto}}.forecast-container{display:flex;flex-direction:column;padding:16px;border-radius:16px}.forecast-container__title{font-size:clamp(1rem,calc(1.5vw + .1rem),1.2rem);padding-bottom:8px;border-bottom:1.5px solid black}.forecast-container__list{display:flex;flex-direction:row;width:100%;overflow-x:auto;gap:0px;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.3) transparent;scroll-behavior:smooth}.forecast-container__list::-webkit-scrollbar{height:6px}.forecast-container__list::-webkit-scrollbar-thumb{background:#00000080;border-radius:10px}.forecast-container__list::-webkit-scrollbar-thumb:hover{background:#000000b3}.forecast-container__list::-webkit-scrollbar-track{background:transparent}@media (max-width: 480px){.forecast-container{padding:10px}}.weather-container{display:flex;flex-direction:column;gap:16px;height:auto;width:1080px}.weather-container__header{display:flex;flex-direction:row;gap:6px;height:40px}.settings-btn{border-radius:6px;display:flex;justify-content:center;align-items:center;aspect-ratio:1 / 1;height:100%;cursor:pointer;color:var(--text-color)}.settings-btn span{font-size:clamp(1.1rem,calc(2vw + .1rem),1.5rem)}.weather-container__menu{display:flex;align-items:center;justify-content:center;gap:8px;border-radius:12px}.weather-container__current-section .weather-container__menu{display:none}.weather-container__content{display:flex;flex-direction:row;gap:16px;height:auto;width:100%}.weather-container__current-section{width:35%;height:initial;display:flex;flex-direction:column;gap:13px}.weather-container__forecast-section{width:65%;height:max-content;display:flex;flex-direction:column;gap:13px}.loading-container{display:flex;flex-direction:column;height:550px}.loading-card{padding:2rem;align-self:center;margin-top:10rem;border-radius:10px;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:10px}.loading-icon{font-size:clamp(2rem,calc(4vw + .1rem),3.5rem)}.loading-text{text-align:center;font-weight:700;font-size:clamp(1rem,calc(2vw + .1rem),1.2rem)}@media (max-width: 1200px){.weather-container{width:100%;padding:20px}}@media (max-width: 768px){.weather-container{gap:10px}.weather-container__header{height:35px}.weather-container__content{flex-direction:column;height:auto;gap:10px}.weather-container__current-section{width:100%;height:auto;gap:10px}.weather-container__forecast-section{width:100%;gap:10px}.weather-container__current-section .weather-container__menu{display:flex}.weather-container__forecast-section .weather-container__menu{display:none}.loading-card{padding:1rem;gap:5px}}@media (max-width: 480px){.weather-container{padding:10px}}.toggle-switch{display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;border-radius:10px;padding:.3rem .6rem;width:calc(100% / 3)}.toggle-switch__label{font-size:clamp(.7rem,calc(1vw + .1rem),.875rem);font-weight:600}.toggle-switch__wrapper{position:relative;width:40px;height:20px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-switch__slider{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#7575758c;border-radius:20px;transition:background-color .3s ease}.toggle-switch__slider:before{content:"";position:absolute;height:14px;width:14px;left:3px;bottom:3px;background-color:#fff;border-radius:50%;transition:transform .3s ease}.toggle-switch input:checked+.toggle-switch__slider{background-color:#000}.toggle-switch input:checked+.toggle-switch__slider:before{transform:translate(20px)}@media (max-width: 1200px){.toggle-switch__wrapper{position:relative;scale:95%}}@media (max-width: 992px){.toggle-switch__wrapper{position:relative;scale:90%}}@media (max-width: 768px){.toggle-switch__wrapper{position:relative;scale:80%}}@media (max-width: 480px){.toggle-switch{padding:.2rem}.toggle-switch__wrapper{position:relative;scale:60%}}.socials{position:fixed;bottom:10px;right:10px;z-index:100;width:60px;height:60px;border-radius:16px;padding:6px}*{box-sizing:border-box;padding:0;margin:0;scroll-behavior:smooth}.app{display:flex;align-items:center;justify-content:center;height:100vh}.border-red{border:1px solid rgb(240,85,85)}.border-green{border:1px solid rgb(85,240,160)}.border-blue{border:1px solid rgb(85,193,240)}.border-purple{border:1px solid rgb(196,85,240)}.border-pink{border:1px solid rgb(240,85,181)}.border-yellow{border:1px solid rgb(194,152,39)}.bg-gray{background-color:#535353}.effect-glass{background:#ffffff57;box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(6.9px);-webkit-backdrop-filter:blur(3px);border:1px solid rgba(255,255,255,.1)}@media (max-width: 768px){.app{align-items:flex-start}}
