/* ── Settings screens ────────────────────────────────────────────────── */
/* Full width, as every other chrome screen (0.81.1, the owner on Rooster LRS's settings: "not full width!"): the board
   arranges the cards in its columns, and each control keeps its own width (settings-controls.css). */

/* The page title. Two classes, so core's `.wrap h1` (0,1,1: 23px, weight 400, 9px top padding) never wins over it: the
   uniformity trace (26 Oct 2026) measured the kit's title at core's 23px/400 on every Zero, LRS and demo screen. */
.rooster-admin-pagehead .rooster-admin-pagehead__title {
	@apply m-0 flex items-center gap-2.5 p-0 text-2xl leading-tight font-semibold;
}

/* The head wears its section's colour, as the cards under it do (the helper adds the section class); a page outside
   the catalogue keeps the product's. */
.rooster-admin-pagehead__icon {
	color: var(--ra-sec-ink, var(--ra-product-ink));
}

/* A record's state beside its title (a badge: "Cancelled", the kind of an organisation; 0.46.2). */
.rooster-admin-pagehead__meta {
	@apply inline-flex items-center text-sm font-normal;
}

/* The head's links (add a new one, how it works): buttons at the far end. */
.rooster-admin-pagehead__actions {
	@apply ms-auto flex flex-wrap items-center gap-2;
}

/* Its Edit layout and Reset layout, printed before their board and hidden until board.js decides, show from the first
   paint where the board says they will (0.86.2: Board::html()'s data-ra-shows; data-ra-pending until the script takes
   them over). On a phone they took a line of the head when the script showed them, and the page moved 26 px. */
:where(.js:has([data-ra-board][data-ra-shows~="edit"])) [data-ra-board-edit][data-ra-pending][hidden],
:where(.js:has([data-ra-board][data-ra-shows~="reset"])) [data-ra-board-reset][data-ra-pending][hidden] {
	@apply inline-flex;
}