/* IntelliClerk — Case Documents.
   A layer over dashboard-v3.css, which must be linked first. The page is the
   docket leaf from briefs.html carrying document entries instead of briefs,
   so this file adds only the entry row, its two actions, and the leaf footer's
   second action. */

:root {
    /* The one warning tone on the page, reserved for delete. Burnt sienna, so
       it reads as caution without leaving the browns. */
    --brick: #8A3324;
}

/* ---------- leaf header ---------- */

/* The count of what the leaf holds, set beside the matter's docket data. */
.caption__holding {
    display: block;
    margin-top: 0.15rem;
    color: var(--walnut);
    letter-spacing: 0.06em;
}

/* ---------- document entries ---------- */

.docs {
    list-style: none;
    margin: 0;
    padding: 0.5rem 0 0;
}

/* Same measure as the brief row in briefs.html — entry number in the gutter,
   title, status, actions — widened at the end for the second action. */
.doc {
    display: grid;
    grid-template-columns: var(--gutter) minmax(0, 1fr) 13rem 19.5rem;
    align-items: center;
    padding: 0.85rem 0;
    border-bottom: 1px solid var(--rule-soft);
    transition: background 120ms ease;
}

.docs .doc:last-child {
    border-bottom: 0;
}

/* ---------- nothing on file yet ---------- */

/* A .doc row is a four-column measure: entry number, name, status, actions.
   The empty state supplies two cells, so the name lands in the gutter column
   and two sentences wrap inside 4.75rem. It is not a row of the register, so
   it steps out of the grid and sets as a short passage on the same leaf. */
.doc--empty { display: block; padding: 1.5rem var(--leaf-pad) 1.6rem var(--gutter); border-bottom: 0; }
.doc--empty:hover { background: transparent; }
.doc--empty .doc__name { display: block; padding-right: 0; color: var(--muted); }
.doc--empty .doc__note { max-width: 42rem; font-family: var(--body); font-size: 0.9375rem; font-style: italic; letter-spacing: 0; }
.doc--empty .doc__acts { justify-content: flex-start; padding-right: 0; margin-top: 1rem; }
@media (max-width: 40rem) { .doc--empty { padding-left: var(--leaf-pad); } }
.doc:hover {
    background: rgba(107, 74, 47, 0.045);
}

.doc__entry {
    font-family: var(--data);
    font-size: 0.875rem;
    color: rgba(27, 46, 74, 0.45);
    text-align: right;
    padding-right: 1.6rem;
}

.doc__name {
    font-size: 1.125rem;
    padding-right: 1rem;
}

/* Kind, extent, and upload date — the file's particulars, in the docket face. */
.doc__note {
    display: block;
    margin-top: 0.15rem;
    font-family: var(--data);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.doc__acts {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-right: var(--leaf-pad);
}

/* ---------- entry actions ---------- */

/* Both labels stay on one line, so every row keeps the same height. */
.doc__acts .act {
    min-width: 0;
    padding: 0.45rem 0.85rem;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    white-space: nowrap;
}

.act--summary {
    color: var(--walnut);
    background: var(--plate);
    border-color: var(--rule);
}

/* It opens the document's summary rather than acting on the row, so it is a
   link wearing the button's clothes. A document still being read has no summary
   to open, so that row keeps a disabled button instead. */
a.act--summary {
    text-decoration: none;
}

.act--summary:hover {
    color: #FFFFFF;
    background: var(--brass);
    border-color: var(--brass);
}

/* Destructive, so it stays quiet until pointed at and never carries brass —
   brass is the page's affirmative hover. */
.act--delete {
    color: var(--muted);
    background: var(--plate);
    border-color: var(--rule);
}

.act--delete:hover {
    color: #FFFFFF;
    background: var(--brick);
    border-color: var(--brick);
}

/* A document still being read cannot be summarized yet; the row says why. */
.act[disabled] {
    color: var(--muted);
    background: transparent;
    border-color: var(--rule-soft);
    cursor: not-allowed;
    opacity: 0.7;
}

.act[disabled]:hover {
    color: var(--muted);
    background: transparent;
    border-color: var(--rule-soft);
}

/* ---------- caption action ---------- */

/* ---------- the analysis bar ---------- */

/* The analysis reads across every document in the leaf rather than any one
   entry, so it is not an entry action and no longer sits in the caption. It
   stands on its own above the list, where counsel meets it before reading any
   single file: what state the analysis is in, and what may be done about it.

   It sits outside the list the toggle hides, so a collapsed leaf still says
   where its analysis stands. */
.analysis {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.5rem;
    flex-wrap: wrap;
    margin: 1.2rem var(--leaf-pad) 1.2rem var(--gutter);
    padding: 0.85rem 1.1rem;
    background: var(--plate);
    border: 1px solid var(--rule-soft);
    border-left: 3px solid var(--rule);
    border-radius: var(--radius-control);
    transition: border-color 160ms ease, background 160ms ease;
}

.analysis__read {
    display: flex;
    align-items: baseline;
    gap: 0.65rem;
    flex-wrap: wrap;
    min-width: 0;
}

/* Hollow until the analysis stands for something; filled in the colour of
   whatever state it is in. */
.analysis__mark {
    width: 0.6rem;
    height: 0.6rem;
    flex: 0 0 auto;
    align-self: center;
    border: 1px solid var(--rule);
    background: transparent;
}

.analysis__state {
    font-family: var(--data);
    font-size: 0.8125rem;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.analysis__detail {
    font-family: var(--data);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    color: var(--muted);
}

/* The state names the standing and the detail qualifies it; the point parts
   them the way the docket parts its particulars. */
.analysis__detail::before {
    content: "\00b7";
    margin-right: 0.6rem;
    color: var(--rule);
}

.analysis__detail:empty::before {
    content: none;
}

.analysis__acts {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Complete: the analysis on file answers for everything under it. */
.analysis[data-state="current"] {
    border-left-color: var(--moss);
}

.analysis[data-state="current"] .analysis__mark {
    background: var(--moss);
    border-color: var(--moss);
}

.analysis[data-state="current"] .analysis__state {
    color: var(--moss);
}

/* Still reading. The count in the detail is what it has got through. */
.analysis[data-state="working"] {
    border-left-color: var(--steel);
}

.analysis[data-state="working"] .analysis__mark {
    background: var(--steel);
    border-color: var(--steel);
}

.analysis[data-state="working"] .analysis__state {
    color: var(--steel);
}

/* Files have come in since the analysis was made, so what it says no longer
   answers for the whole leaf. The one state on the page that asks for
   something, and the only one that offers the regeneration. */
.analysis[data-state="stale"] {
    border-left-color: var(--ochre-deep);
    background: rgba(166, 100, 28, 0.05);
}

.analysis[data-state="stale"] .analysis__mark {
    background: var(--ochre-deep);
    border-color: var(--ochre-deep);
}

.analysis[data-state="stale"] .analysis__state {
    color: var(--ochre-deep);
    font-weight: 700;
}

/* Nothing has been filed under the matter yet, so there is nothing to read. */
.analysis[data-state="none"] .analysis__mark {
    border-style: dashed;
}

/* The regeneration is offered only where it would do something. */
.analysis:not([data-state="stale"]) .analysis__regen {
    display: none;
}

/* ---------- the analysis actions ---------- */

/* Both actions are the caption button's clothes without the caption's spacing;
   the view opens a page of its own, so it is a link, and a leaf with nothing to
   read keeps a disabled button in its place. */
a.case-act--analysis,
a.case-act--regen {
    text-decoration: none;
}

.case-act--analysis,
.case-act--regen {
    color: var(--walnut);
    background: var(--plate);
    border: 1px solid var(--rule);
    padding: 0.3rem 0.6rem;
    white-space: nowrap;
}

.case-act--analysis:hover,
.case-act--regen:hover {
    color: #FFFFFF;
    background: var(--brass);
    border-color: var(--brass);
}

/* Regenerating is the act the stale state asks for, so it takes the ink and
   the view beside it stays quiet. */
.case-act--regen {
    color: var(--parchment);
    background: var(--ink);
    border-color: var(--ink);
}

.analysis__regen .case-act__chev {
    transition: transform 160ms ease;
}

/* ---------- narrow screens ---------- */

@media (max-width: 72rem) {
    .doc {
        grid-template-columns: var(--gutter) minmax(0, 1fr) 13rem;
        row-gap: 0.6rem;
    }

    .doc__acts {
        grid-column: 2 / -1;
        justify-content: flex-start;
        padding-right: 0;
    }
}

@media (max-width: 48rem) {
    .doc {
        grid-template-columns: var(--gutter) minmax(0, 1fr);
    }

    .doc__status,
    .doc__acts {
        grid-column: 2;
    }
}

@media (max-width: 40rem) {
    .doc__acts {
        flex-wrap: wrap;
    }

    .doc__acts .act {
        flex: 1 1 auto;
    }

    .leaf-foot__acts {
        gap: 0.6rem;
    }
}

/* ---------- collapsing a leaf ---------- */

/* The caption's actions share one right-aligned row. */
.caption__acts {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.7rem;
}

.caption__meta .caption__acts .case-act {
    margin-top: 0;
}

.case-act--toggle {
    color: var(--walnut);
    background: var(--plate);
    border: 1px solid var(--rule);
    padding: 0.3rem 0.6rem;
    white-space: nowrap;
}

.case-act--toggle:hover {
    color: #FFFFFF;
    background: var(--brass);
    border-color: var(--brass);
}

/* Points down at the list it opens, and along the caption when shut. */
.case-act__chev {
    transition: transform 160ms ease;
}

.case-leaf.is-collapsed .case-act__chev {
    transform: rotate(-90deg);
}

/* Collapsed, the leaf keeps its caption and its upload action; only the
   entries go. The caption's rule then does the footer's work, and the gutter
   number is dropped — it counts into a list that is no longer on screen. */
.case-leaf.is-collapsed .leaf-foot {
    border-top: 0;
}

.case-leaf.is-collapsed .leaf-foot .doc__entry {
    visibility: hidden;
}