/*
 * The standards every management of this panel shares — تسک ۱۴۰۵/۰۷/۲۰/۰۵.
 *
 * One stylesheet, on every page, keyed off what a page *is* (a page header, a
 * management table, a date cell) and never off which page it is. There is no
 * list of addresses in it: a management built next month has all of this by
 * being built the way the others are.
 *
 *   §3  the page title, a third smaller, and the figure beside it
 *   §4  rows of a management table in two alternating colours
 *   §6  «ترتیب ستون‌ها»
 *   §7  a news source's logo before its name
 *   §8  a date and a clock in a table cell
 */

:root {
    /* «رنگ زرد استاندارد پنل» — the yellow the panel already writes a figure
       in («خوشه‌ها | ۲۴۵», the role names). */
    --panel-stat-yellow: #eab308;

    /* The two row colours. Chosen away from the four the task rules out — the
       page (gray-950), the panel's bar and the row of column titles
       (gray-900), and the rows' own former colour (gray-900 again) — and far
       enough from each other to be told apart at a glance on a dim screen,
       while staying inside the panel's blue-black. */
    --panel-row-a: #f4f7fb;
    --panel-row-b: #e6edf6;
    --panel-row-hover: #d6e2f1;
    --panel-row-selected: #fdf3d0;
}

.dark {
    --panel-row-a: #18202f;
    --panel-row-b: #222d42;
    --panel-row-hover: #2c3a56;
    --panel-row-selected: #3a3420;
}

/* ── §3  The page title and its figure ───────────────────────────────────── */

/* Filament draws a page title at 1.875rem. Two thirds of that is 1.25rem —
   «یک‌سوم کاهش», the size the roles management was already given by hand and
   now the size of every title in the panel. */
.fi-header .fi-header-heading {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.25rem !important;
    line-height: 1.75rem !important;
}

.crawler-header-stat {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    vertical-align: middle;
    margin-inline-start: 0.7rem;
    font-size: 1.05rem;
    line-height: 1.75rem;
    white-space: nowrap;
}

.crawler-header-stat-sep {
    display: inline-block;
    width: 1px;
    height: 1.15rem;
    background-color: rgb(107 114 128 / 0.55);
}

.crawler-header-stat-total {
    color: var(--panel-stat-yellow);
    font-weight: 700;
}

.crawler-header-stat-unit {
    font-size: 0.85rem;
    font-weight: 400;
}

.crawler-header-stat-filtered {
    font-size: 0.8rem;
    font-weight: 400;
    color: #6b7280;
}

.dark .crawler-header-stat-filtered {
    color: #9ca3af;
}

/* ── §4  Two alternating row colours ─────────────────────────────────────── */

/* Filament's own table: every resource list and every relation manager.
   `of .fi-ta-row` counts data rows only, so a group heading or a summary row
   in between does not throw the alternation off; the plain rule before it is
   what an older browser falls back to. The count restarts with whatever rows
   are on screen, so a page of a filtered, sorted list always starts on the
   first colour and alternates from there. */
.fi-ta-table > tbody > tr.fi-ta-row:nth-child(odd) {
    background-color: var(--panel-row-a);
}

.fi-ta-table > tbody > tr.fi-ta-row:nth-child(even) {
    background-color: var(--panel-row-b);
}

.fi-ta-table > tbody > tr.fi-ta-row:nth-child(odd of .fi-ta-row) {
    background-color: var(--panel-row-a);
}

.fi-ta-table > tbody > tr.fi-ta-row:nth-child(even of .fi-ta-row) {
    background-color: var(--panel-row-b);
}

/* A hand-written management table carries `data-management-table` — the same
   one attribute that pins its column titles. */
body.fi-body [data-management-table] > tbody > tr:nth-child(odd),
body.fi-body [data-management-table] table > tbody > tr:nth-child(odd) {
    background-color: var(--panel-row-a);
}

body.fi-body [data-management-table] > tbody > tr:nth-child(even),
body.fi-body [data-management-table] table > tbody > tr:nth-child(even) {
    background-color: var(--panel-row-b);
}

/* The pointer and a ticked row stay readable over either colour. */
.fi-ta-table > tbody > tr.fi-ta-row:hover,
body.fi-body [data-management-table] > tbody > tr:hover,
body.fi-body [data-management-table] table > tbody > tr:hover {
    background-color: var(--panel-row-hover);
}

.fi-ta-table > tbody > tr.fi-ta-row.fi-selected,
.fi-ta-table > tbody > tr.fi-ta-row.fi-selected:hover {
    background-color: var(--panel-row-selected);
}

/* ── §6  «ترتیب ستون‌ها» ─────────────────────────────────────────────────── */

/* The button that opens the column window, in the table's own toolbar: the
   panel's amber, the two-arrows icon and the words — the shape the same tool
   has in Baligpa's panel — in place of the unlabelled three-bars icon. */
.fi-ta-header-toolbar [data-column-order] {
    white-space: nowrap;
}

/* ── §7  A news source's logo before its name ────────────────────────────── */

.crawler-source {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    max-width: 100%;
    vertical-align: middle;
}

.crawler-source-logo {
    flex: none;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 9999px;
    object-fit: contain;
    background-color: #ffffff;
    outline: 1px solid rgb(107 114 128 / 0.35);
}

.crawler-source-name {
    min-width: 0;
}

/* ── §8  A date and a clock in a table cell ──────────────────────────────── */

.crawler-moment {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
}

.crawler-moment-sep {
    display: inline-block;
    width: 1px;
    height: 0.95em;
    background-color: rgb(107 114 128 / 0.6);
}

.crawler-moment-time {
    font-variant-numeric: tabular-nums;
}