@use "/src/scss/abstracts/" as *;

.section-header {
    gap: $spacing-300;
    align-items: center;

    .section-title {
        padding-bottom: 0;
        font-size: 24px;
    }
}

.review-stats {
    display: flex;
    border-radius: $spacing-400;
    border: 1px solid $gray-light;
    align-content: center;
    align-items: center;
    overflow: hidden;
    flex-wrap: nowrap;

    div {
        padding: 0.6rem 1.2rem 0.3rem;
        line-height: 0.875em;
        font-size: $type-size-100;
        font-weight: bold;
        text-transform: uppercase;
        border-color: transparent;
        background-color: $gray-lighter;
        color: $gray-default;

        &:first-child {
            border-right: 1px solid $gray-light;
            background-color: $orange-default;
            color: $white;
        }
    }
}

note {
    icon {
        color: $teal-default;

        ::ng-deep svg {
            padding-top: $spacing-100;
        }
    }
}

.reviewed-items-toggle {
    display: flex;
    align-items: center;

    .switch {
        width: 2.5rem;
        margin-top: 0.75rem;
        margin-left: $spacing-100;

        .toggle {
            height: 1.27rem;

            &:before {
                bottom: 0.05rem;
                left: 0.05rem;
                height: 1rem;
                width: 1rem;
            }

            &:after {
                content: "";
            }
        }

        input:checked {
            & + .toggle {
                &:before {
                    transform: translateX(1.25rem);
                }
            }
        }
    }
}

qanat-grid ::ng-deep .ag-row .ag-cell.muted-text {
    a {
        color: $gray-default;
    }
}

.no-parcels-to-display {
    border: 3px dashed $gray-light;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: $gray-lighter;
    border-radius: $spacing-100;
    font-style: italic;
    color: $gray-dark;
}
