/* ==========================================================================
   Board 04 — the landlord and property screens.

   Colours come from the design system's tokens, so both themes follow without a second palette, and this
   file declares none. The marks these screens draw — the property's kind, the owner chip, the §6.2 band —
   are the design system's too; what is here is the two screens' own layout around them, a kind this
   build does not know, and a print rule for two of the marks.
   ========================================================================== */

/* Pushed to the end of a panel heading — "all of them" beside a panel showing the recent few. */
.panel-link {
    margin-left: auto;
    font-size: var(--fs-caption);
    text-decoration: none;
}

/* --- Summary strip ------------------------------------------------------- */

/* Published for the whole portfolio, which is why it sits above the grid and not inside it. Every
   figure in it is one PropMan counted; the strip's own job is only to line them up. */
.strip {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 20px;
    margin: 0 0 12px;
    padding: 0;
    font-size: var(--fs-secondary);
    color: var(--text-muted);
}

.strip b {
    font-family: var(--font-figures);
    font-variant-numeric: tabular-nums;
    font-size: var(--fs-section);
    font-weight: 500;
    color: var(--text);
    margin-right: 5px;
}

/* A rule between the shapes of address and the state of them: two different questions, one strip. */
.strip-break {
    border-left: 1px solid var(--border);
    padding-left: 20px;
}

.strip-alarm b { color: var(--danger-text); }

/* --- Grouped grid -------------------------------------------------------- */

/* A block heading, and the flats under it. The heading is a row of the table rather than a caption
   above a second table, so the columns of every group line up down the page. */
.register tbody.group > tr.group-head > th {
    background: var(--surface-subtle);
    border-bottom: 1px solid var(--border-subtle);
    font-size: var(--fs-secondary);
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    color: var(--text);
    padding: 8px 12px;
}

.register tbody.group > tr.group-head .tag { display: inline-block; margin-left: 8px; }

/* A flat sits under its block. Indent alone would be lost the moment a group scrolls its heading off,
   so the leader is drawn as well. */
.register td.indented { padding-left: 26px; position: relative; }

.register td.indented::before {
    content: "";
    position: absolute;
    left: 12px;
    top: 50%;
    width: 8px;
    height: 1px;
    background: var(--border-strong);
}

/* An address in the block that belongs to somebody else. Dimmed rather than dropped: leaving it out
   would make the building look smaller than it is. The dimming is set on the CELL, so the link inside it
   keeps the accent colour it sets on itself; the marker beside it takes the same muted colour as the row
   and stays legible on its own chip ground rather than by out-contrasting the text. */
.register tr.foreign > td { color: var(--text-muted); }

/* The row for the address whose screen this is, so a reader can find themselves in the table. */
.register tr.here > td { background: var(--surface-subtle); }
.register tr.here > td:first-child { font-weight: 600; }

/* --- Print ---------------------------------------------------------------- */

@media print {
    .panel-link { display: none; }

    /* The owner chip carries its substance in a BACKGROUND, which a browser drops when it prints unless it is
       told not to, printing the chips away. So it is asked for by name. The chip is qualified by its element
       rather than by a container, so the rule holds in whichever table draws it. The prefixed spelling is there
       because Chromium shipped only that one for most of its life, and a back office is where an old browser
       lives. */
    span.owner-chip {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

/* What needs action on an address, under its acts: in the danger ink, its marks too, as the most consequential fact on
   the page, the lines held together apart from the facts below (DEC-0430). */
.needs-action { margin: 0 0 var(--space-20); }
.needs-action > .consequence, .needs-action > .consequence > .icon:first-child { color: var(--danger-text); }
.needs-action > .consequence:last-child { margin-bottom: 0; }
