/* ===========================================================================
 * Category menu — flat text drill-down look.
 * Shared by the marketplace (adverts) and reseller shop left menus.
 * Plain CSS (not compiled from LESS) so it applies in dev without lessc.
 *
 * Scoped strictly to the CATEGORY parts only:
 *   - header:  .accordionMenuHeader.js_menuBlockCategories
 *   - items:   .js_advertCategories / .js_shopCategories  (accordion lists)
 * Brand and price blocks in the same .shopCategoryMenuWrapper are untouched.
 *
 * !important is used to override the many grey-block rules in shop.less that
 * target every drill-down state (base / openedCategory / currentCategory /
 * ancestorCategory) with higher-specificity selectors.
 * ======================================================================== */

/* --- category header ----------------------------------------------------- */
.shopCategoryMenuWrapper .accordionMenuHeader.js_menuBlockCategories {
    background: none !important;
    border-bottom: none !important;
    height: auto !important;
    padding: 14px 0 6px !important;
    overflow: hidden; /* clear the floated title so the first item drops below */
}

.shopCategoryMenuWrapper .accordionMenuHeader.js_menuBlockCategories span {
    color: #8a8a8a;
    font-size: 13px;
    font-weight: normal;
    padding: 0;
    float: none !important;
}

/* --- category items: flat text links, every drill-down state ------------- */
.shopCategoryMenuWrapper .js_advertCategories span,
.shopCategoryMenuWrapper .js_shopCategories span {
    background: none !important;
    border: none !important;
    color: #2f8fd0 !important;
    font-weight: normal !important;
    font-size: 14px;
    padding: 5px 0 5px 14px;
    display: block;
    position: relative;
    cursor: pointer;
}

.shopCategoryMenuWrapper .js_advertCategories span:hover,
.shopCategoryMenuWrapper .js_shopCategories span:hover {
    text-decoration: underline;
}

/* remove all the sprite arrows used by the old block design */
.shopCategoryMenuWrapper .js_advertCategories span:after,
.shopCategoryMenuWrapper .js_shopCategories span:after {
    display: none !important;
    background: none !important;
    content: none !important;
}

/* drill-down path (selected category + its ancestors): "◀ Title", no indent */
.shopCategoryMenuWrapper .js_advertCategories li.ancestorCategory > span,
.shopCategoryMenuWrapper .js_advertCategories li.currentCategory > span,
.shopCategoryMenuWrapper .js_shopCategories li.ancestorCategory > span,
.shopCategoryMenuWrapper .js_shopCategories li.currentCategory > span {
    padding-left: 0;
}

.shopCategoryMenuWrapper .js_advertCategories li.ancestorCategory > span:before,
.shopCategoryMenuWrapper .js_advertCategories li.currentCategory > span:before,
.shopCategoryMenuWrapper .js_shopCategories li.ancestorCategory > span:before,
.shopCategoryMenuWrapper .js_shopCategories li.currentCategory > span:before {
    content: "\25C0\00A0"; /* ◀ + nbsp */
    font-size: 11px;
}

/* nested sub-levels get a little extra indent */
.shopCategoryMenuWrapper .js_advertCategories ul ul span,
.shopCategoryMenuWrapper .js_shopCategories ul ul span {
    padding-left: 24px;
}