/* Sayfa sekmeleri — tek kaynak. Markup: partials.page-tabs */
.page-tabs {
    --page-tabs-padding: 0.125rem;
    --page-tabs-bg: var(--cui-tertiary-bg);
    --page-tabs-radius: 50rem;
    --page-tabs-link-padding-x: 0.875rem;
    --page-tabs-link-padding-y: 0.375rem;
    --page-tabs-link-color: var(--cui-body-color);
    --page-tabs-link-border-width: 1px;
    --page-tabs-link-active-color: var(--cui-body-color);
    --page-tabs-link-active-bg: var(--cui-body-bg);
    --page-tabs-link-active-border: var(--cui-border-color);
    --page-tabs-link-shadow: var(--cui-box-shadow-sm);
    --page-tabs-link-disabled: var(--cui-secondary-color);

    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    max-width: 100%;
    padding: var(--page-tabs-padding);
    padding-inline-start: var(--page-tabs-padding);
    margin-bottom: 1rem;
    list-style: none;
    background-color: var(--page-tabs-bg);
    border-radius: var(--page-tabs-radius);
}

.page-tabs .nav-item {
    display: flex;
}

.page-tabs .nav-link {
    display: block;
    margin: 0;
    padding: calc(var(--page-tabs-link-padding-y) - var(--page-tabs-link-border-width))
        calc(var(--page-tabs-link-padding-x) - var(--page-tabs-link-border-width));
    font-weight: 500;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: var(--page-tabs-link-color);
    text-decoration: none;
    cursor: pointer;
    background: none;
    border: var(--page-tabs-link-border-width) solid transparent;
    border-radius: calc(var(--page-tabs-radius) - var(--page-tabs-padding));
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
}

.page-tabs .nav-link:hover,
.page-tabs .nav-link:focus {
    color: var(--page-tabs-link-color);
}

.page-tabs .nav-link.disabled,
.page-tabs .nav-link:disabled {
    color: var(--page-tabs-link-disabled);
    pointer-events: none;
}

.page-tabs .nav-link.active,
.page-tabs .show > .nav-link {
    color: var(--page-tabs-link-active-color);
    background-color: var(--page-tabs-link-active-bg);
    border-color: var(--page-tabs-link-active-border);
}

.page-tabs .nav-link.active:not(:focus-visible),
.page-tabs .show > .nav-link:not(:focus-visible) {
    box-shadow: var(--page-tabs-link-shadow);
}
