/**
 * Intent journey tabs (subject hub, category pages, promotion subject).
 */
.vgl-intent-tabs {
    margin: 0 0 var(--vgl-space-6);
}

.vgl-intent-tabs__list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--vgl-space-2);
    list-style: none;
    margin: 0;
    padding: var(--vgl-space-1);
    background: var(--vgl-color-bg-alt);
    border: 1px solid var(--vgl-color-border);
    border-radius: var(--vgl-radius, 8px);
}

.vgl-intent-tabs__item {
    margin: 0;
}

.vgl-intent-tabs__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.5rem;
    padding: var(--vgl-space-2) var(--vgl-space-4);
    border: 1px solid transparent;
    border-radius: calc(var(--vgl-radius, 8px) - 2px);
    color: var(--vgl-color-text);
    font-size: var(--vgl-font-size-sm);
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    background: transparent;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}

.vgl-intent-tabs__link:hover {
    background: var(--vgl-color-surface);
    color: var(--vgl-color-primary);
    border-color: var(--vgl-color-border);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.vgl-intent-tabs__link--active {
    background: var(--vgl-color-primary);
    border-color: var(--vgl-color-primary);
    color: var(--vgl-color-text-inverse);
    box-shadow: 0 2px 6px rgba(0, 107, 189, 0.25);
}

.vgl-intent-tabs__link--active:hover {
    background: var(--vgl-color-primary-hover);
    border-color: var(--vgl-color-primary-hover);
    color: var(--vgl-color-text-inverse);
}

.vgl-intent-tabs__link--deals.vgl-intent-tabs__link--active {
    background: var(--vgl-color-accent);
    border-color: var(--vgl-color-accent);
    box-shadow: 0 2px 6px rgba(242, 80, 78, 0.25);
}

.vgl-intent-tabs__link--deals.vgl-intent-tabs__link--active:hover {
    background: var(--vgl-color-accent-hover);
    border-color: var(--vgl-color-accent-hover);
}

@media (max-width: 640px) {
    .vgl-intent-tabs__list {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }
}