/* ══════════════════════════════════════════════════════════════════════
   EH-Layout-Standard (Teil A): Kopfleiste und Seitenrahmen
   ══════════════════════════════════════════════════════════════════════

   Eingebunden auf jeder geschützten Seite mit EINER Zeile im <head>:

     <link rel="stylesheet" href="/css/eh-standard.css"/>

   dazu als erste Zeile im <body> das Kopfskript (js/eh-kopfleiste.js), das
   die Leiste baut. Eine Seite bringt KEIN eigenes Kopf-CSS mit — der
   Layout-Test (scripts/browsertest/layout-standard.mjs) macht sie sonst rot.

   Die Werte sind aus dem Bestand abgeleitet (Inventur vom 06.10.2026):
   beim Kopf ist das Dashboard Vorbild, sonst gewinnt der häufigste Wert.
   Die Zahl hinter jedem Wert sagt, wie viele der 38 Seiten ihn vorher schon
   hatten. Der Layout-Test liest die Werte aus DIESER Datei — wer hier etwas
   ändert, ändert den Standard, nicht eine Seite.

   Farben der Bausteine (Text, Rand, Karten, Knöpfe, Felder …) gehören zu
   Teil B und stehen hier noch nicht; das Konto-Menü trägt deshalb die
   Farben, die es im Dashboard hatte.
   ══════════════════════════════════════════════════════════════════════ */

:root{
  /* Kopf */
  --eh-kopf-hoehe:72px;                       /* 37/38 */
  --eh-kopf-grund:rgba(10,26,14,0.98);        /* 38/38 */
  --eh-kopf-unschaerfe:16px;                  /* 38/38 */
  --eh-kopf-rand:1px solid rgba(255,255,255,0.07); /* 38/38 */
  --eh-kopf-innen:28px;                       /* 37/38 */
  --eh-kopf-luecke:16px;                      /* Dashboard */
  --eh-kopf-knopf:38px;                       /* Dashboard */
  --eh-kopf-knopf-abstand:10px;               /* Dashboard */
  --eh-kopf-logo:40px;                        /* 36/38 */
  --eh-kopf-symbol:36px;                      /* 27 */
  --eh-kopf-zurueck-hoehe:32px;               /* 26 */
  --eh-kopf-suche:240px;                      /* Suchfeld ab 1024 px (Entscheidung vom 10.10.2026) */
  --eh-kopf-suche-mittel:160px;               /* Suchfeld 621–1023 px; am Handy die Lupe */
  /* Seitenrahmen */
  --eh-seite-grund:#f6faf7;                   /* 22 (Entscheidung 2) */
  --eh-seite-breite:1100px;                   /* 13 */
  --eh-seite-breite-schmal:860px;             /* 3 */
  --eh-seite-breite-breit:1200px;             /* 5 */
  --eh-seite-rand:24px;                       /* 19 bei 1280, 17 bei 390 */
  --eh-kopf-luft:20px;                        /* 14 */
}
/* Handy: bis 620 px wie Glocke und Suche (css/eh-glocke.css,
   css/eh-materialsuche.css). Mit 28 px Innenabstand passt die Leiste bei
   360 px nicht; 14 px haben EH-Order, -Rule, -Strang, -Record und die
   Erinnerungen schon vorher. */
@media(max-width:620px){
  :root{
    --eh-kopf-innen:14px;
    --eh-kopf-luecke:8px;
    --eh-kopf-knopf:34px;
    --eh-kopf-knopf-abstand:6px;
  }
}

/* ── Seitenrahmen ────────────────────────────────────────────────────── */
body{background:var(--eh-seite-grund);font-family:'DM Sans',sans-serif;}

/* Der Inhalt einer Seite steht in EINEM Behälter mit .eh-seite (dazu
   höchstens eine der Breiten). Unten bestimmt die Seite selbst. */
.eh-seite{box-sizing:border-box;max-width:var(--eh-seite-breite);margin-left:auto;margin-right:auto;
  padding-top:calc(var(--eh-kopf-hoehe) + var(--eh-kopf-luft));
  padding-left:var(--eh-seite-rand);padding-right:var(--eh-seite-rand);}
.eh-seite.eh-seite-schmal{max-width:var(--eh-seite-breite-schmal);}
.eh-seite.eh-seite-breit{max-width:var(--eh-seite-breite-breit);}

/* Was vorher als Seitenaktion im Kopf stand („＋ Neues Projekt“,
   „Einstellungen“), steht als erste Zeile des Inhalts, rechtsbündig. */
.eh-seitenaktionen{display:flex;justify-content:flex-end;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;}

/* ── Kopfleiste ──────────────────────────────────────────────────────── */
.eh-kopf{position:fixed;top:0;left:0;right:0;z-index:100;box-sizing:border-box;
  height:var(--eh-kopf-hoehe);padding:0 var(--eh-kopf-innen);
  display:flex;align-items:center;gap:var(--eh-kopf-luecke);
  background:var(--eh-kopf-grund);
  -webkit-backdrop-filter:blur(var(--eh-kopf-unschaerfe));backdrop-filter:blur(var(--eh-kopf-unschaerfe));
  border-bottom:var(--eh-kopf-rand);
  font-family:'Plus Jakarta Sans',sans-serif;line-height:normal;}
.eh-kopf *,.eh-kopf *::before,.eh-kopf *::after{box-sizing:border-box;}
.eh-kopf a{text-decoration:none;}
.eh-kopf [hidden]{display:none !important;}

/* Logo und Marke (links) */
.ehk-logo{display:flex;align-items:center;gap:11px;flex-shrink:0;color:#fff;}
.ehk-logo-icon{width:var(--eh-kopf-logo);height:var(--eh-kopf-logo);flex-shrink:0;border-radius:9px;
  background:#1DB954;color:#fff;font-weight:900;font-size:13px;
  display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(29,185,84,0.35);}
.ehk-marke{font-size:16px;font-weight:700;color:#fff;white-space:nowrap;}
.ehk-marke strong{color:#1DB954;font-weight:700;}

/* Seitensymbol, Überschrift, „← Dashboard“ */
.ehk-seite{display:flex;align-items:center;gap:10px;min-width:0;}
.ehk-symbol{width:var(--eh-kopf-symbol);height:var(--eh-kopf-symbol);flex-shrink:0;border-radius:9px;
  background:#0a1a0e;border:1.5px solid rgba(29,185,84,0.3);
  display:flex;align-items:center;justify-content:center;}
.ehk-titel{min-width:0;font-size:15px;font-weight:800;color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ehk-zurueck{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  height:var(--eh-kopf-zurueck-hoehe);padding:0 13px;border-radius:8px;
  font-size:13px;font-weight:700;color:rgba(255,255,255,0.6);white-space:nowrap;
  background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.12);transition:all 0.15s;}
.ehk-zurueck:hover{color:#fff;background:rgba(255,255,255,0.12);}

/* Navigation (nur Dashboard, wie vorher) */
.ehk-nav{display:flex;gap:2px;margin-left:28px;}
.ehk-nav-link{font-size:14px;font-weight:600;color:rgba(255,255,255,0.5);padding:7px 13px;border-radius:8px;transition:all 0.15s;cursor:pointer;}
.ehk-nav-link:hover{color:#fff;background:rgba(255,255,255,0.08);}
.ehk-admin-link{display:none;font-size:12px;font-weight:700;color:rgba(255,255,255,0.5);padding:7px 13px;border-radius:8px;
  background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.2);}
.ehk-admin-link:hover{color:#fff;background:rgba(239,68,68,0.2);}

/* Rechts: [Hilfe] · Suche · Glocke · Team · Upgraden · Konto. Die Suche ist
   ab 621 px ein Feld (Breite oben), am Handy die Lupe — css/eh-materialsuche.css. */
.ehk-rechts{margin-left:auto;display:flex;align-items:center;gap:var(--eh-kopf-knopf-abstand);flex-shrink:0;}
.ehk-platz{display:inline-flex;}
.ehk-platz:empty{display:none;}
.ehk-rechts .ehms-knopf,.ehk-rechts .ehgl-knopf{margin-left:0;}
.ehk-team{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:var(--eh-kopf-knopf);height:var(--eh-kopf-knopf);border-radius:9px;
  background:rgba(99,102,241,0.12);border:1px solid rgba(99,102,241,0.3);transition:all 0.15s;}
.ehk-upgrade{font-size:12px;font-weight:800;color:#fff;background:#1DB954;padding:7px 16px;border-radius:8px;
  border:none;cursor:pointer;white-space:nowrap;transition:all 0.2s;}
.ehk-upgrade:hover{background:#17a349;}

/* Konto (Initialen, Plan, ▾) und das Menü — aus dem Dashboard übernommen */
.ehk-konto{position:relative;}
.ehk-konto-knopf{display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;cursor:pointer;
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:10px;transition:all 0.15s;
  font-family:inherit;}
.ehk-konto-knopf:hover{background:rgba(255,255,255,0.12);}
.ehk-avatar{width:30px;height:30px;border-radius:9px;background:#1DB954;color:#fff;
  font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;}
.ehk-plan{font-size:11px;font-weight:800;padding:4px 10px;border-radius:6px;white-space:nowrap;
  background:rgba(29,185,84,0.15);color:#1DB954;border:1px solid rgba(29,185,84,0.25);}
.ehk-menue{position:absolute;top:calc(100% + 10px);right:0;width:230px;z-index:150;overflow:hidden;
  background:#fff;border:1.5px solid #cad8d0;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,0.18);}
.ehk-menue a,.ehk-menue button{display:flex;align-items:center;gap:9px;width:100%;padding:11px 14px;margin:0;
  font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:700;color:#0a1a0e;text-align:left;
  background:none;border:none;border-bottom:1px solid #cad8d0;cursor:pointer;}
.ehk-menue a:hover,.ehk-menue button:hover{background:#e8f4ec;}
.ehk-menue .ehk-abmelden{color:#dc2626;border-bottom:none;}
.ehk-pfeil{margin-left:auto;font-size:13px;color:#a8c4b4;}

/* Ab 1024 px abwärts ohne Marke und ohne „Upgraden“ */
@media(max-width:1023px){
  .ehk-marke,.ehk-upgrade{display:none !important;}
}
/* Navigation des Dashboards wie vorher erst über 768 px */
@media(max-width:768px){
  .ehk-nav{display:none;}
}
/* Handy: ohne Seitensymbol, „←“ ohne Wort, Konto nur Initialen, Team im
   Konto-Menü (Bauleiter-Verwaltung). Die Leiste bricht nie um, die
   Überschrift wird bei Platzmangel mit „…“ gekürzt. */
@media(max-width:620px){
  .ehk-symbol,.ehk-zurueck-wort,.ehk-team,.ehk-plan,.ehk-konto-pfeil{display:none !important;}
  .ehk-zurueck{width:var(--eh-kopf-knopf);height:var(--eh-kopf-knopf);padding:0;}
  .ehk-konto-knopf{padding:2px;}
}

/* ── Drucken ─────────────────────────────────────────────────────────── */
/* Die Leiste steht fest am Fenster und läge sonst über dem gedruckten
   Inhalt. EH-Cadence (Gantt mit Strg+P) blendete seinen alten Kopf beim
   Drucken schon aus; seit der Umstellung gilt das hier, für jede Seite —
   eine Seite bringt kein eigenes Kopf-CSS mit. */
@media print{.eh-kopf{display:none !important;}}