.dpc-manual-menu {
    --dpc-manual-menu-gap: 18px;
    --dpc-manual-menu-icon-box: 44px;
    --dpc-manual-menu-speed: 240ms;
    --dpc-manual-menu-divider: #edf0f2;
    --dpc-manual-menu-divider-width: 1px;
    --dpc-manual-menu-item-bg: #ffffff;
    --dpc-manual-menu-item-hover-bg: #f5f8eb;
    --dpc-manual-menu-item-active-bg: #caff1a;
    --dpc-manual-menu-text: #3f4652;
    --dpc-manual-menu-text-hover: #141414;
    --dpc-manual-menu-text-active: #101010;
    --dpc-manual-menu-icon: #646b73;
    --dpc-manual-menu-icon-hover: #101010;
    --dpc-manual-menu-icon-active: #101010;
    --dpc-manual-menu-arrow: #2e3339;
    --dpc-manual-menu-arrow-hover: #101010;
    --dpc-manual-menu-arrow-active: #101010;
    --dpc-manual-menu-arrow-offset: 3px;
    width: 100%;
    overflow: hidden;
    background: #ffffff;
    border-radius: 14px;
}

.dpc-manual-menu,
.dpc-manual-menu * {
    box-sizing: border-box;
}

.dpc-manual-menu-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dpc-manual-menu-item {
    min-width: 0;
    margin: 0;
    padding: 0;
}

.dpc-manual-menu-item:not(:last-child) {
    border-bottom: var(--dpc-manual-menu-divider-width) solid var(--dpc-manual-menu-divider);
}

.dpc-manual-menu-link {
    display: grid;
    grid-template-columns: var(--dpc-manual-menu-icon-box) minmax(0, 1fr) auto;
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: 78px;
    gap: var(--dpc-manual-menu-gap);
    padding: 16px 24px 16px 18px;
    background: var(--dpc-manual-menu-item-bg);
    color: var(--dpc-manual-menu-text);
    text-decoration: none;
    outline: none;
    transition:
        background-color var(--dpc-manual-menu-speed) ease,
        color var(--dpc-manual-menu-speed) ease,
        box-shadow var(--dpc-manual-menu-speed) ease;
}

.dpc-manual-menu-link:hover,
.dpc-manual-menu-link:focus-visible {
    background: var(--dpc-manual-menu-item-hover-bg);
    color: var(--dpc-manual-menu-text-hover);
    text-decoration: none;
}

.dpc-manual-menu-item.is-active .dpc-manual-menu-link {
    background: var(--dpc-manual-menu-item-active-bg);
    color: var(--dpc-manual-menu-text-active);
}

.dpc-manual-menu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--dpc-manual-menu-icon-box);
    min-width: 0;
    color: var(--dpc-manual-menu-icon);
    font-size: 28px;
    line-height: 1;
    transition:
        color var(--dpc-manual-menu-speed) ease,
        transform var(--dpc-manual-menu-speed) ease;
}

.dpc-manual-menu-link:hover .dpc-manual-menu-icon,
.dpc-manual-menu-link:focus-visible .dpc-manual-menu-icon {
    color: var(--dpc-manual-menu-icon-hover);
}

.dpc-manual-menu-item.is-active .dpc-manual-menu-icon {
    color: var(--dpc-manual-menu-icon-active);
}

.dpc-manual-menu-text {
    display: block;
    min-width: 0;
    color: currentColor;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

.dpc-manual-menu-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: var(--dpc-manual-menu-arrow);
    font-size: 18px;
    line-height: 1;
    transition:
        color var(--dpc-manual-menu-speed) ease,
        transform var(--dpc-manual-menu-speed) ease;
}

.dpc-manual-menu-link:hover .dpc-manual-menu-arrow,
.dpc-manual-menu-link:focus-visible .dpc-manual-menu-arrow {
    color: var(--dpc-manual-menu-arrow-hover);
    transform: translateX(var(--dpc-manual-menu-arrow-offset));
}

.dpc-manual-menu-item.is-active .dpc-manual-menu-arrow {
    color: var(--dpc-manual-menu-arrow-active);
}

.dpc-manual-menu-icon svg,
.dpc-manual-menu-icon i,
.dpc-manual-menu-arrow svg,
.dpc-manual-menu-arrow i {
    display: block;
    width: 1em;
    height: 1em;
    color: currentColor;
    fill: currentColor;
}

.dpc-manual-menu-icon svg *,
.dpc-manual-menu-arrow svg * {
    fill: currentColor;
    stroke: currentColor;
}

@media (max-width: 767px) {
    .dpc-manual-menu {
        --dpc-manual-menu-gap: 14px;
        --dpc-manual-menu-icon-box: 38px;
    }

    .dpc-manual-menu-link {
        min-height: 66px;
        padding: 13px 18px 13px 14px;
    }

    .dpc-manual-menu-text {
        font-size: 15px;
    }
}
