/* Playful hand-drawn, wobbly menu items stylesheet */

/* Common Menu Selectors (Elementor, standard WordPress, Gutenberg) */
.elementor-nav-menu > li > a,
.main-navigation ul li a,
.nav-menu li a,
.wp-block-navigation-item__content {
    position: relative;
    padding: 8px 18px !important;
    margin: 5px 8px !important;
    display: inline-block;
    font-weight: 700;
    letter-spacing: 0.5px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    
    /* Playful wobbly hand-drawn border styling with warm organic slate instead of harsh black */
    border: 3px solid #2b273d;
    border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
    box-shadow: 3px 4px 0px #2b273d;
}

/* Give different organic shapes to adjacent menu items */
.elementor-nav-menu > li:nth-child(2n) > a,
.main-navigation ul li:nth-child(2n) a,
.nav-menu li:nth-child(2n) a,
.wp-block-navigation-item:nth-child(2n) .wp-block-navigation-item__content {
    border-radius: 20px 250px 25px 240px/245px 25px 230px 25px;
}

.elementor-nav-menu > li:nth-child(3n) > a,
.main-navigation ul li:nth-child(3n) a,
.nav-menu li:nth-child(3n) a,
.wp-block-navigation-item:nth-child(3n) .wp-block-navigation-item__content {
    border-radius: 125px 25px 145px 35px/35px 125px 25px 145px;
}

/* Default state: Playful vibrant colors */
.elementor-nav-menu > li:nth-child(5n+1) > a,
.main-navigation ul li:nth-child(5n+1) a,
.nav-menu li:nth-child(5n+1) a,
.wp-block-navigation-item:nth-child(5n+1) .wp-block-navigation-item__content {
    background-color: #ffde43 !important; /* Playful yellow */
    color: #2b273d !important;
}

.elementor-nav-menu > li:nth-child(5n+2) > a,
.main-navigation ul li:nth-child(5n+2) a,
.nav-menu li:nth-child(5n+2) a,
.wp-block-navigation-item:nth-child(5n+2) .wp-block-navigation-item__content {
    background-color: #ff6f59 !important; /* Playful orange-red */
    color: #ffffff !important;
}

.elementor-nav-menu > li:nth-child(5n+3) > a,
.main-navigation ul li:nth-child(5n+3) a,
.nav-menu li:nth-child(5n+3) a,
.wp-block-navigation-item:nth-child(5n+3) .wp-block-navigation-item__content {
    background-color: #40c9a2 !important; /* Playful teal */
    color: #ffffff !important;
}

.elementor-nav-menu > li:nth-child(5n+4) > a,
.main-navigation ul li:nth-child(5n+4) a,
.nav-menu li:nth-child(5n+4) a,
.wp-block-navigation-item:nth-child(5n+4) .wp-block-navigation-item__content {
    background-color: #2f97c1 !important; /* Playful blue */
    color: #ffffff !important;
}

.elementor-nav-menu > li:nth-child(5n+5) > a,
.main-navigation ul li:nth-child(5n+5) a,
.nav-menu li:nth-child(5n+5) a,
.wp-block-navigation-item:nth-child(5n+5) .wp-block-navigation-item__content {
    background-color: #ea526f !important; /* Playful pink */
    color: #ffffff !important;
}

/* Hover state: turn white with classic interactive lift-and-shadow effect */
.elementor-nav-menu > li > a:hover,
.main-navigation ul li a:hover,
.nav-menu li a:hover,
.wp-block-navigation-item .wp-block-navigation-item__content:hover {
    background-color: #ffffff !important;
    color: #2b273d !important;
    transform: translate(-2px, -2px);
    box-shadow: 5px 6px 0px #2b273d;
}

/* Active or current page indicators */
.elementor-nav-menu > li.current-menu-item > a,
.main-navigation ul li.current-menu-item a,
.nav-menu li.current_page_item a,
.wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content {
    background-color: #2b273d !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: translate(3px, 4px) !important;
}
