/* ==========================================================================
   EA Cockpit — Seitenflächen (Schritt 2–4)
   Überführt die BESTEHENDEN Klassen (ea-ut-*, ea-content-card, ea-answer-box,
   ea-faq-*, ea-sidebar-*, ea-hf-* sowie das GP-Archiv-Markup) in den
   Cockpit-Look. Kein Eingriff in Inhalte, Schema oder FAQ.
   Alles hängt an body.ea-cockpit → Abschalten über die Option genügt.
   Stand 27.07.2026
   ========================================================================== */

body.ea-cockpit{
  --grund:#eef3fa; --karte:#ffffff; --tinte:#0d1830; --grau:#5a6b88;
  --indigo:#2b4bc9; --indigo-hell:#eaeffc;
  --teal:#0d9d90;  --teal-hell:#e3f5f2;
  --bernstein:#dd8a1c; --bernstein-hell:#fdf1de;
  --rose:#cf4059; --rose-hell:#fdeaed;
  --rand:#dde5f2; --rand-weich:#eef2f8;
  --r:18px; --r-klein:12px;
  --schatten:0 1px 2px rgba(13,24,48,.05), 0 14px 30px -18px rgba(13,24,48,.35);
  background:var(--grund);

  /* ★ Bestandsvariablen umdefinieren statt jede Einzelregel zu überschreiben:
     GeneratePress' Flächenfarben und der warme Ton des Alt-Designs. */
  --base-2:#eef3fa;        /* Seitengrund */
  --base-3:#ffffff;        /* Container */
  --ea-hf-warm:#f7fafd;    /* vormals cremefarbene Flächen */
  --ea-hf-cream:#f7fafd;
}

/* ★ Kategorie-Layout: dessen komplette Palette auf Cockpit umstellen.
   Höhere Spezifität als `body.ea-cat-layout`, damit die Werte greifen. */
body.ea-cockpit.ea-cat-layout,
body.ea-cockpit.archive.ea-cat-layout{
  --eac-bg:#eef3fa;
  --eac-card-bg:#ffffff;
  --eac-card-bg-soft:#f7fafd;
  --eac-orange:#0d9d90;
  --eac-orange-light:#3fc9ad;
  --eac-gold:#0d1830;
  --eac-gold-light:#132449;
  --eac-text:#0d1830;
  --eac-text-mid:#5a6b88;
  --eac-text-soft:#8496b3;
  --eac-border:rgba(43,75,201,.18);
  --eac-border-soft:rgba(43,75,201,.10);
  --eac-shadow-sm:0 1px 2px rgba(13,24,48,.05);
  --eac-shadow-md:0 1px 2px rgba(13,24,48,.05), 0 14px 30px -18px rgba(13,24,48,.35);
  --eac-shadow-lg:0 1px 2px rgba(13,24,48,.06), 0 26px 46px -26px rgba(13,24,48,.5);
  --eac-radius:18px;
  background:var(--grund) !important;
}

/* ---------------------------------------------------------- 1. Artikel-Bühne */
body.ea-cockpit .ea-ut-hero{
  background:
    radial-gradient(1100px 520px at 78% -12%, rgba(29,127,158,.85) 0%, transparent 58%),
    radial-gradient(760px 460px at 8% 108%, rgba(43,75,201,.75) 0%, transparent 60%),
    linear-gradient(160deg,#0d1830 0%,#132449 52%,#0f2f4d 100%) !important;
  padding:46px 40px 52px !important;position:relative;overflow:hidden;
}
body.ea-cockpit .ea-ut-hero::before{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent);
  mask-image:radial-gradient(70% 60% at 50% 30%,#000,transparent);
  border-radius:0;width:auto;height:auto;background-color:transparent;
}
body.ea-cockpit .ea-ut-hero-inner{gap:44px;align-items:center}
body.ea-cockpit .ea-ut-title{
  font-size:clamp(1.7rem,1.2rem + 2.1vw,2.9rem) !important;font-weight:800 !important;
  letter-spacing:-.028em !important;line-height:1.1 !important;margin-bottom:16px !important;
  font-family:'Manrope',system-ui,sans-serif !important;
}
body.ea-cockpit .ea-ut-lead{
  color:#c2d2ea !important;font-size:1.06rem !important;line-height:1.6 !important;
  max-width:58ch !important;
}
body.ea-cockpit .ea-ut-cat{
  background:rgba(255,255,255,.1) !important;border:1px solid rgba(255,255,255,.2) !important;
  color:#a9e8df !important;font-weight:700 !important;border-radius:99px !important;
  padding:7px 15px !important;
}
body.ea-cockpit .ea-ut-reading,body.ea-cockpit .ea-ut-updated{
  color:#93a8c6 !important;font-weight:600}
body.ea-cockpit .ea-ut-updated i{color:#4fd6c4 !important}
body.ea-cockpit .ea-ut-hero-image,body.ea-cockpit .ea-ut-hero-image img{
  border-radius:20px !important;overflow:hidden}
body.ea-cockpit .ea-ut-hero-image{
  border:1px solid rgba(255,255,255,.2);box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}

/* Alte v2.0-Bühne (Posts ohne Universal-Template) */
body.ea-cockpit .ea-hero{
  background:
    radial-gradient(1100px 520px at 78% -12%, rgba(29,127,158,.85) 0%, transparent 58%),
    linear-gradient(160deg,#0d1830 0%,#132449 52%,#0f2f4d 100%) !important;
}
body.ea-cockpit .ea-hero-title{letter-spacing:-.028em;font-weight:800}
body.ea-cockpit .ea-hero-cat{
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  color:#a9e8df;border-radius:99px;padding:6px 14px;text-transform:none;font-weight:700}
body.ea-cockpit .ea-hero-stat{
  background:rgba(255,255,255,.07) !important;border:1px solid rgba(255,255,255,.16) !important;
  border-radius:16px !important}

/* ------------------------------------------------------- 2. Inhaltsflächen */
body.ea-cockpit .ea-layout,
body.ea-cockpit .ea-ut-content-wrap{background:var(--grund) !important}

/* ★ fa-sparkles gibt es nur in Font Awesome PRO — geladen wird Free, der Kreis
   blieb deshalb leer. Ersatzzeichen aus dem Free-Satz (fa-star). */
body.ea-cockpit .fa-sparkles::before{content:"\f005" !important}
body.ea-cockpit .ea-content-card{
  background:var(--karte) !important;border:1px solid var(--rand) !important;
  border-radius:var(--r) !important;box-shadow:var(--schatten) !important;
  padding:30px 32px !important;
}
body.ea-cockpit .ea-content-card h2{
  letter-spacing:-.022em;font-weight:800;line-height:1.18;color:var(--tinte)}
body.ea-cockpit .ea-content-text{color:#3d4c66 !important;line-height:1.75 !important}

/* Icon-Kreise → Cockpit-Kacheln */
body.ea-cockpit .ea-icon-circle{
  border-radius:var(--r-klein) !important;width:42px !important;height:42px !important;
  background:var(--indigo-hell) !important;color:var(--indigo) !important;
  box-shadow:none !important}
body.ea-cockpit .ea-icon-green{background:var(--teal-hell) !important;color:var(--teal) !important}
body.ea-cockpit .ea-icon-orange{background:var(--bernstein-hell) !important;color:var(--bernstein) !important}
body.ea-cockpit .ea-icon-red{background:var(--rose-hell) !important;color:var(--rose) !important}
body.ea-cockpit .ea-icon-blue{background:var(--indigo-hell) !important;color:var(--indigo) !important}

/* Antwort-zuerst */
body.ea-cockpit .ea-answer-box{
  background:linear-gradient(180deg,#f2fbf9,#eaf7f4) !important;
  border:1px solid #bfe6df !important;border-left:4px solid var(--teal) !important;
  border-radius:var(--r-klein) !important;padding:20px 22px !important;
  box-shadow:none !important}
body.ea-cockpit .ea-answer-text{color:var(--tinte) !important;font-size:1.05rem !important;
  line-height:1.6 !important}

/* Tabellen im Beitrag */
body.ea-cockpit .ea-content-card table{
  border-collapse:collapse;width:100%;border-radius:var(--r-klein);overflow:hidden;
  border:1px solid var(--rand)}
body.ea-cockpit .ea-content-card thead th{
  background:#f7fafd !important;color:var(--grau) !important;font-size:.7rem !important;
  letter-spacing:.09em;text-transform:uppercase;font-weight:700;
  border-bottom:1px solid var(--rand) !important}
body.ea-cockpit .ea-content-card td{border-bottom:1px solid var(--rand-weich) !important}
body.ea-cockpit .ea-content-card tbody tr:hover{background:#f9fbfe}

/* Wirkstoff-Karten des GLP-1-Hubs */
body.ea-cockpit .ea-glp-drug{
  background:var(--karte) !important;border:1px solid var(--rand) !important;
  border-radius:var(--r) !important;box-shadow:var(--schatten) !important}
body.ea-cockpit .ea-glp-drug-tag{border-radius:99px !important;font-weight:800 !important;
  letter-spacing:.02em}
body.ea-cockpit .ea-glp-approved{background:var(--teal-hell) !important;color:var(--teal) !important;
  border:1px solid rgba(13,157,144,.25) !important}
body.ea-cockpit .ea-glp-pending{background:var(--bernstein-hell) !important;
  color:var(--bernstein) !important;border:1px solid rgba(221,138,28,.3) !important}
body.ea-cockpit .ea-glp-drug-stat-num{color:var(--tinte) !important;font-weight:800}
body.ea-cockpit .ea-glp-hl{color:var(--indigo) !important}

/* ------------------------------------------------------------ 3. Seitenspalte */
body.ea-cockpit .ea-sidebar-card{
  background:var(--karte) !important;border:1px solid var(--rand) !important;
  border-radius:var(--r) !important;box-shadow:var(--schatten) !important;overflow:hidden}
body.ea-cockpit .ea-sidebar-header{
  background:#f7fafd !important;border-bottom:1px solid var(--rand) !important;
  color:var(--tinte) !important}
body.ea-cockpit .ea-sidebar-title{color:var(--tinte) !important;font-weight:800;
  letter-spacing:-.015em}
body.ea-cockpit .ea-sidebar-subtitle{color:var(--grau) !important}
body.ea-cockpit .ea-sidebar-quick-item{
  background:var(--grund) !important;border:1px solid var(--rand) !important;
  border-radius:var(--r-klein) !important}
body.ea-cockpit .ea-sidebar-quick-icon{color:var(--indigo) !important}
body.ea-cockpit .ea-sidebar-quick-value{color:var(--tinte) !important;font-weight:800}
body.ea-cockpit .ea-sidebar-quick-label{color:var(--grau) !important}
body.ea-cockpit .ea-sidebar-section{border-top:1px solid var(--rand) !important}
body.ea-cockpit .ea-sidebar-section-title{color:var(--grau) !important;font-size:.72rem;
  letter-spacing:.12em;text-transform:uppercase;font-weight:800}
body.ea-cockpit .ea-sidebar-list a{color:var(--indigo) !important;font-weight:600}
body.ea-cockpit .ea-sidebar-list a:hover{color:var(--tinte) !important}
body.ea-cockpit .ea-sidebar-julia{background:var(--grund) !important;
  border:1px solid var(--rand) !important;border-radius:var(--r-klein) !important}

/* ------------------------------------------------------------------- 4. FAQ */
body.ea-cockpit .ea-faq-section{
  background:var(--grund) !important;border-top:1px solid var(--rand)}
body.ea-cockpit .ea-faq-title{color:var(--tinte) !important;letter-spacing:-.022em;font-weight:800}
body.ea-cockpit .ea-faq-item{
  background:var(--karte) !important;border:1px solid var(--rand) !important;
  border-radius:14px !important;margin-bottom:12px !important;overflow:hidden;
  box-shadow:0 1px 2px rgba(13,24,48,.04) !important}
body.ea-cockpit .ea-faq-item.active{border-color:#c5d4ec !important}
body.ea-cockpit .ea-faq-q{color:var(--tinte) !important;font-weight:700 !important;
  background:transparent !important}
body.ea-cockpit .ea-faq-icon{color:var(--indigo) !important}
body.ea-cockpit .ea-faq-a,body.ea-cockpit .ea-faq-a-inner{color:var(--grau) !important}

/* Gesundheitshinweis */
body.ea-cockpit .ea-health-disclaimer{
  background:var(--bernstein-hell) !important;border:1px solid #f0d5a8 !important;
  border-radius:var(--r-klein) !important;color:#7a4d0c !important;padding:18px 20px !important}

/* -------------------------------------------------- 5. Archiv und Kategorie */
body.ea-cockpit .page-header,
body.ea-cockpit.ea-cat-layout .page-header{
  background:
    radial-gradient(900px 400px at 80% -20%, rgba(29,127,158,.8) 0%, transparent 60%),
    linear-gradient(160deg,#0d1830 0%,#132449 60%,#0f2f4d 100%) !important;
  color:#fff !important;border-radius:0 !important;margin:0 0 34px !important;
  padding:44px 26px 48px !important;border:0 !important}
body.ea-cockpit .page-header .page-title{
  color:#fff !important;font-weight:800;letter-spacing:-.028em;
  max-width:1180px;margin:0 auto;font-size:clamp(1.8rem,1.2rem + 2vw,2.8rem)}
body.ea-cockpit .page-header .taxonomy-description,
body.ea-cockpit .page-header .taxonomy-description p{
  color:#c2d2ea !important;max-width:1180px;margin:12px auto 0}
body.ea-cockpit .page-header a{color:#8fc9e8 !important}
body.ea-cockpit .archive .site-main>article,
body.ea-cockpit .blog .site-main>article,
body.ea-cockpit .search .site-main>article{
  background:var(--karte);border:1px solid var(--rand);border-radius:var(--r);
  box-shadow:var(--schatten);overflow:hidden;margin-bottom:22px;
  transition:transform .18s,box-shadow .18s}
body.ea-cockpit .archive .site-main>article:hover,
body.ea-cockpit .blog .site-main>article:hover{
  transform:translateY(-3px);box-shadow:0 1px 2px rgba(13,24,48,.06),0 26px 46px -26px rgba(13,24,48,.5)}
body.ea-cockpit .archive .inside-article,
body.ea-cockpit .blog .inside-article{padding:26px 28px}
body.ea-cockpit .entry-title{letter-spacing:-.022em;font-weight:800;line-height:1.22}
body.ea-cockpit .entry-title a{color:var(--tinte)}
body.ea-cockpit .entry-title a:hover{color:var(--indigo)}
body.ea-cockpit .entry-meta{
  color:var(--grau);font-size:.83rem;font-weight:600}
body.ea-cockpit .entry-meta a{color:var(--grau)}
body.ea-cockpit .post-image img{border-radius:var(--r-klein)}
body.ea-cockpit .entry-summary{color:var(--grau)}
body.ea-cockpit .paging-navigation .page-numbers{
  display:inline-grid;place-items:center;min-width:42px;height:42px;border-radius:var(--r-klein);
  border:1px solid var(--rand);background:var(--karte);color:var(--grau);font-weight:700}
body.ea-cockpit .paging-navigation .page-numbers.current,
body.ea-cockpit .paging-navigation .page-numbers:hover{
  background:var(--indigo);border-color:var(--indigo);color:#fff}

/* ------------------------------------------------------------------- 6. Fuß */
body.ea-cockpit .ea-hf-prefooter{
  background:
    radial-gradient(700px 300px at 80% -30%, rgba(29,127,158,.7) 0%, transparent 60%),
    linear-gradient(160deg,#0d1830,#132449) !important;color:#fff !important;
  border:0 !important}
body.ea-cockpit .ea-hf-prefooter-btn{
  background:var(--indigo) !important;color:#fff !important;border:0 !important;
  border-radius:var(--r-klein) !important;font-weight:700 !important;
  box-shadow:0 10px 26px -10px rgba(43,75,201,.85) !important;
  transition:transform .16s,box-shadow .16s}
body.ea-cockpit .ea-hf-prefooter-btn:hover{transform:translateY(-2px)}
body.ea-cockpit .ea-hf-footer{
  background:#0d1830 !important;color:#9db0cd !important;border-top:0 !important}
body.ea-cockpit .ea-hf-footer a{color:#9db0cd !important}
body.ea-cockpit .ea-hf-footer a:hover{color:#4fd6c4 !important}
body.ea-cockpit .ea-hf-footer-col>*:first-child,
body.ea-cockpit .ea-hf-footer h3,body.ea-cockpit .ea-hf-footer h4,
body.ea-cockpit .ea-hf-footer-topics>*:first-child{color:#fff !important}
body.ea-cockpit .ea-hf-trust span,body.ea-cockpit .ea-hf-trust li{
  color:#a9e8df !important}
body.ea-cockpit .ea-hf-footer-note{
  border-top:1px solid rgba(255,255,255,.1) !important;color:#8598b5 !important}
body.ea-cockpit .ea-hf-footer-bottom{
  border-top:1px solid rgba(255,255,255,.1) !important;color:#71839f !important}
/* ★ Nicht per Filter aufhellen — die Originaldatei hat einen weißen Hintergrund
   und würde zum weißen Kasten. Stattdessen die freigestellte weiße Fassung
   einsetzen (liegt neben dieser CSS-Datei). */
body.ea-cockpit .ea-hf-footer-logo{
  display:inline-block !important;width:180px !important;height:38px !important;
  background:url('logo-weiss.png') left center / contain no-repeat !important}
body.ea-cockpit .ea-hf-footer-logo img{opacity:0 !important;filter:none !important}

/* --------------------------------------------------------- 7. Feinschliff */
/* Alt-Akzent (#2ecc71) auf die Systemfarbe ziehen */
body.ea-cockpit .ea-answer-label,
body.ea-cockpit .ea-answer-box .ea-answer-label,
body.ea-cockpit .ea-badge-green{
  background:var(--teal) !important;color:#fff !important;border-radius:99px !important;
  font-weight:800 !important;letter-spacing:.04em}
body.ea-cockpit .ea-content-text a,
body.ea-cockpit .ea-content-card a:not(.knopf):not([class*="btn"]){
  color:var(--teal) !important;text-decoration-color:rgba(13,157,144,.4)}
body.ea-cockpit .ea-content-text a:hover,
body.ea-cockpit .ea-content-card a:not(.knopf):not([class*="btn"]):hover{
  color:var(--indigo) !important}

body.ea-cockpit .site-main{background:var(--grund)}
body.ea-cockpit h1,body.ea-cockpit h2,body.ea-cockpit h3{
  font-family:'Manrope',system-ui,-apple-system,sans-serif}
body.ea-cockpit .ea-h1-tagline{
  max-width:1180px;margin:0 auto;padding:22px 26px 6px;font-size:1rem;font-weight:700;
  color:var(--grau);letter-spacing:0;line-height:1.5;background:transparent}
@media(max-width:900px){
  body.ea-cockpit .ea-ut-hero{padding:32px 22px 38px !important}
  body.ea-cockpit .ea-content-card{padding:22px 20px !important}
  body.ea-cockpit .page-header{padding:32px 18px 36px}
}

/* ═══════════════════════════════════════════════════════════════════
   FIX 28.07.2026 — unsichtbare Sidebar-Navigation auf 16 Beitraegen
   Die Beitrags-CSS stylt die Inhaltsverzeichnis- und Sidebar-Links mit
   color: rgba(255,255,255,.88) !important — passend zur FRUEHER dunklen
   Sidebar-Card. Seit dem Cockpit-Rollout ist die Card hell, die Schrift
   blieb weiss: weiss auf weiss. Betrifft u. a. Post 140, die einzige
   Top-3-Google-Position der Domain.
   ═══════════════════════════════════════════════════════════════════ */
body.ea-cockpit [class*="-toc"] a,
body.ea-cockpit [class*="-sidebar"] .ea-sidebar-section a,
body.ea-cockpit [class*="-sidebar-box"] a,
body.ea-cockpit [class*="-sidebar-links"] a{
  color:var(--indigo) !important;
  text-decoration:none;
}
body.ea-cockpit [class*="-toc"] a:hover,
body.ea-cockpit [class*="-sidebar"] .ea-sidebar-section a:hover,
body.ea-cockpit [class*="-sidebar-box"] a:hover,
body.ea-cockpit [class*="-sidebar-links"] a:hover{
  color:var(--tinte) !important;
  text-decoration:underline;
}
/* Trennlinien der Listen waren ebenfalls fuer dunklen Grund gebaut */
body.ea-cockpit [class*="-toc"] li{
  border-bottom-color:var(--rand) !important;
}
