:root{
	--ba-weather-bg:#fff;
	--ba-weather-color:#2e3b5b;
	--ba-weather-active:#0689b1;
	--ba-weather-drop:rgba(26, 119, 188, 0.3);
	--ba-weather-radius: .3em;
}
.ba__weather, .ba__weather *{box-sizing: border-box; display: block; margin: 0; padding: 0; position: relative;font-family: Yekan Bakh;}
.ba__weather{width: 22em; min-height: 5em; margin: 0 auto 1em;text-align: center;background: var(--ba-weather-bg);color:var(--ba-weather-color); border-radius: var(--ba-weather-radius);box-shadow: 0 1px 8px var(--ba-weather-drop),0 0 15px rgba(16, 126, 207, 0.05) inset; border: 1px solid transparent;font-size: 1rem; position: relative; padding:1em 0;}
.ba__weather:not(.ready)::before {border: 5px solid #eee; border-top-color:var(--ba-weather-active); border-radius: 50%; width:32px;height:32px; display: block; content: ''; position: absolute; left: calc(50% - 16px); top: calc(50% - 16px); -webkit-animation:baWeatherSpin 2s linear infinite; animation:baWeatherSpin 2s linear infinite;}
@-webkit-keyframes baWeatherSpin {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}
@keyframes baWeatherSpin {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}
.ba__weather-inner{margin: 0 1em;}
.ba__weather .name{font-size: 1.25em; font-weight: bold; z-index: 1;}
.ba__weather .date{font-weight: 600; opacity: .5; font-size: .8em; margin-bottom: 1em; z-index: 2;}
.ba__weather .icon{display: block;}
.ba__weather .icon img{-webkit-filter: drop-shadow(0 15px 50px rgba(232, 226, 218, 0.5));filter: drop-shadow(0 15px 50px rgba(232, 226, 218, 0.5));}
.ba__weather .icon .tempunit{position: absolute;top:0;left:10px; z-index: 1; width: auto;direction: ltr;}
.ba__weather .icon-inner{width:68%;display:inline-table; position: relative; z-index: 2; padding-top:2em;}
.ba__weather .tempunit{font-size: 2.5em;line-height: 1;font-weight:bolder;display: flex;justify-content: center;}
.ba__weather .description{font-size: 1.25em;font-weight: 600;text-transform: capitalize; padding-bottom: 1em;}
.ba__weather .info{display: flex;}
.ba__weather .info > *{width:100%;font-size: 70%;font-weight: 600;display: flex; flex-direction: column; align-items: center;}
.ba__weather .info i{font-size: .8em;opacity: .5;font-style: normal;font-weight: normal; display: none;}
.ba__weather .info img{width: 2.5em;}
.ba__weather .info > * > :first-child{-webkit-mask: var(--info-icon) no-repeat;mask: var(--info-icon) no-repeat;-webkit-mask-size: 100% 100%;mask-size: 100% 100%;background-color: currentColor;color: inherit;width: 2em;height: 2em; opacity: .6;}
.ba__weather .windspeed > :first-child{--info-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke-width='2' stroke='currentColor' d='M5 8h8.5a2.5 2.5 0 1 0-2.34-3.24M3 12h15.5a2.5 2.5 0 1 1-2.34 3.24M4 16h5.5a2.5 2.5 0 1 1-2.34 3.24'/%3E%3C/svg%3E");}
.ba__weather .humidity > :first-child{--info-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M14.5 18q.625 0 1.063-.438T16 16.5q0-.625-.438-1.063T14.5 15q-.625 0-1.063.438T13 16.5q0 .625.438 1.063T14.5 18Zm-5.75-.75q.3.3.7.3t.7-.3l5.1-5.1q.3-.3.3-.7t-.3-.7q-.3-.3-.713-.3t-.712.3L8.75 15.825q-.3.3-.3.713t.3.712ZM9.5 13q.625 0 1.063-.438T11 11.5q0-.625-.438-1.063T9.5 10q-.625 0-1.063.438T8 11.5q0 .625.438 1.063T9.5 13Zm2.5 9q-3.425 0-5.713-2.35T4 13.8q0-1.55.7-3.1t1.75-2.975Q7.5 6.3 8.725 5.05T11 2.875q.2-.2.463-.287T12 2.5q.275 0 .537.088t.463.287q1.05.925 2.275 2.175t2.275 2.675Q18.6 9.15 19.3 10.7t.7 3.1q0 3.5-2.288 5.85T12 22Zm0-2q2.6 0 4.3-1.763T18 13.8q0-1.825-1.513-4.125T12 4.65Q9.025 7.375 7.513 9.675T6 13.8q0 2.675 1.7 4.438T12 20Zm0-8Z'/%3E%3C/svg%3E");}
.ba__weather .uv > :first-child{--info-icon: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="none" stroke="currentColor" stroke-width="2" d="M3 12h1m16 0h1M5.6 5.6l.7.7m12.1-.7l-.7.7M8 12a4 4 0 1 1 8 0m-4-8V3m1 13l2 5h1l2-5M6 16v3a2 2 0 1 0 4 0v-3"%2F%3E%3C%2Fsvg%3E');}
.ba__weather .visibility > :first-child{--info-icon: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cg fill="none" stroke="currentColor" stroke-width="2"%3E%3Cpath d="M3 7V5a2 2 0 0 1 2-2h2m10 0h2a2 2 0 0 1 2 2v2m0 10v2a2 2 0 0 1-2 2h-2M7 21H5a2 2 0 0 1-2-2v-2"%2F%3E%3Ccircle cx="12" cy="12" r="1"%2F%3E%3Cpath d="M5 12s2.5-5 7-5s7 5 7 5s-2.5 5-7 5s-7-5-7-5"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');}

.ba__weather small{font-size: .45em; opacity: .6;margin: .1em 0 0 -.1em;}
.ba__weather small i{font-style: normal;font-weight: 600; display: none;}

.ba__forecast{margin: 1em 1em 0; z-index: 1; padding-top: 1.5em;}
.ba__forecast-inner{width: 100%; overflow: hidden; background: none;border-radius: var(--ba-weather-radius);}
.ba__weather:not(.ba__resizing) .ba__forecast-inner{scroll-behavior: smooth;}
.ba__forecast > *{background: none;border-radius: var(--ba-weather-radius);}
.ba__forecast > div{display: none;}
.ba__forecast > * > i{width: 28px; height: 28px; position: absolute; left: -14px; top: calc(50% - 14px);background: #38cc0f;border-radius: 50%;z-index: 9; cursor: pointer;}
.ba__forecast > * > i:hover{box-shadow: 0 0 5px rgba(0, 0, 0, .5);}
.ba__forecast > * > i::before{width: 8px; height: 8px; position: absolute; left: 11px; top:9px; border: 2px solid; border-color:currentColor currentColor transparent transparent; content: ''; transform: rotate(-140deg);font-size: 0.5em !important;}
.ba__forecast > * > i+i{left: auto; right: -14px;}
.ba__forecast > * > i+i::before{transform: rotate(45deg) !important; left: 7px;font-size: 0.5em;}
.ba__forecast ul{display: inline-flex; width: auto; list-style: none; padding: 0; margin: 0;}
.ba__forecast li{text-align: center; width:4.4em; height: 100%; padding:.3em 0; margin: .5em 0;font-size: 0.9em;}
.ba__forecast li:first-child{border: 0;}
.ba__forecast li.active{color: var(--ba-weather-active);}
.ba__forecast .tempunit{font-size: 0.7em;direction: ltr;}
.ba__forecast .tempunit small{font-size: 1em; margin: 0;}
.ba__forecast li span{font-style: normal;font-size: .8em;opacity: .6;font-weight: 600;}
.ba__forecast li .icon-inner{padding: 0;}
.ba__forecast .forecast-tab{display: block; font-weight:600; text-transform: uppercase;font-size: .8em; opacity: .6; cursor: pointer; z-index: 9;position: absolute;top: 0;left:0;}
.ba__forecast .forecast-tab:nth-of-type(2){left: auto;right: 0;}
.ba__forecast .forecast-tab.active{opacity: 1;}
.ba__forecast .forecast-tab.active + div{display: block;}
.ba__forecast-nav-hide > i{display: none;}

.ba__weather.normal .ba__forecast,
.ba__weather.mini .ba__forecast,
.ba__weather.mini .info,
.ba__weather.mini .date,
.ba__weather.mini .description{display: none !important;}

.ba__weather.mini .icon{display: flex !important; align-items: center;}
.ba__weather.mini .icon > *{position: static !important; padding: 0; width: 50%;}



.ba__weather.style2{--ba-weather-bg:#fff; --ba-weather-color:#2e3b5b; --ba-weather-active:rgb(80, 62, 173); --ba-weather-drop:rgba(101, 79, 206, 0.5);}
.ba__weather.style2 .ba__weather-inner{margin:0; overflow: hidden;}
.ba__weather.style2 .icon::before{position: absolute; left:0; right:-10%; bottom:40%; width:auto; height: 300%; display: block; z-index: 0; content: '';background: var(--ba-weather-bg); box-shadow: 0 1em 4em var(--ba-weather-drop); border-radius: 80em;}
.ba__weather.style2 .icon img{-webkit-filter: drop-shadow(0 15px 50px var(--ba-weather-drop));filter: drop-shadow(0 15px 50px var(--ba-weather-drop));}
.ba__weather.style2 .ba__forecast-inner{background:rgba(150, 150, 150, .15); border-radius: var(--ba-weather-radius);}
.ba__weather.style2 .ba__forecast-inner li{border-left: 1px solid rgba(0, 0, 0, .1);}
.ba__weather.mini.style2{padding: 0;}


.ba__weather.style3{--ba-weather-bg:#fff; --ba-weather-color:#2e3b5b; --ba-weather-active:#54cf0f; --ba-weather-drop:rgba(26, 160, 14, 0.3);}
.ba__weather.style3 .icon,
.ba__weather.style3 .ba__forecast-inner li{background-image: linear-gradient(rgba(148, 148, 148, 0.2) 50%, rgba(0, 0, 0,.3) 50%);border-radius: var(--ba-weather-radius);background-color: var(--ba-weather-active); box-shadow:0 0 0 1px #fff, 0 1em 2em var(--ba-weather-drop);}
.ba__weather.style3 .ba__forecast-inner li{margin: .3em;	background-color: var(--ba-weather-bg);}
.ba__weather.style3 .ba__forecast-inner li.active{background-color: var(--ba-weather-active); color: #fff;}


.ba__weather.style4{--ba-weather-bg:#041327; --ba-weather-color:#fff; --ba-weather-active:#1696f9; --ba-weather-drop:rgba(31, 153, 224, 0.3); --ba-weather-radius: 1em; padding: 2px;}
.ba__weather.style4 .ba__weather-inner{margin: 0;padding: 1em;background: var(--ba-weather-active);border-radius: var(--ba-weather-radius); box-shadow: 0 .6em var(--ba-weather-drop), 0 2em 2em var(--ba-weather-drop);}
.ba__weather.style4 .ba__weather .icon img{-webkit-filter: drop-shadow(0 15px 50px rgba(0, 0, 0, .5));filter: drop-shadow(0 15px 50px rgba(0, 0, 0, .5));}
.ba__weather.style4 .ba__forecast-inner li.active{background-color: var(--ba-weather-active); color: #fff; border-radius: 8px;}
.ba__weather.style4 .info img{-webkit-filter: invert(90%);filter: invert(90%)}


.ba__weather.style5{--ba-weather-bg:#8826e9; --ba-weather-color:#fff; --ba-weather-active:#1696f9; --ba-weather-drop:rgba(31, 153, 224, 0.3); --ba-weather-radius: 1em; background-image:linear-gradient(15deg, rgba(255, 0, 159, 0.5) 0%, rgba(0,255,248,.5) 50%, rgba(0, 66, 255, 0.5) 87%); color: var(--ba-weather-color); border: 0;}
.ba__weather.style5 .ba__forecast-inner,
.ba__weather.style5 .info{background-color: rgba(0, 0, 0, .1);border-radius: var(--ba-weather-radius); box-shadow: 0 0 2px rgba(255, 255, 255, 0.3); padding: .3em;}