/*
 * GrandLiga Guide Hub — mobile Popular chip touch fix v1
 * 2026-08-22
 *
 * The base stylesheet lifts Popular chips by 1px on :hover.
 * iOS Safari applies that hover state during tap/navigation while the row
 * itself clips overflow, which can temporarily hide the top border.
 *
 * Touch devices do not need a hover lift.
 */

@media (hover: none), (pointer: coarse) {
    .gl-guide-popular-chip,
    .gl-guide-popular-chip:hover,
    .gl-guide-popular-chip:active {
        transform: none !important;
        border-color: var(--gl-line) !important;
        box-shadow: 0 2px 8px rgba(20, 43, 63, .05) !important;
        -webkit-tap-highlight-color: transparent;
    }

    /*
     * Keep keyboard accessibility intact on hybrid devices.
     */
    .gl-guide-popular-chip:focus-visible {
        outline: 2px solid rgba(35, 129, 116, .45);
        outline-offset: 2px;
    }
}