:root {
    --nb-attribute-value-box-2-max-height: 54px;
    --nb-attribute-value-box-2-padding-x: 16px;
    --nb-attribute-value-box-2-padding-y: 12px;
    --nb-attribute-value-box-2-hover-bg: var(--nb-color-gray-300);

    --nb-attribute-value-box-2-image-max-height: 30px;

    --nb-attribute-value-box-2-name-color: var(--nb-text-color-primary);
    --nb-attribute-value-box-2-name-font-size: var(--nb-font-size-14);
    --nb-attribute-value-box-2-name-font-weight: var(--nb-font-weight-400);
    --nb-attribute-value-box-2-name-line-height: 20px;
}

.nb-attribute-value-box-2 {
    display: flex;
    align-items: center;
    gap: 10px;
    max-height: var(--nb-attribute-value-box-2-max-height);
    padding: var(--nb-attribute-value-box-2-padding-y) var(--nb-attribute-value-box-2-padding-x);
}

.nb-attribute-value-box-2:hover {
    background-color: var(--nb-attribute-value-box-2-hover-bg);
}

.nb-attribute-value-box-2 .nb-attribute-value-image {
    max-height: var(--nb-attribute-value-box-2-image-max-height);
}

.nb-attribute-value-box-2 .nb-attribute-value-name {
    color: var(--nb-attribute-value-box-2-name-color);
    font-size: var(--nb-attribute-value-box-2-name-font-size);
    font-weight: var(--nb-attribute-value-box-2-name-font-weight);
    line-height: var(--nb-attribute-value-box-2-name-line-height);
}

@media screen and (max-width: 991px) {
    .nb-attribute-value-box-2 {
        justify-content: flex-start;
    }
}