::deep table.main-grid {
    margin-bottom: 1px !important; /* make bottom table row border visible when scrolling */
}

::deep .trace-row-error,
::deep .trace-row-error fluent-button[appearance=lightweight]:not(:hover)::part(control) {
    background-color: var(--log-error);
}

.trace-id {
    color: var(--foreground-subtext-rest);
    padding-left: 0.5rem;
    font-size: 12px;
    font-weight: normal;
}

.trace-tag {
    display: flex;
    align-items: center;
    border: 1px solid rgb(217, 217, 217);
    padding: 2px 7px;
    font-size: 12px;
    background-color: var(--neutral-fill-rest);
    color: var(--neutral-foreground-rest);
}

.trace-service-tag {
    border-left-width: 15px;
    margin-right: 7px;
}

::deep fluent-progress-ring::part(background) {
    stroke: var(--neutral-fill-input-alt-active);
}

::deep fluent-progress-ring::part(determinate) {
    transition: unset;
    stroke-linecap: unset;
}

::deep .duration-container {
    display: flex;
    align-items: center;
}

::deep .duration-ring {
    width: 20px;
    height: 20px;
}

::deep .trace-duration {
    padding-left: 10px;
}
