﻿
.dotation-replace-article {
    width: 97%;
    display: flex;
    flex-direction: column;
    padding: 0.625rem;
    gap: 1.875rem;
    align-items: flex-start;
}

    .dotation-replace-article .combo {
        width: 100%;
    }



.replace-item .article {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
    padding: 0.25rem;
    gap:  0.5rem;
}

.image {
    max-width: 3.75rem;
    max-height: 5rem;
}
  
    .replace-item .article .article-center-part {
        height: 4.5rem;
        width: 16.25rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        padding-left: .75rem;
        gap: .2rem;
    }

        .replace-item .article .article-center-part .old-reference {
            font-size: 0.875rem;
            color: gray;
        }


        .replace-item .article .article-center-part .material-number {
            font-size: 0.8125rem;
            color: gray;
        }

        .replace-item .article .article-center-part .description {
            white-space: nowrap;
            font-weight: 500;
            font-size: 0.938rem;
            width: inherit;
            text-overflow: ellipsis;
            overflow: hidden;
        }

        .replace-item .article .article-center-part .shortext {
            font-size: 0.875rem;
        }





.recap-dotation {
}

    .recap-dotation .recap-group {
        display: flex;
        flex-direction: row;
        gap: 0.3125rem;
    }

        .recap-dotation .recap-group .recap-group-item {
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 0.625rem;
            padding: 0.3125rem 0.9375rem;
            align-items: center;
            border: 1px solid var(--borders);
        }

            .recap-dotation .recap-group .recap-group-item .bottom-container {
                display: flex;
                flex-direction: row;
                justify-content: center;
                gap: 0.625rem;
                align-items: center;
            }

                .recap-dotation .recap-group .recap-group-item .bottom-container .article-ref {
                }

                .recap-dotation .recap-group .recap-group-item .bottom-container .article-count {
                    width: 1.5rem;
                    height: 1.5rem;
                    justify-content: center;
                    display: flex;
                    align-items: center;
                    border-radius: 50%;
                    font-size: 0.75rem;
                    line-height: 1rem;
                    color: var(--white);
                    background-color: #DB504A;
                }
