/* ── Faster accordion ── */
.rm-items .navbar-nav {
    transition: max-height 0.12s ease, opacity 0.12s ease !important;
}

/* ── Root item ── */
.hcm-root-item {
    padding: 0 !important;
    border-bottom: 1px solid var(--sa-border-color, #e9ecef) !important;
    direction: rtl !important;
}

/* ── Universal row ── */
.hcm-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: 100% !important;
    cursor: pointer !important;
    /* RTL: content starts from right, arrow pushed to far left */
    padding: 0 16px 0 8px !important;
    margin: 0 !important;
    gap: 10px !important;
    direction: rtl !important;
    text-decoration: none !important;
    color: var(--sa-heading-color) !important;
    min-height: 44px !important;
    box-sizing: border-box !important;
    transition: background 0.1s ease !important;
}

    .hcm-row:hover,
    .hcm-row:focus {
        background: rgba(var(--sa-primary-rgb), 0.3) !important;
        color: var(--sa-heading-color) !important;
        text-decoration: none !important;
    }

/* Root row */
.hcm-row--root {
    background: var(--sa-card-bg);
    border-radius: var(--sa-btn-radius) var(--sa-btn-radius) 0 0;
    font-weight: 700 !important;
    font-size: 14px !important;
    border-bottom: 1px solid var(--sa-success) !important;
}

.hcm-icon-grid {
    font-size: 1.05rem !important;
    color: var(--sa-heading-color) !important;
    flex-shrink: 0 !important;
    transition: transform 0.12s ease !important;
}

/* Grid icon rotation when root menu is open */
.hcm-row--root.hcm-open > .hcm-icon-grid {
    transform: rotate(90deg) !important;
}

/* Thumb wrapper */
.hcm-row__thumb {
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

/* Level 1 */
.hcm-row--l1 {
    background: rgba(var(--sa-category-mobile-rgb), var(--sa-category-mobile-opacity-lvl1)) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

/* Level 2 (plain <a>) */
.hcm-row--l2 {
    padding: 0 28px 0 8px !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    min-height: 40px !important;
    color: var(--sa-text, #374151) !important;
    gap: 10px !important;
    direction: rtl !important;
}

/* "همه محصولات" */
.hcm-row--viewall {
    padding: 0 16px 0 10px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--sa-text-third) !important;
    background: var(--sa-btn-primary) !important;
    min-height: 40px !important;
    border-bottom: 1px solid var(--sa-border-color, #e9ecef) !important;
    gap: 8px !important;
    direction: rtl !important;
}

    .hcm-row--viewall:hover {
        background: rgba(var(--sa-primary-rgb, 37,99,235), 0.12) !important;
    }

.hcm-viewall-icon {
    font-size: .85rem !important;
    flex-shrink: 0 !important;
    transition: transform 0.12s ease !important;
}

/* Icon rotation for همه محصولات when parent is open */
.hcm-row--l1.hcm-open ~ .hcm-level-2 .hcm-row--viewall .hcm-viewall-icon {
    transform: rotate(90deg) !important;
}

/* Arrow pushed to far LEFT (start of LTR = end of RTL) */
.hcm-viewall-arrow {
    font-size: .75rem !important;
    flex-shrink: 0 !important;
    margin-right: auto !important;
    opacity: .7 !important;
}

/* ── Chevron arrows ── */
.hcm-arrow {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    flex-shrink: 0 !important;
    color: var(--sa-muted-text, #94a3b8) !important;
    /* In RTL flex, margin-right: auto pushes to the LEFT end */
    margin-right: auto !important;
    margin-left: 0 !important;
}

    .hcm-arrow i {
        font-size: .72rem !important;
        transition: transform 0.12s ease !important;
        margin: 0 !important;
    }

/* Arrow rotation when open */
.hcm-row--root.hcm-open .hcm-arrow i {
    transform: rotate(180deg) !important;
}

.hcm-row--l1.hcm-open .hcm-arrow i {
    transform: rotate(-90deg) !important;
}

.hcm-child-caret {
    font-size: .65rem !important;
    color: #cbd5e1 !important;
    flex-shrink: 0 !important;
    margin-right: auto !important;
}

/* ── Items ── */
.hcm-item {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    border: none !important;
    border-bottom: 1px solid var(--sa-border-color, #f0f2f4) !important;
    padding: 0 !important;
    margin: 0 !important;
}

    .hcm-item:last-child {
        border-bottom: none !important;
    }

.hcm-item--viewall {
    border-bottom: none !important;
}

.hcm-name {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* ── Thumbnails ── */
.hcm-thumb {
    width: 26px !important;
    height: 26px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
    border: 1px solid rgba(0,0,0,.06) !important;
    flex: 0 0 auto !important;
    background: #fff !important;
    display: block !important;
}

.hcm-thumb-bi {
    width: 26px !important;
    height: 26px !important;
    border-radius: 6px !important;
    background: #f1f5f9 !important;
    color: #94a3b8 !important;
    border: 1px solid #e5e7eb !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    font-size: .75rem !important;
}

.hcm-thumb--sm {
    width: 20px !important;
    height: 20px !important;
    border-radius: 4px !important;
}

.hcm-thumb-bi--sm {
    width: 20px !important;
    height: 20px !important;
    border-radius: 4px !important;
    font-size: .65rem !important;
}

/* ── Level containers ── */
.hcm-level-1, .hcm-level-2 {
    width: 100% !important;
    flex-basis: 100% !important;
}

.hcm-level-2 {
    background: rgba(var(--sa-category-mobile-rgb), var(--sa-category-mobile-opacity-lvl2)) !important;
    border-top: 1px solid rgba(var(--sa-text-rgb),.06) !important;
}