.pepperi-mui-tabs .MuiTabs-scroller {
    min-height: 3.5rem;
}

.pepperi-mui-tabs .MuiTabs-indicator {
    display: none;
}

.pepperi-mui-tabs .MuiTabs-flexContainer {
    min-height: 3.5rem;
    justify-content: flex-start;
    width: inherit;
}

.pepperi-mui-tabs .MuiTab-root {
    flex: 1 1 0;
    max-width: none;
    min-width: unset;
    padding: 0 1rem;
    text-transform: none;
    letter-spacing: normal;
}


.pepperi-mui-tabs .MuiTab-root.Mui-selected {
    background-color: hsla(var(--pep-color-weak-h, 0), var(--pep-color-weak-s, 0%), var(--pep-color-weak-l, 10%), .08);
    font-weight: bold;
    color: hsla(var(--pep-color-system-primary-h, 0), var(--pep-color-system-primary-s, 0%)0%, var(--pep-color-system-primary-l, 10%), .7);
}

.pepperi-mui-tabs .MuiTab-root:focus {
    background-color: var(--pep-color-system-primary-invert-base, white);
    box-shadow: var(--pep-shadow-xs-offset, 0 0.125rem 0.25rem 0) hsla(var(--pep-color-system-primary-h, 0), var(--pep-color-system-primary-s, 0%), var(--pep-color-system-primary-l, 10%), .08);
    border: 1px solid hsl(var(--pep-color-regular-h, 100%), var(--pep-color-regular-s, 100), var(--pep-color-regular-l, 100));
    background-color: hsla(var(--pep-color-weak-h, 0), var(--pep-color-weak-s, 0%), var(--pep-color-weak-l, 10%), .08);
}

.pepperi-mui-tabs .MuiTab-root:hover {
    background-color: hsla(var(--pep-color-weak-h, 0), var(--pep-color-weak-s, 0%), var(--pep-color-weak-l, 10%), .16);
}

.pepperi-mui-tabs.pepperi-mui-tabs--sticky > .MuiBox-root:first-child {
    position: sticky;
    top: calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));
    z-index: 2;
    background: #fff;
}

.pepperi-mui-tabs .MuiTabs-root {
    min-height: 3rem;
    border-bottom-color: hsla(var(--pep-color-system-primary-h, 0), var(--pep-color-system-primary-s, 0%), var(--pep-color-system-primary-l, 10%), .24);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    position: sticky;
    top: calc(var(--pep-top-bar-spacing-top, 1.5rem) + var(--pep-top-bar-spacing-bottom, .5rem) + var(--pep-top-bar-field-height, 2.5rem));
    z-index: 2; /* adjust if you have a fixed topbar (e.g. top: 56px) */
    background: #fff; /* avoid transparency when content scrolls under */
}
