/* =====================================================================
 * agrobyte-polish.css — Shared visual layer for ALL pages.
 * v0.9 BETA · Built additively so it does NOT override page-specific layout.
 * Order of inclusion: AFTER each page's own <style>, so we win on conflicts.
 * Scope:
 *   1.8  Inter font globally (Greek-friendly)
 *   1.9  Beta badge styling (replaces big "ΥΠΟ ΑΝΑΠΤΥΞΗ" text where present)
 *   1.10 Brighter light theme (auto-toggle with #agb-theme-toggle)
 *   2.7  EL/EN toggle styles
 *   Map dark-tile brightening (only affects pages with Leaflet)
 * ===================================================================== */

/* === Twemoji unified iconography (1.4 P2) ===
 * Inline-renders all emoji glyphs as consistent SVG across iOS/Android/Win/Linux.
 * .agb-twemoji is added by twemoji.parse() in polish.js. */
img.agb-twemoji {
  display: inline-block;
  height: 1em;
  width: 1em;
  margin: 0 .05em 0 .1em;
  vertical-align: -.1em;
}
/* Map pins, status dots, and similar non-emoji glyphs should NOT be replaced —
 * those are SVG/CSS shapes, so twemoji never touches them. */

/* === Inter font as primary body font (overrides Space Grotesk on body) === */
html, body {
  font-family: 'Inter','DM Sans','Space Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif !important;
  font-feature-settings: 'cv02','cv03','cv04','cv11';
}
/* Keep Space Grotesk for headings if the page already chose it */
.nav-logo, .footer-logo, h1, h2, h3 { letter-spacing: -.5px; }

/* === Nav toggles (lang + theme) — injected by polish.js if a .nav exists === */
.agb-toggle, .agb-lang-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  height: 32px; border-radius: 10px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.75);
  cursor: pointer; font-size: 13px; font-weight: 700;
  font-family: inherit; letter-spacing: .5px;
  transition: all .2s;
}
.agb-toggle { width: 32px; font-size: 16px; }
.agb-lang-toggle { padding: 0 10px; min-width: 50px; gap: 4px; }
.agb-lang-toggle .lt-active { color: #00e676; }
.agb-lang-toggle .lt-sep { color: rgba(255,255,255,.35); font-weight: 500; }
.agb-toggle:hover, .agb-lang-toggle:hover {
  background: rgba(0,230,118,.12); color: #00e676; border-color: #00e676;
}

/* === Beta badge (small replacement for the big "ΥΠΟ ΑΝΑΠΤΥΞΗ") === */
.agb-beta-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 14px; border-radius: 100px;
  background: rgba(245,158,11,.15);
  border: 1px solid rgba(245,158,11,.35);
  color: #fbbf24;
  font-size: 10px; font-weight: 500;
  letter-spacing: .8px; text-transform: uppercase;
  font-family: 'Inter',sans-serif;
}
.agb-beta-badge::before {
  content:''; width: 6px; height: 6px; border-radius: 50%;
  background: #fbbf24; animation: agb-pulse 2s infinite;
}
@keyframes agb-pulse { 0%,100%{opacity:1} 50%{opacity:.3} }

/* === LIGHT THEME — applied when body has .agb-light === */
body.agb-light {
  background: linear-gradient(135deg,#eaf4fb,#dfe9f3,#e6edf5) !important;
  color: #0f172a !important;
}
body.agb-light::before {
  content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(135deg,#eaf4fb,#dfe9f3,#e6edf5);
}

/* Generic backgrounds & text — these target common selectors used across pages */
body.agb-light .nav,
body.agb-light .navbar,
body.agb-light nav[class*="nav"] {
  background: rgba(255,255,255,.85) !important;
  border-color: rgba(15,23,42,.10) !important;
  box-shadow: 0 4px 24px rgba(15,23,42,.06) !important;
}
body.agb-light .nav-logo,
body.agb-light .footer-logo { color: #0f172a !important; }
body.agb-light .nav-logo span,
body.agb-light .footer-logo span { color: #059669 !important; }
body.agb-light .nav-link { color: #475569 !important; }
body.agb-light .nav-link:hover { color: #059669 !important; }
body.agb-light .nav-status {
  background: rgba(5,150,105,.15) !important;
  color: #047857 !important;
}
body.agb-light .nav-status::before { background: #059669 !important; }
body.agb-light .nav-dot { background: #94a3b8 !important; }

/* Cards / tiles */
body.agb-light .card,
body.agb-light .station-card,
body.agb-light .st-card,
body.agb-light .data-card,
body.agb-light [class*="card"] {
  background: rgba(255,255,255,.78) !important;
  backdrop-filter: blur(20px);
  border-color: rgba(15,23,42,.08) !important;
  color: #0f172a;
  box-shadow: 0 4px 20px rgba(15,23,42,.06);
}
body.agb-light .card:hover { background: rgba(255,255,255,.95) !important; }

/* Headings & text on light mode */
body.agb-light h1,
body.agb-light h2,
body.agb-light h3,
body.agb-light h4 { color: #0f172a !important; }
body.agb-light p { color: #334155; }
body.agb-light .hero-sub,
body.agb-light .hero-region { color: #334155 !important; }
body.agb-light .sec-head h2 { color: #0f172a !important; }
body.agb-light .sec-head p { color: #475569 !important; }
body.agb-light .footer { color: #475569 !important; }
body.agb-light .footer a { color: #059669 !important; }

/* The big gradient title common across pages */
body.agb-light .hero h1 .gr,
body.agb-light h1 .gr {
  background: linear-gradient(135deg,#047857 0%,#1d4ed8 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* Hero / beta badges */
body.agb-light .hero-badge,
body.agb-light .badge {
  background: rgba(5,150,105,.10) !important;
  border-color: rgba(5,150,105,.25) !important;
  color: #047857 !important;
}
body.agb-light .agb-beta-badge {
  background: rgba(217,119,6,.15) !important;
  border-color: rgba(217,119,6,.40) !important;
  color: #b45309 !important;
}
body.agb-light .agb-beta-badge::before { background: #d97706 !important; }

/* Toggles in light */
body.agb-light .agb-toggle,
body.agb-light .agb-lang-toggle {
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(15,23,42,.10) !important;
  color: #334155 !important;
}
body.agb-light .agb-toggle:hover,
body.agb-light .agb-lang-toggle:hover {
  background: rgba(5,150,105,.15) !important;
  color: #059669 !important;
  border-color: #059669 !important;
}
body.agb-light .agb-lang-toggle .lt-active { color: #059669 !important; }
body.agb-light .agb-lang-toggle .lt-sep { color: #94a3b8 !important; }

/* Reduce background blob brightness in light mode */
body.agb-light .bg-blobs { opacity: .35; }
body.agb-light .blob { filter: blur(100px); }
body.agb-light .blob:nth-child(1) { background: #10b981 !important; opacity: .18; }
body.agb-light .blob:nth-child(2) { background: #3b82f6 !important; opacity: .16; }

/* Iframes (grafana panels) keep dark background usually — let's add subtle border in light */
body.agb-light iframe { border-color: rgba(15,23,42,.10) !important; }

/* === Station-page specific elements in light mode (metric cards, PP cards) === */
/* Override the CSS custom properties used by station/crop pages */
body.agb-light {
  --text:     #0f172a !important;
  --text2:    #1e293b !important;
  --text3:    #334155 !important;
  --text-dim: #64748b !important;
  --glass:    rgba(255,255,255,.85) !important;
  --border:   rgba(15,23,42,.10) !important;
}
/* Metric values & labels (station pages) */
body.agb-light .metric-big .val,
body.agb-light .metric-med .val,
body.agb-light .val {
  color: #0f172a !important;
}
body.agb-light .metric-big .label,
body.agb-light .metric-med .label,
body.agb-light .metric-big .sub,
body.agb-light .metric-med .sub,
body.agb-light .metric-big .unit,
body.agb-light .metric-med .unit {
  color: #475569 !important;
}
body.agb-light .src-note { color: rgba(15,23,42,.45) !important; }

/* PP (Προσωπικό Περιβάλλον) section toggles — keep readable in light mode */
body.agb-light .pp-toggle,
body.agb-light .pp-body {
  background: rgba(255,255,255,.85) !important;
  border-color: rgba(15,23,42,.10) !important;
  color: #0f172a !important;
}
body.agb-light .pp-toggle .pp-name,
body.agb-light .pp-name { color: #0f172a !important; }
body.agb-light .pp-toggle .pp-desc,
body.agb-light .pp-desc { color: #475569 !important; }

/* Time-range buttons (pp-tr-btn) */
body.agb-light .pp-timerange,
body.agb-light .pp-tr-label { color: #475569 !important; }
body.agb-light .pp-tr-btn {
  color: #334155 !important;
  background: rgba(255,255,255,.6) !important;
  border-color: rgba(15,23,42,.10) !important;
}
body.agb-light .pp-tr-btn.active {
  color: #059669 !important;
  background: rgba(5,150,105,.15) !important;
  border-color: #059669 !important;
}

/* Section headers with emoji at start (e.g. "Ιστορικά Δεδομένα") */
body.agb-light .sec-head h2,
body.agb-light .sec-head h2 span,
body.agb-light h2 span { color: #0f172a !important; }

/* Hero coords / breadcrumbs */
body.agb-light .hero-coords,
body.agb-light .hero-region,
body.agb-light .breadcrumb a,
body.agb-light .breadcrumb { color: #334155 !important; }
body.agb-light .breadcrumb a:hover { color: #059669 !important; }

/* "Powered by Grafana" plate inside cards */
body.agb-light .grafana-plate,
body.agb-light [class*="grafana"] { color: #475569 !important; }

/* Wind direction widget */
body.agb-light .wind-card,
body.agb-light .wind-card * { color: #0f172a !important; }
body.agb-light .wind-card .deg,
body.agb-light .wind-card .dir { color: #475569 !important; }

/* Alert "no alert" green check card */
body.agb-light .alert-ok,
body.agb-light .alert-card { color: #047857 !important; }

/* Buttons (Είσοδος etc.) */
body.agb-light .pin-submit {
  background: linear-gradient(135deg,#059669,#10b981) !important;
  color: #fff !important;
}
body.agb-light .pin-gate h4 { color: #0f172a !important; }
body.agb-light .pin-gate p  { color: #475569 !important; }
body.agb-light .pin-error   { color: #b91c1c !important; }
body.agb-light .pin-info,
body.agb-light .pin-info * { color: #64748b !important; }

/* Map: brighten dark tiles in dark mode for less-black look ===
 * Applies to BOTH theme-class systems: polish.js uses body.agb-light,
 * main index.html uses body.light. In light mode under either, no filter. */
body:not(.agb-light):not(.light) .leaflet-tile-pane { filter: brightness(1.35) contrast(.92) saturate(1.05); }
body:not(.agb-light):not(.light) .leaflet-tile { filter: none; }  /* the pane filter handles it */
/* Light mode: keep tiles clean */
body.agb-light .leaflet-tile-pane,
body.light    .leaflet-tile-pane { filter: none; }

/* === Hide the giant "ΥΠΟ ΑΝΑΠΤΥΞΗ" type disclaimers — polish.js replaces with badge === */
.agb-hide { display: none !important; }

/* === Mobile UX polish === */
@media (max-width: 520px) {
  .nav-link[href]:not([href^="#"]) { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .blob, .agb-beta-badge::before, .nav-status::before { animation: none !important; }
  * { transition: none !important; }
}