html {
    scroll-behavior: smooth;
}


/* ==================================================
   NAVIGATION 
   ================================================== */
   
   /* — SOUS-MENU NAIL ART */

@media (hover: hover) and (pointer: fine) {

    .wp-block-navigation .mem-hover-submenu
        > .wp-block-navigation__submenu-container {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    .wp-block-navigation .mem-hover-submenu:hover
        > .wp-block-navigation__submenu-container {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;

        /* WordPress open-on-click garde le sous-menu replié */
        height: auto !important;
        min-height: max-content !important;
    }

    .mem-hover-submenu
        > .wp-block-navigation-submenu__toggle {
        cursor: pointer;
    }
}


/* ==================================================
   NAIL ART
   ================================================== */

.mem-nail-preview img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 8px;
}


/* Galerie Nail Art : empêcher la dernière image
   de s'étendre lorsqu'une ligne est incomplète */
.mem-nail-gallery {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.mem-nail-gallery > figure {
    width: 100% !important;
    margin: 0 !important;
}

.mem-nail-gallery > figure img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 8px;
}

/* Tablette */
@media (max-width: 782px) {
    .mem-nail-gallery {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Petit téléphone */
@media (max-width: 400px) {
    .mem-nail-gallery {
        grid-template-columns: 1fr;
    }
}


/* ==================================================
   EASY APPOINTMENTS 
   ================================================== */
   /* Masquer le choi de l'employé dans le form */


.ea-field-group:has(select[name="worker"]) {
    display: none !important;
}