/* ── The table skin: toolbar, head, typed cells, row actions on hover, selection, footer ───────────── */
.rooster-admin-table {
	@apply @container flex flex-col;
}

.rooster-admin-table__toolbar {
	@apply flex flex-wrap items-end gap-2 border-b border-border px-4.5 py-2.5;
}

.rooster-admin-table__toolbar .rooster-admin-inputwrap,
.rooster-admin-table__toolbar .rooster-admin-input {
	@apply w-auto max-w-72;
}

/* The declared filters' bar in a table's toolbar (0.64.0): the toolbar's line, without the bar's own indent. A wide bar
   (a group, More filters: 0.68.24) takes the whole line, the table's tools (size, columns, export) at the end of the
   next, so its filters wrap on the toolbar's width, not on what the tools leave of it. */
.rooster-admin-table__toolbar > .rooster-admin-filters {
	@apply flex-1 ps-0;
}

.rooster-admin-table__toolbar
	> .rooster-admin-filters:has(.rooster-admin-filters__group, .rooster-admin-filters__more) {
	@apply basis-full;
}

.rooster-admin-table__toolbar:has(
	> .rooster-admin-filters .rooster-admin-filters__group,
	> .rooster-admin-filters .rooster-admin-filters__more
) {
	@apply justify-end;
}

/* The active filters as chips, Clear filters after them (0.64.0); nothing set, nothing shown. */
.rooster-admin-table__chips {
	@apply flex flex-wrap items-center gap-2 border-b border-border px-4.5 py-2;

	&:empty {
		@apply hidden;
	}
}

.rooster-admin-table__clear {
	@apply text-sm text-secondary-foreground underline-offset-2;

	@variant hover {
		@apply text-foreground underline;
	}
}

/* A row's details (0.64.0): its button turns its chevron when open; the panel spans the row on the muted ground. */
.rooster-admin-table__th.is-detail,
.rooster-admin-table__td.is-detail,
.rooster-admin-table__th.is-move,
.rooster-admin-table__td.is-move {
	@apply w-px pe-0;
}

/* Rows that move (0.65.0): a moved row's cells flash where it landed (a row draws no ring of its own); a grip that
   cannot move now (a sorted or filtered local table) is dimmed, its tip says why; the status line and Reset to
   default under the table. */
.rooster-admin-table__row[data-ra-item].is-moved > .rooster-admin-table__td {
	background: color-mix(in srgb, var(--ra-ring) 14%, transparent);
	transition: background var(--ra-dur-slow) var(--ra-ease);
}

.rooster-admin-grip[aria-disabled="true"] {
	@apply cursor-not-allowed opacity-40;
}

.rooster-admin-table__order {
	@apply flex flex-wrap items-center gap-x-3 gap-y-2 px-4.5 py-2 text-sm;
}

.rooster-admin-table__expand {
	@apply inline-flex size-7 cursor-pointer items-center justify-center rounded-md border-0 bg-transparent p-0 text-secondary-foreground;

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

	&[aria-expanded="true"] svg {
		transform: rotate(180deg);
	}
}

.rooster-admin-table__td.is-panel {
	@apply bg-muted px-4.5 py-3;
}

/* A row across the table (0.65.2, `_span`): a note under its row in the secondary ink; a section label in the
   foreground's weight on the muted ground. */
.rooster-admin-table__td.is-span {
	@apply py-2 text-xs text-secondary-foreground;
}

.rooster-admin-table__detail.is-label > .rooster-admin-table__td.is-span {
	@apply bg-muted text-sm font-semibold text-foreground;
}

/* A radio of one choice per group (0.64.0): the control alone, its words for the screen reader. */
.rooster-admin-check.is-bare {
	@apply inline-flex;
}

/* flex-wrap (0.61.0): its count and its buttons wrap in a narrow card instead of pushing the page sideways (FR9).
   0.68.9 (the LMS's request; the owner: "homogenize it, align"): no box of its own, the count in the help text's ink
   and size, its buttons the line's height: the selection's words and actions on the fields' line. */
.rooster-admin-table__bulk {
	@apply flex max-w-full flex-wrap items-center gap-2 text-sm text-secondary-foreground;
}

.rooster-admin-table__aside {
	@apply ms-auto flex flex-wrap items-center gap-2;
}

/* The text size (0.68.0) leads the toolbar's right: before the selection bar and the tools (the owner). */
.rooster-admin-table__scale {
	@apply ms-auto flex items-center;
}

/* One height on the toolbar's line (0.68.9, the LMS's request; the owner: "homogenize it, align and so on"): the fields
   are 32 px, so a small button there (a bulk action, Export, Columns, the text size, a filter's Apply) takes their
   height, and the right-hand parts (the text size, the selection, the tools) stand on the fields' line, centred, 8 px
   apart. The buttons of a popover the line opens (the Columns panel) are not the line's. */
.rooster-admin-table__toolbar .rooster-admin-button--sm:not([popover] *) {
	@apply min-h-8 text-sm;
}

.rooster-admin-table__toolbar .rooster-admin-button--sm:not(.rooster-admin-button--icon, [popover] *) {
	@apply px-3;
}

.rooster-admin-table__toolbar .rooster-admin-button--icon:not([popover] *) {
	@apply min-w-8;
}

.rooster-admin-table__scale ~ .rooster-admin-table__aside {
	@apply ms-0;
}

/* relative (0.61.0): the containing block of what its cells position (a switch's input, a hidden label), so the region
   clips them too; without it they escaped to the card and pushed a narrow page sideways (FR9, the kit at 390 px). */
.rooster-admin-table__scroll {
	@apply relative overflow-x-auto scrollbar-thin;
}

.rooster-admin-table__table {
	@apply ra-table;
}

/* Every table on a phone (0.70.0, TABLES-PLAN; the owner, 31 Oct 2026): the frame is a size container, so a table
   answers to its own box, never to the screen's (a table in a narrow column of a wide screen behaves the same), and it
   scrolls inside its card, never the page (FR9). Under 40 rem the toolbar's search box takes its line and the cells
   lose a step of padding; the narrow layouts of the kinds (a column that may go, a card per row) switch at the same
   width. */
@container (width < 40rem) {
	.rooster-admin-table__toolbar .rooster-admin-inputwrap,
	.rooster-admin-table__toolbar .rooster-admin-input {
		@apply w-full max-w-full;
	}

	.rooster-admin-table__th {
		@apply px-2.5;
	}

	.rooster-admin-table__td {
		@apply px-2.5 py-2;
	}
}

.rooster-admin-table__th {
	@apply ra-table-th;
}

.rooster-admin-table.is-sticky .rooster-admin-table__th {
	@apply sticky top-0 z-10;
}

.rooster-admin-table__th.is-num,
.rooster-admin-table__td.is-num {
	@apply text-end tabular-nums;
}

/* A number never breaks (0.65.5): a cell wraps anywhere, which split a money total inside its number ("1.000,|00 €"). */
.rooster-admin-table__td.is-num {
	@apply whitespace-nowrap;
}

/* A column's width (0.63.1): a width, not only a cap, so a column of short values keeps its room. */
.rooster-admin-table__th.is-w-xs,
.rooster-admin-table__td.is-w-xs {
	@apply w-24 min-w-24;
}

.rooster-admin-table__th.is-w-sm,
.rooster-admin-table__td.is-w-sm {
	@apply w-40 min-w-40;
}

.rooster-admin-table__th.is-w-md,
.rooster-admin-table__td.is-w-md {
	@apply w-64 min-w-64;
}

.rooster-admin-table__th.is-w-lg,
.rooster-admin-table__td.is-w-lg {
	@apply w-96 min-w-96;
}

/* A column's alignment (0.63.1), over its type's. */
.rooster-admin-table__th.is-start,
.rooster-admin-table__td.is-start {
	@apply text-start;
}

.rooster-admin-table__th.is-center,
.rooster-admin-table__td.is-center {
	@apply text-center;
}

.rooster-admin-table__th.is-end,
.rooster-admin-table__td.is-end {
	@apply text-end;
}

/* A list cut at its first rows (0.63.1): one line under the table. */
.rooster-admin-table__capped {
	@apply m-0 flex items-center gap-1.5 border-t border-border px-4 py-2 text-xs text-secondary-foreground;
}

/* A row button's reason (0.63.1, FR7): small, after its button, on the buttons' line. */
.rooster-admin-table__buttons .rooster-admin-reason {
	@apply self-center text-xs whitespace-nowrap;
}

/* A yes or no (0.62.0): a tick in the success ink, a dash in the muted one; the words are read out. */
.rooster-admin-table__th.is-boolean,
.rooster-admin-table__td.is-boolean {
	@apply text-center;
}

.rooster-admin-table__bool {
	@apply inline-flex align-middle;

	&.is-yes {
		@apply ra-tone-success;
		color: var(--ra-tone-fg);
	}

	&.is-no {
		@apply text-muted-foreground;
	}
}

/* A thumbnail (0.62.1): a box of a fixed size, the placeholder under the image; an image that is missing or failed to
   load (table.js marks it) leaves the placeholder showing. */
.rooster-admin-table__thumb {
	@apply relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-md bg-muted align-middle text-muted-foreground;

	&.is-sm {
		@apply size-8;
	}

	&.is-md {
		@apply size-10;
	}

	&.is-lg {
		@apply size-14;
	}

	&.is-xl {
		@apply size-20;
	}
}

.rooster-admin-table__img {
	@apply absolute inset-0 size-full object-cover;

	&.is-failed {
		@apply invisible;
	}
}

.rooster-admin-table__thumblink {
	@apply inline-flex rounded-md;
}

/* A thumbnail that acts (0.62.1: a preview, a product's action) is a button that looks like the image. */
button.rooster-admin-table__thumblink {
	@apply m-0 cursor-pointer border-0 bg-transparent p-0;

	@variant hover {
		@apply opacity-85;
	}
}

/* The larger image (0.62.1, table.js preview()): the page dimmed, the image whole, its close button on its corner. */
.rooster-admin-preview {
	@apply m-auto overflow-visible rounded-lg border-0 bg-transparent p-0;

	&::backdrop {
		@apply bg-black/70;
	}
}

.rooster-admin-preview__img {
	@apply block rounded-lg bg-background object-contain;
}

.rooster-admin-preview__close {
	@apply absolute -end-3 -top-3 inline-flex size-8 cursor-pointer items-center justify-center rounded-full border border-border bg-background text-lg leading-none text-foreground shadow-md;
}

.rooster-admin-table__th.is-image,
.rooster-admin-table__td.is-image {
	@apply w-px;
}

/* A code, a key, a pattern (0.62.0). */
.rooster-admin-table__code {
	@apply rounded-sm bg-muted px-1 py-px font-mono text-xs break-all;
}

/* A cell's own tone (0.62.0): its ink, a loss red and a gain green; the text says it too (a sign, a word). */
.rooster-admin-table__td.is-tone-success,
.rooster-admin-kv > dd.is-tone-success {
	@apply ra-tone-success font-medium;
	color: var(--ra-tone-fg);
}

.rooster-admin-table__td.is-tone-destructive,
.rooster-admin-kv > dd.is-tone-destructive {
	@apply ra-tone-destructive font-medium;
	color: var(--ra-tone-fg);
}

.rooster-admin-table__td.is-tone-warning,
.rooster-admin-kv > dd.is-tone-warning {
	@apply ra-tone-warning font-medium;
	color: var(--ra-tone-fg);
}

.rooster-admin-table__td.is-tone-info,
.rooster-admin-kv > dd.is-tone-info {
	@apply ra-tone-info;
	color: var(--ra-tone-fg);
}

.rooster-admin-table__td.is-tone-primary,
.rooster-admin-kv > dd.is-tone-primary {
	@apply ra-tone-primary;
	color: var(--ra-tone-fg);
}

.rooster-admin-table__td.is-tone-mono,
.rooster-admin-kv > dd.is-tone-mono {
	@apply text-secondary-foreground;
}

.rooster-admin-table__th.is-min,
.rooster-admin-table__td.is-min,
.rooster-admin-table__th.is-check,
.rooster-admin-table__td.is-check,
.rooster-admin-table__th.is-actions,
.rooster-admin-table__td.is-actions {
	@apply w-px whitespace-nowrap;
}

.rooster-admin-table__sort {
	@apply inline-flex items-center gap-1 text-inherit no-underline;

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

/* A sort control that sorts on the page (a button, the LMS's tree table) looks like the link (0.45.8). */
button.rooster-admin-table__sort {
	@apply m-0 cursor-pointer border-0 bg-transparent p-0;
	font: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
}

.rooster-admin-table__sort svg {
	@apply opacity-40;
}

/* The sorted column's chevron at full strength: by the class, or by the head's aria-sort (a script that sorts on the
   page sets it; 0.45.8). */
.rooster-admin-table__sort.is-on svg,
.rooster-admin-table__th:is([aria-sort="ascending"], [aria-sort="descending"]) .rooster-admin-table__sort svg {
	@apply opacity-100;
}

.rooster-admin-table__th[aria-sort="ascending"] .rooster-admin-table__sort svg {
	transform: rotate(180deg);
}

.rooster-admin-table__td {
	@apply ra-table-td;
}

/* A table's text size (0.68.0, Ui::table()'s `text_size`, assets/table-size.js): its body scaled (its text, rows and
   icons alike; the toolbar as it was), drawn at first paint from the person's choice; a product's own container marked
   the same is scaled whole. */
.rooster-admin-table[data-ra-text-size="1"] > .rooster-admin-table__scroll,
[data-ra-text-size="1"]:not(.rooster-admin-table) {
	zoom: 0.8;
}

.rooster-admin-table[data-ra-text-size="2"] > .rooster-admin-table__scroll,
[data-ra-text-size="2"]:not(.rooster-admin-table) {
	zoom: 0.9;
}

.rooster-admin-table[data-ra-text-size="4"] > .rooster-admin-table__scroll,
[data-ra-text-size="4"]:not(.rooster-admin-table) {
	zoom: 1.1;
}

.rooster-admin-table[data-ra-text-size="5"] > .rooster-admin-table__scroll,
[data-ra-text-size="5"]:not(.rooster-admin-table) {
	zoom: 1.25;
}

.rooster-admin-table.is-dense .rooster-admin-table__td {
	@apply py-1.5;
}

.rooster-admin-table__row:last-child .rooster-admin-table__td {
	@apply border-b-0;
}

/* stylelint-disable-next-line selector-max-specificity -- the stripe sits over the cell recipe and under a row's tone */
.rooster-admin-table.is-striped .rooster-admin-table__row:nth-child(even) .rooster-admin-table__td {
	@apply bg-muted/40;
}

.rooster-admin-table__row:hover .rooster-admin-table__td {
	background: color-mix(in srgb, var(--ra-accent) 5%, var(--ra-background));
}

.rooster-admin-table__row.is-selected .rooster-admin-table__td {
	background: color-mix(in srgb, var(--ra-accent) 9%, var(--ra-background));
}

.rooster-admin-table__row.is-warning .rooster-admin-table__td.is-first {
	box-shadow: inset 3px 0 0 var(--ra-warning);
}

.rooster-admin-table__row.is-destructive .rooster-admin-table__td.is-first {
	box-shadow: inset 3px 0 0 var(--ra-destructive);
}

/* A tree: group rows across every column, rows indented by their depth. */
.rooster-admin-table__td.is-group {
	@apply bg-muted/60 py-1.5 text-sm font-semibold text-foreground;
}

.rooster-admin-table__td.is-group .rooster-admin-icon--caret {
	@apply me-1.5 inline-block align-[-2px] text-muted-foreground;
}

/* The row's name has room; a first column that declares its width (a grid's position field) keeps it (0.77.2). */
.rooster-admin-table__td.is-first:not(.is-min, .is-w-xs, .is-w-sm, .is-w-md, .is-w-lg) {
	@apply min-w-[12rem];
}

.rooster-admin-table__row.is-depth-1 .rooster-admin-table__td.is-group,
.rooster-admin-table__row.is-depth-1 .rooster-admin-table__td.is-first {
	@apply ps-7;
}

.rooster-admin-table__row.is-depth-2 .rooster-admin-table__td.is-group,
.rooster-admin-table__row.is-depth-2 .rooster-admin-table__td.is-first {
	@apply ps-11;
}

.rooster-admin-table__row.is-depth-3 .rooster-admin-table__td.is-group,
.rooster-admin-table__row.is-depth-3 .rooster-admin-table__td.is-first {
	@apply ps-15;
}

.rooster-admin-table__icon {
	@apply me-1.5 align-[-3px] text-muted-foreground;
}

.rooster-admin-table__person {
	@apply flex items-center gap-2.5;
}

.rooster-admin-table__avatar {
	@apply inline-flex size-8 flex-none items-center justify-center rounded-full text-xs font-semibold;
	color: color-mix(
		in srgb,
		var(--ra-accent) 85%,
		var(--ra-foreground)
	); /* an ink on its own wash: a step towards the text colour (axe) */
	background: color-mix(in srgb, var(--ra-accent) 12%, var(--ra-background));
}

.rooster-admin-table__title {
	@apply block font-medium text-foreground no-underline;
}

a.rooster-admin-table__title:hover {
	@apply underline;
	color: var(--ra-accent);
}

a.rooster-admin-table__title:focus {
	@apply text-foreground;
}

.rooster-admin-table__sub {
	@apply block text-xs text-secondary-foreground;
}