/* ============================================================
   HD Energy Portal — Dunkles Theme im Tracker-Look
   Wird NACH den Seiten-Styles geladen und zieht nur die Farb-Token
   auf die Tracker-Werte. Funktionen/Layout bleiben unverändert.
   Token: Hintergrund #0a0f1e · Karten #1e293b · Border #334155
          Text #f8fafc · Subtext #94a3b8 · Akzent #a78bfa / #22d3ee
   ============================================================ */

:root{
  --bg:#0a0f1e;
  --text:#f8fafc; --muted:#94a3b8;
  --violet:#a78bfa; --cyan:#22d3ee;
  --glass:#1e293b; --glass-strong:#243044;
  --border:#334155; --border-strong:#475569;
  --grad:linear-gradient(135deg,#8b5cf6,#3b82f6);
  --shadow:0 18px 44px -18px rgba(0,0,0,.65);
}

html, body{ background:var(--bg) !important; }
body{ color:var(--text) !important; }
/* die „spacigen" Bild-Hintergründe entfernen → ruhiger Tracker-Look */
body::before, body::after{ display:none !important; content:none !important; background:none !important; }

/* ── Karten / Panels: dunkle Flächen, klare Borders, kein Glas-Blur ── */
.tile, .card, .panel, .kpi, .scard, .det, .group, .gcard, .mbox, .box,
.searchbar, .menu, .provpop{
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.tile, .card, .panel, .kpi, .scard, .group, .gcard, .det{
  background:#1e293b !important;
  border:1px solid var(--border) !important;
  box-shadow:0 1px 2px rgba(0,0,0,.25), 0 8px 22px -14px rgba(0,0,0,.55) !important;
}
.tile:hover{ transform:translateY(-3px);
  border-color:var(--violet) !important;
  box-shadow:0 14px 30px -14px rgba(139,92,246,.45) !important; background:#243044 !important; }

/* ── Topbar-Buttons / Pills ── */
.iconbtn, .back, .msel, .ghost, .btn-ghost, .quick button, .grp button, .stbtn{
  background:#1e293b !important; border:1px solid var(--border) !important; color:var(--text) !important;
}
.iconbtn:hover, .back:hover, .msel:hover, .ghost:hover, .btn-ghost:hover{ background:#243044 !important; border-color:var(--border-strong) !important; }

/* ── Tile-Icon: Violett/Cyan-Verlauf wie im Tracker ── */
.tile .ico{ background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(34,211,238,.16)) !important;
  border:1px solid var(--border) !important; }
.tile .ico svg{ stroke:var(--violet) !important; }

/* ── Eingaben ── */
input, select, textarea, .inp, .ein{
  background:#0f172a !important; color:var(--text) !important; border:1px solid var(--border) !important;
}
input:focus, select:focus, textarea:focus, .inp:focus, .ein:focus{
  border-color:var(--violet) !important; box-shadow:0 0 0 3px rgba(167,139,250,.22) !important;
}
input::placeholder, textarea::placeholder{ color:#64748b !important; }
input[type=month], input[type=date], input[type=time]{ color-scheme:dark !important; }
.searchbar{ background:#0f172a !important; border:1px solid var(--border) !important; }

/* ── Tabellen ── */
table th{ background:#16213a !important; color:var(--muted) !important; }
table td, table th{ border-color:var(--border) !important; }
tbody tr:hover{ background:rgba(167,139,250,.06) !important; }
.tablewrap{ border-color:var(--border) !important; }

/* ── Popups / Menüs / Toasts / Modals ── */
.toast, .menu, .provpop, .mbox, .msheet{
  background:#1e293b !important; color:var(--text) !important;
  border:1px solid var(--border-strong) !important;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.7) !important;
}
.menu button{ color:var(--text) !important; }
.menu button:hover{ background:#243044 !important; }
.modal{ background:rgba(2,6,17,.6) !important; }

/* ── Diverses ── */
.loading, .err, .empty{ color:var(--muted) !important; }
.empty{ background:#1e293b !important; border:1px solid var(--border) !important; }
hr{ border-color:var(--border) !important; }
::selection{ background:rgba(139,92,246,.35); }

/* ── Sticky-Steuerleisten / Filter ── */
.toolbar, .stickybar, .headbar, .filterbar{ background:var(--bg) !important; }
.seg{ background:#16213a !important; border:1px solid var(--border) !important; }
.seg button:not(.on){ color:var(--muted) !important; }
.seg button:not(.on):hover{ background:#1e293b !important; color:var(--text) !important; }
option, select option{ background:#0f172a !important; color:var(--text) !important; }
thead th, th.ma{ background:#16213a !important; color:var(--muted) !important; }
td.ma{ background:#131c31 !important; color:var(--text) !important; }

/* ── Eingebettet (Tool läuft RECHTS im Portal-iframe): doppelte
   Topbar/Logo ausblenden, Hintergrund an die Shell angleichen ── */
.hde-embedded .topbar img, .hde-embedded img.logo{ display:none !important; }
.hde-embedded body{ background:var(--bg) !important; }
.hde-embedded .toolbar, .hde-embedded .stickybar, .hde-embedded .headbar, .hde-embedded .filterbar{ background:var(--bg) !important; }