/**
 * Theme Name: Yummi Child Theme
 * Template: yummi
*/

/*------------------------------------------------------------------
[Add Your Custom CSS Here] */

/* --- MOBILE SUB-MENU FIX (FINAL) --- */
@media (max-width: 991px) {
    /* Ensure parent menu items are fully clickable */
     .mad-navigation > li.menu-item-has-children > a {
        display: flex;
        justify-content: space-between; /* This pushes the text and arrow apart */
        align-items: center;
        width: 100%;
    }

    /* Make sure the dropdown arrow is visible and properly aligned */
    .mad-navigation > li.menu-item-has-children > a::after {
        display: inline-block !important; /* Force display */
        float: none; /* Remove float to work with flexbox */
        transition: transform 0.3s ease;
    }

    /* Rotate the arrow when the sub-menu is open */
    .mad-navigation > li.menu-item-has-children.is-open > a::after {
        transform: rotate(180deg);
    }

    /* Reset ALL desktop styles and prepare the sub-menu for an accordion layout */
    .mad-navigation .sub-menu {
        position: static !important; /* CRITICAL: Must not be absolute */
        display: none;               /* Hidden by default */
        width: 100% !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;      /* Reset any transforms */
        transition: none !important;     /* Disable desktop transitions */
        box-shadow: none !important;
        background-color: rgba(0, 0, 0, 0.25); /* Darker background for visibility */
        padding: 5px 0 10px 30px;        /* Indent sub-menu items */
        margin-top: 5px;
        border-radius: 0;
    }

    /* Show the sub-menu when the parent has the 'is-open' class */
    .mad-navigation li.menu-item-has-children.is-open > .sub-menu {
        display: block !important;
    }

    /* Style the links inside the sub-menu for clarity */
    .mad-navigation .sub-menu a {
        color: #e0e0e0; /* Slightly lighter than main links for hierarchy */
        padding: 8px 15px;
        font-size: 1rem;
        border: none;
    }

    .mad-navigation .sub-menu a:hover {
        color: #ebe117; /* Highlight on hover */
    }
}


/* --- MOBILE NAVIGATION PANEL WIDTH OVERRIDE (DEFINITIVE) --- */
@media (max-width: 991px) {
    body .mad-header-item.header-item_navigation {
        max-width: 380px !important; /* Force the maximum width */
        width: 50% !important;       /* Use a percentage for better adaptability */
    }
}

@media (max-width: 767px) {
    .mad-content
 {
        padding-top: 1rem;
        padding-bottom: 9rem;
    }
}