/***
****  Bitte immer zuerst mit Ctrl + F nach der gewünschten Klasse suchen, bevor eine neue Klasse erstellt wird.
****  Die Klasse muss immer mit tsz- beginnen, damit es nicht zu Konflikten mit anderen Klassen kommt.
***/

html, body {
    font-family: Verdana, Helvetica, Arial, sans-serif !important;
    font-size: 16px; 
}

/*Heading / Überschriften*/

h1 {
    font-size: 24px;
}

/*Heading / Überschriften -ende*/


/*Link / a */

a {
    text-decoration: none !important;
}

.tsz-link-fett a {
    font-weight: bold;
}

/*Link / a -ende */


/*Table / Tabelle*/

table.mud-table-root, td {
    white-space: nowrap;
}

/*    table.mud-table-root, td[data-label="Kommentar"] {
        white-space: normal;
    }*/


/*Table / Tabelle -ende*/



/* font-size / Schriftgrößen */

.tsz-fs-10 {
    font-size: 10px;
}

/* font-size / Schriftgrößen -ende */

/*width / länge*/

.tsz-w-200px {
    width: 200px;
}

.tsz-w-100px {
    width: 100px;
}

.tsz-w-90px {
    width: 90px;
}

.tsz-minw-100px {
    min-width: 100px;
}

.tsz-mitarbeiter-bild-upload .mud-button-root {
    min-width: 100px; /* Mindestbreite */
}

/*width / länge*/

/* margin*/

.tsz-mt-6 {
    margin-top: 4.5rem;
}

.tsz-mt-7 {
    margin-top: 4.5rem;
}

.tsz-mt-8 {
    margin-top: 6rem;
}

.tsz-mt-9 {
    margin-top: 7.5rem;
}

.tsz-mt-10 {
    margin-top: 9rem;
}

@media (min-width: 575px) {
    .tsz-mt-sm-6 {
        margin-top: 4.5rem;
    }

    .tsz-mt-sm-7 {
        margin-top: 4.5rem;
    }

    .tsz-mt-sm-8 {
        margin-top: 6rem;
    }

    .tsz-mt-sm-9 {
        margin-top: 7.5rem;
    }

    .tsz-mt-sm-10 {
        margin-top: 9rem;
    }
}
/* margin*/



/*Disabled / Deaktiviert*/

.tsz-disabled {
    pointer-events: none;
    opacity: 0.6;
}

/*Disabled / Deaktiviert -ende*/


/*Overflow / Scrollbar */

.tsz-overflow-x-hidden {
    overflow-x: hidden !important;
}

/*Overflow / Scrollbar -ende*/


/*Background-Blur*/

.tsz-dialog-bg-blur {
    backdrop-filter: blur(10px);
}

/*Background-Blur -ende*/


.tsz-container {
    display: flex !important;
    flex-direction: column !important;
    height: calc(100vh - var(--mud-appbar-height)) !important; /* Die gesamte Höhe des Displays - MudAppBar einnehmen */
    gap: 0.5rem;
    padding: 0.5rem 0.65rem;
}

.tsz-form-container {
    width: max-content;
    max-height: max-content;
    overflow-y: auto;
    overflow-x: hidden;
}

.tsz-auto-größe {
    flex: 0 !important; /* Die Höhe, Breite wird vom Inhalt bestimmt */
}

.tsz-platz-auffüllen {
    flex: 1 !important; /* Die restliche verfügbare Höhe, Breite des im Eltern-Element wird genutzt*/
}

.tsz-VertikaleScrollbar {
    overflow-y: auto; /* Nur vertikales Scrollen */
    overflow-x: hidden; /* Horizontales Scrollen unterdrücken */
}

.tsz-AutomatischeScrollbar
{
    overflow:auto;
}


/*Styles die greifen wenn wir im Printmodus sind (ctrl + P)*/
@media print {

    @page {
        size: landscape;
    }

    body {
        position: relative;
        visibility: hidden !important;
    }

    div.mud-main-content {
        position: unset !important;
    }

    .tsz-print-container {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
    }

    .tsz-print-container, tsz-print-container * {
        visibility: visible !important;
        transform: scale(0.85);
        transform-origin: 0 0;
        -webkit-print-color-adjust: exact !important; /* Chrome, Safari */
        color-adjust: exact !important; /*Firefox*/
    }

    .tsz-spalte {
        max-width: 200px;
    }
}



/*Tagessummen*/
.tsz-tagesummen-text img.mud-image {
    opacity: 0.5;
}

.tsz-tagesummen-text-dunkel td {
    color: black !important;
}

.tsz-tagesummen-text-hell td {
    color: white !important;
}

.tsz-tagesummen-text-zukunft-dunkel td {
    color: gray !important;
}

.tsz-tagesummen-text-zukunft-hell td {
    color: darkgray !important;
}

.tsz-tagesummen-text-heute td {
    font-weight: bold !important;
}

/*Tagessummen ende*/

.tsz-DropDownBreiteBegrenzen {
    width: 150px; /* Feste Breite */
    white-space: nowrap; /* Kein Zeilenumbruch */
    text-overflow: ellipsis; /* Text mit ... abschneiden */
}

.tsz-WT-Uhr {
    display: inline-block;
    font-size: 40px;
}
.tsz-WT-Datum {
    font-size: 1.25rem;
    margin-bottom: 0rem;
}
.tsz-WT-Status {
    font-size: 1.25rem;
}



.tsz-webterminal-container {
    max-width: 700px;
}

.tsz-divider {
    position: relative;
    width: 100%;
    height: 1px; /* Adjust the height to your preference */
    background-color: black; /* Color of the line */
    opacity: 0.4;
}

    .tsz-divider::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 1px; /* Same height as the main divider */
        background-color: black; /* Color of the after element */
    }

.tsz-expandpanels-container .my-panels .mud-expand-panel .mud-expand-panel-header {
    padding: 0px !important;
}



.tsz-TabelleMitFixiertemHeader {
    height: -webkit-fill-available; /* Höhe des sichtbaren Bereichs */
    overflow-y: auto; /* Vertikales Scrollen ermöglichen */
}

/* Standardfilter */
.tsz-filter-container {
    width: 250px;
}


thead {
    position: sticky;
    top: 0;
    background-color: white; /* Hintergrund der fixierten Überschrift */
    z-index: 1; /* Damit die Überschrift über dem Inhalt bleibt */
}

.tsz-spalte .mud-typography-body1
{
    font-size: revert;
}

.tsz-GridGruppierungsElement {
    font-weight: bold;
}

.mud-datagrid-group-button
{
    padding-top: 0;
    padding-bottom: 0;
}

.tsz-multiselect-popover {
    background-color: lightgrey;
}

.tsz-tagessumme-row:hover {
    filter: brightness(.92);
}

.tsz-text-grey {
    color: darkgray;
}

.tsz-text-vertikal-zentriert{
    margin-top: auto;
    margin-bottom:auto;
}

.tsz-inaktiver-datensatz {
    text-decoration: line-through;
    font-style:italic;
}

.tsz-required label::after {
    content: "*";
}