/**
 * This file used to be 100% hardcoded light-theme values (white dialog
 * background, #333 text, gray borders), completely independent of the
 * app's color scheme. That's the actual cause of the washed-out "New
 * Test" dialog: .el-dialog.cs-01 forced a solid white background no
 * matter what, while the dialog's own content (title, labels) already
 * follows the scheme via style/css/element-bridge.css / the g-t1 etc.
 * fix, under a dark scheme that's near-white text landing on a
 * hardcoded white background, which is why it read as pale/illegible
 * rather than simply "wrong color". Every value below now comes from
 * the same root schema tokens as the rest of the app (see
 * tri-3.5-frontend/public/css tokens.css / element-bridge.css); the
 * original hex/rgba is kept only as each var()'s fallback. box-shadow:
 * none is left exactly as authored, that was a deliberate choice, not
 * part of the color bug.
 */

.el-select.cs-01 .el-select__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--surface-2, rgba(150, 150, 150, .2));
    border: none;
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 500;
    color: var(--text, #333);
    cursor: pointer;
    min-width: 140px;

    .el-select__selected-item.el-select__placeholder.is-transparent {
        color: var(--text-faint, #333);
    }

    .el-icon svg {
        color: var(--text-dim, #333);
    }
}

.el-table-cs-01 {
    border: 1px solid var(--border, rgba(150, 150, 150, 0.3)) !important;
}

.el-table-row-cs-01 {
    background-color: var(--surface-2, #f1f1f1) !important;
}

/* Dialog */
.el-dialog.cs-01 {
    margin-bottom: 0;
    /*min-height: fit-content;*/
    background-color: var(--surface, rgba(255, 255, 255, 1));
    color: var(--text, #1e293b);
    border-radius: 6px;
    box-shadow: none;
    max-width: 98%;
    width: fit-content;
    min-width: 600px;
    margin-top: calc(68px) !important;
    max-height: calc(100vh - 88px);
    overflow: auto;
    scrollbar-width: thin;
}

.el-dialog.cs-small {
    margin-bottom: 0;
    /*min-height: fit-content;*/
    background-color: var(--surface, rgba(255, 255, 255, 1));
    color: var(--text, #1e293b);
    border-radius: 6px;
    box-shadow: none;
    width: fit-content;
    max-width: 900px;
    margin-top: calc(30px) !important;
    max-height: calc(100vh - 100px);
    overflow: auto;
    scrollbar-width: thin;
}