twin-sprachwechsler {
    * {
        box-sizing: border-box;
    }

    .dbi-sprachwechsler-twin-component {
        position: relative;

        .db-sprachliste {
            position: absolute;
            left: 0;
            right: 0;
            top: 30rem;
            padding-top: 25rem;
            z-index: 1;
        }
    }

    .dbi-sprachwechsler-combobox {
        display: flex;
        flex-direction: row;
        cursor: pointer;
        padding: 5px 10px;
        border: transparent solid 2px;
        border-radius: 15px;
        align-items: center;
        z-index: 5;
        position: relative;

        .db-colored-icon {
            display: inline-block;
            background: var(--iconfarbe-header);
            mask-position: center;
            mask-repeat: no-repeat;
            -webkit-mask-position: center;
            -webkit-mask-repeat: no-repeat;
            background-size: cover;
            margin-right: 10px;
        }

        .db-sprachwechsler-label {
            font-size: 20rem;
            font-family: var(--fontfamily-regular);
        }

        span {
            align-self: center;
        }
    }

    .dbi-sprachwechsler-twin-component .dbi-menu {
        display: none;
        right: 0;
        top: 30rem;
        z-index: 3;
        border-radius: 15px;
        border: var(--rahmenfarbe) solid 2px;
        background-color: white;

        a {
            padding: 5px 10px;
            color: var(--iconfarbe-header-dropdown);
            font-size: 20rem;
            text-decoration: none;
        }

        a:last-of-type {
            -moz-border-radius-bottomleft: 15px;
            -moz-border-radius-bottomright: 15px;
            border-bottom-left-radius: 15px;
            border-bottom-right-radius: 15px;
        }

        a.db-sprachwechsler-active {
            background-color: var(--rahmenfarbe-hell);
        }

        a.db-sprachwechsler-selected {
            position: relative;
        }

        a.db-sprachwechsler-selected::after {
            border-bottom: 2px solid var(--primaere-farbe);
            border-right: 2px solid var(--primaere-farbe);
            content: '';
            height: 16px;
            position: absolute;
            right: 15px;
            top: 50%;
            transform: translate(0, -50%) rotate(45deg);
            width: 8px;
        }
    }

    .dbi-sprachwechsler-twin-component.db-open .dbi-menu {
        display: flex;
        flex-direction: column;
    }

    .dbi-sprachwechsler-twin-component.db-open .dbi-sprachwechsler-combobox,
    .dbi-sprachwechsler-combobox:hover,
    .dbi-sprachwechsler-combobox:focus-visible {
        border: var(--rahmenfarbe) solid 2px;
        background-color: var(--rahmenfarbe-hell);
        cursor: pointer;

    }

    .db-sprachwechsler-label {
        text-transform: uppercase;
        color: var(--schriftfarbe);
    }
}

.db-header-login twin-sprachwechsler {
    .dbi-sprachwechsler-combobox {
        .db-colored-icon {
            margin: 0;
        }

        .db-sprachwechsler-label {
            display: none;
        }
    }

    .db-sprachwechsler-dropdown {
        width: 200%;
        right: 0;
        left: unset;
        padding: 0;
        top: 100%;

        a:first-of-type {
            -moz-border-radius-topleft: 15px;
            -moz-border-radius-topright: 15px;
            border-top-left-radius: 15px;
            border-top-right-radius: 15px;
        }
    }
}

.db-header-klient {
    .dbi-sprachwechsler-twin-component.db-open .dbi-sprachwechsler-combobox,
    .dbi-sprachwechsler-combobox:hover,
    .dbi-sprachwechsler-combobox:focus-visible {
        background-color: white;
    }
}