/** tabs */
.content .tab-container {}
.content .tab-container .tabs { margin: 0; padding: 0; }
.content .tab-container .tabs .tab-link { background: none; display: inline-block; color: #222; cursor: pointer; padding: 10px 15px; }
.content .tab-container .tabs .tab-link.current { background: #ededed; color: #222; }
.content .tab-container .tab-content {}
.content .tab-container .tab-item { display: none; background: #ededed; margin: 0; padding: 15px; }
.content .tab-container .tab-item.current { display: inherit; }

/** tabs mit radio-Buttons */
.content .tab-container-subpages { max-width: 100%; position: relative; }
.content .tab-container-subpages > input {
    display: block; /* "enable" hidden elements in IE/edge */
    position: absolute; /* then hide them off-screen */
    left: -100%;
}
.content .tab-container-subpages .tab-header { text-align: center; width: 100%; }
.content .tab-container-subpages .tab-header--item { border: 2px transparent solid; border-radius: 25px; color: #ededed; cursor: pointer; display: inline-block; margin: 0 5px 5px; padding: 0; transition: all 300ms ease-out; }
.content .tab-container-subpages .tab-header--item .label { cursor: inherit; display: block; font-weight: 700; padding: 10px; text-align: center; }
.content .tab-container-subpages .tab-input:checked:nth-of-type(1) ~ .tab-header .tab-header--item:nth-of-type(1),
.content .tab-container-subpages .tab-input:checked:nth-of-type(2) ~ .tab-header .tab-header--item:nth-of-type(2),
.content .tab-container-subpages .tab-input:checked:nth-of-type(3) ~ .tab-header .tab-header--item:nth-of-type(3),
.content .tab-container-subpages .tab-input:checked:nth-of-type(4) ~ .tab-header .tab-header--item:nth-of-type(4),
.content .tab-container-subpages .tab-input:checked:nth-of-type(5) ~ .tab-header .tab-header--item:nth-of-type(5),
.content .tab-container-subpages .tab-input:checked:nth-of-type(6) ~ .tab-header .tab-header--item:nth-of-type(6),
.content .tab-container-subpages .tab-input:checked:nth-of-type(7) ~ .tab-header .tab-header--item:nth-of-type(7),
.content .tab-container-subpages .tab-input:checked:nth-of-type(8) ~ .tab-header .tab-header--item:nth-of-type(8),
.content .tab-container-subpages .tab-input:checked:nth-of-type(9) ~ .tab-header .tab-header--item:nth-of-type(9) { color: #222; cursor: default; padding-bottom: 1px; transition: all 500ms ease-out; }

.content .tab-container-subpages .tab-content {}
.content .tab-container-subpages .tab-content .tab-content--item { opacity: 0; width: 100%; position: absolute; left: 0; z-index: -1; transform: translateY(-5px); }
.content .tab-container-subpages .tab-input:checked:nth-of-type(1) ~ .tab-content .tab-content--item:nth-of-type(1),
.content .tab-container-subpages .tab-input:checked:nth-of-type(2) ~ .tab-content .tab-content--item:nth-of-type(2),
.content .tab-container-subpages .tab-input:checked:nth-of-type(3) ~ .tab-content .tab-content--item:nth-of-type(3),
.content .tab-container-subpages .tab-input:checked:nth-of-type(4) ~ .tab-content .tab-content--item:nth-of-type(4),
.content .tab-container-subpages .tab-input:checked:nth-of-type(5) ~ .tab-content .tab-content--item:nth-of-type(5),
.content .tab-container-subpages .tab-input:checked:nth-of-type(6) ~ .tab-content .tab-content--item:nth-of-type(6),
.content .tab-container-subpages .tab-input:checked:nth-of-type(7) ~ .tab-content .tab-content--item:nth-of-type(7),
.content .tab-container-subpages .tab-input:checked:nth-of-type(8) ~ .tab-content .tab-content--item:nth-of-type(8),
.content .tab-container-subpages .tab-input:checked:nth-of-type(9) ~ .tab-content .tab-content--item:nth-of-type(9) { opacity: 1; position: relative; top: 0; z-index: 100; transform: translateY(0); transition: .5s opacity ease-in, .8s transform ease; }


.container--tabs button{
    padding: 15px;
    background-color: #fff;
    text-align: center;
    margin-bottom: 30px;
    border: 1px solid #ccdbde;
    cursor: pointer;
}

.container--tabs li:not(:first-child) button{
    border-left: none;
}

.container--tabs li::before{
    content: none !important;
}

.container--tabs li{
    padding: 0 !important;
    margin: 0 !important;
}

.container--tabs ul{
    display: flex;
    flex-direction: row;
}

.frame-type-container--tabs .frame{
    padding-inline: 0 !important;
}

.container--tabs button[aria-selected="true"]{
    background: var(--color-sherpa-blue-10);
    font-weight: 600;
}

.frame:has(.container--tabs){
    margin-bottom: 50px;
}