.ContainerConsentText {
    background: #fbf9f9;
    padding: 5px;
    margin-bottom:10px;

}

.ContianerConsentRedOutLine {
    border-top: 1px solid #dc3545;
    border-bottom: 1px solid #dc3545;
}

/* hide the real inputs */
.consent-toggle input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* base pill style */
.consent-toggle label {
    display: inline-block;
    cursor: pointer;
    padding: 0.4em 1em;
    margin-right: 0.5em;
    border: 1px solid #cbd5e0; /* gray-300 */
    border-radius: 9999px;
    background: #fff;
    color: #374151; /* gray-700 */
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}

/* GREEN when “true” is checked */
.consent-toggle input[type="radio"][value="true"]:checked + label {
    background-color: #d1fae5; /* green-100 */
    border-color: #10b981; /* green-500 */
    border-width: 4px;
    color: black !important;
    font-weight: 600;
}

/* RED when “false” is checked */
.consent-toggle input[type="radio"][value="false"]:checked + label {
    background-color: #fee2e2; /* red-100 */
    border-color: #ef4444; /* red-500 */
    border-width: 4px;
    color: black!important; 
    font-weight: 600;
}

/* optional focus/hover tweaks */
.consent-toggle label:hover {
    filter: brightness(0.97);
}

.consent-toggle input[type="radio"]:focus + label {
    box-shadow: 0 0 0 2px rgba(244, 63, 94, 0.5); /* pinkish-red focus */
}
/* When “Ja” is active */
.btn-outline-success.active {
    background-color: #d1fae5 !important; /* green-100 */
    border-color: #10b981 !important; /* green-500 */
    color: #065f46 !important; /* green-800 */
    border-radius: 2em;
}

/* When “Nei” is active */
.btn-outline-secondary.active {
    background-color: #fee2e2 !important; /* red-100 */
    border-color: #ef4444 !important; /* red-500 */
    color: #b91c1c !important; /* red-700 */
}

/* Validation error message style */
.field-validation-error {
    color: #dc3545; /* bootstrap’s $red */
    display: block;
    margin-top: 0.25rem;
}