/* Presentation for the documents module views (list, detail, create form). Content-only: each view
   renders inside the platform shell's content frame. After the platform-wide CSS consolidation, page
   chrome comes from layout.css (`.platform-page__*`, `.platform-list*`, `.platform-meta`, `.platform-link`)
   and form primitives from forms.css (`.platform-form__*`); the split editor's preview pane + live uploader
   moved to the shared platform component (M-062, file-uploader.css). This file keeps ONLY what is genuinely
   documents-specific: the detail page's key/value table, the description/note blocks, and the detail
   action-button row.
   Colors, spacing, radii and type come from the platform design tokens (tokens.css) — themeable
   without touching markup (coding-standards §4 and §12). Mobile-first; no inline styles. */

/* ---- Detail: key/value table (M-053) ----------------------------------- */
/* The document's textual details render with the shared platform key/value table
   (`.platform-kv-table .platform-kv-table--fixed`, 35% key via `.platform-kv-table__key--prop`), promoted
   to the platform layer in G4 — same shape as the směrnice detail and the admin notification page, no
   module-local copy (coding-standards §3, table.css). */

/* ---- Detail: description / note blocks ---------------------------------- */
.documents-detail__note-text {
    margin: 0;
    white-space: pre-line;
}

/* The contract's derived display-state pill (valid / expired / proposed / closed) and its free-form tag
   chips both render with the shared platform badge (`.platform-badge` + tone/`--wrap` modifiers) inside a
   `.platform-chip-row`, promoted to the platform layer in G1 — so the same status reads identically in the
   list grid and on the detail page, with no module-local copy (coding-standards §3, table.css).

   The organization selects' "+" quick-add trigger + modal (M-104) now use the shared platform
 * `platform-quick-add*` classes (promoted in M-107, packages/platform/.../css/quick-add.css), so the "our
 * party"/counterparties selects and the "+ create user" picker share one definition (coding-standards §3). */

/* ---- Create form: access/visibility staging (M-156) --------------------- */
/* The create form's "stage grants before publish" add-list (the edit form uses the shared platform access
   panel instead). Deliberately mirrors the platform access panel's layout (access-panel.css) so create and
   edit read the same: a stacked list of subject+level rows, then a subject/level picker + Add button that
   flows into a row once there is width. All values are design tokens (tokens.css), so light↔dark is a
   token-scope switch; mobile-first, no inline styles (coding-standards §4/§12). */
.documents-access-staging__intro {
    margin: 0 0 var(--platform-space-md);
    color: var(--platform-color-text-muted);
    font-size: var(--platform-font-size-sm);
}

.documents-access-staging__list {
    list-style: none;
    margin: 0 0 var(--platform-space-sm);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--platform-space-xs);
}

.documents-access-staging__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--platform-space-sm);
    padding: var(--platform-space-sm) var(--platform-space-md);
    border: 1px solid var(--platform-color-border);
    border-radius: var(--platform-radius-md);
    background: var(--platform-color-surface-muted);
}

.documents-access-staging__subject {
    /* Take the free space so the level badge and remove control sit at the row's end. */
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    color: var(--platform-color-text);
    word-break: break-word;
}

.documents-access-staging__level {
    flex: 0 0 auto;
    padding: var(--platform-space-xs) var(--platform-space-sm);
    border-radius: var(--platform-radius-sm);
    font-size: var(--platform-font-size-xs);
    font-weight: 600;
    white-space: nowrap;
}

.documents-access-staging__level--see {
    background: var(--platform-color-surface);
    border: 1px solid var(--platform-color-border);
    color: var(--platform-color-text-muted);
}

.documents-access-staging__level--edit {
    background: var(--platform-color-accent-surface);
    color: var(--platform-color-accent-strong);
}

.documents-access-staging__remove {
    flex: 0 0 auto;
}

.documents-access-staging__empty {
    margin: 0 0 var(--platform-space-sm);
    color: var(--platform-color-text-muted);
    font-size: var(--platform-font-size-sm);
}

/* The picker + Add button: stacks on mobile, then flows into a row (subject picker takes the lion's share)
   once there is width — matching the access panel's add form. */
.documents-access-staging__add {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--platform-space-md);
    padding-top: var(--platform-space-md);
    border-top: 1px solid var(--platform-color-border);
}

.documents-access-staging__field {
    display: flex;
    flex-direction: column;
    gap: var(--platform-space-xs);
}

.documents-access-staging__field:first-of-type {
    flex: 1 1 16rem;
    min-width: 0;
}

.documents-access-staging__submit {
    flex: 0 0 auto;
}