:root {
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-border-radius-xl: 0;
    --bs-border-radius-xxl: 0;
    --bs-border-radius-pill: 0;
}

*,
*::before,
*::after {
    border-radius: 0 !important;
}

.form-switch .form-check-input {
    border-radius: 2em !important;
}

.transcription-dialog {
    padding: .15rem .75rem .5rem;
}

.transcription-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.25rem;
    align-items: center;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);
    font-size: .75rem;
}

.transcription-meta-item {
    display: inline-flex;
    gap: .35rem;
    align-items: center;
}

.transcription-meta-item strong {
    color: var(--bs-body-color);
    font-weight: 500;
}

.transcription-meta-item--operator > i {
    color: var(--bs-primary);
}

.transcription-meta-item--client > i {
    color: var(--bs-success);
}

.transcription-message {
    position: relative;
    display: grid;
    grid-template-columns: 3rem minmax(8.5rem, 11.5rem) minmax(0, 1fr);
    gap: .25rem .6rem;
    width: 100%;
    margin: 0;
    padding: .45rem .25rem .45rem 1.1rem;
    border: 0;
    border-left: 1px solid var(--bs-border-color);
    background: transparent;
    text-align: left;
}

.transcription-timeline-marker {
    position: absolute;
    top: .75rem;
    left: -.3rem;
    padding: .08rem 0;
    background: var(--bs-body-bg);
    color: var(--bs-border-color);
    font-size: .55rem;
    line-height: 1;
}

.transcription-message--operator .transcription-timeline-marker {
    color: var(--bs-primary);
}

.transcription-message--client .transcription-timeline-marker {
    color: var(--bs-success);
}

.transcription-message-time {
    padding-top: .12rem;
    color: var(--bs-secondary-color);
    font-size: .75rem;
    font-variant-numeric: tabular-nums;
    line-height: 1.3;
}

.transcription-speaker-badge {
    display: inline-flex;
    gap: .25rem;
    align-items: center;
    align-self: start;
    min-width: 0;
    padding: .18rem .35rem;
    background: var(--bs-secondary-bg);
    color: var(--bs-secondary-color);
    font-size: .6rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
}

.transcription-speaker-badge span {
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}

.transcription-message--operator .transcription-speaker-badge {
    background: #e7f1ff;
    color: #0a58ca;
}

.transcription-message--client .transcription-speaker-badge {
    background: #e8f5e9;
    color: #198754;
}

.transcription-message-text {
    min-width: 0;
    color: var(--bs-body-color);
    font-size: .875rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

@media (max-width: 575.98px) {
    .transcription-dialog {
        padding-right: .75rem;
        padding-left: .75rem;
    }

    .transcription-message {
        grid-template-columns: 2.6rem minmax(0, 1fr);
        padding: .4rem .15rem .4rem .9rem;
    }

    .transcription-message-text {
        grid-column: 2;
    }
}
