/**
 * @deprecated tag:v6.6.0 - File "_aside-children.scss" will be removed. The corresponding templates were removed in v6.5.0. Please build upon the CSS for "line-item" instead.
 */

.cart-aside-item-children {
    background-color: $gray-100;
    width: 100%;
    margin-top: $spacer-sm;
    padding: 16px 16px 10px;
    order: 10;

    // Dynamic indentation of nested line items
    @for $i from 1 through 10 {
        $margin: ($i + 0.5) * 18px;
        .nesting-level-#{$i} {
            margin-left: $margin;
        }
    }

    .cart-aside-item-children-elements {
        padding: 12px 0 0;
    }

    .cart-aside-item-headline {
        padding: 0;
        font-weight: $font-weight-semibold;
    }

    .cart-aside-item-change-button {
        width: fit-content;
        margin: 0 12px;
        font-size: 12px;
        text-decoration: underline;
        background-color: transparent;
        border-style: none;

        &:focus {
            outline: none;
        }
    }

    .cart-aside-item-collapse {
        margin: 0;
    }

    .cart-aside-item-collapse-container,
    .cart-aside-item-child-label {
        padding: 0;
    }

    .cart-aside-item-collapse-icon-container {
        padding: 0;
        text-align: right;
    }

    .cart-aside-item-collapse-button {
        background-color: transparent;
        border-style: none;

        &:focus {
            outline: none;
        }
    }

    .cart-aside-item-collapse-button > .cart-aside-item-collapse-icon {
        transform: rotate(180deg);
        transition: all 0.2s ease-out;
    }

    .cart-aside-item-collapse-button.collapsed > .cart-aside-item-collapse-icon {
        transform: rotate(0deg);
    }

    .cart-aside-item-children-element {
        margin: 0;
        padding: 8px 4px 0;
    }

    .cart-aside-item-children-element > .nesting-level-0 {
        list-style: none;
    }

    .cart-aside-item-children-element:last-child,
    .cart-aside-item-children-element-divider:last-child {
        border-style: none;
    }

    .cart-aside-item-child-label-bullet {
        display: list-item;
    }

    .cart-aside-item-child-total-price {
        padding: 0;
        text-align: right;
        font-weight: $font-weight-semibold;
    }

    .cart-aside-item-children-element-divider {
        border-top: 1px solid $sw-border-color;
        margin: $spacer-md 0;
    }
}
