/* Styling for #v2-hadith-menu copied from #v2-library-menu to ensure consistency */

/* ✅ LEVEL 1: Main Categories (Books/Collections) - Deep Blue */
#v2-hadith-menu .level-1>label {
    color: #070707ff !important;
    font-weight: bold !important;
    border-left: 5px solid #b983ff !important;
    padding: 12px 15px !important;
    font-size: 16px !important;
    box-shadow: 0 2px 8px rgba(33, 150, 243, 0.3) !important;
}

#v2-hadith-menu .level-1>label:hover {
    background: linear-gradient(135deg, #89ffe0, #64adff) !important;
    transform: translateX(3px) !important;
    box-shadow: 0 4px 12px rgba(33, 150, 243, 0.4) !important;
}

/* ✅ LEVEL 2: Volumes/Parts - Green */
#v2-hadith-menu .level-2>label {
    color: #070707ff !important;
    font-weight: 600 !important;
    border-left: 5px solid #2e7d32 !important;
    padding: 10px 20px !important;
    padding-left: 35px !important;
    font-size: 15px !important;
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.3) !important;
    margin-left: 10px !important;
}

#v2-hadith-menu .level-2>label:hover {
    transform: translateX(2px) !important;
    background: linear-gradient(135deg, #89ffe0, #64adff) !important;
    box-shadow: 0 3px 10px rgba(76, 175, 80, 0.4) !important;
}

/* ✅ LEVEL 3: Chapters - Orange */
#v2-hadith-menu .level-3>label {
    color: #000000ff !important;
    font-weight: 500 !important;
    border-left: 4px solid #ef6c00 !important;
    padding: 9px 25px !important;
    padding-left: 50px !important;
    font-size: 14px !important;
    box-shadow: 0 2px 5px rgba(255, 152, 0, 0.3) !important;
    margin-left: 20px !important;
}

#v2-hadith-menu .level-3>label:hover {
    background: linear-gradient(135deg, #89ffe0, #64adff) !important;
    transform: translateX(2px) !important;
    box-shadow: 0 3px 8px rgba(255, 152, 0, 0.4) !important;
}

/* ✅ LEVEL 4: Sub-chapters - Red */
#v2-hadith-menu .level-4>label {
    color: #000000ff !important;
    font-weight: 500 !important;
    border-left: 4px solid #c62828 !important;
    padding: 8px 30px !important;
    padding-left: 65px !important;
    font-size: 13px !important;
    box-shadow: 0 2px 4px rgba(244, 67, 54, 0.3) !important;
    margin-left: 30px !important;
}

#v2-hadith-menu .level-4>label:hover {
    background: linear-gradient(135deg, #d32f2f, #c62828) !important;
    transform: translateX(1px) !important;
    box-shadow: 0 2px 6px rgba(244, 67, 54, 0.4) !important;
}

/* ✅ LEVEL 5: Sub-sections - Purple */
#v2-hadith-menu .level-5>label {
    color: #000000ff !important;
    font-weight: 400 !important;
    border-left: 3px solid #6a1b9a !important;
    padding: 7px 35px !important;
    padding-left: 80px !important;
    font-size: 12px !important;
    box-shadow: 0 1px 3px rgba(156, 39, 176, 0.3) !important;
    margin-left: 40px !important;
}

#v2-hadith-menu .level-5>label:hover {
    background: linear-gradient(135deg, #7b1fa2, #6a1b9a) !important;
    transform: translateX(1px) !important;
    box-shadow: 0 2px 5px rgba(156, 39, 176, 0.4) !important;
}

/* ✅ LEVEL 6: Details - Teal */
#v2-hadith-menu .level-6>label {
    color: #080808ff !important;
    font-weight: 400 !important;
    border-left: 3px solid #00695c !important;
    padding: 6px 40px !important;
    padding-left: 95px !important;
    font-size: 11px !important;
    box-shadow: 0 1px 2px rgba(0, 150, 136, 0.3) !important;
    margin-left: 50px !important;
}

#v2-hadith-menu .level-6>label:hover {
    background: linear-gradient(135deg, #00796b, #00695c) !important;
    box-shadow: 0 2px 4px rgba(0, 150, 136, 0.4) !important;
}

/* ✅ CONTENT ITEMS: Final level with content - Gradient */
#v2-hadith-menu label.has-content {
    color: #050505ff !important;
    font-weight: normal !important;
    border-left: 4px solid #4527a0 !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
}

#v2-hadith-menu label.has-content:hover {
    background: linear-gradient(135deg, #e1f7c3ff, #7aebffff) !important;
    transform: scale(1.02) !important;
    box-shadow: 0 4px 15px rgba(103, 58, 183, 0.5) !important;
}

/* ✅ ACTIVE ITEM: Currently selected */
#v2-hadith-menu li.act_item>label {
    background: linear-gradient(135deg, #ffa6a6, #77fff9) !important;
    color: #070707ff !important;
    border-left-color: #bf360c !important;
    font-weight: bold !important;
    box-shadow: 0 4px 20px rgba(255, 87, 34, 0.6) !important;
    transform: scale(1.05) !important;
    border-radius: 8px !important;
}

/* ✅ FOLDER CONTAINERS: Styling for ul elements */
#v2-hadith-menu .level-1+ul {
    border-left: 3px solid #2196f3 !important;
    margin-left: 15px !important;
    padding-left: 10px !important;
    background: rgba(33, 150, 243, 0.05) !important;
}

#v2-hadith-menu .level-2+ul {
    border-left: 3px solid #4caf50 !important;
    margin-left: 20px !important;
    padding-left: 8px !important;
    background: rgba(76, 175, 80, 0.05) !important;
}

#v2-hadith-menu .level-3+ul {
    border-left: 2px solid #ff9800 !important;
    margin-left: 25px !important;
    padding-left: 6px !important;
    background: rgba(255, 152, 0, 0.05) !important;
}

#v2-hadith-menu .level-4+ul {
    border-left: 2px solid #f44336 !important;
    margin-left: 30px !important;
    padding-left: 4px !important;
    background: rgba(244, 67, 54, 0.05) !important;
}

#v2-hadith-menu .level-5+ul {
    border-left: 1px solid #9c27b0 !important;
    margin-left: 35px !important;
    padding-left: 3px !important;
    background: rgba(156, 39, 176, 0.05) !important;
}

/* ✅ RESPONSIVE: Mobile optimization */
@media (max-width: 768px) {

    #v2-hadith-menu .level-1>label,
    #v2-hadith-menu .level-2>label,
    #v2-hadith-menu .level-3>label,
    #v2-hadith-menu .level-4>label,
    #v2-hadith-menu .level-5>label,
    #v2-hadith-menu .level-6>label {
        padding: 8px 12px !important;
        font-size: 14px !important;
        margin-left: 5px !important;
    }

    #v2-hadith-menu .level-2>label {
        padding-left: 25px !important;
    }

    #v2-hadith-menu .level-3>label {
        padding-left: 35px !important;
    }

    #v2-hadith-menu .level-4>label {
        padding-left: 45px !important;
    }

    #v2-hadith-menu .level-5>label {
        padding-left: 55px !important;
    }

    #v2-hadith-menu .level-6>label {
        padding-left: 65px !important;
    }
}

/* ✅ ANIMATION: Smooth transitions */
#v2-hadith-menu label {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

#v2-hadith-menu label:hover {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* ✅ LOADING STATE */
#v2-hadith-menu .v2-loader-wrapper {
    text-align: center !important;
    padding: 30px !important;
    background: linear-gradient(135deg, #f5f5f5, #eeeeee) !important;
    border-radius: 8px !important;
    margin: 10px !important;
}

#v2-hadith-menu .v2-loader {
    border: 4px solid #f3f3f3 !important;
    border-top: 4px solid #2196f3 !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    animation: v2-spin 1s linear infinite !important;
}

/* Level-wise closed book icons and colors */
#v2-hadith-menu .level-1>label.has-children::before {
    content: '📚 ';
    color: #1976d2;
    font-size: 19px;
}

#v2-hadith-menu .level-2>label.has-children::before {
    content: '📗';
    color: #388e3c;
}

#v2-hadith-menu .level-3>label.has-children::before {
    content: '📙';
    color: #f57c00;
}

#v2-hadith-menu .level-4>label.has-children::before {
    content: '📕';
    color: #d32f2f;
}

#v2-hadith-menu .level-5>label.has-children::before {
    content: '📔';
    color: #7b1fa2;
}

#v2-hadith-menu .level-6>label.has-children::before {
    content: '📒';
    color: #009688;
}

/* Level-wise open book icons when expanded */
#v2-hadith-menu li.level-1.expanded>label.has-children::before {
    content: '📖';
    color: #1976d2;
}

#v2-hadith-menu li.level-2.expanded>label.has-children::before {
    content: '📖';
    color: #388e3c;
}

#v2-hadith-menu li.level-3.expanded>label.has-children::before {
    content: '📖';
    color: #f57c00;
}

#v2-hadith-menu li.level-4.expanded>label.has-children::before {
    content: '📖';
    color: #d32f2f;
}

#v2-hadith-menu li.level-5.expanded>label.has-children::before {
    content: '📖';
    color: #7b1fa2;
}

#v2-hadith-menu li.level-6.expanded>label.has-children::before {
    content: '📖';
    color: #009688;
}

/* Content leaf node: page icon */
#v2-hadith-menu label.has-content::before {
    content: '📄';
    color: #512da8;
}