/* ============================================
   Jehan Mega Menu v6.0
   Desktop: full viewport mega dropdown
   Mobile: standalone full-screen overlay panel
   ============================================ */

.jehan-mm-wrapper {
    display: block;
    height: 0;
    width: 0;
    overflow: visible;
    position: static;
    pointer-events: none;
}

/* ── DESKTOP DROPDOWN ── */
.jehan-mm-dropdown {
    position: fixed !important;
    top: 0; left: 0 !important; right: 0 !important;
    width: 100% !important; max-width: 100vw !important;
    margin: 0 !important; padding: 0 !important;
    opacity: 0; visibility: hidden;
    transform: translateY(-6px);
    transition: opacity 0.25s, visibility 0.25s, transform 0.25s;
    z-index: 999999 !important;
    background: #fff;
    box-shadow: 0 10px 50px rgba(0,0,0,0.2);
    box-sizing: border-box !important;
    overflow: hidden;
    pointer-events: auto;
}
.jehan-mm-dropdown.is-open { opacity:1; visibility:visible; transform:translateY(0); }

.jehan-mm-inner {
    display: flex !important; flex-direction: row !important;
    width: 100% !important; max-height: 80vh; min-height: 380px;
    box-sizing: border-box; overflow: hidden;
}

.jehan-mm-sidebar {
    display: flex; flex-direction: column;
    width: 250px; min-width: 250px; max-width: 250px;
    flex-shrink: 0; overflow-y: auto; overflow-x: hidden;
    padding: 12px 0; box-sizing: border-box; background: #4A2C1A;
}
.jehan-mm-sidebar a {
    display: block; padding: 10px 24px; color: #fff;
    text-decoration: none; font-size: 14px; font-weight: 500;
    line-height: 1.5; white-space: nowrap;
    border-left: 3px solid transparent; transition: background 0.2s, padding-left 0.2s;
}
.jehan-mm-sidebar a:hover {
    background: rgba(255,255,255,0.15); padding-left: 28px;
    border-left-color: rgba(255,255,255,0.6);
}
.jehan-mm-sidebar::-webkit-scrollbar { width: 4px; }
.jehan-mm-sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.3); border-radius: 2px; }

.jehan-mm-content {
    flex: 1 1 0%; min-width: 0; padding: 24px 32px;
    overflow-y: auto; overflow-x: hidden; box-sizing: border-box; background: #fff;
}
.jehan-mm-content::-webkit-scrollbar { width: 5px; }
.jehan-mm-content::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }

.jehan-mm-grid { display: grid !important; width: 100% !important; box-sizing: border-box; gap: 20px 24px; }
.jehan-mm-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
.jehan-mm-cols-4 { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
.jehan-mm-cols-5 { grid-template-columns: repeat(5, minmax(0,1fr)) !important; }

.jehan-mm-cat-card {
    padding: 10px 8px 14px; border-bottom: 1px solid #eee;
    min-width: 0; overflow: hidden; word-wrap: break-word; box-sizing: border-box;
}
.jehan-mm-badge {
    display: inline-block; background: #4A2C1A; color: #fff;
    font-size: 10px; font-weight: 700; letter-spacing: 0.5px;
    text-transform: uppercase; padding: 4px 10px; margin-bottom: 8px;
    line-height: 1.3; border-radius: 3px;
}
.jehan-mm-cat-title { margin: 0 0 10px; font-size: 15px; font-weight: 700; line-height: 1.35; color: #222; word-wrap: break-word; }
.jehan-mm-cat-title a { text-decoration: none; color: inherit; transition: color 0.2s; }
.jehan-mm-cat-title a:hover { color: #4A2C1A; }
.jehan-mm-sub-items { list-style: none; margin: 0; padding: 0; }
.jehan-mm-sub-item { margin-bottom: 5px; }
.jehan-mm-sub-item a { text-decoration: none; font-size: 13px; color: #555; line-height: 1.55; display: block; word-wrap: break-word; transition: color 0.2s; }
.jehan-mm-sub-item a:hover { color: #4A2C1A; padding-left: 4px; }
.jehan-mm-view-all { margin-top: 8px; }
.jehan-mm-view-all a { text-decoration: none; font-size: 13px; font-weight: 600; color: #4A2C1A; display: inline-block; }
.jehan-mm-view-all a:hover { text-decoration: underline; }

@media (max-width: 1200px) {
    .jehan-mm-grid { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
    .jehan-mm-content { padding: 20px 24px; }
}
@media (max-width: 1024px) {
    .jehan-mm-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
    .jehan-mm-sidebar { width: 200px; min-width: 200px; max-width: 200px; }
}

/* Desktop animation */
.jehan-mm-dropdown.is-open .jehan-mm-cat-card { animation: jmFade 0.3s ease forwards; opacity: 0; }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(1)  { animation-delay:.02s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(2)  { animation-delay:.04s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(3)  { animation-delay:.06s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(4)  { animation-delay:.08s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(5)  { animation-delay:.1s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(6)  { animation-delay:.12s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(7)  { animation-delay:.14s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(8)  { animation-delay:.16s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(9)  { animation-delay:.18s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(10) { animation-delay:.2s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(11) { animation-delay:.22s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(12) { animation-delay:.24s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(13) { animation-delay:.26s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(14) { animation-delay:.28s }
.jehan-mm-dropdown.is-open .jehan-mm-cat-card:nth-child(15) { animation-delay:.3s }
@keyframes jmFade { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }

/* Hide desktop dropdown on mobile */
@media (max-width: 768px) {
    .jehan-mm-dropdown { display: none !important; }
}

/* Elementor Editor */
.elementor-editor-active .jehan-mm-wrapper { height:auto;width:auto;pointer-events:auto;overflow:visible }
.elementor-editor-active .jehan-mm-dropdown { position:relative!important;opacity:1;visibility:visible;transform:none;width:100%!important }


/* ============================================
   MOBILE: Standalone Full-Screen Overlay
   Appended to <body> by JS
   ============================================ */

body.jmm-body-lock {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
}

#jmm-mobile-overlay {
    display: none;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 9999999 !important;
    background: rgba(0,0,0,0.4) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
}

#jmm-mobile-overlay.is-visible {
    display: block !important;
}

/* The sliding panel */
.jmm-mob-panel {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 85% !important;
    max-width: 380px !important;
    height: 100% !important;
    background: #ffffff !important;
    box-shadow: 4px 0 30px rgba(0,0,0,0.2) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    animation: jmmSlideIn 0.3s ease !important;
}

@keyframes jmmSlideIn {
    from { transform: translateX(-100%); }
    to { transform: translateX(0); }
}

/* Panel header */
.jmm-mob-panel-header {
    display: flex !important;
    align-items: center !important;
    padding: 16px 20px !important;
    border-bottom: 1px solid #e8e8e8 !important;
    background: #fff !important;
    flex-shrink: 0 !important;
    gap: 12px !important;
    box-sizing: border-box !important;
}

.jmm-mob-back {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: none !important;
    border: none !important;
    color: #4A2C1A !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    padding: 6px 0 !important;
    line-height: 1 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.jmm-mob-back svg {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
}

.jmm-mob-panel-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #4A2C1A !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Panel body - scrollable */
.jmm-mob-panel-body {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    box-sizing: border-box !important;
}

/* Category list */
.jmm-mob-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Each row */
.jmm-mob-row {
    border-bottom: 1px solid #e8e8e8 !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Row header */
.jmm-mob-row-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 15px 20px !important;
    cursor: pointer !important;
    user-select: none !important;
    background: transparent !important;
    transition: background 0.15s !important;
    box-sizing: border-box !important;
}

.jmm-mob-row-header:active {
    background: #faf7f4 !important;
}

.jmm-mob-row-title {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #333333 !important;
    text-decoration: none !important;
    flex: 1 !important;
    line-height: 1.4 !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: none !important;
}

/* Plus icon */
.jmm-mob-plus {
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    font-weight: 300 !important;
    color: #aaaaaa !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: color 0.2s !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.jmm-mob-row.is-open .jmm-mob-plus {
    color: #4A2C1A !important;
}

/* Sub items - hidden by default */
.jmm-mob-row-subs {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.35s ease !important;
    background: #f9f7f5 !important;
}

.jmm-mob-row.is-open > .jmm-mob-row-subs {
    max-height: 800px !important;
}

.jmm-mob-row-subs ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 6px 0 14px 0 !important;
}

.jmm-mob-row-subs li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.jmm-mob-row-subs li a {
    display: block !important;
    padding: 10px 20px 10px 40px !important;
    color: #555555 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    transition: color 0.15s, background 0.15s !important;
    background: transparent !important;
    border: none !important;
}

.jmm-mob-row-subs li a:active {
    color: #4A2C1A !important;
    background: rgba(74,44,26,0.05) !important;
}

/* View All */
.jmm-mob-row-va {
    padding: 4px 20px 14px 40px !important;
}

.jmm-mob-row-va a {
    display: inline-block !important;
    color: #4A2C1A !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}

.jmm-mob-row-va a:active {
    text-decoration: underline !important;
}

/* Hide mobile overlay on desktop */
@media (min-width: 769px) {
    #jmm-mobile-overlay {
        display: none !important;
    }
}