/* Catalog dropdown — left column (headings + L1 sections).
   Used by header (bitrix:menu/main_with_image) and section page (marchenkov:section.children_v2). */

.nav-submenu {
    padding: 0;
    margin: 0;
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-start;
    list-style: none;
    font-size: 24px;
    line-height: 1;
}

.nav-submenu__item {
    position: relative;
    padding-left: 0;
}

.nav-submenu__item a.nav-link {
    height: 42px;
    display: flex;
    align-items: center;
    padding-right: 40px;
    transition: color 0.2s;
    color: #202020;
    text-decoration: none;
}

.nav-submenu__item a.nav-link:hover {
    color: var(--currentDarkBlue);
}

.nav-submenu__item.is-active a.nav-link {
    color: var(--currentDarkBlue);
}

.nav-submenu__item .nav-submenu-arrow {
    display: none;
    width: 13px;
    height: 8px;
    color: var(--currentDarkBlue);
    margin-right: 8px;
}

.nav-submenu__item.is-active .nav-submenu-arrow {
    display: inline-flex;
    align-items: center;
}

/* Headings: «Каталог продукции» / «Коллекции» — bold + triangle marker */
.nav-submenu__item--heading {
    font-weight: bold;
}

/* Enlarged gap around headings vs L1↔L1 rhythm (42px).
   Relies on headings being first/last child — revisit if L1 order changes. */
.nav-submenu__item--heading:first-child {
    margin-bottom: 12px;
}

.nav-submenu__item--heading:last-child {
    margin-top: 12px;
}

.nav-submenu__item--heading a.nav-link {
    font-weight: bold;
}

.nav-submenu__item--heading:first-child .nav-submenu-arrow {
    display: inline-flex;
    align-items: center;
    color: #202020;
}

.nav-submenu__item--heading:first-child a.nav-link:hover .nav-submenu-arrow,
.nav-submenu__item--heading:first-child.is-active .nav-submenu-arrow {
    color: var(--currentDarkBlue);
}

.nav-submenu__item--heading:last-child a.nav-link::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 10px;
    border-radius: 50%;
    background: #202020;
}

.nav-submenu__item--heading:last-child a.nav-link:hover::before {
    background: var(--currentDarkBlue);
}

/* Section page parent (collapsible overlay) — symmetric outer padding
   around the L1 list so top/bottom gaps match the reference (≈48px).
   Kept in the shared component stylesheet so all L1-list spacing lives in one place. */
.collapsible-content.active .container {
    padding-top: 48px;
    padding-bottom: 48px;
}