:root {
    --color-brand: #ffa300;
    --color-brand-hover: #ffb434;
    --color-primary: #00158c;
    --color-body: #2d2926;
    --color-white: #ffffff;
    --color-link: var(--color-brand);
    --color-link-hover: var(--color-brand-hover);

    --card-space-x: 20px;
    --card-space-y: 20px;
    --card-divider-height: 4px;

    --focus-outline-width: 3px;
    --focus-outline-style: solid;
    --focus-outline-offset: 2px;

    --font-body: 'HelveticaNeueLTStd-Roman', system-ui, -apple-system, 'Open Sans', 'Helvetica Neue', sans-serif;
    --font-body-bold: 'HelveticaNeueLTStd-Blk', var(--font-body);
    --font-header: 'AccordAlt_Bold', var(--font-body);

    --topbar-height: 100px;
}

/* ============= */
/* == General == */
/* ============= */
*:focus:focus-visible {
    outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary);
    outline-offset: var(--focus-outline-offset);
    z-index: 1;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

iframe {
    width: 100%;
    height: auto;
/*    min-height: 650px; */
}

address {
    display: flex;
    flex-direction: column;
    font-style: normal;
    gap: 2px;
    line-height: 1.3;

    span:empty:not(.spacer) {
        display: none;
    }

    .spacer {
        display: block;
        margin-bottom: 1rem;
    }

    .highlighted_text {
        margin-bottom: 0;
        line-height: inherit;
    }

    .tel-link {
        display: block;
        width: fit-content;
        line-height: inherit;
    }

    .mail {
        display: block;
        width: fit-content;
        line-height: inherit;
        color: var(--color-brand);
        /*font-weight: 700;*/
        /*letter-spacing: 0.03rem;*/
    }

    a:hover {
            text-decoration: underline;
    }
}


/* =============== */
/* == Skip Link == */
/* =============== */
#skip {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3000;
}

.skip-link {
    padding: 0.5rem 1rem;
    background-color: var(--color-brand);
    color: var(--color-body);
    display: inline-block;
    text-align: center;
    font-family: var(--font-header), sans-serif ;
    font-size: 16px;
    margin: 0.5rem;
}

.skip-link:not(:focus) {
    position: absolute;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(100%);
    white-space: nowrap;
}


/* ================ */
/* == Overwrites == */
/* ================ */
body {
    background-image: none;
}

.header_wrapper {
    top: auto;
}

.video-js {
    height: auto;
}

[data-dce] {
    * {
        box-sizing: border-box;
    }

    ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    figure {
        margin: 0;
    }

    img {
        width: 100%;
        height: auto;
        max-width: 100%;
        max-height: 100%;
        display: block;

    }

    a:not(.btn):hover {
        text-decoration: underline;
    }

    p {
        margin-block: 0.25rem;
        line-height: 1.4;
    }

    input {
        background-color: #eae9e9;
        border: none;
        padding: 1rem .75rem;
    }

    label {
        font-family: var(--font-header), sans-serif;
        font-size: 0.875rem;
    }

    label.required::after {
        content: " *";
        color: #706f6f;
    }

    form {
        .error {
            font-size: 0.875rem;
            font-family: var(--font-body), sans-serif;
            color: red;
            line-height: 1.2;
        }

        .error:empty {
            display: none;
        }
    }

    .dottedlist {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        row-gap: 0.25rem;

        li {
            line-height: 1.1;
            background-image: none;
            background-repeat: unset;
            background-position: unset;
            list-style: unset;
            margin: 0;
            padding: 0;

            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

        li::before {
            content: '';
            background-image: url('/fileadmin/templates/images/bullet.png');
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
            margin-right: 0.4ch;
            align-self: flex-start;
            flex: 0 0 8px;
            height: 6px;
            margin-top: 6px;
        }
    }

}


#main-content {
    .dottedlist {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        padding: 0;

        li {
            line-height: 1.3;
            background-position: left calc((14px * 1.3 / 2) -  (8px / 2));
            margin: 0;
            padding: 0;
            padding-left: calc(10px + 0.8ch);
        }
    }


    .rs-downloadlist li a {
        height: auto;
    }
}

/* ========== */
/* == Card == */
/* ========== */
.card {
    padding-inline: var(--card-space-x);
    padding-block: var(--card-space-y);
    background-color: var(--color-white);
    display: flex;
    flex-direction: column;
    border-radius: 0.1em;

    .card-header {
        margin-right: calc(var(--card-space-x) * -1);
        margin-bottom: 0.5rem;
        padding-right: var(--card-space-x);
        padding-bottom: .5rem;

        .headline {
            font-family: var(--font-header), sans-serif;
            font-size: 1.875rem;
            margin: 0;
            line-height: 1.1;
            /*padding-bottom: 1rem;*/
        }
    }
    .card-img {
        img {
            object-fit: contain;
            object-position: left top;
        }
    }

    .card-body {
        display: flex;
        flex-direction: column;
        gap: 1rem;

        h1,h2,h3,h4,h5,h6 {
            margin: 0;
            margin-bottom: 0.5rem;
        }
    }

    .card-footer {}

    .card-header:empty,
    .card-body:empty,
    .card-footer:empty {
        display: none;
    }
}


/* ======================== */
/* == Card Body Elements == */
/* ======================== */
.link-list,
.download-list {

    display: flex;
    flex-direction: column;
    gap: 1rem;

    li {
        display: flex;
        flex-direction: column;

    }

    a {
        line-height: 1.4;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        color: var(--color-link);

        sub {
            align-self: end;
            line-height: 1.1;
        }

        &:hover {
            color: var(--color-link-hover);
        }
    }



    a:after {
        content: '';
        width: calc(22px + 0.75rem);
        height: 18px;
        display: inline-block;
        background-size: contain;
        background-position: center right;
        background-repeat: no-repeat;
        flex-shrink: 0;
        margin-left: auto;
    }

    .info {
        line-height: 1.4;
    }
}

.link-list {
    a:after {
        background-image: url('/fileadmin/templates/icons/arrow_right_orange.svg');
    }
}

.download-list {
    a:after {
        background-image: url('/fileadmin/templates/icons/download_orange.svg');
    }
}


/* ============ */
/* == DCE K1 == */
/* ============ */
[data-dce="k1"] {
    flex-direction: row;
    gap: 1rem;

    .serviceicon {
        background-color: #d5d4d4;
        align-self: flex-start;
        background-image: url("/fileadmin/templates/icons/hotline_white.svg");
        background-position: center;
        background-size: 40px;
        background-repeat: no-repeat;
        width: 100%;
        max-width: 60px;
        aspect-ratio: 1;
    }

    .service-card-body {
        display: flex;
        flex-direction: column;

        .service-card-headline {
            margin: 0;
			margin-top: -2px;
            font-family: var(--font-header);
            line-height: 1;
            /*order: 2;*/
        }

        .service-card-subheadline {
            /*order: 3;*/
        }

        .service-card-phone {
            margin: 0;
            /*order: 1;*/

            a {
                color: var(--color-brand);
                font-size: 30px;
                letter-spacing: -0.04rem;
                font-family: var(--font-header), sans-serif;

                margin-top: 0.25rem;
                display: inline-block;

                &:hover {
                    text-decoration: underline;
                    color: var(--color-brand-hover);
                }
            }
        }
    }
}

/* ============ */
/* == DCE K2 == */
/* ============ */
[data-dce="k2"] {
    .opening-list {
        max-width: fit-content;
        li {
            display: flex;
            gap: 1ch;
            flex-wrap: wrap;
            justify-content: space-between;
        }

        .day {
            span {
                font-weight: 700;
            }

            &:after {
                content: ':'
            }
        }

        .time {}

        span {
            line-height: 1.3;
        }
    }


    /*For offset Button*/
    padding-bottom: 0;
    margin-bottom: var(--card-space-y);
    .card-footer {
        .btn {
            transform: translate(calc(-1 * var(--card-space-x) / 2), var(--card-space-y));
            max-width: 270px;
            min-width: max-content;
        }
    }
}


/* ============ */
/* == DCE K3 == */
/* ============ */
[data-dce="k3"] {
    &:has(.card-img) {
        .card-header {
            margin-bottom: 0;
        }
    }

    .card-img {
        img {
            max-width: 265px;
        }
    }

    /*For offset Button*/
    padding-bottom: 0;
    margin-bottom: var(--card-space-y);
    .card-footer {
        .btn {
            transform: translate(calc(-1 * var(--card-space-x) / 2), var(--card-space-y));
            max-width: 270px;
            min-width: max-content;
        }
    }
}


/* ============ */
/* == DCE A8 == */
/* == DCE A10 = */
/* ============ */
[data-dce="a8"],
[data-dce="a10"]{
    .rs-downloadlist,
    .rs-linklist {
        li {
            display: flex;
            flex-direction: column;
            margin: 0;
            padding: 0;
            margin-block: 20px;
            background-image: none;

            a {
                max-width: initial;
                margin-bottom: unset;
                min-height: unset;
                line-height: 1.4;
                background-repeat: no-repeat;
                background-size: 18px 20px;
                background-position: right top;
                padding-right: 30px;
                /*background-image: none;*/
            }

            .caption {
                margin: 0;
            }

            .download-link {
                background-image: url(/fileadmin/templates/icons/download_orange.svg);
            }

            .text-link {
                background-image: url(/fileadmin/templates/icons/arrow_right_orange.svg);
            }
        }

        &:empty {
            display: none;
        }
    }
}
/* ============ */
/* == DCE D2 == */
/* ============ */
[data-dce="d2"] {
    position: relative;
    padding-bottom: 0;
    margin-bottom: var(--card-space-y);

    figure {
        img {
            margin-inline: calc(-1 * var(--card-space-x));
            max-width: unset;
            width: max-content;
        }
    }

    .card-header,
    figcaption {
        position: relative;
        z-index: 2;
    }


    .card-footer {
        margin-top: 0.5rem;
        margin-bottom: calc(-1 * var(--card-space-y));
        margin-left: calc(-1 * var(--card-space-x) / 2);
    }


    .btn-download {
        max-width: 270px;
            &:before {
                content: '';
                position: absolute;
                inset: 0;
            }
    }

}

/* ============ */
/* == DCE D3 == */
/* ============ */
[data-dce="d3"] {

    form {
        display: flex;
        flex-direction: column;
        gap: 1rem;

        .headline {
            margin: 0;
            font-size: 1.30rem;
            font-family: var(--font-header), sans-serif;
        }

        .row {
            display: flex;
            flex-direction: column;
            gap: 0.25rem;
        }

        .info {
            font-size: 0.75rem;
            font-style: italic;
        }

        .captcha-error {
            margin-block: 0.25rem;
        }
    }

    .card-img {
        margin-inline: calc(-1 * var(--card-space-x));
    }

    .card-footer {
        display: none;
        padding-top: 1rem;
    }


    /* Success message */
    .rs-content-text-wrapper {
        padding: 0 !important;
        h3 {
            margin-top: 0;
            margin-bottom: 0.5rem;
            font-size: 1.875rem;
            font-family: var(--font-header), sans-serif;
            line-height: 1.1;
        }
    }
}


/* =============== */
/* == DCE AP-A1 == */
/* =============== */
[data-dce="ap-a1"] {
    /*display: grid;*/
    /*grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));*/
    /*grid-template-columns: repeat(2, minmax(200px, 265px));*/
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    /*column-gap: 3rem;*/
    row-gap: 3rem;
    margin: 0;
    padding: 1.25rem;
    padding-top: 0;
    padding-right: 0;
}

/* =============== */
/* == PARTIAL AP-A1-Child == */
/* =============== */
[data-dce="ap-a1-child"] {
    --card-space-x: 0;
    --card-space-y: 0;
    --max-width: 265px;

    flex: 1 0 var(--max-width);


    .card-header {
        display: flex;
        flex-direction: column;
        gap: .25rem;
        margin-block: 0.5rem;
        padding: 0;
        /*letter-spacing: -0.01rem;*/

        .headline {
            font-size: .875rem;
            margin: 0;
            font-family: var(--font-body) !important;
            font-weight: 700 !important;
        }

        .subheadline {
            font-size: 0.875rem;
            font-family: var(--font-body), sans-serif !important;
            font-weight: 400 !important;
            margin: 0;
        }
    }

    .card-img {
        max-width: var(--max-width);
    }

    .card-body {
        max-width: var(--max-width);
    }

    .details-wrapper {
        display: flex;
        flex-direction: column;
        row-gap: 0.25rem;

        .label {
            font-weight: 700;
            /*margin-bottom: 0.25rem;*/
        }

        p {
            margin-block: 0;
        }
    }

    .mail {
        font-family: var(--font-body-bold);
    }

    address {
        row-gap: 0.25rem;
    }

    span {
        margin-bottom: 0;
        margin-top: 0;
    }

    &:not(:first-child) {
        border-top: 2px solid var(--color-brand);
    }

    @media (min-width: 965px) {
        &:nth-child(2) {
            border-top: none;
        }
    }
}


/* ============================= */
/* == DCE with underline == */
/* ============================= */
[data-dce="k2"],
[data-dce="k3"] {
    .card-header {
        border-bottom: var(--card-divider-height) solid var(--color-brand);
    }
}


/* ================= */
/* == tx_pteswegw == */
/* ================= */
.content-form-radio input[type='radio'] {
    display: initial;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}


/* ============ */
/* == Forms == */
/* =========== */
/*.content-form-checkbox input[type='checkbox'] {*/
/*    display: unset;*/
/*    margin-top: -60px;*/
/*}*/

.content-form-radio,
.content-form-checkbox {
    input:focus+label {
        outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary);
        outline-offset: var(--focus-outline-offset);
    }
}

/*.selectric-wrapper:focus-within {*/
/*    outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary);*/
/*    outline-offset: var(--focus-outline-offset);*/
/*}*/


/* ==========-== */
/* == Footer == */
/* ============ */
.footer {
    .footer_top_left_inner {
        a:focus-within {
            .footer_corporation_logo {
                outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary);
                outline-offset: var(--focus-outline-offset);
            }

        }
    }
}


/* ==========-== */
/* == Sidebar == */
/* ============ */
.content-right-sitebar {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    padding-bottom: 1rem;
}

.content-right-sitebar .rs-box-text {
    margin-top: 0;
}

/* ============ */
/* == Button == */
/* ============ */
.btn {
    padding: 1rem 2rem;
    font-family: var(--font-header), sans-serif;
    font-size: 16px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
    color: var(--color-body);
    border: none;
    cursor: pointer;
}

.btn-brand {
    background-color: var(--color-brand);

    &:hover {
        background-color: var(--color-brand-hover);
    }
}

.btn-download {
    padding-block: 0.25rem;
    padding-inline: 2rem;
    min-height: 50px;
    min-width: max-content;

    &:after {
        content: "";
        background-position: center;
        background-repeat: no-repeat;
        margin: .25rem;
        width: 1.15rem;
        aspect-ratio: 1;
        background-size: auto;
        background-origin: content-box;
        background-image: url('/fileadmin/templates/icons/download.svg');
    }
}

.btn-toggle-download {
    background: none;
    border: none;
    text-align: left;
    padding: 0;
    cursor: pointer;
    color: var(--color-brand);
    font-family: var(--font-body-bold), sans-serif;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-block: 0.5rem;
    font-size: 0.875rem;

    &:after {
        content: "";
        background-position: center;
        background-repeat: no-repeat;
        margin: .25rem;
        /*width: 1.15rem;*/
        flex: 0 0 1.15rem;
        display: inline-block;
        aspect-ratio: 1;
        background-size: contain;
        background-origin: content-box;
        background-image: url('/fileadmin/templates/icons/download_orange.svg');
    }

    &:hover {
        text-decoration: underline;
        color: var(--color-brand-hover);
    }
}

/* ================ */
/* == Navigation == */
/* ================ */
#menu {
    z-index: 10;
    box-shadow: 1px 1px 7px 0 rgb(0 0 0 / 20%);

    > .mm-panels {
        top: var(--topbar-height);
    }

    .mm-panel#mm-1:before {
        content: none;
    }
}


#mm-0 .mm-navbar {
    display: none;
}

#mm-1 .mm-navbar {
    all: unset;
    margin-inline: -20px;
    display: flex !important;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;

    .mm-btn {
        position: static;
    }

    .mm-title {
        position: static;
    }
}

#backdrop {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 9;
    display: none;
}


/* ==================== */
/* == Header Wrapper == */
/* ==================== */
#header_wrapper {
    box-shadow: 1px 1px 7px 0 rgb(0 0 0 / 20%);
}


/* =================== */
/* == Siegel Leiste == */
/* =================== */
.siegelleiste_container {
    display: block;
    margin-block: 3rem;
    width: 100%;

    .siegelleiste_container_row {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        align-items: center;
        gap: 1rem;

        .siegelleiste_kachel {
            all: initial;
            display: block;

            a {
                display: block;
                /*padding: 1rem;*/
                transition: transform 0.2s ease-in;
            }

            a:hover {
                transform: scale(1.07);
            }

            .active {
                user-select: none;
                pointer-events: none;
                max-height: 70px;
                display: block;
            }
        }
    }
}


/* =========================== */
/* == Firefox Browser Fixes == */
/* =========================== */

/* CSS Reset */
#top-buttons-right {
    .searchicon-standard,
    .incidents,
    .top-right-button {
        float: unset;
        margin: 0;
    }
}
/* Styling */
#top-buttons-right {
    display: flex;


    a { display: inline-block;}

    button { border: none; }

    .incidents:hover {
        background-color: var(--color-brand-hover);
    }

    .searchicon-standard:hover {
        background-color: #e9e9e9;
    }

    .searchicon-standard {
        background-color: transparent;
    }
}

.small-menu #top-area-right {
    margin-top: 15px;
}

@media (min-width: 648px) {
    #top-area-right {
        margin-top: 55px;
    }
}

/* FIX: Hide overflowed sec. Menu */
/*@media (max-width: 367px) {*/
/*    #top-area-right {*/
/*        display: none;*/
/*    }*/
/*}*/
/*END Fix*/

/* Fix: Menu close Icon disappears on mobile */
@media (min-width: 321px) and (max-width: 360px) {
    .burger_close {
        left: 10px;
    }
}

@media (max-width: 320px) {
    .burger_close {
        left: 10px;
    }
}
/*END Fix*/

/*Footer*/

.footer_top_left_inner {
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;

    a:has(.footer_corporation_logo) {
        width: fit-content;
        margin-bottom: 20px;
    }

    .footer_corporation_logo {
        position: static;
    }
}

.fancybox-zoom:focus-visible {
    outline: none;

    > div {
        outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary);
        outline-offset: var(--focus-outline-offset);
    }
}

.cm-list-input:focus:has(+ label .slider) + label .slider {
    outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary);
    outline-offset: var(--focus-outline-offset);
}

.cm-footer,
.cn-buttons {
    .cm-btn:focus {
        outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary) !important;
        outline-offset: var(--focus-outline-offset);
    }
}


a:has(.header-image-headline-button):focus-visible {
    outline: none;
}

a:has(.header-image-headline-button):focus > .header-image-headline-button {
    outline: var(--focus-outline-width) var(--focus-outline-style) var(--color-primary);
    outline-offset: var(--focus-outline-offset);
}

/* ======================= */
/* == Kachel Startseite == */
/* ======================= */
.single_content_box_small {
    overflow: initial;
}
.single_content_box_small:has(+ .dce-link-navigation-wrapper) {
    overflow: hidden;
}

/* ========== */
/* == News == */
/* ========== */
.news > h2:empty {
    display: none;
}

/* ========================= */
/* == Klaro Cookie Banner == */
/* ========================= */
.cookie-spacer {
    height: var(--cookie-height) ;
}

.klaro .cookie-notice:not(.cookie-modal-notice) {
    width: auto ;
}

.klaro.we_cookie_consent .cookie-notice:not(.cookie-modal-notice) {
    max-width: calc(100% - 60px);
    inset-inline: 50%;
    transform: translateX(-50%);

    /*@media (min-width: 768px) {*/
    /*    max-width: calc(100% - 60px - 1rem);*/
    /*}*/

    /*@media (min-width: 1400px) {*/
    /*    max-width: calc(1400px - 60px - 1rem);*/
    /*}*/
}
