/*
 * The column-header row of every management table in the panel, pinned while
 * the rows scroll under it — تسک ۱۴۰۵/۰۶، «اصلاح سراسری رفتار اسکرول نوار عنوان
 * ستون‌های تمام جدول‌های مدیریتی» (آژانس ـ اسکرول ـ ۰۰۱ … ۰۰۵).
 *
 * ─── Why this is one stylesheet and not a list of managements ───────────────
 *
 * آژانس ـ دامنه ـ ۰۰۱ forbids an array of pages that opt in, and آژانس ـ معماری
 * ـ ۰۰۱ asks for the behaviour to live in whatever the tables already share. So
 * the scope is written as what a management list *is*, in Filament's own
 * markup: a page that draws a table card (`.fi-ta-ctn`) and is not one of the
 * three record pages a form lives on. Every management that has a real table
 * today is matched by that — the fifty-seven whose page carries the table
 * itself, and the five whose table arrives in a widget (مانیتور پردازش فراداده،
 * مانیتور به‌روزرسانی فراداده، مغایرت تاریخ عکس‌ها، گزارش واترمارک‌ها، وضعیت
 * واترمارک‌ها) — and a management added tomorrow is matched by the same
 * sentence, with nothing to remember.
 *
 * The three exclusions are the pages بند ۴ takes out of scope: «فرم ساخت»،
 * «فرم ویرایش» and «صفحه نمایش جزئیات». A relation manager's table on an edit
 * form therefore keeps the behaviour it has today, and so does every page that
 * is cards rather than a list — it has no table card, so no rule here reaches
 * it.
 *
 * ─── Why the page becomes the scroll box ───────────────────────────────────
 *
 * A `position: sticky` row is only sticky inside its own scrolling box. By
 * default that box is `.fi-ta-content-ctn`, which Filament gives `overflow-x:
 * auto` for wide tables — and a box whose height follows its content never
 * scrolls vertically, so a sticky `<thead>` inside it is inert. Capping that
 * box instead would pin the header, but everything above the table would then
 * stay on screen for ever, which is exactly what بند ۷ forbids.
 *
 * So the scrolling box moves out to `.fi-main-ctn`, the panel's page area: the
 * page's own heading, its stat cards, its search and its filters scroll up and
 * away inside it (بند ۷), and the column-header row pins against its top edge —
 * which is the first pixel below the panel's topbar, because the topbar is the
 * element above it in the layout. Nothing here writes the topbar's height down
 * (بند ۹): the body is laid out as a column, the topbar takes the height it
 * takes, and the page area is given the rest.
 *
 * Both axes therefore belong to one box, and that is deliberate: the header row
 * and the rows under it are one `<table>` in one scrolling box, so a horizontal
 * move carries titles and data together and no title can ever end up over
 * another column's data (بند ۱۱). Nothing is synchronised, because there is
 * nothing to synchronise.
 */

.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) {
    display: flex;
    flex-direction: column;
    height: 100dvh;
    overflow: hidden;
}

.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) > .fi-layout {
    flex: 1 1 auto;
    min-height: 0;
}

.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-main-ctn {
    min-height: 0;
    overflow: auto;
}

/*
 * The page area, not `.fi-main` inside it: `.fi-main` is the column the panel
 * centres its content in, so a scrollbar on it would stand in the middle of a
 * wide screen rather than at its edge, which is where the page's scrollbar has
 * always been.
 */

/*
 * The table stops being a scrolling box of its own, so the row above resolves
 * against the page area rather than against a box that never scrolls. It keeps
 * the table's full width so the card's surface goes on under the columns that
 * reach past the screen, rather than the page's own background showing through
 * them; `min-width: 100%` leaves every table that fits exactly as it is.
 */
.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-ta-content-ctn:has(.fi-ta-table) {
    overflow: visible;
    width: max-content;
    min-width: 100%;
    background-color: var(--color-white);
}

:where(.dark) .fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-ta-content-ctn:has(.fi-ta-table) {
    background-color: var(--gray-900);
}

/*
 * بند ۸ — the column-header row, and nothing else. Not the card, not the
 * toolbar, not the filters: they are outside `<thead>` and no rule here names
 * them.
 *
 * بند ۱۰ — and it is opaque while it is pinned. The row's own tint is
 * `white/5`, which rows would otherwise be read through; the card's surface is
 * painted under the row group, where the tint then lands on top of it, so what
 * is seen is the colour the header has always had rather than a new one.
 *
 * z-index 10 keeps it over the rows. It is deliberately below the 20 Filament
 * gives a dropdown panel: the filters and the column arranger open from the
 * toolbar above the table, which comes first in the markup, so at an equal
 * z-index the pinned row would paint over the panel and the list would appear
 * to open underneath the header.
 */
.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-ta-table > thead {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: var(--color-white);
}

:where(.dark) .fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-ta-table > thead {
    background-color: var(--gray-900);
}

/*
 * ─── Sideways, only the table moves ─────────────────────────────────────────
 *
 * تسک ۱۴۰۵/۰۶/۱۴/۱۰ — ساخت‌گالری ـ اسکرول ـ ۰۰۳ و ۰۰۴، چیدمان ـ ۰۰۱، ابزار ـ
 * ۰۰۱ و معماری ـ ۰۰۱.
 *
 * The rules above hand both axes to the page area, and for a table that fits
 * inside the page column that is invisible. For one that does not, it is the
 * whole fault the task describes. «دستور ساخت گالری» is 2,676 pixels of
 * columns in a 1,216-pixel column, so dragging the table sideways dragged the
 * page area with it: the management's own title, the sentence under it,
 * «مستندات فنی», «تلاش دوباره», the search box and the filters all travelled
 * with the rows and left the screen, and the card's surface stopped where the
 * page column stopped — which is the empty strip beside the table in the two
 * pictures attached to the task.
 *
 * It is not this page's own doing and there was nothing here to bring back
 * into line (بند ۴ و ۵): in the same browser «عکاسان» overflowed the page area
 * by 491 pixels and «عکس‌ها» by 713, with the same heading travelling. So the
 * fix belongs to the behaviour rather than to the address (بند ۲۸).
 *
 * ─── Why the scrolling box is still the page area ──────────────────────────
 *
 * The obvious repair — give `.fi-ta-content-ctn` its `overflow-x: auto` back —
 * silently undoes the paragraph above this one. A box with an overflow on
 * either axis is a scroll container on both, so it becomes the scrollport the
 * pinned column-title row resolves against; and since that box is only ever as
 * tall as its own content, the row stops pinning. Measured, not assumed: with
 * that one rule the titles sat 159 pixels above the visible area at the very
 * moment they were supposed to be against its top edge.
 *
 * So the horizontal movement is left where تسک ۱۴۰۵/۰۶/۱۱/۰۱ put it, and what
 * changes is what travels with it. `.fi-page` grows to its table, which gives
 * the page's own furniture — the management's header, the sections and
 * widgets a page draws beside its table, and the toolbar and pagination the
 * card carries above and below it — room to be pinned within, and carries
 * the card's surface under every column, closing the empty strip (بند ۱۰).
 * The rows and their titles are the only thing left to move (بند ۷ و ۸), and
 * they are still one `<table>` in one box, so no title can leave its column.
 *
 * ─── No length is written down (بند ۲۹) ────────────────────────────────────
 *
 * `100cqi` is the page column's own content width, whatever Filament's
 * `fi-width-7xl` and its padding make it on this screen;
 * `--agency-page-area-width` is the page area's, read one level up. Half their
 * difference is the gutter the column is centred in, so a pinned box stays
 * exactly where it was drawn rather than sliding to the screen's edge — at
 * 1440, 1024, 768 and 390 pixels alike, and with the menu open or shut.
 *
 * ─── And why they carry a z-index ──────────────────────────────────────────
 *
 * `position: sticky` makes a stacking context whatever else it does. Without a
 * z-index of its own the toolbar would take its dropdowns down to its place in
 * document order, which is *before* the table — so the pinned title row's 10
 * would paint over the column arranger, and a drag inside it would land on the
 * row instead of on the list. That is not theory either: the column-arranger
 * test failed on exactly that until this line was added. 20 is the level
 * Filament already gives a dropdown panel, which is the note beside the
 * pinned row's own z-index above.
 */

@property --agency-page-area-width {
    syntax: "<length>";
    inherits: true;
    initial-value: 0px;
}

.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-main-ctn {
    container-type: inline-size;
}

.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-main {
    container-type: inline-size;
    --agency-page-area-width: 100cqi;
}

.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-page {
    width: max-content;
    min-width: 100%;
}

.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-page .fi-header,
.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-page .fi-sc-section:not(:has(.fi-ta-table)),
.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-page .fi-wi > :not(:has(.fi-ta-table)),
.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-page .fi-ta-main > :not(.fi-ta-content-ctn) {
    position: sticky;
    inset-inline-start: calc((var(--agency-page-area-width) - 100cqi) / 2);
    width: 100cqi;
    z-index: 20;
}

/*
 * ─── …and the toolbar one step above the rest of that group ────────────────
 *
 * تسک ۱۴۰۵/۰۶/۱۸/۰۳ — فیلتر-تکمیل-۰۱۶ … ۰۲۱ و ۰۶۰ و ۰۶۱.
 *
 * The rule above pins **every** direct child of `.fi-ta-main` except the rows,
 * and gives each of them the same z-index: the toolbar above the table, the
 * pagination below it, and — on a list that has found nothing — Filament's
 * «رکوردی یافت نشد» panel between them. `position: sticky` makes each one a
 * stacking context of its own, and a stacking context is not entered to
 * compare what is inside it: at an equal z-index the later box in the document
 * wins outright, whatever the dropdown inside the earlier one is painted at.
 *
 * So the filters' open list, at z-index 30 inside the toolbar, was covered by
 * the empty-state panel that follows the toolbar in the markup — and no
 * z-index on the *panel* could have changed it, which is what خط قرمز ۲ warns
 * about. The thing that had to move is the box the panel is inside.
 *
 * One step, and only for the toolbar. The rest of the group keeps 20 and keeps
 * its order among itself, the pinned column-title row keeps its 10 below all of
 * them, and Filament's own overlays — modals, notifications, the topbar — are
 * far above and are untouched.
 */
.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-page .fi-ta-main > .fi-ta-header-ctn {
    z-index: 21;
}

/*
 * ─── The page column is as wide as the screen, on a page that lists ────────
 *
 * تسک ۱۴۰۵/۰۶/۱۷/۰۱ — عکاس-رابط-۰۰۲ تا ۰۰۷ و ۰۵۳.
 *
 * `.fi-main` is Filament's centred content column and it is capped at
 * `fi-width-7xl`, 1280 pixels. That cap is the root of the empty strip the task
 * reports, and it is not this management's doing: on a 1440-pixel screen the
 * column leaves 80 pixels of gutter on each side, and «عکاسان» — 1619 pixels of
 * columns — cannot fit in what is left. The rules above hand the sideways
 * movement to the page area and pin the page's own furniture inside the column,
 * so what a manager sees is a table that starts at the column's right edge,
 * 112 pixels in from the screen, and disappears off the left: measured at 1440
 * as `.fi-page` x = -291 → right = 1328, against a viewport of 1440.
 *
 * The cap is a length the panel never chose; it is Filament's default. Removing
 * it on the pages this stylesheet already governs — a management list, never a
 * form or a details page — gives the table the whole width and closes the strip
 * without writing a width of our own down anywhere (بند ۲۹ of the earlier task
 * still holds: no length here, only «all of it»).
 *
 * It cannot be undone by a later change to one page, because it is stated at
 * the same level as the behaviour that exposed it: the same `:has()` sentence
 * that says «this page draws a management table» (عکاس-رابط-۰۰۵ و ۰۵۳).
 *
 * No horizontal page scroll follows (عکاس-رابط-۰۰۶): `.fi-main-ctn` is still the
 * one scrolling box, so a table wider than the screen moves inside the page
 * area with its own titles, and a table narrower than it simply fills the row.
 */
.fi-body:has(.fi-page:not(.fi-resource-create-record-page):not(.fi-resource-edit-record-page):not(.fi-resource-view-record-page) .fi-ta-ctn) .fi-main {
    max-width: none;
}