/* The CSS for the Navaa style */
/* If you use scss, then you have to run sass explicitly and create a navaa.css */
/* Cryogen does not do that for you */

html {
    scroll-behavior: smooth;
}

/* For accessibility */
.skipnav {
    font-size: 40px;
    text-align: left;
}
.skipnav a {
    position: fixed; /* wrt viewport */
    left: -10000px;
    padding: 1em;
    background-color: black;
    color: white;
    z-index: -999;
    overflow: hidden;
    opacity: 0;
}

.skipnav a:focus,
.skipnav a:active {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    overflow: visible;
    opacity: 1;
}

/* Menu-related */

.menu-section-heading {
    /* @extend .subtitle; */
    /* The above does not work.  Minimally, have to @use bulma */
    padding-bottom: 8px;
    border-bottom: solid 2px #e1e1e1; /* TODO: use a variable here */
}

.menu-item {
}

.menu-item-name {
}

.menu-item-description {
}

.menu-item-price {
}

/* Reduced motion preference support */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}