/* ========================================= */
/* 文件：weather-modal.css                     */
/* 功能：天气弹窗与环境感知面板                 */
/*       ——独立毛玻璃弹窗、当前天气展示、       */
/*       4日预报网格、刷新按钮                   */
/* ========================================= */

/* 天气抽屉（内嵌于猎人面板，复用 .hunter-panel-content 毛玻璃） */
#weather-panel-drawer {
  padding: 18px 20px 24px;
}

.weather-modal-content {
    width: 100%;
    max-width: 300px;
    background:
        linear-gradient(135deg, rgba(10,8,20,0.7), rgba(5,5,12,0.75)) padding-box,
        linear-gradient(135deg, rgba(255,179,122,0.4), rgba(162,155,254,0.35)) border-box;
    backdrop-filter: blur(20px) saturate(120%);
    border: 1px solid transparent;
    border-radius: 28px;
    box-shadow: -2px -2px 10px rgba(162,155,254,0.15), 2px 2px 10px rgba(255,179,122,0.15),
                0 12px 30px rgba(0,0,0,0.45), inset 0 1px 1px rgba(255,255,255,0.08);
    overflow: visible;
    animation: popIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative;
}
#weather-panel-drawer .sheet-header {
  margin-bottom: 14px;
  padding-bottom: 10px;
}
.weather-panel-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  width: 206px;
  margin-left: auto;
  margin-right: auto;
}
.weather-panel-temp {
  font-size: 44px;
  font-weight: 300;
  color: rgba(255,179,122,0.95);
  line-height: 1;
}
.weather-panel-desc {
  font-size: 12px;
  color: rgba(255,255,255,0.45);
  margin-top: 4px;
  letter-spacing: 0.3px;
}
.weather-panel-grid {
  display: grid;
  grid-template-columns: repeat(2, 100px);
  gap: 10px;
  justify-content: center;
}
.weather-panel-item {
  background: rgba(255,255,255,0.05);
  border-radius: 14px;
  padding: 8px 10px;
}
.weather-panel-item-label {
  font-size: 11px;
  color: rgba(255,255,255,0.35);
  margin-bottom: 4px;
}
.weather-panel-item-val {
  font-size: 15px;
  color: rgba(255,255,255,0.85);
  font-weight: 500;
}
.weather-refresh-btn {
  font-size: 11px;
  color: rgba(255,179,122,0.7);
  background: none;
  border: 1px solid rgba(255,179,122,0.2);
  border-radius: 20px;
  padding: 3px 10px;
  cursor: pointer;
}

.forecast-divider {
    height: 1px;
    background: rgba(255,255,255,0.07);
    margin: 12px 0;
}
.forecast-row {
    display: flex;
    justify-content: space-between;
    gap: 4px;
}
.forecast-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.forecast-label {
    font-size: 11px;
    color: rgba(255,255,255,0.45);
}
.forecast-icon {
    width: 20px;
    height: 20px;
    opacity: 0.8;
    filter: invert(1);
}
.forecast-temp {
    font-size: 13px;
    color: rgba(255,179,122,0.9);
    font-weight: 500;
}
.forecast-night {
    font-size: 11px;
    color: rgba(255,255,255,0.35);
}