/* =====================================================
   NEW-EE JOBS – Overlays und Z-Leiter (D-017)
   Letztes Stylesheet auf jeder Seite des Jobs-Hosts und der Portale.
   Ordnet alle fixierten/schwebenden Elemente den Z-Tokens zu (05 §1.7)
   und definiert die kompakte Consent-Leiste (05 §2.10, B-33).
   Keine Hex-Farben, keine Token-Definitionen. www (astro) lädt sie nicht.
   ===================================================== */

/* ── Z-Leiter: ausschließlich Token-Werte ──────────────────────── */
.ee-skip-link { z-index: var(--ee-z-skip); }
.ee-header { z-index: var(--ee-z-header); }
.ee-portal-topbar,
.cockpit-topbar { z-index: var(--ee-z-header); }
.ee-nav-login__menu { z-index: var(--ee-z-dropdown); }
.ee-portal-table th { z-index: var(--ee-z-raised); }
.ee-front .ee-job-save { z-index: var(--ee-z-raised); }
.cockpit-save-bar { z-index: var(--ee-z-sticky); }
.ee-sheet-backdrop,
.ee-front .ee-sheet-backdrop,
.ee-portal-drawer-backdrop { z-index: var(--ee-z-overlay-backdrop); }
.ee-jobs-filters-panel.sheet-open,
.ee-front .ee-jobs-filters-panel.sheet-open,
.ee-portal-drawer { z-index: var(--ee-z-overlay); }
.ee-cookie-banner { z-index: var(--ee-z-banner); }
.ee-cookie-modal { z-index: var(--ee-z-dialog); }

/* Scroll-Lock bei offenem Sheet – bisher nur < 768 px (editorial.css), gilt
   jetzt für jeden Sheet-Modus (bis 1279 px). */
body.ee-sheet-lock { overflow: hidden; }

/* ── Consent-Leiste (Markup aus assets/js/cookie-banner.js) ─────── */
/* Liegt oberhalb einer Sticky-Leiste (z. B. Bewerben-CTA der Stellenseite),
   die ihren Platz per --ee-banner-offset anmeldet. */
.ee-cookie-banner { bottom: calc(1.5rem + var(--ee-banner-offset, 0px)); }

/* Solange ein Overlay offen ist oder der Bewerbungs-Wizard läuft, bleibt die
   Leiste unsichtbar – sie darf keine Primäraktion verdecken (F-20). */
body.ee-sheet-lock .ee-cookie-banner,
body.ee-overlay-open .ee-cookie-banner,
body.ee-wizard-active .ee-cookie-banner { display: none; }

/* Fokusziele bleiben oberhalb der Leiste sichtbar (WCAG 2.4.11). */
html.ee-has-banner { scroll-padding-bottom: calc(var(--ee-banner-height, 0px) + var(--ee-banner-offset, 0px) + var(--ee-space-3)); }

/* „Einstellungen“ als Textlink im Fließtext der Leiste */
.ee-cookie-text .ee-cookie-link {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  color: var(--ee-color-brand);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.ee-cookie-text .ee-cookie-link:hover { color: var(--ee-color-action-primary-hover); }

/* Schließen-Button des Cookie-Dialogs: 44 × 44 Zielfläche (05 §2.7) */
.ee-cookie-modal-close { width: 44px; height: 44px; border-radius: var(--ee-radius-control); }
.ee-cookie-modal-header h2 { font-family: var(--ee-font-sans); font-weight: 700; letter-spacing: -0.02em; }
.ee-cookie-modal-header h2:focus { outline: none; }
.ee-cookie-modal-header h2:focus-visible { outline: 2px solid var(--ee-color-focus); outline-offset: 4px; }

/* Mobil: kompakte Leiste über die volle Breite, Buttons nebeneinander,
   Höhe ≈ 110 px statt 308 px (editorial.css stapelt drei Buttons). */
@media (max-width: 767px) {
  .ee-cookie-banner {
    bottom: var(--ee-banner-offset, 0px);
    padding: var(--ee-space-3) var(--ee-space-4) calc(var(--ee-space-3) + env(safe-area-inset-bottom));
    border-top-width: 2px;
    box-shadow: var(--ee-shadow-3);
  }
  .ee-cookie-inner { gap: var(--ee-space-2); }
  .ee-cookie-text { font-size: var(--ee-text-xs); line-height: var(--ee-leading-normal); }
  .ee-cookie-actions { flex-direction: row; gap: var(--ee-space-2); width: 100%; }
  .ee-cookie-actions .ee-btn {
    flex: 1 1 0;
    width: auto;
    min-height: var(--ee-size-control-compact);
    padding: 0 var(--ee-space-3);
    font-size: var(--ee-text-sm);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ee-cookie-banner,
  .ee-cookie-modal,
  .ee-cookie-modal-box { animation: none; }
}