/* Wider layout: break out of the default container (max ~1320px)
   and use full width up to 1920px for ultrawide support */
.translator-workspace {
    max-width: 1920px;
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    padding-left: calc(50vw - 960px);
    padding-right: calc(50vw - 960px);
}

@media (max-width: 1920px) {
    .translator-workspace {
        padding-left: 2rem;
        padding-right: 2rem;
    }
}

@media (max-width: 992px) {
    .translator-workspace {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        padding-left: 1rem;
        padding-right: 1rem;
        left: auto;
        right: auto;
    }
}

.translator-workspace .table th:nth-child(1),
.translator-workspace .table td:nth-child(1) { width: 8%; }

.translator-workspace .table th:nth-child(2),
.translator-workspace .table td:nth-child(2) { width: 18%; }

.translator-workspace .table th:nth-child(3),
.translator-workspace .table td:nth-child(3) { width: 37%; }

.translator-workspace .table th:nth-child(4),
.translator-workspace .table td:nth-child(4) { width: 37%; }

/* Allow tag/text column to wrap */
.translator-workspace .table td:nth-child(2) {
    word-break: break-word;
    overflow-wrap: break-word;
}

.translator-workspace .editable-cell {
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 3px;
    min-height: 1.5em;
    display: inline-block;
    width: 100%;
}

.translator-workspace .editable-cell:hover {
    background-color: rgba(170, 90, 255, 0.1);
}

.translator-workspace .text-cell {
    white-space: pre-wrap;
    word-break: break-word;
}

.translator-workspace .edit-group {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 4px;
}

.translator-workspace .edit-group > textarea,
.translator-workspace .edit-group > input {
    flex: 1;
    min-width: 0;
}

.translator-workspace .edit-actions {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex-shrink: 0;
}

.translator-workspace textarea.auto-grow {
    resize: none;
    overflow: hidden;
    min-height: 31px;
    background-color: var(--osr-bg-card, #0a1128);
    color: var(--osr-text-primary, #f0f0f8);
    border-color: rgba(170, 90, 255, 0.15);
}

.translator-workspace textarea.auto-grow:focus {
    border-color: var(--osr-lila, #AA5AFF);
    box-shadow: 0 0 0 0.2rem rgba(170, 90, 255, 0.15);
}

.translator-workspace .disabled-cell {
    color: var(--osr-text-muted, rgba(240, 240, 248, 0.45));
    font-style: italic;
}

.translator-workspace .tag-cell {
    font-weight: 600;
    font-size: 0.85em;
    color: var(--osr-tuerkis, #69F5C8);
}

.translator-workspace .devtext-cell {
    font-size: 0.85em;
    color: var(--osr-text-secondary, rgba(240, 240, 248, 0.7));
}