.torque-list-item {
    background-color: var(--neutralcolor-white);
    display: flex;
    padding: 0 var(--spacing-token-md);
    color: var(--neutralcolor-dark);
    position: relative;
    border-bottom: none;
    align-items: center;
    margin: 0 var(--spacing-token-md);
    border-bottom: 1px solid var(--neutralcolor-light);
}

.torque-list-item--contrast {
    padding: 0 var(--spacing-token-md);
    margin: 0;
    border-bottom: none;
}

.torque-list-item__link {
    align-items: center;
    column-gap: var(--spacing-layout-3xs);
    padding: var(--spacing-token-sm) 0;
    display: flex;
    grid-template-columns: repeat(auto-fit, minmax(min-content, 0));
    white-space: nowrap;
    width: var(--full-width);
    cursor: pointer;
}

.torque-list-item--contrast::after {
    background-image: url(/comum/novo-menu/images/icons/24/neutral-white/seta-direita.svg);
}

.torque-list-item__description-container {
    display: grid;
    font-size: var(--font-size-2xs);
    font-weight: var(--font-weight-sm);
    grid-row-gap: var(--spacing-token-3xs);
}

.torque-list-item--contrast {
    font-weight: var(--font-weight-sm);
}

.torque-list-item--first {
    order: -1;
}

.torque-list-item__img {
    width: var(--spacing-layout-sm);
    height: var(--spacing-layout-sm);
}

.torque-list-item__img--small,
.torque-list-item__img--2xs {
    width: var(--spacing-layout-2xs);
    height: var(--spacing-layout-2xs);
}

.torque-list-item__img--xs {
    width: var(--spacing-layout-xs);
    height: var(--spacing-layout-xs);
}

.torque-list-item__name {
    color: var(--brandcolor-primary-medium);
    font-size: var(--font-size-xs);
}

.torque-list-item__description {
    color: var(--neutralcolor-medium);
    font-size: var(--font-size-2xs);
    display: none;
}

/* SLIM */
.torque-list-item--slim {
    display: flex;
    align-items: center;
    border-bottom: none;
    width: auto;
    height: var(--spacing-token-xs);
    margin: var(--spacing-token-xs) 0 0;
}

.torque-list-item--chevron-right-sm::after {
    content: "";
    width: var(--spacing-layout-2xs);
    height: var(--spacing-layout-2xs);
    background-image: url(/comum/novo-menu/images/icons/12/neutral-medium/seta-direita.svg);
    background-position: center;
    background-repeat: no-repeat;
}

/* MEGAMENU */
.torque-list-item--megamenu:after {
    display: none;
}


@media screen and (min-width: 1024px) {
    .torque-list-item {
        color: inherit;
        border-bottom: 1px solid var(--neutralcolor-light);
    }

    .torque-list-item::after {
        background-image: none;
        width: 0;
    }

    .torque-list-item:not(.torque-list-item--megamenu) {
        margin: 0;
        border-bottom: none;
        height: 64px;
    }

    .torque-list-item:not(.torque-list-item--contrast) {
        padding: 0;
    }

    .torque-list-item__img {
        width: var(--spacing-layout-2xs);
        height: var(--spacing-layout-2xs);
    }

    .torque-list-item--login .torque-list-item__img {
        width: var(--spacing-layout-2xs);
        height: var(--spacing-layout-2xs);
    }

    .torque-list-item__link {
        color: var(--brandcolor-primary-medium);
        text-decoration: none;
    }

    .torque-list-item__link--with-enhancer {
        padding: var(--spacing-token-xs) var(--spacing-token-md);
    }

    .torque-list-item--dt-last {
        order: 99;
        padding: 0;
    }

    .torque-list-item__link--with-enhancer {
        justify-content: center;
    }

    .torque-list-item__link:not(.torque-list-item__link--with-enhancer) .torque-list-item__img {
        display: none;
    }

    .torque-list-item:not(.torque-list-item--contrast)::after {
        background-color: var(--brandcolor-secondary-medium);
        bottom: 0;
        left: -5px;
        width: calc(100% + 10px);
        content: '';
        display: block;
        height: 2px;
        position: absolute;
        transition: width var(--dur);
    }

    .torque-list-item:not(.torque-list-item--active)::after {
        width: 0;
    }

    .torque-list-item:hover:before {
        transform: scaleY(1);
    }

    .torque-list-item:hover:before {
        transform: scaleY(1);
    }

    .torque-list-item__name {
        font-size: var(--font-size-2xs);
        font-weight: var(--font-weight-md);
    }

    .torque-list-item__description {
        display: block;
    }

    .torque-list-item--megamenu:hover {
        background-color: var(--neutralcolor-lightest);
    }

    .torque-list-item--megamenu:not(.torque-list-item--slim):hover:after {
        width: 0;
    }

    .torque-list-item__img--megamenu {
        display: block !important;
    }

    .torque-list-item__link--megamenu {
        padding: var(--spacing-token-md);
        column-gap: var(--spacing-layout-xs);
    }

    #torque-megamenu--login {
        padding: 0;
        margin: 0;
    }

    #torque-megamenu--login .torque-list-item {
        margin: 0;
        width: 100%;
        height: 50px;
        padding: 12px;
        border: none;
    }

    #torque-megamenu--login .torque-list-item__link {
        margin: inherit;
        width: inherit;
        padding:inherit;
    }
}

#login-button-link.bg-primary {
    background-color: white;
}

#login-button-link .label__onLight {
    color: #3D3A34;
}

@media only screen and (max-width: 1023px) {
    /*card body mobile*/

    .diviser {
        display: none;
    }

    :not(#login-button).torque-list-item {
        border: 1px solid var(--ids_color_action_neutral_base);
        border-radius: calc(var(--border-radius-lg) * 2);
        width: 100%;
        height: 130px;
        margin: 0;
        padding: 0;
    }

    /*login button body*/
    #login-button.torque-list-item {
        width: 100%;
        padding: 0;
        grid-row:7;
        grid-column: 1;
    }

    /*card layout mobile*/
    :not(#login-button) .torque-list-item__link{
        padding: var(--spacing-token-2xs);
        display: flex;
        height: 100%;
        justify-content: space-between;
        align-items: flex-start;
        flex-direction: column;
    }

    #login-button {
        width: inherit;
        height: 90px;
        position: fixed;
        z-index: 1000;
        bottom: 0;
    }

    #login-button-link.bg-primary {
        background-color: var(--ids_color_action_primary_base);
    }

    a.bg-primary:hover, a.bg-primary:focus {
        background-color: var(--ids_color_action_primary_base);
    }

    .bg-variant-1 {
        background-color: var(--ids_color_bg_variant_01);
    }

    #login-button .torque-list-item__link {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        padding: 0 2rem;
    }

    #login-button .torque-list-item__img {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #torque-image-wrapper {
        background-color: white;
        border-radius: 100%;

        width: var(--spacing-layout-md);
        height: var(--spacing-layout-md);

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .authenticated #torque-image-wrapper {
        border: 1px solid black;
    }

    .torque-list-item__img {
        width: var(--ids_spacing_4x);
    }
}
