/* ── 날씨 아이콘 애니메이션 ─────────────────────────────────────── */
.weather-icon { display:inline-block; width:44px; height:44px; flex-shrink:0; vertical-align:top; }
.weather-icon svg { width:100%; height:100%; display:block; }
/* compact 래퍼: 부모 크기에 맞춤 (일정 배지용) */
.weather-icon-compact { display:block; width:100%; height:100%; }
.weather-icon-compact .weather-icon { width:100%; height:100%; }

/* sunny */
@keyframes sun-spin { 0%,100%{transform:rotate(0deg)} 100%{transform:rotate(360deg)} }
.weather-icon-sunny .sun-body { animation:sun-spin 8s linear infinite; transform-origin:50% 50%; }

/* partly_cloudy */
@keyframes cloud-drift { 0%,100%{transform:translateX(0)} 50%{transform:translateX(3px)} }
.weather-icon-partly_cloudy .cloud { animation:cloud-drift 3s ease-in-out infinite; }

/* cloudy */
.weather-icon-cloudy .cloud { animation:cloud-drift 4s ease-in-out infinite; }

/* rain */
@keyframes rain-drop { 0%{transform:translateY(-4px);opacity:0} 50%{opacity:1} 100%{transform:translateY(6px);opacity:0} }
.weather-icon-rain .drop1 { animation:rain-drop 1.0s ease-in infinite; }
.weather-icon-rain .drop2 { animation:rain-drop 1.0s ease-in 0.3s infinite; }
.weather-icon-rain .drop3 { animation:rain-drop 1.0s ease-in 0.6s infinite; }

/* heavy_rain */
.weather-icon-heavy_rain .drop1 { animation:rain-drop 0.7s ease-in infinite; }
.weather-icon-heavy_rain .drop2 { animation:rain-drop 0.7s ease-in 0.2s infinite; }
.weather-icon-heavy_rain .drop3 { animation:rain-drop 0.7s ease-in 0.4s infinite; }
.weather-icon-heavy_rain .drop4 { animation:rain-drop 0.7s ease-in 0.1s infinite; }
.weather-icon-heavy_rain .drop5 { animation:rain-drop 0.7s ease-in 0.5s infinite; }

/* thunder */
@keyframes bolt-flash { 0%,100%{opacity:1} 50%{opacity:0.2} }
.weather-icon-thunder .bolt { animation:bolt-flash 0.8s ease-in-out infinite; }
.weather-icon-thunder .drop1 { animation:rain-drop 0.7s ease-in infinite; }
.weather-icon-thunder .drop2 { animation:rain-drop 0.7s ease-in 0.3s infinite; }

/* snow */
@keyframes snow-fall { 0%{transform:translateY(-4px) rotate(0deg);opacity:0} 50%{opacity:1} 100%{transform:translateY(6px) rotate(180deg);opacity:0} }
.weather-icon-snow .flake1 { animation:snow-fall 1.4s ease-in infinite; }
.weather-icon-snow .flake2 { animation:snow-fall 1.4s ease-in 0.5s infinite; }
.weather-icon-snow .flake3 { animation:snow-fall 1.4s ease-in 0.9s infinite; }

/* fog */
@keyframes fog-wave { 0%,100%{opacity:0.5;transform:translateX(0)} 50%{opacity:1;transform:translateX(3px)} }
.weather-icon-fog .fog1 { animation:fog-wave 3s ease-in-out infinite; }
.weather-icon-fog .fog2 { animation:fog-wave 3s ease-in-out 1s infinite; }

/* wind */
@keyframes wind-gust { 0%,100%{transform:translateX(0);opacity:0.6} 50%{transform:translateX(4px);opacity:1} }
.weather-icon-wind .gust1 { animation:wind-gust 1.5s ease-in-out infinite; }
.weather-icon-wind .gust2 { animation:wind-gust 1.5s ease-in-out 0.5s infinite; }
