.mol-submenu {
    @apply mt-4;

    .atm-heading {
        @apply mb-3 text-secondary-col-1;
    }

    .submenu-wrapper {
        @apply relative;
        @apply font-display font-semibold text-md;
    }

    .submenu-viewport {
        @apply relative overflow-x-scroll overflow-y-auto border-b;

        /* -webkit-overflow-scrolling: touch;
        -ms-scroll-chaining: chained;
        -ms-scroll-snap-type: x mandatory;
        scroll-snap-type: x mandatory;
        -ms-overflow-style: none; */
        scrollbar-width: none;

        &::-webkit-scrollbar {
            display: none;
        }
    }

    .submenu-list {
        @apply flex;

        li {
            @apply relative flex flex-shrink-0 items-center mr-8;

            /* scroll-snap-align: start; */

            .atm-slash {
                @apply mx-4;
            }

            &:last-child {
                .atm-slash {
                    @apply hidden;
                }
            }

            .atm-nav-link {
                @apply text-md font-normal pb-5 inline-block text-black hover:no-underline hover:text-cta;
            }

            &.active {
                .atm-nav-link {
                    @apply pb-5 border-primary border-b-[3px] mt-[3px];
                }
            }
        }
    }

    .submenu-prev,
    .submenu-next {
        @apply flex absolute transform top-1/2 -translate-y-1/2 py-2 px-3 cursor-pointer;

        &.inactive {
            @apply hidden;
        }
    }

    .submenu-prev {
        @apply -left-4;
        background-image: linear-gradient(to right, #fff 60%, transparent);
    }

    .submenu-next {
        @apply -right-4;
        background-image: linear-gradient(to left, #fff 60%, transparent);
    }
}