:root {
    --mdc-theme-primary: rgb(38, 61, 76);
    --mdc-theme-surface-tint: rgb(63, 95, 144);
    --mdc-theme-on-primary: rgb(255, 255, 255);
    --mdc-theme-primary-container: rgb(86, 117, 168);
    --mdc-theme-on-primary-container: rgb(255, 255, 255);
    --mdc-theme-secondary: rgb(58, 67, 84);
    --mdc-theme-on-secondary: rgb(255, 255, 255);
    --mdc-theme-secondary-container: rgb(107, 117, 136);
    --mdc-theme-on-secondary-container: rgb(255, 255, 255);
    --mdc-theme-tertiary: rgb(96, 58, 0);
    --mdc-theme-on-tertiary: rgb(255, 255, 255);
    --mdc-theme-tertiary-container: rgb(156, 106, 41);
    --mdc-theme-on-tertiary-container: rgb(255, 255, 255);
    --mdc-theme-error: rgb(140, 0, 9);
    --mdc-theme-on-error: rgb(255, 255, 255);
    --mdc-theme-error-container: rgb(218, 52, 46);
    --mdc-theme-on-error-container: rgb(255, 255, 255);
    --mdc-theme-background: rgb(249, 249, 255);
    --mdc-theme-on-background: rgb(25, 28, 32);
    --mdc-theme-surface: rgb(249, 249, 255);
    --mdc-theme-on-surface: rgb(25, 28, 32);
    --mdc-theme-surface-variant: rgb(224, 226, 236);
    --mdc-theme-on-surface-variant: rgb(63, 67, 74);
    --mdc-theme-outline: rgb(92, 95, 103);
    --mdc-theme-outline-variant: rgb(120, 123, 131);
    --mdc-theme-shadow: rgb(0, 0, 0);
    --mdc-theme-scrim: rgb(0, 0, 0);
    --mdc-theme-inverse-surface: rgb(46, 48, 53);
    --mdc-theme-inverse-on-surface: rgb(240, 240, 247);
    --mdc-theme-inverse-primary: rgb(168, 200, 255);
    --mdc-theme-primary-fixed: rgb(86, 117, 168);
    --mdc-theme-on-primary-fixed: rgb(255, 255, 255);
    --mdc-theme-primary-fixed-dim: rgb(60, 93, 142);
    --mdc-theme-on-primary-fixed-variant: rgb(255, 255, 255);
    --mdc-theme-secondary-fixed: rgb(107, 117, 136);
    --mdc-theme-on-secondary-fixed: rgb(255, 255, 255);
    --mdc-theme-secondary-fixed-dim: rgb(83, 92, 110);
    --mdc-theme-on-secondary-fixed-variant: rgb(255, 255, 255);
    --mdc-theme-tertiary-fixed: rgb(156, 106, 41);
    --mdc-theme-on-tertiary-fixed: rgb(255, 255, 255);
    --mdc-theme-tertiary-fixed-dim: rgb(128, 82, 17);
    --mdc-theme-on-tertiary-fixed-variant: rgb(255, 255, 255);
    --mdc-theme-surface-dim: rgb(217, 217, 224);
    --mdc-theme-surface-bright: rgb(249, 249, 255);
    --mdc-theme-surface-container-lowest: rgb(255, 255, 255);
    --mdc-theme-surface-container-low: rgb(243, 243, 250);
    --mdc-theme-surface-container: rgb(237, 237, 244);
    --mdc-theme-surface-container-high: rgb(231, 232, 238);
    --mdc-theme-surface-container-highest: rgb(225, 226, 233);
    --mdc-veersuch: rgb(27,131,242);
  }
  
  .mdc-text-field .mdc-floating-label,
  .mdc-select .mdc-floating-label {
    color: var(--mdc-floating-label-color) !important; /* Verwendet die definierte Farbe aus :root */
  }
  
  /* Farbe auf Rot ändern, wenn der Fehlerzustand aktiv ist */
  .mdc-text-field.mdc-text-field--invalid .mdc-floating-label,
  .mdc-select.mdc-select--invalid .mdc-floating-label {
    color: var(--mdc-theme-error) !important; /* Setzt die Farbe bei einem Fehler auf Rot */
  }
  
  
  .mdc-text-field__input {
    border: var(--mdc-input-border-color) !important; /* Verwendet die definierte Grenze aus :root */
    background: transparent !important;
    box-shadow: none !important;
    padding: 10px 0 !important; /* Beibehaltung des Material Design Stylings */
  }
  
  
  /* Entferne horizontale Linien und Rahmen */
  table.dataTable thead th,
  table.dataTable tfoot th,
  table.dataTable tbody td {
      border: none !important; /* Entferne alle Rahmen mit !important */
  }

  /* Für Sicherheit: Entferne auch Rahmen an der Tabelle selbst */
  table.dataTable {
      border-left: none !important; /* Entferne linken Rand der gesamten Tabelle */
  }
  
  /* Allgemeine Tabellen-Einstellungen */
  table.dataTable {
      width: 100%;
      border-collapse: collapse; /* Sicherstellen, dass die Zellen zusammengeklappt sind */
      border-left: none !important; /* Entfernt den linken Rand der gesamten Tabelle */
      border-bottom: 1px solid #ccc; /* Optional: Beibehaltung eines unteren Randes */
      font-family: 'Arial', sans-serif; /* Moderne Schriftart */
      box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Schatten für moderneren Look */
  }
  
  
  
  /* Zeilen des Tabellenkörpers als klickbar anzeigen */
  table.dataTable tbody tr {
      cursor: pointer; /* Mauszeiger wird zu einem klickbaren Symbol */
      transition: background-color 0.3s ease; /* Sanfter Übergang bei Hover */
  }
  
  
  .dataTables_filter label {
      display: flex;
      align-items: center; /* Vertikale Zentrierung des Labels und des Eingabefelds */
      margin: 0; /* Entfernt eventuelle Standardabstände */
  }
  
  .mdc-layout-grid__inner.top2 {
      display: flex;
      justify-content: space-between; /* Links- und Rechtsbündigkeit */
  }
  
  .mdc-layout-grid__cell.dt-buttons {
      display: flex;
      justify-content: flex-end; /* Buttons rechtsbündig */
      align-items: center; /* Vertikale Zentrierung */
      gap: 8px; /* Abstand zwischen den Buttons */
      flex-wrap: wrap; /* Umbrechen, wenn Platz nicht reicht */
  }
  
  .mdc-card.top {
      padding: 8px;
      margin-bottom: 8px; /* Abstand nach unten */
  }
  
  .dt-buttons .mdc-button i.material-icons {
      vertical-align: middle; /* Icons vertikal zentrieren */
  }
  
  
  
  /* Full-page black overlay */
  #black-overlay {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black */
      z-index: 9995;
      display: none; /* Initially hidden */
  }
  
       /* Modal styling */
       .mdc-dialog {
          display: none;
         position: fixed;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
         z-index: 9999; /* Sits above the overlay */
         padding: 0px;
         border-radius: 0px;
  
  
     } 
  
  
  .dialog-container {
      display: none;
      pointer-events: none; /* Ermöglicht das Klick-durchlassen */
  
  
  }
  
  /* Snackbar styling */
  .mdc-snackbar {
      z-index: 10001; /* Set high z-index to keep above overlay */
      }
  
  /* Styling für den Snackbar-Container */
  .mdc-snackbar--open {
      position: fixed; /* Fixiert im Fenster */
      bottom: 16px; /* Abstand vom unteren Rand */
      left: 50%; /* Zentriert horizontal */
      transform: translateX(-50%); /* Exakte Zentrierung */
      z-index: 9999; /* Über allen anderen Elementen */
      pointer-events: none; /* Keine Blockade von darunterliegenden Elementen */
  }
  
  /* Fehlerstil für Snackbar */
  .mdc-snackbar--error .mdc-snackbar__surface {
      background-color: #d32f2f; /* Rot für Fehler */
      color: #ffffff; /* Weißer Text */
  }
  
  .media-router .media-menu-item {
      color: inherit !important; /* Stellt sicher, dass die Schriftfarbe sichtbar ist */
      opacity: 1 !important; /* Setzt die Transparenz auf 100% */
  }
  
  .mdc-button:hover {
    color: #1e83f3;
  }
  
  


/* Standardfarbe für die Links */
.menu-link,
.mdc-list-item__text {
    color: rgb(34, 34, 34); /* Initiale Farbe */
    text-decoration: none; /* Keine Unterstreichung */
    transition: none !important; /* Keine Übergänge */
}

/* Hover- und Fokus-Zustand für Links (Unterstreichung entfernen) */
.menu-link:hover,
.mdc-list-item__text:hover,
.menu-link:focus,
.sub-menu .menu-link:hover,
.sub-menu .menu-link:focus,
.mdc-list-item__text:focus {
    color: rgb(27, 131, 242); /* Blau, wenn der Link überfahren oder fokussiert wird */
    text-decoration: none; /* Keine Unterstreichung beim Hover */
    transition: none !important; /* Keine Übergänge */

}

/* Markiere nur den aktuellen Menüpunkt (nicht die übergeordneten) */
.menu-item.current-menu-item > .menu-link {
    color: rgb(27, 131, 242); /* Blau für den aktiven Punkt */
}

/* Übergeordnete Menüpunkte behalten ihre Standardfarbe */
.menu-item.current-menu-ancestor > .menu-link,
.menu-item.current-menu-parent > .menu-link {
    color: rgb(34, 34, 34); /* Standardfarbe für übergeordnete Menüpunkte */
}

/* Optional: Hover- und Fokus-Zustand für Links */
.menu-link:hover,
.menu-link:focus {
    color: rgb(27, 131, 242); /* Blau bei Hover/Fokus */
    text-decoration: none; /* Keine Unterstreichung */
}

/* Sub-Menüpunkte in der Dropdown-Liste */
.sub-menu .menu-item.current-menu-item > .menu-link {
    color: rgb(27, 131, 242); /* Blau für aktiven Sub-Menüpunkt */
}

/* Standard-Styling für nicht-aktive Sub-Menüpunkte */
.sub-menu .menu-link {
    color: rgb(34, 34, 34); /* Standardfarbe für Sub-Menüpunkte */
}

/* Remove arrows from parent menu */
.menu-link .ast-icon.icon-arrow,
.menu-link .ast-arrow-svg {
    display: none; /* Hide arrow icons */
}

/* Remove arrows from sub-menu */
.sub-menu .ast-icon.icon-arrow,
.sub-menu .ast-arrow-svg {
    display: none; /* Hide arrow icons in sub-menu */
}






div.dt-button-collection {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    margin-top: 3px;
    margin-bottom: 3px;
    padding: .75em 0;
    border: 1px solid rgba(0, 0, 0, 0.4);
    background-color: white;
    overflow: hidden;
    z-index: 2002;
    border-radius: 5px;
    box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
  }
  
  div.dt-button-collection .dt-button {
    display: block;
    width: 100%;
   text-align: left;
  }
  
  div.dt-button-background {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2001;
  }


  @media (min-width: 993px) {
    .ast-left-sidebar #secondary {
        padding-right: 20px !important;
    }
}

@media (min-width: 993px) {
    .ast-left-sidebar #primary {
        padding-left: 20px !important;
    }
}


/* Ensure all headers and cells in all DataTables are left-aligned */
table.dataTable th,
table.dataTable td {
    text-align: left !important;
}


/* Style for hover and focus of checkbox*/
.mdc-checkbox.mdc-checkbox--touch:hover,
.mdc-checkbox.mdc-checkbox--touch:focus-within {
    outline-offset: 4px;       /* Space around the checkbox */
    border-radius: 4px;        /* Smooth rounded edges for focus */
    background-color:rgba(0, 0, 0, 0.2);
}






.autocomplete-wrapper {
    position: relative;
    display: inline-block; /* Prevent full-width stretching */
}

.autocomplete-dropdown {
    position: absolute; /* Makes the dropdown overlay instead of affecting layout */
    left: 0;
    z-index: 1000; /* Ensures it appears above other elements */
    max-height: 150px;
    background-color: #fff;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow-y: auto;
    width: 300%; /* Matches the input field width */
    box-sizing: border-box; /* Includes padding and border in width calculation */
}

.dropdown-item {
    cursor: pointer;
    padding: 2px;
}

.dropdown-item:hover,
.dropdown-item.active {
    background-color: #f0f0f0;
}


.dt-scroll {
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.14); /* MDC Card shadow */
}




@media print {
    table {
        width: 100%;
        border-collapse: collapse;
    }
    
    thead {
        display: table-header-group;
    }

    tr {
        page-break-inside: avoid;
    }

    tbody {
        display: table-row-group;
    }

    td, th {
        word-break: break-word;
        max-width: 100px; /* Adjust based on your needs */
    }

    /* Force new page when table exceeds page height */
    .page-break {
        page-break-before: always;
        display: block;
        height: 0;
        visibility: hidden;
    }
}