/* StationCast local icon set (no external CDNs)
   Compatible with existing <i class="wi wi-..."> markup.
   Uses SVG masks so icons inherit CSS color (via currentColor).
*/
.wi{
  display:inline-block;
  width:1em;
  height:1em;
  line-height:1;
  vertical-align:-0.125em;
  font-family:inherit !important;
  position:relative;
}

/* Neutralize any other Weather Icons font glyphs that might be present */
.wi:before{
  content:"" !important;
  display:inline-block;
  width:1em;
  height:1em;
  background-color: currentColor; /* icon color */
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  -webkit-mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  mask-size:contain;
}

/* Ensure StationCast icons follow the accent color (without affecting text) */
.stationcast-box .wi{
  color: var(--stationcast-accent, currentColor);
}

/* Icon mappings (SVG masks) */
.wi-thermometer:before{ -webkit-mask-image:url('../icons/thermometer.svg'); mask-image:url('../icons/thermometer.svg'); }
.wi-hot:before{ -webkit-mask-image:url('../icons/hot.svg'); mask-image:url('../icons/hot.svg'); }
.wi-raindrop:before{ -webkit-mask-image:url('../icons/raindrop.svg'); mask-image:url('../icons/raindrop.svg'); }
.wi-raindrops:before{ -webkit-mask-image:url('../icons/raindrops.svg'); mask-image:url('../icons/raindrops.svg'); }
.wi-lightning:before{ -webkit-mask-image:url('../icons/lightning.svg'); mask-image:url('../icons/lightning.svg'); }
.wi-strong-wind:before{ -webkit-mask-image:url('../icons/strong-wind.svg'); mask-image:url('../icons/strong-wind.svg'); }
.wi-windy:before{ -webkit-mask-image:url('../icons/windy.svg'); mask-image:url('../icons/windy.svg'); }
.wi-wind-default:before{ -webkit-mask-image:url('../icons/wind-default.svg'); mask-image:url('../icons/wind-default.svg'); }
.wi-barometer:before{ -webkit-mask-image:url('../icons/barometer.svg'); mask-image:url('../icons/barometer.svg'); }
.wi-timer:before{ -webkit-mask-image:url('../icons/timer.svg'); mask-image:url('../icons/timer.svg'); }
.wi-humidity:before{ -webkit-mask-image:url('../icons/humidity.svg'); mask-image:url('../icons/humidity.svg'); }
.wi-day-sunny:before{ -webkit-mask-image:url('../icons/day-sunny.svg'); mask-image:url('../icons/day-sunny.svg'); }
.wi-cloud:before{ -webkit-mask-image:url('../icons/cloud.svg'); mask-image:url('../icons/cloud.svg'); }
.wi-time-2:before{ -webkit-mask-image:url('../icons/time.svg'); mask-image:url('../icons/time.svg'); }
