/* Globale Fontvererbung für alle Syncfusion-Controls */
.e-control,
.e-dropdownlist,
.e-control-wrapper,
.e-input-group,
.e-input-group input,
.e-dropdownbase,
.e-list-item {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    margin-top: 5px;
}


    /* Wrapper */
    .e-control-wrapper.e-dropdownlist.e-input-group {
        border: 1px solid #b9c5ca !important;
        border-radius: 8px !important;
        background-color: #fff !important;
        box-shadow: none !important;
        height: 58px !important;
        display: flex !important;
        align-items: center !important;
        padding: 0 !important;
        /* komplette Font- & Farbvererbung */
        color: inherit !important;
        font: inherit !important;
        font-family: inherit !important;
        font-size: inherit !important;
        font-weight: inherit !important;
    }



    /* Eingabefeld */
    .e-input-group .e-input {
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
        background: transparent !important;
        color: inherit !important;
        font: inherit !important;
        font-family: inherit !important;
        font-size: inherit !important;
        font-weight: inherit !important;
        padding: 14px 16px !important;
        height: auto !important;
        line-height: 1.4 !important;
        box-sizing: border-box !important;
    }

.e-outline.e-input-group.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled):not(.e-float-icon-left), .e-outline.e-input-group.e-input-focus.e-control-wrapper:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled):not(.e-float-icon-left), .e-outline.e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled), .e-outline.e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) {
    border-color: #b1bd15;
    box-shadow: inset 1px 1px #b1bd15, inset -1px 0 #b1bd15, inset 0 -1px #b1bd15;
}

/* Placeholder */
.e-input-group .e-input::placeholder {
    color: color-mix(in srgb, currentColor 60%, transparent) !important;
    font: inherit !important;
    font-family: inherit !important;
}

/* Fokus */
.e-control-wrapper.e-ddl.e-input-focus {
    border-color: #7ba9b8 !important;
    box-shadow: 0 0 0 2px rgba(123, 169, 184, 0.25) !important;
}

/* Pfeilcontainer */
.e-input-group-icon.e-ddl-icon {
    width: 36px !important;
    border: none !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 2px !important;
    margin-top: 1px !important; /* vertikal perfekt */
    padding: 0 !important;
    color: inherit !important;
    font: inherit !important;
    font-family: inherit !important;
}

    /* Pfeil selbst */
    .e-input-group-icon.e-ddl-icon::before {
        color: currentColor !important;
        font-size: 15px !important;
        position: relative !important;
        top: 1px !important;
    }

/* Hover */
.e-control-wrapper.e-ddl:hover {
    border-color: #7ba9b8 !important;
}

/* Dropdownpanel */
.e-dropdownbase {
    border-radius: 8px !important;
    border: 1px solid #b9c5ca !important;
    background-color: #ffffff !important;
    color: inherit !important;
    font: inherit !important;
    font-family: inherit !important;
}

    /* Listenelemente */
    .e-dropdownbase .e-list-item {
        color: inherit !important;
        font: inherit !important;
        font-family: inherit !important;
        font-size: inherit !important;
        padding: 10px 1px !important;
    }

        /* Hover & aktiv */
        .e-dropdownbase .e-list-item.e-item-focus,
        .e-dropdownbase .e-list-item.e-active {
            background-color: #e8f1f3 !important;
            color: inherit !important;
        }


/* --- Disabled-Optik für SfDropDownList --- */
.e-control-wrapper.e-dropdownlist.e-disabled,
.e-control-wrapper.e-dropdownlist.e-disabled .e-input,
.e-control-wrapper.e-dropdownlist.e-disabled .e-input-group-icon {
    background-color: #f8f9fa !important; /* heller, wie dein Select */
    border-color: #d1d5d8 !important; /* feiner Rahmen */
    color: #9aa4ab !important; /* heller Text */
    cursor: not-allowed !important;
    opacity: 1 !important; /* verhindert das Ausgrauen */
}

    /* Textfarbe und Pfeil */
    .e-control-wrapper.e-dropdownlist.e-disabled .e-input::placeholder,
    .e-control-wrapper.e-dropdownlist.e-disabled .e-input,
    .e-control-wrapper.e-dropdownlist.e-disabled .e-input-group-icon::before {
        color: #9aa4ab !important;
    }

    /* Hover unterbinden */
    .e-control-wrapper.e-dropdownlist.e-disabled:hover {
        border-color: #d1d5d8 !important;
        background-color: #f8f9fa !important;
    }

span.e-control-wrapper.e-dropdownlist.e-disabled,
span.e-ddl.e-control-wrapper.e-disabled {
    opacity: 0.2 !important;
    background: #fff !important;
}

.e-input-group.e-control-wrapper.e-disabled.datepicker-dob {
    background: #fff !important;
    opacity: 0.2 !important;
}

.datepicker-dob.e-disabled {
    background: #fff !important;
    opacity: 0.2 !important;
}

.e-input-group.e-control-wrapper {
    position: relative;
    border: 1px solid #f0f0f0;
    border-radius: 5px; /* normale Abrundung */
    margin-bottom: 20px;
}



    /* Fokus-Layer */
    .e-input-group.e-control-wrapper:focus-within::after {
        content: "";
        position: absolute;
        inset: -7px; /* 4 px Abstand außen */
        border: 3px solid var(--focus-outline-color); /* Fokusfarbe */
        border-radius: 10px; /* Radius für den Fokusrahmen */
        pointer-events: none; /* blockiert keine Klicks */
        /* box-shadow: 0 0 6px rgba(26, 115, 232, .3);*/ /* optional Glow */
    }






/*FONTSIZE*/





body {
    font-size: 2.2rem;
}

p {
    font-size: 2.2rem;
}

/*SYncfusionSelect*/
.e-input-group.e-control-wrapper {
    font-size: 2.2rem !important;
}

/*Standardinput Field*/
.field__text,
.field__textarea {
    font-size: 2.2rem;
}

.speech-bubble {
    font-size: 2.2rem;
}

.button {
    font-size: 1.8rem;
}

.field__label {
    font-size: 1.8rem;
}

.header .language-select {
    font-size: 2.2rem;
}

.change-link {
    font-size: 1.8rem;
}

.text-standard {
    font-size: 2.2rem;
}

.checkbox-label-alt {
    font-size: 1.8rem;
}

.e-datepicker {
    font-size: 1.8rem !important;
}

.notification {
    font-size: 1.8rem;
}

.text-small {
    font-size: 1.6rem;
}


@media (max-width: 580px) {
    /*SYncfusionSelect*/
    .e-input-group.e-control-wrapper {
        font-size: 1.8rem !important;
    }

    /*Standardinput Field*/
    .field__text,
    .field__textarea {
        font-size: 2.2rem;
    }

    p {
        font-size: 1.8rem;
    }

    body {
        font-size: 1.8rem;
    }

    .speech-bubble {
        font-size: 1.8rem;
    }

    .button {
        font-size: 1.6rem;
    }

    .field__label {
        font-size: 1.6rem;
    }

    .header .language-select {
        font-size: 1.8rem;
    }

    .change-link {
        font-size: 1.6rem;
    }

    .text-standard {
        font-size: 1.8rem;
    }

    .checkbox-label-alt {
        font-size: 1.8rem;
    }

    .e-datepicker {
        font-size: 1.8rem !important;
    }

    .notification {
        font-size: 1.6rem;
    }

    .text-small {
        font-size: 1.6rem;
    }
}