.nx-line-editor {
    display: flex;
    flex-direction: column;
    width: 100%;
    font-family: var(--nx-font);
    color: var(--nx-primary-fg);
    margin: var(--nx-margin);
    grid-column: -1 / 1;
}

.nx-line-editor__table {
    width: 100%;
    border-collapse: collapse;
    border-radius: var(--nx-border-radius);
    border: var(--nx-border-width) solid var(--nx-border-color);
    overflow: hidden;
}

    .nx-line-editor__table thead tr {
        background-color: var(--nx-secondary-bg);
    }

    .nx-line-editor__table th {
        padding: var(--nx-space-small) var(--nx-space);
        text-align: left;
        font-weight: 600;
        font-size: 0.85rem;
        color: var(--nx-secondary-fg);
        border-bottom: var(--nx-border-width) solid var(--nx-border-color);
        white-space: nowrap;
    }

    .nx-line-editor__table td {
        padding: 0 var(--nx-space-small);
        vertical-align: middle;
        border-bottom: var(--nx-border-width) solid var(--nx-border-color);
    }

.nx-line-editor__row:last-child td {
    border-bottom: none;
}

.nx-line-editor__row:hover {
    background-color: color-mix(in srgb, var(--nx-highlight-bg) 30%, transparent);
}

/* Left-edge focus indicator */
.nx-line-editor__row:focus-within td:first-child {
    box-shadow: inset 3px 0 0 var(--nx-highlight-fg);
}

/* Fit inputs to their cell — leave all visual styles untouched */
.nx-line-editor__table .nx-input {
    margin: 0;
    width: 100%;
    min-width: 0;
}

/* ── Delete strip ─────────────────────────────────────────────────────────── */

/* Header slot — invisible, just reserves column width */
.nx-line-editor__table thead th.nx-line-editor__action-col {
    width: 4px;
    padding: 0;
    background-color: transparent;
    border: none;
}

/* Body strip — starts as a faint red accent on the row's right edge */
.nx-line-editor__table tbody td.nx-line-editor__action-col {
    width: 4px;
    padding: 0;
    overflow: hidden;
    background-color: var(--nx-negative-fg);
    opacity: 0.2;
    transition: width 0.18s ease, opacity 0.18s ease;
    vertical-align: middle;
}

/* Expand on row hover */
.nx-line-editor__row:hover td.nx-line-editor__action-col {

    opacity: 1;
}

/* Button fills the expanded strip */
.nx-line-editor__del-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 100%;
    min-height: 34px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    box-shadow: none;
    margin:0px;

}



/* Pin icon to white so it reads against the red background */
.nx-line-editor__action-col .nx-icon,
.nx-line-editor__action-col .nx-icon i {
    color: white !important;
    font-size: 0.85rem;
}

/* ── Empty state ──────────────────────────────────────────────────────────── */

.nx-line-editor__empty {
    padding: var(--nx-space);
    text-align: center;
    color: var(--nx-muted-fg);
    font-style: italic;
}

/* ── Footer ───────────────────────────────────────────────────────────────── */

.nx-line-editor__footer {
    display: flex;
    justify-content: flex-end;
    padding-top: 0;               /* flush against the table's bottom edge */
}

/* Compact add-line tab — hangs below the action column */
.nx-line-editor__add-btn {
    display: flex;
    align-items: center;
    justify-content: center;
   
  
    background: var(--nx-secondary-bg);
    border: var(--nx-border-width) solid var(--nx-border-color);
    border-top: none;                           /* merges with table border  */
    border-radius: 0 0 var(--nx-border-radius) var(--nx-border-radius);
    cursor: pointer;
  

    box-shadow: none;

    opacity: 0.6;
    transition: opacity 0.18s ease, color 0.18s ease, background-color 0.18s ease;
    margin:0px;
    zoom:0.8;
}

.nx-line-editor__add-btn:hover {
    opacity: 1;
   
    background-color: color-mix(in srgb, var(--nx-highlight-bg) 40%, transparent);
}

.nx-line-editor__add-btn .nx-icon,
.nx-line-editor__add-btn .nx-icon i {
    font-size: 0.75rem;
}