.celpip-dashboard-subnav {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: min(100% - 2rem, 92rem);
    margin: 1.25rem auto 0;
    padding: 0.35rem;
    overflow-x: auto;
    border: 1px solid var(--dash-border, #e8e3da);
    border-radius: 12px;
    background: var(--dash-card, #fff);
    scrollbar-width: none;
}

.celpip-dashboard-subnav::-webkit-scrollbar { display: none; }

.celpip-dashboard-subnav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0.65rem 1rem;
    border-radius: 9px;
    color: var(--dash-text-secondary, #5c5856);
    font: 600 0.86rem/1 'Poppins', sans-serif;
    text-decoration: none;
    white-space: nowrap;
}

.celpip-dashboard-subnav a:hover,
.celpip-dashboard-subnav a:focus-visible {
    color: var(--dash-text, #1a1816);
    background: var(--dash-elevated, #f0ede6);
    outline: none;
}

.celpip-dashboard-subnav a[aria-current="page"] {
    color: #fff;
    background: var(--dash-accent, #2d5f4d);
}

html.dark-mode .celpip-dashboard-subnav {
    --dash-card: #222;
    --dash-border: #343434;
    --dash-elevated: #2d2d2d;
    --dash-text: #e8e6e3;
    --dash-text-secondary: #c9c5c0;
    --dash-accent: #587b66;
}

@media (max-width: 520px) {
    .celpip-dashboard-subnav {
        width: calc(100% - 1.25rem);
        margin-top: 0.75rem;
    }

    .celpip-dashboard-subnav a { flex: 1 0 auto; }
}