.ProductValidationInfoPopover {
    &-Content {
        background-color: var(--white);
        width: 550px;
        min-width: 550px;
        border: 0;
        border-radius: 3px;

        @include block-shadow;

        .pre-header {
            padding: 0.75rem;
            color: var(--gray-700);
        }

        table {
            font-size: 1rem;
            margin-bottom: 0;

            th {
                padding-top: 1.25rem;
            }

            th,
            tr,
            td {
                border: 1px solid $gray-300;
            }

            td {
                vertical-align: middle;
            }

            th,
            tr,
            td:first-of-type {
                border-left: 0;
                border-bottom: 0;
                min-width: 216px;
            }

            thead tr th {
                border-bottom: none;
            }

            th:last-of-type,
            tr,
            td:last-of-type {
                border-right: 0;
                border-bottom: 0;
            }

            svg {
                margin-right: 0.75rem;
                position: relative;
                bottom: 1px;
            }

            .warn {
                svg {
                    color: var(--warning);
                }
            }

            .error {
                svg {
                    color: var(--danger);
                }
            }

            .flag {
                svg {
                    color: var(--danger);
                }
            }

            .info {
                svg {
                    color: var(--info);
                }
            }
        }
    }
}