@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&family=Outfit:wght@300;400;600;800&family=Roboto:wght@300;400;700&display=swap";
.widget-base{width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative;overflow:hidden}.widget-text-container,.widget-clock-container,.widget-date-container{box-sizing:border-box;text-shadow:0 2px 4px #0006;-webkit-backdrop-filter:blur(8px);border-radius:inherit;background:#00000040;border:1px solid #ffffff0d;justify-content:center;align-items:center;width:100%;height:100%;transition:all .3s;display:flex;overflow:hidden}.widget-text-container span,.widget-clock-container span,.widget-date-container span{max-width:100%;transition:font-size .2s;display:inline-block}.weather-widget{color:#fff;border-radius:inherit;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);flex-direction:column;min-height:200px;padding:16px;display:flex}.weather-widget.dark{background:linear-gradient(135deg,#2c3e50 0%,#34495e 100%)}.weather-widget.light{background:linear-gradient(135deg,#74b9ff 0%,#0984e3 100%)}.widget-header{justify-content:space-between;align-items:center;margin-bottom:16px;font-size:12px;display:flex}.location-info{align-items:center;gap:6px;display:flex}.location-icon{opacity:.8;font-size:14px}.location-text{opacity:.9;font-weight:500}.current-time{opacity:.7;font-size:11px}.main-weather{text-align:center;flex-direction:column;flex:1;align-items:center;margin-bottom:20px;display:flex}.weather-icon-large{opacity:.9;margin-bottom:8px;font-size:48px}.temperature-main{margin-bottom:8px;font-size:48px;font-weight:300;line-height:1}.weather-description{opacity:.8;text-transform:capitalize;font-size:14px}.weather-details{grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px;display:grid}.detail-item{text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border-radius:8px;flex-direction:column;align-items:center;padding:8px;display:flex}.detail-icon{opacity:.8;margin-bottom:4px;font-size:16px}.detail-value{margin-bottom:2px;font-size:14px;font-weight:600}.detail-label{opacity:.7;text-transform:uppercase;letter-spacing:.5px;font-size:10px}.weather-forecast{margin-top:auto}.forecast-title{opacity:.8;text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;font-size:12px;font-weight:600}.forecast-items{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.forecast-item{text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border-radius:6px;flex-direction:column;align-items:center;padding:8px;display:flex}.forecast-day{opacity:.8;text-transform:uppercase;margin-bottom:4px;font-size:10px;font-weight:500}.forecast-icon{opacity:.9;margin-bottom:4px;font-size:20px}.forecast-temps{gap:8px;font-size:11px;display:flex}.temp-max{opacity:.9;font-weight:600}.temp-min{opacity:.6}.html-widget{width:100%;height:100%;overflow:hidden}.widget-iframe{border-radius:inherit;border:none;width:100%;height:100%}@media (max-width:300px){.weather-widget{padding:12px}.temperature-main,.weather-icon-large{font-size:36px}.weather-details{grid-template-columns:repeat(2,1fr);gap:8px}.forecast-items{grid-template-columns:repeat(2,1fr)}}@media (min-width:400px){.weather-widget{padding:20px}.temperature-main,.weather-icon-large{font-size:56px}.weather-details{gap:16px}.forecast-items{gap:12px}}@media (min-width:600px){.weather-widget{padding:24px}.temperature-main,.weather-icon-large{font-size:64px}.weather-description{font-size:16px}.detail-item{padding:12px}.detail-icon{font-size:18px}.detail-value{font-size:16px}.detail-label{font-size:11px}}.weather-widget.compact{padding:8px}.weather-widget.compact .temperature-main,.weather-widget.compact .weather-icon-large{font-size:24px}.weather-widget.compact .weather-details,.weather-widget.compact .weather-forecast{display:none}.weather-widget.medium{padding:16px}.weather-widget.medium .temperature-main,.weather-widget.medium .weather-icon-large{font-size:36px}.weather-widget.medium .weather-details,.weather-widget.medium .forecast-items{grid-template-columns:repeat(2,1fr)}.weather-widget.large{padding:24px}.weather-widget.large .temperature-main,.weather-widget.large .weather-icon-large{font-size:72px}.weather-widget.large .weather-description{font-size:18px}.weather-widget.large .detail-item{padding:16px}.weather-widget.large .detail-icon{font-size:20px}.weather-widget.large .detail-value{font-size:18px}.weather-widget.large .detail-label{font-size:12px}.weather-widget.loading,.weather-widget.error{justify-content:center;align-items:center;min-height:200px;display:flex}.weather-widget.error{background:linear-gradient(135deg,#e74c3c 0%,#c0392b 100%)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.weather-widget{animation:.3s ease-out fadeIn}.detail-item,.forecast-item{transition:transform .2s,background-color .2s}.detail-item:hover,.forecast-item:hover{background:#ffffff26;transform:translateY(-2px)}@media (prefers-color-scheme:dark){.weather-widget.auto{background:linear-gradient(135deg,#2c3e50 0%,#34495e 100%)}}@media (prefers-color-scheme:light){.weather-widget.auto{background:linear-gradient(135deg,#74b9ff 0%,#0984e3 100%)}}
