/* =============================================================================
   Mobile Menu — Drilldown Panel Styles
   WoodMart wd-layout-drilldown overrides for Discount Fabrics Ltd.
   Each depth level slides into its own full-width panel.
   @package WoodmartChildNew
   ============================================================================= */

/* ── Global link sizing for ALL drilldown levels ──────────────────────────── */
.wd-nav-mobile .woodmart-nav-link {
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: #222 !important;
    line-height: 1.4 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    text-transform: none !important;
}

/* ── Level 1 top-level items — slightly bolder ──────────────────────────── */
.wd-nav-mobile>li.item-level-0>a.woodmart-nav-link,
.wd-nav-mobile .wd-sub-menu>li.item-level-0>a.woodmart-nav-link {
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #111 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

/* ── Deeper level items inside a drilldown sub-panel ──────────────────── */
.wd-nav-mobile .wd-sub-menu>li.item-level-1>a.woodmart-nav-link,
.wd-nav-mobile .wd-sub-menu>li.item-level-2>a.woodmart-nav-link,
.wd-nav-mobile .wd-sub-menu>li.item-level-3>a.woodmart-nav-link {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #444 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
}

/* ── Items with children (parent arrows) — slightly bolder ──────────── */
.wd-nav-mobile .menu-item-has-children>a.woodmart-nav-link {
    font-weight: 600 !important;
}

.wd-nav-mobile .wd-drilldown-back {
    min-height: 44px !important;
    height: 44px !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
    margin-bottom: 5px !important;
    display: flex !important;
    align-items: center !important;
    background-color: #fbfbfb !important;
}

.wd-nav-mobile .wd-drilldown-back a {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #222 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 12px !important;
    min-height: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.wd-nav-mobile .wd-drilldown-back a:hover {
    color: #E4003B !important;
}

/* Left Arrow Box — clean, borderless, matching list items style */
.wd-nav-mobile .wd-drilldown-back .wd-nav-opener {
    background-color: transparent !important;
    border: none !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    flex-shrink: 0 !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.wd-nav-mobile .wd-drilldown-back .wd-nav-opener::before,
.wd-nav-mobile .wd-drilldown-back .wd-nav-opener::after {
    color: #E4003B !important;
    font-weight: bold !important;
}

.wd-nav-mobile .wd-drilldown-back .wd-nav-opener:after {
    content: "\f114" !important;
    font-family: "woodmart-font" !important;
    font-size: 10px !important;
    color: #E4003B !important;
    position: static !important;
}

/* ── Subtle divider between sibling items ──────────────────────────────── */
.wd-nav-mobile .wd-sub-menu>li:not(.wd-drilldown-back) {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* ── Category icon in mobile nav (wd-nav-img) ─────────────────────────── */
.wd-nav-mobile .wd-nav-img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
    flex-shrink: 0 !important;
    margin-right: 6px !important;
    vertical-align: middle !important;
}