/*
 * SafetyPPE Home Index 2.5.3
 * Homepage-only refinements. Loaded after the main SafetyPPE stylesheet.
 */

.home-page .home-swipe-track {
    min-width: 0;
}

.home-page .home-swipe-track:focus-visible {
    outline: 3px solid rgba(112, 207, 67, .32);
    outline-offset: 6px;
    border-radius: 20px;
}

@media (max-width: 760px) {
    .home-page .home-swipe-track {
        display: grid;
        width: 100%;
        max-width: 100%;
        align-items: stretch;
        grid-template-columns: none !important;
        grid-auto-flow: column;
        gap: 14px;
        overflow-x: auto;
        overflow-y: hidden;
        margin: 0;
        padding: 2px 14px 18px 1px;
        scroll-padding-inline: 1px;
        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .home-page .home-swipe-track::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .home-page .home-category-track {
        grid-auto-columns: clamp(270px, 82vw, 330px);
    }

    .home-page .home-knowledge-track {
        grid-auto-columns: clamp(286px, 85vw, 360px);
    }

    .home-page .home-category-track .category-card,
    .home-page .home-knowledge-track .knowledge-card {
        width: 100%;
        height: 100%;
        min-width: 0;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .home-page .home-category-track .category-card {
        min-height: 112px;
    }

    .home-page .home-knowledge-track .knowledge-card:last-child:nth-child(odd) {
        grid-column: auto !important;
    }

    .home-page .home-knowledge-track .knowledge-image {
        height: 190px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-page .home-swipe-track {
        scroll-behavior: auto;
    }
}