/* ==========================================================================
    Mobile Navigation
========================================================================== */

.c-mobileNav {
    --navigation-primary-padding: 100px;
    --navigation-scroll-padding: 100px;

    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: calc(100vh - var(--navigation-height));
    pointer-events: none;

    &__scroll {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
    }

    &__primary {
        position: relative;
        padding: var(--navigation-primary-padding) 0 0 0;

        &--list {
            ul {
                margin: 0;
                padding: 0;
                list-style: none;
                font-family: var(--font-primary);

                li {
                    position: relative;
                    padding: 15px var(--half-container);
                    margin: 0;

                    span {
                        display: inline-block;
                        overflow: hidden;

                        a {
                            display: inline-block;
                            @include font-size(25px);
                            font-weight: var(--font-regular);
                            color: var(--navigation-link-color);
                            text-transform: uppercase;

                            &.is-current-page {
                                color: var(--navigation-link-current-color);
                            }
                        }
                    }
                }
            }
        }
    }

    &.is-open {
        pointer-events: all;
    }

    &.is-open & {
        &__scroll {
            padding-bottom: var(--navigation-scroll-padding);
        }
    }

    // **---------------------------------------------------**
    // MEDIA QUERIES

    @include mediaq('>LG') {
        display: none;
    }
}
