/* ============================================================
   weather.css  —  New York State Search Weather Pages
   Combines page layout (from map.css) with weather widget styles.
   Loaded by ny_weather_generator_v1.py in place of map.css + inline <style>.
   ============================================================ */

/* ── Reset ─────────────────────────────────────────────────── */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;background:#fff;color:#333;font-size:15px;line-height:1.55}
a{color:#0055bb;text-decoration:none}
a:hover{text-decoration:underline}

/* ── Header / Nav ── */
#site-header{background:#1a1a2e;padding:7px 16px;font-size:0.85em}
#site-header a{color:#aad4f5;margin:0 5px}
#site-header a:hover{color:#fff}
#breadcrumb{background:#f4f4f4;border-bottom:1px solid #ddd;padding:5px 16px;font-size:0.83em;color:#666}
#breadcrumb a{color:#0055bb}

/* ── Page layout ── */
#wrap{max-width:980px;margin:0 auto;padding:14px 16px}
h1{font-size:1.55em;color:#1a1a2e;border-bottom:2px solid #1a1a2e;padding-bottom:6px;margin-bottom:12px}
h2{font-size:1.15em;color:#1a1a2e;margin:20px 0 8px}
h3{margin:14px 0 6px}
p{margin-bottom:10px}

/* ── Info grid (detail table) ── */
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0}
.info-box{background:#f8f8f8;border:1px solid #e0e0e0;border-radius:4px;padding:12px 14px}
.info-box table{width:100%;border-collapse:collapse}
.info-box td{padding:3px 6px;border-bottom:1px solid #eee;font-size:0.88em}
.info-box td:first-child{font-weight:bold;color:#555;width:110px}
@media(max-width:600px){.info-grid{grid-template-columns:1fr}}

/* ── Dynamic content sections ── */
#wiki-context,#news,#news-world,#news-world-bbc,#places,#seo-content{
  margin:14px 0;padding:12px 14px;
  background:#fafafa;border:1px solid #e8e8e8;border-radius:4px;
  min-height:40px;font-size:0.9em}
#weather{margin:10px 0;font-size:0.9em;color:#333}
#weather .we-widget,#weather .we-widget *{color:#fff !important}

/* ── State / weather hub link ── */
.state-map-link{margin:18px 0;padding:10px 14px;background:#eef4ff;border:1px solid #c0d4f0;border-radius:4px;font-size:0.9em}

/* ── Footer ── */
#site-footer{background:#1a1a2e;color:#aaa;text-align:center;padding:12px;font-size:0.8em;margin-top:28px}
#site-footer a{color:#aad4f5;margin:0 7px}

/* ============================================================
   Weather widget styles
   ============================================================ */

/* ── Section nav pill bar ── */
.wx-nav{
  display:flex;flex-wrap:wrap;gap:8px;
  margin:12px 0 18px;padding:10px 0;
  border-top:1px solid #e0e8f0;border-bottom:1px solid #e0e8f0;
}
.wx-nav a{
  display:inline-flex;align-items:center;gap:5px;
  padding:6px 14px;border-radius:20px;
  background:#f0f4f8;border:1px solid #d0d8e4;
  font-size:0.84em;font-weight:500;
  text-decoration:none;color:#2d6ca8;
  transition:background 0.15s,color 0.15s;
}
.wx-nav a:hover{background:#2d6ca8;color:#fff;}
.wx-nav a.wx-alert{
  background:#cc0000;color:#fff;border-color:#aa0000;
  animation:wx-pulse 1.5s ease-in-out infinite;
}
@keyframes wx-pulse{0%,100%{opacity:1;}50%{opacity:0.7;}}

/* ── Current conditions card ── */
.wx-current{
  background:linear-gradient(135deg,#1a3a5c 0%,#2d6ca8 100%);
  color:#fff !important;border-radius:10px;padding:20px;margin:14px 0;
}
.wx-current *{color:#fff !important;}
.wx-current .wx-cell-label{opacity:0.75;}
.wx-current-top{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:16px;
}
.wx-temp-big{font-size:3.8em;font-weight:700;line-height:1;}
.wx-condition{font-size:1.15em;opacity:0.92;margin-top:4px;}
.wx-feels{font-size:0.9em;opacity:0.75;margin-top:2px;}
.wx-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:10px;margin-top:4px;
}
.wx-cell{background:rgba(255,255,255,0.12);border-radius:8px;padding:10px 12px;font-size:0.85em;}
.wx-cell-label{opacity:0.72;font-size:0.88em;margin-bottom:2px;}
.wx-cell-value{font-weight:600;font-size:1.05em;}

/* ── VFR/IFR flight category badge ── */
.vfr-badge{
  display:inline-block;padding:4px 12px;border-radius:12px;
  font-weight:700;font-size:0.82em;letter-spacing:0.5px;margin-left:8px;
}
.vfr-vfr {background:#27ae60;color:#fff;}
.vfr-mvfr{background:#e67e22;color:#fff;}
.vfr-ifr {background:#e74c3c;color:#fff;}
.vfr-lifr{background:#8e44ad;color:#fff;}

/* ── Section headers ── */
.wx-section{
  margin:22px 0 10px;padding-bottom:6px;
  border-bottom:2px solid #e0e8f0;
  font-size:1.05em;font-weight:600;color:#1a3a5c;
}

/* ── Hourly forecast strip ── */
.wx-hourly{display:flex;overflow-x:auto;gap:8px;padding:10px 2px;scrollbar-width:thin;}
.wx-hour{
  min-width:58px;text-align:center;
  background:#f5f8fc;border-radius:8px;
  padding:8px 4px;font-size:0.8em;flex-shrink:0;
}
.wx-hour-time{color:#666;margin-bottom:3px;}
.wx-hour-icon{font-size:1.3em;margin:3px 0;}
.wx-hour-temp{font-weight:600;}
.wx-hour-rain{color:#2d6ca8;font-size:0.82em;margin-top:2px;}

/* ── 7-day forecast grid ── */
.wx-daily{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(90px,1fr));
  gap:8px;margin:10px 0;
}
.wx-day{background:#f5f8fc;border-radius:8px;padding:10px 8px;text-align:center;font-size:0.83em;}
.wx-day-name{font-weight:600;color:#1a3a5c;}
.wx-day-icon{font-size:1.5em;margin:5px 0;}
.wx-day-temps{color:#333;}
.wx-day-hi{font-weight:600;}
.wx-day-lo{color:#888;}
.wx-day-rain{color:#2d6ca8;font-size:0.8em;margin-top:3px;}

/* ── Aviation / detail data grid ── */
.wx-avi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:8px;margin:10px 0;
}
.wx-avi-cell{background:#f5f8fc;border-radius:8px;padding:10px 12px;font-size:0.85em;}
.wx-avi-label{color:#666;font-size:0.85em;margin-bottom:2px;}
.wx-avi-val{font-weight:600;color:#1a3a5c;}

/* ── Tide cards ── */
.wx-tide-row{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0;}
.wx-tide-card{
  background:#e8f4fd;border-left:3px solid #2d6ca8;
  border-radius:6px;padding:10px 14px;
  font-size:0.88em;min-width:140px;
}
.wx-tide-type{font-weight:600;color:#1a3a5c;}
.wx-tide-time{color:#444;margin-top:2px;}
.wx-tide-ht{color:#2d6ca8;font-weight:600;}

/* ── NWS extended forecast periods ── */
.wx-nws-period{
  margin-bottom:10px;padding:10px 12px;
  background:#f0f4f8;border-radius:8px;
  border-left:3px solid #2d6ca8;
}
.wx-nws-period strong{color:#1a3a5c;}
.wx-nws-temp{float:right;font-weight:600;color:#2d6ca8;}
.wx-nws-short{font-size:0.88em;color:#444;margin-top:3px;}
.wx-nws-detail{font-size:0.8em;color:#555;margin-top:4px;}

/* ── Radar / satellite iframe wrapper ── */
.wx-embed-wrap{
  position:relative;width:100%;padding-top:56.25%;
  border-radius:10px;overflow:hidden;
  background:#111;margin:10px 0;
}
.wx-embed-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
.wx-embed-loading{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  color:#aaa;font-size:0.9em;
}

/* ── Air quality ── */
.wx-aqi-bar{
  height:14px;border-radius:7px;margin:8px 0;
  background:linear-gradient(to right,#27ae60,#f1c40f,#e67e22,#e74c3c,#8e44ad,#6b0f1a);
}
.wx-aqi-labels{display:flex;justify-content:space-between;font-size:0.72em;color:#666;margin-top:2px;}

/* ── Moon phase emoji ── */
.wx-moon{font-size:2em;margin-right:8px;vertical-align:middle;}

/* ── Map cross-link block ── */
.wx-map-link{
  margin:16px 0;padding:12px 16px;
  background:#f0f4f8;border-radius:8px;
  border-left:3px solid #2d6ca8;font-size:0.9em;
}

/* ── Loading indicator ── */
.wx-loading{color:#888;font-size:0.88em;font-style:italic;padding:12px 0;}

/* ── Responsive ── */
@media(max-width:600px){
  .wx-temp-big{font-size:2.8em;}
  .wx-nav a{padding:5px 10px;font-size:0.78em;}
}