/* Team Info page — the reader-facing view of a team's documents.
   Page-scoped only; nothing here is a candidate for a global rule.

   Comments here use the C-style block form only. A double slash is not a CSS comment and silently
   kills the rule that follows it. */

/* ---------------------------------------------------------------------------
   Page header
   --------------------------------------------------------------------------- */

/* A second class on .page-head supplies the flex row while .page-head keeps owning the bottom
   margin (UI/PageHeading.md). Do NOT add a margin-bottom here.

   align-items: flex-start keeps the control on the heading's first line rather than centring it
   against a two- or three-line title block. */
.team-info-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

/* The team's description under the heading.

   `pre-line` restores the line breaks the author typed into the Teams page textarea WITHOUT any
   markup being generated from their text — the alternative, replacing newlines with <br>, means
   building HTML from member-authored content on a page the open internet can read. Collapsing runs
   of whitespace is `pre-line`'s other half and is wanted here: it stops a stray double space or a
   run of blank lines from reshaping the page header.

   max-width because this is prose. `.page-sub` sets no measure, and a long description stretched to
   a wide viewport is a line length nobody reads comfortably. 70ch is the ch-based measure UI/Units.md
   prefers for text. */
.team-info-desc {
    white-space: pre-line;
    max-width: 70ch;
}

/* ---------------------------------------------------------------------------
   Left panel rows
   --------------------------------------------------------------------------- */

/* [2026-08-18: .roster-list-item is now .gp-panel-row, so the naming objection below is gone and
   this panel could adopt it. Left as copied values rather than changed on the way past.]
   Values copied from UI/Layout.md's row-metrics table rather than reaching for .roster-list-item,
   whose name would be a lie on a page that is not about rosters.

   NO `border-left: 2px solid transparent`, deliberately. That reservation belongs to rows whose
   selected accent is drawn with border-left-color. These carry .gp-split-left-row, whose .is-active
   draws with an INSET BOX-SHADOW — it paints inside the padding box and takes no layout space, so
   adding the border would push the text 2px right for no reason.

   Hover and the selected state both come from .gp-split-left-row in site.css. Nothing is
   redeclared here. */
/*  SUPERSEDED 2026-08-17 (Session 198) — the nav rows are no longer <button> elements. They are
    rows of `.team-info-nav-table` (see the bottom of this file), because the Tactics row needs the
    D2 expand indicator and that is keyed on `tr[data-expandable]`.

    WHAT SURVIVED AND WHERE: the 0.781rem panel type size is now
    `.team-info-nav-table > tbody > tr > td`. The button reset, the block/width, the manual padding
    and the bottom border are all things `.data-table` supplies, which is most of the reason the two
    mechanisms became one.

    STILL TRUE IN THE NEW FORM: no `border-left: 2px solid transparent` — .gp-split-left-row's
    .is-active draws with an INSET BOX-SHADOW, so the border would push the text 2px right for
    nothing.

.team-info-row {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    border-bottom: 1px solid var(--line-soft);
    padding: 0.438rem 0.875rem 0.438rem 1.625rem;
    color: inherit;

    / * `font: inherit` first, because a <button> inherits neither the page's font-family nor its
       size — declare nothing and it falls through to the UA default, which is the wrong TYPEFACE
       and reads as a rendering fault. Then font-size, because the page font is not the panel-row
       size: `font: inherit` alone resolves to body's 1rem and the rows come out about a quarter
       larger than every other left panel in the portal.

       0.781rem is the established value from the two reference implementations UI/Layout.md names
       (.loot-boss-row, .roster-list-date). Nothing on .gp-split-left, -body or -row sets a size,
       so a non-table panel must state one. * /
    font: inherit;
    font-size: 0.781rem;
}

.team-info-row:last-child { border-bottom: none; }
*/

/* ---------------------------------------------------------------------------
   Document panels
   --------------------------------------------------------------------------- */

/* THIS RULE IS LOAD-BEARING AND MUST NOT BE REMOVED AS REDUNDANT.

   The `hidden` attribute works through the user agent stylesheet's `[hidden] { display: none }`,
   which is the WEAKEST possible author-facing rule — any author `display` beats it. A .gp-card is
   `display: flex`, so without this line every document renders at once, stacked, and the page looks
   like it has no tabs at all.

   Same cascade trap documented for .nav-notif-badge in UI/Badges.md, and the one
   .gp-notice-dismissible had to carry its own [hidden] rule for when it was promoted to a global. */
.team-info-doc[hidden] { display: none; }

.team-info-doc { margin-bottom: 0; }

/* The panels are HEADERLESS — the nav row on the left already names the open document, so a heading
   would be the panel repeating its own tab (UI/TabsAndPanels.md).

   That heading used to supply the top spacing: base .gp-card has NO padding of its own, and the
   inset utilities carry the horizontal distance only. So the first inset child needs the margin
   instead, or it sits flush against the card's top border while its sides are inset.

   global.css already does exactly this for `.gp-card-table > .gp-card-inset-box:first-child`; this
   rule is the same fix for the other two combinations these panels actually use — a padding-inset
   first child, and a plain .gp-card rather than a table card. */
.team-info-doc > .gp-card-inset:first-child,
.team-info-doc > .gp-card-inset-box:first-child {
    margin-top: 1.125rem;
}

/* ---------------------------------------------------------------------------
   Fact cards
   --------------------------------------------------------------------------- */

/* The row of cards under a document — Schedule / Attendance Rate / Bench Rate on About, and the
   three requirement cards on Raider Requirements.

   Grid rather than flex so the cards share the width evenly regardless of how much each one holds:
   a Schedule card with four rows must not be three times the width of a Bislist card with one.
   auto-fit with a minimum lets them drop to two-up and then one-up on a narrow viewport without a
   media query. 0.75rem is the gap .team-details-col already uses between stacked section cards. */
.team-info-fact-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
    margin-bottom: 1.125rem;
}

/* The document's prose sits directly above the fact row; without this the last paragraph's own
   margin is the only separation and the cards read as part of the text. */
.team-info-doc .gp-richtext { margin-bottom: 0; }

/* A qualifier inside the card header strip — "(realm time)". The header is already uppercase,
   0.656rem and --ink-3, so this only needs to step back from it: normal case and lighter weight,
   which is what distinguishes an aside from the label itself. */
.team-info-fact-hint {
    text-transform: none;
    font-weight: 400;
    letter-spacing: 0;
}

/* ---------------------------------------------------------------------------
   Warcraft Logs
   --------------------------------------------------------------------------- */

/* One raid night can hold several report codes. They wrap rather than stretching the column, and the
   gap keeps them readable as separate links — without it, adjacent codes run together into what
   looks like one long code.

   Deliberately NOT .gp-badge-row: that class groups badges, and these are plain links. */
.team-info-log-links {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.75rem;
}

/* ---------------------------------------------------------------------------
   Fact card values
   --------------------------------------------------------------------------- */

/* The single-value cards (the three requirement ones). The rate and schedule cards use
   .gp-kv-table instead and take their type from it.

   0.813rem matches .gp-kv-table's own font-size, so a row of cards mixing the two reads as one set
   rather than as two different components sitting next to each other. */
.team-info-fact-value {
    font-size: 0.813rem;
    color: var(--ink);
}

/* =====================================================================
   The nav table — added 2026-08-17 when the flat <button> rows became rows of one
   `.data-table`. The Tactics row needs UI/Tables.md's D2 expand indicator, which is keyed on
   `tr[data-expandable]` and works nowhere else, so the row that needs it forced the table and
   the rest joined it rather than two row mechanisms being kept in step by hand.

   These rules mirror pages/tactics.css's for the Team Documents nav, which met the same problem
   first. If a THIRD left-panel table appears, they should become a shared rule rather than a
   third copy.
   ===================================================================== */
.team-info-nav-table {
    border-top: 1px solid var(--line-soft);
    /* `.data-table` ships `margin-bottom: 1.5rem`, which is spacing for a table standing in a
       page. Inside a scrolling split panel that margin is counted in the body's scrollHeight but
       not in its layout height, so the panel draws a scrollbar on content that fits. */
    margin-bottom: 0;
}

/* The panel's type size, not the data table's 0.813rem. 0.781rem is the established left-panel
   value (UI/Layout.md's reference implementations). CHILD COMBINATORS are load-bearing: a
   descendant selector would also match the boss sub-rows inside the subrow panel and override
   the 0.75rem that makes them read as nested. */
.team-info-nav-table > tbody > tr > td {
    font-size: 0.781rem;
}

/* HIGHLIGHTS FOLLOW UI/Layout.md's TWO-COLUMN STANDARD, NOT UI/Tables.md's ROW TREATMENT — this
   is a menu that happens to be built from a table. `.data-table tbody tr` (0,1,2) paints
   `var(--bg-2)` while `.gp-split-left-row` (0,1,0) declares no background at all, so without
   this every nav row would sit on a table band instead of on the panel.

   Excluding the two interactive states leaves site.css's own (0,2,0) rules owning them, so hover
   and selection are still the SHARED ones rather than copies. */
.data-table.team-info-nav-table tbody tr:not(.is-active):not(:hover) {
    background: transparent;
}

/* The subrow holding the boss list. `.detail-panel` is `display: grid` with
   `repeat(auto-fit, minmax(12rem, 1fr))`, and that 12rem floor cannot fit a 13rem
   `.gp-split-left` once the panel's padding and the spine's inset are added — it overflows and
   the column grows a horizontal scrollbar. One track with no floor fixes it without abandoning
   the panel type.

   Chained to the ancestor deliberately: `.detail-panel.expand-spine-detail` is (0,2,0), so a
   (0,2,0) page rule would depend on source order. */
.team-info-nav-table .detail-panel.expand-spine-detail {
    padding: 0;
    grid-template-columns: 1fr;
    gap: 0;
}