.ugpfrm {
    padding: 1.5rem 2rem;

    .ugp_grid {
        border: 1px solid #e2e2e2;
        border-radius: 0.5rem;
        background: #fff;
        box-shadow: 0 1px 3px rgba(50, 50, 50, 0.1);
        overflow: hidden;
        max-width: 32rem;
    }

    .ugp_row {
        display: grid;
        grid-template-columns: 1fr;
        align-items: center;
        padding: 0.55rem 1rem;
        border-bottom: 1px solid #eee;

        &:last-child { border-bottom: none; }
    }

    .ugp_row_hd {
        background: $fuchs_blau;
        color: #fff;
        font-weight: bold;
        font-size: 0.85rem;
        text-transform: uppercase;
        letter-spacing: 0.02em;
        padding: 0.5rem 1rem;
    }

    .ugp_row:not(.ugp_row_hd) {
        cursor: pointer;
        transition: background-color 0.12s ease-in-out;

        &:hover { background-color: #f3f6fb; }

        &.selected {
            background-color: rgba($fuchs_akzent, 0.12);
            box-shadow: inset 3px 0 0 $fuchs_akzent;
        }
    }

    .ugp_col_name { font-weight: 600; color: #222; }

    .ugp_empty {
        padding: 1.5rem 1rem;
        text-align: center;
        color: #777;
    }

    .ugp_err {
        padding: 1rem 2rem;
        color: #b00020;
        font-weight: bold;
    }
}