/*
 * variation-builder.css — Styles spécifiques au tableau de variation.
 * Les règles communes avec le tableau de signe sont dans builders-common.css
 * (chargé avant ce fichier). Ne dupliquez pas ici .vb-card, .x-tag*, .preview-grid,
 * .row, .add-mini-btn, .sim-table/row/cell/label/track-wrapper/item/interval, .ghost.
 */
.label-cell {
    width: 80px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.label-cell .label-rendered {
    width: 100%;
    border: 1px solid var(--mc-tool-border-strong);
    border-radius: 4px;
    padding: 4px;
    text-align: center;
    background: var(--mc-tool-surface);
    cursor: pointer;
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sign-track,
.var-track {
    display: flex;
    align-items: center;
    flex: 1;
}

.sim-node {
    width: 60px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* .sign-interval diverge du tableau de signe (40px vs 48px) → reste ici */
.sign-interval {
    flex: 1;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--mc-tool-text-soft);
    font-weight: bold;
    min-width: 40px;
}

.var-node {
    width: 60px;
    min-height: 40px;
    border: 1px solid var(--mc-tool-border-strong);
    border-radius: 4px;
    background: var(--mc-tool-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem;
}

.var-rendered {
    width: 100%;
    text-align: center;
    border: none;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
}

.split-node {
    width: 60px;
    padding: 0;
    overflow: hidden;
}

.split-side {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.split-divider {
    width: 1px;
    background: var(--mc-tool-border);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    color: var(--mc-tool-text-muted);
}

.var-spacer {
    flex: 1;
    min-width: 40px;
}

/* Simulated Preview — .sim-node et .d-bar divergent du tableau de signe */
.sim-node {
    width: 40px;
    position: relative;
}

.d-bar {
    height: 100%;
    width: 4px;
    border-left: 1px solid var(--mc-tool-table-line);
    border-right: 1px solid var(--mc-tool-table-line);
}

.sim-var-node {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 120px;
}

.pos-high {
    justify-content: flex-start;
    padding-top: 2px;
}

.pos-low {
    justify-content: flex-end;
    padding-bottom: 2px;
}

.sim-var-interval {
    height: 120px;
    position: relative;
}

.split-node {
    flex-direction: row;
    align-items: stretch;
    width: 60px;
}

.split-part {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.split-bar {
    width: 4px;
    border-left: 1px solid var(--mc-tool-table-line);
    border-right: 1px solid var(--mc-tool-table-line);
}