@import "@patternfly/patternfly/components/Tabs/tabs.css";

:host([vertical]) {
    display: grid;
    grid-template-columns: auto 1fr;

    .pf-c-tabs {
        width: auto !important;
    }

    .pf-c-tabs__list {
        height: 100%;
    }

    .pf-c-tabs .pf-c-tabs__list::before {
        border-color: transparent;
    }

    .pf-c-tabs__link {
        --pf-c-tabs__link--before--BorderRightWidth: 0;
    }
}

.pf-c-tabs {
    --pf-c-tabs--inset: var(--pf-global--spacer--lg);
    --pf-c-tabs--m-vertical--m-box--inset: var(--pf-global--spacer--lg);

    margin-block-start: var(--pf-global--spacer--xs);
    background-color: transparent;

    &.pf-m-box.pf-m-vertical {
        .pf-c-tabs__list::before {
            border-color: transparent;
        }
    }

    &.pf-m-box .pf-c-tabs__item.pf-m-current:first-child .pf-c-tabs__link::before {
        border-color: transparent;
    }

    &.pf-m-vertical {
        .pf-c-tabs__link {
            background-color: transparent;
        }
    }

    &:not(.pf-m-vertical) .pf-c-tabs__item {
        &.pf-m-current {
            --pf-c-tabs__link--after--BorderColor: var(--ak-accent);
        }
    }
}

ak-tabs[vertical] {
    [role="tabpanel"] {
        padding-inline-start: 0 !important;
    }

    .pf-c-card__body > *::part(table-container) {
        overflow-x: auto;
    }
}

.pf-c-tabs__link {
    --pf-c-tabs__link--Color: var(--pf-global--Color--100);
}
