.sastest header { text-align: center; margin-bottom: 30px; }
.sastest header img { max-width: 100%; height: auto; }
.sastest h1 { color: #007bff; text-align: center; }
.sastest form {margin: 0 auto; }
.sastest label { font-weight: bold; margin-top: 10px; display: block; }
.sastest .input-group { display: flex; align-items: center; margin: 5px 0; } /* FC<r bC<ndige Tooltips */
.sastest .input-group input[type="number"], .input-group input[type="radio"], .input-group input[type="checkbox"] { margin-right: 5px; }

.sastest input[type="number"] { 
    padding: 8px; 
    width: 100%; 
    border: 1px solid #ccc; 
    border-radius: 5px; 
}
.sastest .radiobox { 
    margin-right: 40px;
    display: inline-block;
}

.sastest .sastest--group {
    margin-bottom: 30px; 
    width: 100%;
}

.sastest .tooltip { 
    position: relative; 
    display: inline-block; 
    cursor: pointer; 
    background-color: #007bff; 
    line-height: 1; 
    color: white;
    top: -6px;
    left: 5px;  
    border-radius: 50px;
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-weight:bold;
    text-align: center;
    opacity: 1;
} /* Angepasst fC<r BC<ndigkeit */

.sastest .tooltip:hover::after { content: attr(data-tooltip); position: absolute; background-color: #333; color: #fff; padding: 5px 10px; border-radius: 5px; bottom: 100%; left: 50%; transform: translateX(-50%); white-space: normal; width: 200px; z-index: 1; }
.sastest fieldset { border: 1px solid #ccc; padding: 10px; margin-top: 20px; border-radius: 5px; }
.sastest legend {
            font-weight: bold; 
            color: #007bff; 
            cursor: pointer; /* Klickbar machen */
            padding: 5px;
        }
.sastest legend::before { /* Symbol fC<r Aufklappen */
            content: '\25B6 \00A0'; /* Rechtes Dreieck + Leerzeichen */
            display: inline-block;
            transition: transform 0.2s ease-in-out;
        }
.sastest fieldset.open legend::before {
            transform: rotate(90deg);
        }
.sastest .fieldset-content {
            display: none; /* StandardmC$Cig eingeklappt */
            padding-top: 10px;
        }
.sastest fieldset.open .fieldset-content {
            display: block; /* Anzeigen, wenn Fieldset offen */
        }
.sastest #errorMsg { color: red; text-align: center; margin-top: 10px; display: none; }

.sastest #calculateBtn { 
    background-color: #007bff; 
    color: white; 
    padding: 12px 24px; 
    border: none; 
    border-radius: 5px; 
    cursor: pointer; 
    display: block; 
    margin: 20px auto; 
    font-size: 16px; 
    width: 100%;
}

.sastest #calculateBtn:disabled { background-color: #cccccc; cursor: not-allowed; }

.sastest #result { 
    margin: 0 auto; 
    background-color: #efefef;; 
    padding: 20px; 
    border-radius: 10px; 
    display: none; 
    text-align: left; 
}

.sastest #resultValue { 
            font-size: 1.2em; 
            margin-bottom: 10px; 
            text-align: left; 
        }
.sastest #resultText { 
            text-align: left; 
            margin-top: 10px; 
            margin-bottom: 10px; 
        }
.sastest #pdfInfoText, #furtherInfoLink { 
            font-size: 0.9em; 
            color: #333; 
            text-align: left; /* Explizit linksbC<ndig */
        }
.sastest #disclaimerTextHtml { /* CSS fC<r den Disclaimer auf der HTML-Seite */
            font-size: 0.85em; 
            color: #666; 
            margin-top: 20px; 
            text-align: left; 
        }
        
.sastest #bargraphContainer { /* Container fC<r den Bargraph */
            width: 100%; /* Volle Breite innerhalb von #result */
            margin: 20px 0; /* Oben/Unten Abstand, kein horizontaler Auto-Margin mehr */
            text-align: left; /* Stellt sicher, dass Inhalt links startet */
        }
.sastest #bargraphTrack { /* Hintergrund des Bargraphs */
            width: 100%; 
            height: 25px; 
            background: linear-gradient(to right, green, yellow, red);
            border-radius: 5px; 
            position: relative;
        }
.sastest #bargraphBar { /* Der eigentliche Balken */
            height: 180%; 
            width: 0%; /* Startet bei 0, wird per JS gesetzt */
            transition: width 0.5s ease-in-out, background-color 0.5s ease-in-out;
            border-right: 5px solid black;
            background: transparent!important;  
            position: relative;
            top: -40%;
        }

.sastest #downloadPdfBtn { 
    background-color: #28a745; 
    color: white; 
    padding: 10px 20px; 
    border: none; 
    border-radius: 5px; 
    cursor: pointer; 
    margin: 20px 20px 0; 
    font-size: 16px; 
    display: none; 
}

.sastest #appointementBtn { 
    background-color: #367bb7; 
    color: white; 
    padding: 10px 20px; 
    border: none; 
    border-radius: 5px; 
    cursor: pointer; 
    margin: 20px 20px 0; 
    font-size: 16px; 
    display: none; 
}

.sastest .button-container { text-align: center; margin-top: 20px; } 
.sastest footer { text-align: center; margin-top: 40px; padding-top: 20px; border-top: 1px solid #ccc; font-size: 0.9em; color: #555; }F