/* ── Editable cells (0.52.0, assets/table-edit.js) ───────────────────── */
/* The value and its edit button on one line; while editing, the field in its place with the error under it. */

.rooster-admin-edit {
	@apply relative inline-flex max-w-full items-center gap-1 align-middle;
}

.rooster-admin-edit[aria-busy="true"] {
	@apply opacity-60;
}

.rooster-admin-edit__shown {
	@apply min-w-0;
}

/* A table whose cells open on a click or a double click (edit( frame, { open } )): the cell is the target. */
.is-edit-click .rooster-admin-edit__shown,
.is-edit-dblclick .rooster-admin-edit__shown {
	@apply cursor-text;
}

.rooster-admin-edit__open {
	@apply inline-flex h-6 w-6 flex-none cursor-pointer items-center justify-center rounded-md border-0 bg-transparent text-secondary-foreground;

	@variant hover {
		@apply bg-muted text-foreground;
	}
}

/* The open field lies over its cell, out of the table's flow (0.63.1): the cell keeps its box (the value under it,
   unseen), so neither its row nor its column moves and the table is not laid out again; centred on the value's line,
   the error under it. In a number column it is anchored to the cell's end. */
.rooster-admin-edit__form {
	@apply absolute start-0 top-1/2 z-20 -mt-4 inline-flex flex-col gap-1;
}

.rooster-admin-table__td.is-num .rooster-admin-edit__form {
	@apply start-auto end-0 items-end whitespace-normal; /* its error wraps, as in any cell */
}

/* In a cell the field is the dense control; a number is short. */
.rooster-admin .rooster-admin-edit__field {
	@apply h-8 w-auto min-w-40 shadow-sm;
}

.rooster-admin .rooster-admin-edit__field[type="number"] {
	@apply w-28 min-w-0;
}

/* A choice is the searchable select (select.js makes every select on a chrome screen one): its box, the same height. */
.rooster-admin-edit__form .rooster-admin-combo {
	@apply w-auto min-w-40;
}

.rooster-admin-edit__error {
	@apply max-w-64 rounded-sm bg-background px-1 text-xs text-destructive-foreground shadow-sm;
}