/* AG-Grid theme overrides for the EasyFile cabinet hitlist.
   The base theme is ag-theme-alpine; these overrides bring it in line with the
   existing CabinetWorkspace table styling (row height, selected/checked tints,
   strikethrough for deleted rows). */

.ef-ag-grid {
    --ag-font-family: var(--ef-font-family, system-ui, -apple-system, "Segoe UI", sans-serif);
    --ag-font-size: var(--ef-text-13, 13px);
    --ag-row-height: 32px;
    --ag-header-height: 36px;
    --ag-header-background-color: var(--ef-surface-2, #f8f9fa);
    --ag-header-foreground-color: var(--ef-text, #1a1a1a);
    --ag-row-hover-color: var(--ef-blue-bg, rgba(96, 165, 250, 0.08));
    /* Bind AG-Grid's selected-row tint to the design-system token so the cabinet
       hitlist matches the rest of the app. Falls back to the previous blue if
       the token isn't defined yet. */
    --ag-selected-row-background-color: var(--ef-selected-bg, rgba(96, 165, 250, 0.18));
    --ag-border-color: var(--ef-border, rgba(0, 0, 0, 0.12));
    --ag-cell-horizontal-padding: 8px;
    width: 100%;
    height: 100%;
    min-height: 200px;
}

/* Row state classes set via gridOptions.rowClassRules */
/* Viewed-doc row: stronger highlight than AG-Grid's default subtle selection
   tint so the user can spot which record is in the viewer at a glance. Uses the
   design-system selected-bg token (amber/yellow) and a primary-colored left
   border for accent. */
.ef-ag-grid .ef-grid-selected {
    background-color: var(--ef-selected-bg, rgba(37, 99, 235, 0.12)) !important;
    box-shadow: inset 3px 0 0 0 var(--ef-color-primary, #2563eb);
    font-weight: 500;
}
.ef-ag-grid .ef-grid-selected .ag-cell {
    background-color: transparent !important;
}

/* v7.699 — the record a merge merged INTO. Green, not the selection's tint: .ef-grid-selected
   answers "what is in the viewer" and moves on the next click, this answers "what did the merge
   produce" and stays until the next search. On the one row that is both (immediately after a
   merge) the two combine deliberately — the selection's !important background keeps showing which
   row is open, and this rule, later in source, turns the left rail green to mark the result. */
.ef-ag-grid .ef-grid-merged {
    background-color: var(--ef-green-bg, rgba(22, 163, 74, 0.10));
    box-shadow: inset 3px 0 0 0 var(--ef-green, #16a34a);
}

.ef-ag-grid .ef-grid-merged .ag-cell {
    background-color: transparent !important;
}

.ef-ag-grid .ef-grid-checked {
    background-color: var(--ef-yellow-bg, rgba(255, 215, 0, 0.10)) !important;
}

.ef-ag-grid .ef-grid-deleted {
    text-decoration: line-through;
    color: var(--ef-text-muted, #999);
}

/* Make the action / edit-doc / folder-count columns look right next to a
   normal data column — center their inline buttons. */
.ef-ag-grid .ag-cell[col-id="__action"],
.ef-ag-grid .ag-cell[col-id="__edit_doc"],
.ef-ag-grid .ag-cell[col-id="__folder_count"],
.ef-ag-grid .ag-cell[col-id="__ai_status"],
.ef-ag-grid .ag-cell[col-id="__doc_present"],
.ef-ag-grid .ag-cell[col-id="__status"] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
}

/* Status column header — drop the default 8px horizontal padding + remove the
   text-overflow:ellipsis on its label so "Status" renders fully even when the
   user's saved column state shrunk the column. */
.ef-ag-grid .ag-header-cell[col-id="__status"] {
    padding-left: 4px !important;
    padding-right: 4px !important;
}
.ef-ag-grid .ag-header-cell[col-id="__status"] .ag-header-cell-text {
    overflow: visible !important;
    text-overflow: clip !important;
}

/* Slightly thicker right border on the last pinned (sticky) column,
   mirroring the existing border-right:2px on .sticky-col. */
.ef-ag-grid .ag-pinned-left-cols-container .ag-cell:last-child,
.ef-ag-grid .ag-pinned-left-header .ag-header-cell:last-child {
    border-right: 2px solid var(--ef-border-strong, var(--ef-border));
}

/* ── Cell text wrapping ──
   AG-Grid's defaults set white-space:nowrap on the cell so long values get
   truncated with text-overflow:ellipsis. We pair the JS defaultColDef
   `wrapText:true` + `autoHeight:true` with these CSS overrides so values
   actually wrap and the row grows to fit. Excludes the icon/action columns
   (their inner buttons must stay on one line). */
.ef-ag-grid .ag-cell:not([col-id="__action"]):not([col-id="__edit_doc"]):not([col-id="__folder_count"]):not([col-id="__ai_status"]):not([col-id="__doc_present"]):not([col-id="__status"]) {
    white-space: normal !important;
    text-overflow: clip !important;
    overflow: visible;
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.35;
    padding-top: 6px;
    padding-bottom: 6px;
}
