@charset "utf-8";
/* ==========================================================
   ASYS_SCREEN.CSS – stabile Dropdown-Version
   ==========================================================
   - Kein Flackern beim Menü
   - Dropdown immer über Inhalt
   - Tabellenlayout bleibt unverändert
   - Kompatibel mit alten HTML-Strukturen (z. B. <table>-Navigation)
   ========================================================== */

/* --- Basis: Tabellenlayout --- */
table.resp {
  width: 100%;
  border-collapse: collapse;
}
td, th {
  vertical-align: middle;
  text-align: center;
}

/* --- Menü-Grundlayout --- */
nav, .menu, .menuleiste, .hauptmenue {
  position: relative;
  z-index: 1000;
}

td.menu, td.menuCell, td.navItem, td#Leistungen {
  position: relative;
  z-index: 2000;
}

a, a:visited {
  text-decoration: none;
  color: inherit;
}

/* --- Dropdown-Menüs --- */
#menuLeistungen,
.dropdown,
.dropmenu,
.drop1,
nav ul li ul {
  position: absolute !important;
  z-index: 99999 !important;
  background: #fff;
  border: 1px solid #888;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25);
  min-width: 160px;
  padding: 4px 0;
  display: none;
}

/* --- Sichtbarkeit: Dropdown anzeigen bei Hover --- */
nav ul li:hover > ul,
#menuLeistungen:hover ul,
.dropdown:hover,
.dropmenu:hover,
.drop1:hover {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* --- Dropdown-Elemente --- */
nav ul li ul li,
#menuLeistungen ul li {
  list-style: none;
  background: #fff;
  border-bottom: 1px solid #ddd;
  padding: 6px 12px;
  font-size: 14px;
  text-align: left;
  white-space: nowrap;
}
nav ul li ul li:hover,
#menuLeistungen ul li:hover {
  background: #e0e0ff;
  cursor: pointer;
}

/* --- Anti-Flacker-Trick (hover bleibt stabil) --- */
nav ul li ul {
  transition: none !important;
  pointer-events: auto !important;
}
nav ul li {
  position: relative;
}

/* --- Inhalte unter Menü dürfen nicht verdecken --- */
#rcorners2,
caption,
table,
td,
.inhalt,
.maincontent,
#content,
#displayArea {
  position: relative !important;
  z-index: 0 !important;
  overflow: visible !important;
}

/* --- Tabellen dürfen Dropdown nicht abschneiden --- */
table, tr, td {
  overflow: visible !important;
  position: static !important;
  z-index: auto !important;
}

/* --- Caption darf nicht über Menü liegen --- */
caption {
  position: relative !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* --- Menü-Buttons --- */
td.menuCell a,
td.navItem a {
  display: block;
  padding: 10px 20px;
  background: blue;
  color: white;
  font-weight: bold;
  border: 1px solid #0033cc;
  border-radius: 4px;
}
td.menuCell a:hover,
td.navItem a:hover {
  background: #0000ff;
}

/* --- Allgemeine Layout-Sicherheit --- */
body {
  margin: 0;
  padding: 0;
  background-color: #cde8f3;
  font-family: Arial, sans-serif;
}

/* --- Optional: Übergang für Dropdown weicher --- */
#menuLeistungen ul {
  animation: fadeIn 0.1s ease-in;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-2px); }
  to { opacity: 1; transform: translateY(0); }
}
/* === HARTE PRIORITÄT: Dropdown über allem === */
#menuLeistungen,
nav ul li ul {
  position: absolute !important;
  z-index: 999999 !important;
}

/* === Alle Inhaltscontainer zurückstufen === */
#content,
#rcorners2,
.maincontent,
#displayArea,
#inhalt,
.content {
  position: relative !important;
  z-index: 1 !important;
}

/* === Tabellen unter Menü dürfen nichts blockieren === */
table, tr, td {
  position: static !important;
  overflow: visible !important;
  z-index: auto !important;
}

/* === Captions dürfen nicht überlagern === */
caption {
  position: relative !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* ============================================
   SEITENLAYOUT – Immer vollständig sichtbar
   ============================================ */

/* Seite an Bildschirmgröße anpassen */
html, body {
  margin: 0;
  padding: 0;
  width: 100vw;           /* volle Breite */
  height: 100vh;          /* volle Höhe */
  overflow-x: hidden;     /* keine horizontale Scrollleiste */
  overflow-y: auto;       /* vertikal nur bei echtem Bedarf */
  background-color: #cde8f3;
  font-family: Arial, sans-serif;
  box-sizing: border-box;
}

/* Hauptcontainer passt sich automatisch an */
#content,
.maincontent,
#displayArea,
#rcorners2 {
  max-width: 100%;
  height: auto;
  overflow: visible;
  margin: 0 auto;
  box-sizing: border-box;
}

/* Navigation bleibt immer oben sichtbar */
nav, .menuleiste, .hauptmenue {
  position: sticky;        /* bleibt beim Scrollen oben kleben */
  top: 0;
  z-index: 99999;          /* über allen Inhalten */
  background: #cde8f3;
  padding: 0;
  margin: 0;
}

/* Dropdown-Menü bleibt vollständig sichtbar */
#menuLeistungen,
nav ul li ul {
  position: absolute !important;
  z-index: 999999 !important;
  max-height: 90vh;        /* Dropdown nie größer als Bildschirm */
  overflow-y: auto;        /* bei Bedarf scrollbar */
}

/* Verhindert Überlappung am unteren Rand */
body::after {
  content: "";
  display: block;
  height: 10px; /* kleiner Puffer, damit nichts „abgeschnitten“ wird */
}