/* Mobile modern theme
   Works with html.theme-modern and/or body.theme-modern
*/
html.theme-modern,
body.theme-modern {
  --wx-bg: #e8eef2;
  --wx-ink: #1c2b36;
  --wx-muted: #5a6f7d;
  --wx-line: #c9d6df;
  --wx-panel: #ffffff;
  --wx-accent: #1f6f8b;
  --wx-accent2: #2a9d8f;
  --wx-header: #143447;
  --wx-radius: 16px;
  --wx-shadow: 0 10px 28px rgba(20, 52, 71, 0.1);
  --wx-font: "Figtree", "Segoe UI", sans-serif;
  --wx-display: "Fraunces", Georgia, serif;
}
html.theme-modern body.mobile-home,
html.theme-modern body.mobile-page,
body.theme-modern.mobile-home,
body.theme-modern.mobile-page {
  background:
    radial-gradient(800px 400px at 0% 0%, rgba(42,157,143,0.2), transparent 55%),
    linear-gradient(180deg, #d9e4ec, var(--wx-bg) 45%, #d5e0e8) !important;
  font-family: var(--wx-font) !important;
  color: var(--wx-ink) !important;
}
html.theme-modern .m-wrap,
body.theme-modern .m-wrap {
  max-width: 520px;
  margin: 0 auto;
}
html.theme-modern .m-header,
body.theme-modern .m-header {
  background: linear-gradient(135deg, #0f2a38, #1f6f8b 60%, #2a9d8f) !important;
  border: none !important;
  border-radius: 0 0 var(--wx-radius) var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  padding: 18px 16px 16px 16px !important;
}
html.theme-modern .m-header h1,
html.theme-modern .m-header h1 a,
body.theme-modern .m-header h1,
body.theme-modern .m-header h1 a {
  font-family: var(--wx-display) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: #fff !important;
  text-decoration: none !important;
}
html.theme-modern .m-header .m-sub,
body.theme-modern .m-header .m-sub {
  color: rgba(255,255,255,0.85) !important;
  font-weight: 500 !important;
}
html.theme-modern .m-section,
body.theme-modern .m-section {
  background: var(--wx-panel) !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  margin: 12px 10px !important;
  overflow: hidden;
}
html.theme-modern .m-section h2,
body.theme-modern .m-section h2 {
  background: var(--wx-header) !important;
  color: #fff !important;
  border: none !important;
  font-family: var(--wx-font) !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.02em !important;
  padding: 10px 14px !important;
  margin: 0 !important;
}
html.theme-modern .m-body,
body.theme-modern .m-body { padding: 12px !important; }
html.theme-modern .m-hero-temp .val,
body.theme-modern .m-hero-temp .val {
  font-family: var(--wx-display) !important;
  font-size: 3rem !important;
  font-weight: 700 !important;
  color: var(--wx-header) !important;
}
html.theme-modern .m-card,
body.theme-modern .m-card {
  background: #f3f8fa !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
html.theme-modern .m-card .label,
body.theme-modern .m-card .label {
  color: var(--wx-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
}
html.theme-modern .m-card .val,
body.theme-modern .m-card .val {
  color: var(--wx-ink) !important;
  font-weight: 600 !important;
}
html.theme-modern .m-nav,
body.theme-modern .m-nav {
  background: var(--wx-panel) !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  margin: 12px 10px !important;
  box-shadow: var(--wx-shadow) !important;
  padding: 8px !important;
}
html.theme-modern .m-nav a,
body.theme-modern .m-nav a {
  border-radius: 10px !important;
  font-weight: 600 !important;
  color: var(--wx-ink) !important;
}
html.theme-modern .m-nav a.active,
body.theme-modern .m-nav a.active {
  background: var(--wx-accent) !important;
  color: #fff !important;
  box-shadow: none !important;
}
html.theme-modern .m-nav a.secondary,
body.theme-modern .m-nav a.secondary {
  color: var(--wx-muted) !important;
}
html.theme-modern .m-footer,
body.theme-modern .m-footer {
  color: var(--wx-muted) !important;
}
html.theme-modern .windHistory,
html.theme-modern .rainHistory,
html.theme-modern .windVane,
body.theme-modern .windHistory,
body.theme-modern .rainHistory,
body.theme-modern .windVane {
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
}
html.theme-modern .wh-btn,
html.theme-modern .rh-btn,
body.theme-modern .wh-btn,
body.theme-modern .rh-btn {
  border-radius: 999px !important;
}
html.theme-modern img[src*="icons-modern"],
body.theme-modern img[src*="icons-modern"] {
  border-radius: 12px;
  background: linear-gradient(160deg, #f7fbfd, #e8f2f4);
  padding: 4px;
}
html.theme-modern .m-content,
body.theme-modern .m-content {
  border-radius: var(--wx-radius) !important;
  border-color: var(--wx-line) !important;
  box-shadow: var(--wx-shadow) !important;
}