.tabGroup {
    max-width: 64em;
    margin-inline: auto;
    box-shadow: 0 0 27px 0 rgb(0 70 105 / 40%);
    border-radius: 1em;
}

.tabList {
    display: flex;
}

.tabListBtn:first-child {
    border-top-left-radius: 1em;
}

.tabListBtn:last-child {
    border-top-right-radius: 1em;
}

.tabListBtn {
    padding: 1em;
    flex: 1;
    font-size: 1em;
    border: none;
    border-bottom: 1px solid var(--primary10);
    color: var(--greyscale50);
    background: var(--greyscale80);
}


.tabListBtn[aria-selected="true"] {
    border: 1px solid var(--darkest0);
    border-bottom: none;
    color: var(--greyscale100);
    background: linear-gradient(65deg, rgba(2, 37, 55, 1) 0%, rgba(0, 70, 105, 1) 100%);
    font-weight: bold;
}

.tabListBtn[aria-selected="false"]:hover {
    cursor: pointer;
    background: var(--tertiary50);
    color: var(--primary10);
}

.tabPanels {
    display: grid;
    padding-bottom: 1em;
    border: 1px solid var(--primary10);
    border-top: none;
    border-bottom-left-radius: 1em;
    border-bottom-right-radius: 1em;
}

.tabPanel{

}

.tabPanelHeading {

}

.tabHeading {
    margin-block-start: 0.5em;
    margin-block-end: 0;
    font-size: 2em;
    color: var(--primary10);
}

.tabPanelUnderline {
    margin-block-start: 0;
    margin-block-end: 1.5em;
    margin-inline: 1em;
    height: 0.1em;
    background: var(--primary10);
}

.tabPanelContent {
    max-width: 48em;
    margin-inline: auto;
}

.tabPanelResponseError {
    font-weight: bold;
    color: var(--error50)
}

.tabPanelResponseInformation {
    font-weight: bold;
    color: var(--primary10) !important;
}

@media screen and (max-width: 66em) {
    .tabGroup {
        margin-inline: 1em;
    }
}