/* Flechas de scroll horizontal (mismo patrón que el menú nativo Android). */
.hscroll-arrows-host {
    display: flex;
    align-items: center;
    gap: .45rem;
    min-width: 0;
    max-width: 100%;
}
.hscroll-arrows-host > .hscroll-arrows-scroller {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
}
.hscroll-arrow {
    display: none;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border, #e2e8f0);
    background: var(--bg-card, #fff);
    color: var(--text-secondary, #64748b);
    border-radius: 999px;
    font-size: 1rem;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    z-index: 1;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .08);
    transition: background .15s, color .15s, opacity .15s;
}
.hscroll-arrow:hover {
    background: color-mix(in srgb, var(--accent, #059669) 10%, var(--bg-card, #fff));
    color: var(--text-primary, #0f172a);
}
.hscroll-arrow:active { opacity: .8; }
.hscroll-arrow.d-none { display: none !important; }

@media (max-width: 991.98px) {
    .hscroll-arrow { display: inline-flex; }
    .jobs-quick-filters.hscroll-arrows-scroller {
        flex-wrap: nowrap !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .jobs-quick-filters.hscroll-arrows-scroller::-webkit-scrollbar { display: none; }
}

@media (min-width: 992px) {
    .hscroll-arrow { display: none !important; }
}