/* Titillium Web – Hausschrift der QuACX GmbH (SIL Open Font License, siehe fonts/OFL.txt) */
@font-face {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('fonts/TitilliumWeb-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/TitilliumWeb-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Titillium Web';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/TitilliumWeb-Italic.ttf') format('truetype');
}

@font-face {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('fonts/TitilliumWeb-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Titillium Web';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('fonts/TitilliumWeb-Bold.ttf') format('truetype');
}

html, body {
    font-family: 'Titillium Web', 'Segoe UI', Helvetica, Arial, sans-serif;
}

/* ---------- Kopf- und Seitenleiste in dunklem Türkis ----------
   Farbwerte stammen aus der Petrol-Reihe des QuACX-Corporate-Designs:
   #1e698c (Kopfleiste), #10556f (Seitenleiste), #00afd7 (Türkis als Akzent). */

.quacx-appbar {
    /* Feine Kante, damit sich Kopf- und Seitenleiste trotz ähnlicher Farbe trennen */
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.quacx-appbar-untertitel {
    color: rgba(255, 255, 255, .65);
}

.quacx-logo {
    height: 30px;
}

/* Navigationseinträge auf dunklem Grund */
.quacx-drawer .mud-nav-link {
    color: rgba(255, 255, 255, .82);
}

.quacx-drawer .mud-nav-link .mud-icon-root {
    color: inherit;
}

.quacx-drawer .mud-nav-link:hover:not(.active) {
    background-color: rgba(255, 255, 255, .08);
    color: #ffffff;
}

/* Aktiver Eintrag: Türkis als Akzent, links abgesetzt */
.quacx-drawer .mud-nav-link.active {
    color: #ffffff;
    background-color: rgba(0, 175, 215, .22);
    box-shadow: inset 3px 0 0 0 #00afd7;
}

.quacx-drawer .mud-nav-link.active .mud-icon-root {
    color: #00afd7;
}

.quacx-drawer .mud-divider {
    border-color: rgba(255, 255, 255, .15);
}

/* Ampel-Punkt in der Wochenübersicht */
.ampel {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12);
}

.ampel-gruen { background-color: #32beb4; }
.ampel-gelb  { background-color: #faa500; }
.ampel-rot   { background-color: #d64550; }
.ampel-leer  { background-color: transparent; box-shadow: inset 0 0 0 1px #b9c5c9; }

/* Statuszeile in der Tabelle auf eine Zeile kürzen */
.status-text {
    display: block;
    max-width: 420px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Identity-Seiten (Login) nutzen Bootstrap – Grundfarben anpassen */
.btn-primary {
    background-color: #00afd7;
    border-color: #00afd7;
}

.btn-primary:hover, .btn-primary:focus {
    background-color: #1e698c;
    border-color: #1e698c;
}

a, .btn-link {
    color: #1e698c;
}

.validation-message, .text-danger {
    color: #d64550;
}