/* DOK-279 — shared "cadastro" shell: the Work Item (Direção B) rail + step content + sticky footer,
   generalized from the CaseDetailPage .case-* classes so every create/edit screen can reuse it. */

.dok-cadastro-layout {
    display: grid;
    grid-template-columns: 17rem minmax(0, 1fr);
    grid-template-areas:
        "rail content"
        "rail footer";
    align-items: start;
    gap: 1rem;
}

/* ---- Left rail (sticky vertical stepper) ---- */
.dok-cadastro-rail {
    grid-area: rail;
    position: sticky;
    top: 5.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(148, 163, 184, .2);
    border-radius: 10px;
    background: var(--mud-palette-surface);
}

.dok-cadastro-rail__title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
}

.dok-cadastro-rail__title strong { font-size: var(--dok-font-size-base); font-weight: 800; }

.dok-cadastro-rail__badge {
    display: inline-flex;
    align-items: center;
    padding: .32rem .58rem;
    border-radius: 999px;
    background: rgba(148, 163, 184, .16);
    color: var(--mud-palette-text-secondary);
    font-size: .72rem;
    font-weight: 850;
}

.dok-cadastro-rail__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.dok-cadastro-rail__step {
    position: relative;
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: .7rem;
    width: 100%;
    min-height: 4rem;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    color: inherit;
}

/* DOK-557 — a step its flow declares unselectable (CadastroStepDefinition.IsSelectable = false; the
   component renders the button disabled) must not invite a click. Muted, never hidden: the user still
   sees the step exists and reads its summary, which is where the flow says why it is locked. First
   consumer: the advanced-search pop-up, whose steps 3 to 5 wait for a Process. */
.dok-cadastro-rail__step:disabled {
    cursor: not-allowed;
    opacity: .55;
}

.dok-cadastro-rail__step:not(:last-child)::before {
    content: "";
    position: absolute;
    top: 2rem;
    bottom: 0;
    left: .95rem;
    width: 2px;
    background: rgba(148, 163, 184, .32);
}

.dok-cadastro-rail__step--complete:not(:last-child)::before,
.dok-cadastro-rail__step--active:not(:last-child)::before {
    background: rgba(148, 163, 184, .55);
}

.dok-cadastro-rail__marker {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: rgba(148, 163, 184, .22);
    color: var(--mud-palette-text-secondary);
    font-size: .78rem;
    font-weight: 900;
}

/* DOK-321 — completion and navigation get one visual channel each, so a step can carry both.
   These rules used to be a single shared declaration, which made "active" and "complete"
   indistinguishable and let the active step hide its own completeness. */

/* Completion — done: filled marker, holding the Check icon the component renders. */
.dok-cadastro-rail__step--complete .dok-cadastro-rail__marker {
    background: var(--mud-palette-text-primary);
    color: var(--mud-palette-surface);
}

/* Completion — work left to do. Warning, not error: incomplete is unfinished, not invalid. */
.dok-cadastro-rail__step--incomplete .dok-cadastro-rail__marker {
    background: var(--mud-palette-surface);
    color: var(--dok-tone-warning-ink);
    box-shadow: inset 0 0 0 2px var(--mud-palette-warning);
}

/* Completion — nothing to complete (Review, History, Genius). Deliberately neutral: these steps
   are out of the percentage too, so they must not read as pending. */
.dok-cadastro-rail__step--na .dok-cadastro-rail__marker {
    background: rgba(148, 163, 184, .22);
    color: var(--mud-palette-text-secondary);
}

/* Navigation — a ring around whatever the completion channel already drew. */
.dok-cadastro-rail__step--active .dok-cadastro-rail__marker {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}

.dok-cadastro-rail__copy { min-width: 0; padding-top: .08rem; }
.dok-cadastro-rail__name { display: block; color: var(--mud-palette-text-primary); font-size: .88rem; font-weight: 850; }
.dok-cadastro-rail__summary {
    display: block;
    margin-top: .1rem;
    overflow: hidden;
    color: var(--mud-palette-text-secondary);
    font-size: .74rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dok-cadastro-rail__next { display: block; margin-top: .15rem; color: var(--mud-palette-warning-darken, var(--mud-palette-warning)); font-size: .72rem; font-weight: 800; }

.dok-cadastro-rail__progress {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(148, 163, 184, .18);
}
.dok-cadastro-rail__autosave {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: var(--mud-palette-text-secondary);
    font-size: .72rem;
    font-weight: var(--dok-font-weight-medium);
}

.dok-cadastro-rail__progress-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    font-size: .72rem;
    color: var(--mud-palette-text-secondary);
}

/* DOK-321 — "5 of 8 complete · 63%". The percentage on its own is what used to read as
   "you are nearly done" when it only meant "you are nearly at the end of the rail". */
.dok-cadastro-rail__progress-meta {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    min-width: 0;
    text-align: right;
}

/* DOK-2196 — the track and its fill are DokProgressBar's (dok-theme.css); the rail only names its place. */

.dok-cadastro-rail__context {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(148, 163, 184, .18);
}

.dok-cadastro-rail__context-item {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: var(--mud-palette-text-secondary);
}

.dok-cadastro-rail__context-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.dok-cadastro-rail__context-label {
    font-size: .68rem;
    font-weight: var(--dok-font-weight-bold);
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--mud-palette-text-secondary);
}

.dok-cadastro-rail__context-value {
    font-size: .78rem;
    font-weight: var(--dok-font-weight-bold);
    color: var(--mud-palette-text-primary);
}

/* ---- Main step content ---- */
.dok-cadastro-content { grid-area: content; display: flex; flex-direction: column; gap: .85rem; }
.dok-cadastro-panel {
    padding: 1.15rem;
    border: 1px solid rgba(148, 163, 184, .2);
    border-radius: 12px;
    background: var(--mud-palette-surface);
}
.dok-cadastro-panel__header { margin-bottom: 1rem; }

/* DOK-816 — a panel that saves something of its own puts that button here. The sticky
   .dok-cadastro-footer carries the STEP's primary action (next / create); a per-panel save (the
   tenant's plan, its storage, its language) is a different act and belongs to the card it saves.
   Shared rather than page-local because the screens that need it were each growing a private copy —
   TenantDetailPage's .tenant-detail-accordion__footer was one, and it is what this rule replaces. */
.dok-cadastro-panel__actions { display: flex; justify-content: flex-end; gap: .65rem; margin-top: 1rem; }
.dok-cadastro-panel__header h3 { margin: 0; font-size: 1.05rem; font-weight: 850; }
.dok-cadastro-panel__header p { margin: .2rem 0 0; color: var(--mud-palette-text-secondary); font-size: .82rem; }

/* ---- Sticky footer (prev / save / primary) ---- */
.dok-cadastro-footer {
    grid-area: footer;
    position: sticky;
    bottom: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 1.1rem;
    border: 1px solid rgba(148, 163, 184, .2);
    border-radius: 12px;
    background: var(--mud-palette-surface);
}
.dok-cadastro-footer__primary { display: flex; align-items: center; gap: .65rem; margin-left: auto; }

/* DOK-320 — "unsaved changes" / "all changes saved", beside the Save button. Secondary text weight on
   purpose: it reports state, it is not an action competing with the button next to it. */
.dok-cadastro-footer__state {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin-right: .35rem;
    color: var(--mud-palette-text-secondary);
    font-size: .78rem;
    font-weight: var(--dok-font-weight-bold);
}

/* ---- DOK-315 — template editor rows -------------------------------------------------------
   The row language of the dossier sections (DokChecklistSection / DokApprovalSection, DOK-313)
   lifted out of those components so the *template* editors (Document Process cadastro) can wear
   the same clothes. It lives here, and not in a component <style>, because the sections that use
   it render in different rail steps and would otherwise each need their own copy.               */

.dok-tpl-list { display: flex; flex-direction: column; gap: .5rem; }

.dok-tpl-row {
    border-radius: 14px;
    background:
        linear-gradient(180deg, rgba(var(--mud-palette-primary-rgb), .015), rgba(var(--mud-palette-primary-rgb), 0)),
        var(--mud-palette-surface);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, opacity .18s ease;
}
.dok-tpl-row:hover {
    border-color: rgba(var(--mud-palette-primary-rgb), .22);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
    transform: translateY(-1px);
}
.dok-tpl-row--draggable { cursor: grab; }
.dok-tpl-row--draggable:active { cursor: grabbing; }
.dok-tpl-row--dragging { opacity: .45; }
.dok-tpl-row--editing { border-color: rgba(var(--mud-palette-primary-rgb), .45); }
.dok-tpl-row--new {
    border-style: dashed;
    background:
        linear-gradient(135deg, rgba(var(--mud-palette-primary-rgb), .035), rgba(var(--mud-palette-info-rgb), .02)),
        var(--mud-palette-surface);
}
.dok-tpl-row--new:hover { transform: none; box-shadow: none; }

.dok-tpl-row__line { display: flex; align-items: center; gap: .55rem; width: 100%; }
.dok-tpl-row__grip { display: grid; place-items: center; flex: 0 0 auto; color: var(--mud-palette-text-secondary); cursor: grab; }
.dok-tpl-row__grip:active { cursor: grabbing; }
.dok-tpl-row__order {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 50%;
    background: rgba(148, 163, 184, .16);
    color: var(--mud-palette-text-primary);
    font-size: .74rem;
    font-weight: 900;
}
.dok-tpl-row__main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.dok-tpl-row__actions { display: flex; align-items: center; gap: .1rem; flex: 0 0 auto; }

/* click-to-edit affordance (mirrors .dok-smart-checklist__text-button) */
.dok-tpl-row__text-button {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .5rem .65rem;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color .16s ease;
}
.dok-tpl-row__text-button:hover:not(:disabled) { background: rgba(var(--mud-palette-primary-rgb), .06); }
.dok-tpl-row__text-button:disabled { opacity: .7; cursor: default; }
.dok-tpl-row__text { flex: 1 1 auto; min-width: 0; color: var(--mud-palette-text-primary); font-size: .94rem; line-height: 1.45; }
.dok-tpl-row__edit-icon { flex: 0 0 auto; opacity: .45; transition: opacity .16s ease; }
.dok-tpl-row__text-button:hover:not(:disabled) .dok-tpl-row__edit-icon { opacity: .95; }
.dok-tpl-row__edit-inline { display: flex; align-items: center; gap: .35rem; width: 100%; }
.dok-tpl-row__edit-inline .mud-input-control { flex: 1 1 auto; }

.dok-tpl-row__title { overflow: hidden; color: var(--mud-palette-text-primary); font-size: .92rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.dok-tpl-row__meta { color: var(--mud-palette-text-secondary); font-size: .76rem; font-weight: 650; }
.dok-tpl-row__badges { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }

.dok-tpl-badge {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .12rem .5rem;
    border-radius: 999px;
    background: rgba(148, 163, 184, .16);
    color: var(--mud-palette-text-secondary);
    font-size: .68rem;
    font-weight: 800;
}
.dok-tpl-badge--accent { background: rgba(var(--mud-palette-primary-rgb), .12); color: var(--dok-tone-primary-ink); }
.dok-tpl-badge--warn { background: var(--dok-warning-surface); color: var(--dok-warning-ink); }

/* DOK-324 — the runtime half of an approval row. The template's default approvers and the dossier's
   live ones now share .dok-tpl-row*; what only exists at runtime (the decision, when it was taken, the
   comments) is ADDED to that row instead of justifying a second row language. These replace the
   .dok-approval-panel* block that used to live in an embedded <style> inside DokApprovalSection. */
/* DOK-1515 — the decision and the invalidated round are DokStatusPill, in the canonical chips' pill. */
/* DOK-404 - as rondas anteriores, por baixo da cadeia viva. */
.dok-approval-rounds { margin-top: 1rem; }
.dok-approval-rounds__row { display: flex; flex-direction: column; gap: .1rem; padding: .35rem 0; }

/* DOK-402/403 - a segunda linha de um passo do Processo: substituto e prazo, por baixo de quem decide. */
.dok-tpl-row__config { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .35rem 0 .1rem 2.6rem; }

/* DOK-403 - o prazo por omissao da cadeia, no topo do painel dos aprovadores. */
.dok-tpl-panel__config { margin-bottom: 1rem; }

.dok-tpl-row__comments {
    margin-top: .7rem;
    padding: .75rem;
    border-radius: 12px;
    background: rgba(var(--mud-palette-primary-rgb), .02);
}
.dok-tpl-row__comment-add { display: flex; align-items: flex-start; gap: .5rem; margin-top: .6rem; }
.dok-tpl-row__comment-add .mud-input-control { flex: 1 1 auto; }
.dok-tpl-row__comment-add .mud-button-root { flex: 0 0 auto; height: 40px; }

@media (max-width: 700px) {
    /* The status pill drops below the name rather than squeezing it to three characters. */
    .dok-tpl-row__line { flex-wrap: wrap; }
}

/* structured add/edit card (fields, documents) */
.dok-tpl-editor {
    margin-top: .85rem;
    padding: 1rem;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(var(--mud-palette-primary-rgb), .025), rgba(var(--mud-palette-info-rgb), .015)),
        var(--mud-palette-surface);
}
.dok-tpl-editor__header { display: flex; align-items: flex-start; gap: .7rem; margin-bottom: .85rem; }
.dok-tpl-editor__header-icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    border: 1px solid rgba(148, 163, 184, .2);
    border-radius: 999px;
    background: rgba(148, 163, 184, .16);
    color: var(--mud-palette-text-primary);
}
.dok-tpl-editor__title { display: block; color: var(--mud-palette-text-primary); font-size: .88rem; font-weight: 800; line-height: 1.25; }
.dok-tpl-editor__hint { display: block; margin-top: .1rem; color: var(--mud-palette-text-secondary); font-size: .76rem; }

/* section header count chip, sits next to the panel title */
.dok-tpl-count {
    display: inline-flex;
    align-items: center;
    padding: .1rem .5rem;
    border-radius: 999px;
    background: rgba(148, 163, 184, .16);
    color: var(--mud-palette-text-secondary);
    font-size: .7rem;
    font-weight: 850;
}

/* ---- Responsive: rail collapses to horizontal pills, footer becomes fixed ---- */
@media (max-width: 1199.98px) {
    .dok-cadastro-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "rail" "content" "footer"; }
    .dok-cadastro-rail { position: static; }
    .dok-cadastro-rail__steps { flex-direction: row; overflow-x: auto; gap: .5rem; }
    .dok-cadastro-rail__step { min-height: 0; }
    .dok-cadastro-rail__step:not(:last-child)::before { display: none; }
    .dok-cadastro-footer { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1200; border-radius: 0; }
    .dok-cadastro-content { padding-bottom: 5rem; }
}

/* DOK-364 — below 720px the shell shows a fixed 60px areas bar at the same z-index as this
   footer and later in the DOM, so it painted over the primary actions. Sit the footer on top
   of the bar rather than under it, and give the content enough room to clear both. The rule
   is here, not only on the dossier page, because every cadastro screen shares this footer. */
@media (max-width: 720px) {
    .dok-cadastro-footer { bottom: var(--dok-mobile-areas-height, 60px); }
    .dok-cadastro-content { padding-bottom: calc(5rem + var(--dok-mobile-areas-height, 60px)); }
}

/* The collapsed rail scrolls horizontally, so a step must keep its natural width. Without a
   floor it was squeezed to share the row and the labels ran into each other — the "rails
   desformatados" in the report. */
@media (max-width: 1199.98px) {
    .dok-cadastro-rail__step { flex: 0 0 auto; min-width: 9.5rem; scroll-snap-align: start; }
    .dok-cadastro-rail__steps { scroll-snap-type: x proximity; padding-bottom: .25rem; }
    .dok-cadastro-rail__summary { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* ---------------------------------------------------------------- Process trigger (DOK-483/486) --
   The one external operation a process may drive. Its own block rather than more dok-tpl-* variants,
   because this is a form with panels, not the row language the other template sections share. */
.dok-trigger { display: flex; flex-direction: column; gap: .75rem; }

.dok-trigger__status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: .75rem 1rem;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--dok-radius-md, 12px);
    background: var(--mud-palette-background-gray);
}

.dok-trigger__status-main { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.dok-trigger__status-actions { display: flex; align-items: center; gap: .5rem; }

.dok-trigger__panels { border-radius: var(--dok-radius-md, 12px); overflow: hidden; }

/* DEV-45 / DOK-1150 — three fields a row on a wide screen (who and how sensitive, then how hard to try), and
   the endpoint alone on the last row. Two a row where three would cut the labels, and one on a phone. */
.dok-trigger__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem 1rem;
}

.dok-trigger__wide { grid-column: 1 / -1; }

.dok-trigger__hint { margin: .35rem 0 0; color: var(--mud-palette-text-secondary); font-size: .82rem; line-height: 1.5; }
.dok-trigger__subhead { margin: 1rem 0 .5rem; font-size: .78rem; font-weight: var(--dok-font-weight-bold); letter-spacing: .05em; text-transform: uppercase; color: var(--mud-palette-text-secondary); }

.dok-trigger__actions { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-top: .75rem; }
.dok-trigger__footer { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }

/* The template and the built payload are read character by character when something is wrong, so they
   get a monospace face and are allowed to scroll rather than wrap mid-token. */
.dok-trigger__code textarea { font-family: var(--dok-font-mono, ui-monospace, "Cascadia Code", Consolas, monospace); font-size: .84rem; }

.dok-trigger__json {
    margin: 0;
    padding: .75rem 1rem;
    max-height: 20rem;
    overflow: auto;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--dok-radius-sm, 8px);
    background: var(--mud-palette-background-gray);
    font-family: var(--dok-font-mono, ui-monospace, "Cascadia Code", Consolas, monospace);
    font-size: .82rem;
    line-height: 1.6;
    white-space: pre-wrap;
    word-break: break-word;
}

.dok-trigger__errors { margin: 0; padding-left: 1.1rem; display: grid; gap: .3rem; }
.dok-trigger__paths { display: grid; gap: .5rem; }

.dok-trigger__path {
    padding: .6rem .8rem;
    border: 1px solid var(--mud-palette-lines-default);
    border-left-width: 3px;
    border-left-color: var(--mud-palette-success);
    border-radius: var(--dok-radius-sm, 8px);
    background: var(--mud-palette-surface);
}

/* A blocked path is the one thing on this screen somebody is looking for, so it is coloured rather
   than merely annotated. */
.dok-trigger__path--blocked { border-left-color: var(--mud-palette-warning); background: var(--dok-warning-surface-soft); }

.dok-trigger__path-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.dok-trigger__path-head code { font-size: .84rem; font-weight: var(--dok-font-weight-semibold); }
.dok-trigger__path-value { margin: .35rem 0 0; font-size: .88rem; word-break: break-word; }
.dok-trigger__path-problem { margin: .35rem 0 0; font-size: .84rem; color: var(--dok-warning-ink); }
.dok-trigger__path-note { margin: .25rem 0 0; font-size: .78rem; color: var(--mud-palette-text-secondary); }

@media (max-width: 1199.98px) {
    .dok-trigger__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    .dok-trigger__grid { grid-template-columns: minmax(0, 1fr); }
    .dok-trigger__status { align-items: flex-start; flex-direction: column; }
}

/* -------------------------------------------------------- Case integrations (DOK-490) --
   The attempts this dossier made at another company's system. Everything rendered here arrived from
   the API already redacted; nothing is un-redacted for display. */
.case-integrations { display: flex; flex-direction: column; gap: .5rem; }
.case-integrations__list { display: grid; gap: .5rem; }

/* DOK-1263 — one call of the chain: its heading, then its attempts, spaced as the list spaces them. */
.case-integrations__step { display: grid; gap: .5rem; }

/* DOK-1263 — under a row's head: what the answer wrote into the Dossiê, and the call's two files. */
.case-integrations__note { margin: 0; padding: 0 .8rem .6rem; font-size: .8rem; color: var(--mud-palette-text-secondary); word-break: break-word; }

.case-integrations__row {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--dok-radius-sm, 8px);
    background: var(--mud-palette-surface);
    overflow: hidden;
}

.case-integrations__row--open { border-color: rgba(var(--mud-palette-primary-rgb), .4); }

.case-integrations__row-head {
    display: flex;
    align-items: center;
    gap: .6rem;
    width: 100%;
    padding: .6rem .8rem;
    border: 0;
    background: none;
    text-align: left;
    cursor: pointer;
    font: inherit;
    color: inherit;
}

.case-integrations__row-head:hover { background: var(--mud-palette-action-default-hover); }
.case-integrations__row-main { display: flex; flex-direction: column; gap: .1rem; flex: 1 1 auto; min-width: 0; }
.case-integrations__row-meta { color: var(--mud-palette-text-secondary); font-size: .78rem; }

/* DOK-1509 — an attempt's status is DokExecutionStatusChip (ExecutionStates): timed out keeps the warning tone, never
   error, because we do not know the outcome — which is the whole reason re-sending is a decision and not a button. */
.case-integrations__row-head > .dok-pill { flex: 0 0 auto; }

.case-integrations__failure { margin: 0; padding: 0 .8rem .6rem; font-size: .82rem; color: var(--dok-warning-ink); }

/* DOK-1159 — under the explanation, the reason the server stored, with its code. It stays on screen because
   it is the audit record and a support conversation quotes it word for word; it is muted and smaller so it
   reads as the technical note it is, and not as the explanation, which is now the line above it. */
.case-integrations__failure-technical { margin: 0; padding: 0 .8rem .6rem; font-size: .76rem; color: var(--mud-palette-text-secondary); }
.case-integrations__detail { padding: 0 .8rem .8rem; display: flex; flex-direction: column; gap: .5rem; }

.case-integrations__facts { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .25rem .75rem; margin: 0; font-size: .84rem; }
.case-integrations__facts dt { color: var(--mud-palette-text-secondary); }
.case-integrations__facts dd { margin: 0; word-break: break-word; }

.case-integrations__subhead { margin: .5rem 0 .25rem; font-size: .74rem; font-weight: var(--dok-font-weight-bold); letter-spacing: .05em; text-transform: uppercase; color: var(--mud-palette-text-secondary); }

.case-integrations__json {
    margin: 0;
    padding: .6rem .75rem;
    max-height: 16rem;
    overflow: auto;
    border-radius: var(--dok-radius-sm, 8px);
    background: var(--mud-palette-background-gray);
    font-family: var(--dok-font-mono, ui-monospace, "Cascadia Code", Consolas, monospace);
    font-size: .78rem;
    line-height: 1.6;
    white-space: pre-wrap;
    word-break: break-word;
}

.case-integrations__paths { display: grid; gap: .35rem; }
.case-integrations__path { padding: .45rem .6rem; border-left: 3px solid var(--mud-palette-lines-default); background: var(--mud-palette-background-gray); border-radius: var(--dok-radius-sm, 8px); }
.case-integrations__path-head { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.case-integrations__path-head code { font-size: .8rem; font-weight: var(--dok-font-weight-semibold); }
.case-integrations__path-value { margin: .2rem 0 0; font-size: .84rem; word-break: break-word; }
.case-integrations__path-note { margin: .15rem 0 0; font-size: .76rem; color: var(--mud-palette-text-secondary); }

.case-integrations__actions { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: .35rem; }
.case-integrations__hint { color: var(--mud-palette-text-secondary); font-size: .78rem; }

@media (max-width: 767.98px) {
    .case-integrations__facts { grid-template-columns: minmax(0, 1fr); }
    .case-integrations__facts dt { margin-top: .35rem; }
}

/* DOK-335 — the access policy, made readable in the dossier. The rule itself is old and enforced
   server-side; what was missing was any way to read it off the screen without opening a dropdown.
   Tokens only, no literals: the palette follows the tenant theme. */
.dok-access-summary {
    display: grid;
    gap: .55rem;
    margin-top: .9rem;
    padding: .85rem 1rem;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--dok-radius-sm, 8px);
    background: var(--mud-palette-background-gray);
}

.dok-access-summary__head { display: flex; align-items: center; gap: .4rem; color: var(--mud-palette-text-secondary); font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.dok-access-summary__level { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; }
.dok-access-summary__consequence { color: var(--mud-palette-text-secondary); font-size: .82rem; }

.dok-access-summary__who { display: grid; gap: .3rem; margin: 0; padding: 0; list-style: none; }
.dok-access-summary__who li { display: flex; justify-content: space-between; gap: 1rem; font-size: .82rem; }
.dok-access-summary__who span { color: var(--mud-palette-text-secondary); }
.dok-access-summary__who strong { font-weight: 800; text-align: right; word-break: break-word; }

.dok-access-summary__note { display: flex; align-items: flex-start; gap: .4rem; margin: 0; color: var(--mud-palette-text-secondary); font-size: .78rem; line-height: 1.5; }

/* Said once for the Documents step. Per document it would be the same sentence thirty times. */
.case-documents-access { display: flex; align-items: center; gap: .4rem; margin: 0 0 .8rem; color: var(--mud-palette-text-secondary); font-size: .8rem; }

/* ---------------------------------------------------------- Dossier shares (DOK-703) --
   Who outside the company was sent this dossier. Global rather than a .razor.css, because a scoped
   stylesheet never reaches a MudBlazor component root — the pill and the row would lose their styling
   the moment either grew a Mud element. Tokens and palette variables only, no literal colours: the
   whole section has to follow the tenant theme and dark mode like everything around it. */
.case-shares { display: flex; flex-direction: column; gap: .5rem; }
.case-shares__lead { margin: 0; color: var(--mud-palette-text-secondary); font-size: .82rem; line-height: 1.5; }

/* The Public-only notice. Warning-tinted rather than error-tinted: nothing has gone wrong, a rule is
   being explained. */
.case-shares__locked {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .75rem .9rem;
    border: 1px solid rgba(var(--mud-palette-warning-rgb), .35);
    border-radius: var(--dok-radius-sm, 8px);
    background: rgba(var(--mud-palette-warning-rgb), .08);
}

.case-shares__locked-icon { flex: 0 0 auto; margin-top: .1rem; color: var(--dok-tone-warning-ink); }
.case-shares__locked-title { margin: 0; font-size: .88rem; font-weight: var(--dok-font-weight-bold); }
.case-shares__locked-why { margin: .3rem 0 0; color: var(--mud-palette-text-secondary); font-size: .82rem; line-height: 1.55; }
.case-shares__locked-level { margin: .3rem 0 0; font-size: .82rem; font-weight: var(--dok-font-weight-semibold); }

.case-shares__list { display: grid; gap: .5rem; }

.case-shares__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: start;
    gap: .6rem;
    padding: .6rem .8rem;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--dok-radius-sm, 8px);
    background: var(--mud-palette-surface);
}

.case-shares__row-main { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.case-shares__email { font-size: .9rem; font-weight: var(--dok-font-weight-bold); word-break: break-word; }
.case-shares__meta { display: flex; flex-wrap: wrap; gap: .1rem .6rem; color: var(--mud-palette-text-secondary); font-size: .78rem; }
.case-shares__meta span + span::before { content: "·"; margin-right: .5rem; }
.case-shares__activity { margin: .1rem 0 0; color: var(--mud-palette-text-secondary); font-size: .78rem; }
.case-shares__note { margin: .1rem 0 0; font-size: .78rem; color: var(--mud-palette-text-secondary); font-style: italic; }
.case-shares__row-actions { display: flex; align-items: center; gap: .1rem; }
.case-shares__actions { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: .35rem; }

.case-shares__status {
    flex: 0 0 auto;
    align-self: start;
    padding: .15rem .55rem;
    border-radius: var(--dok-radius-full, 999px);
    background: var(--mud-palette-background-gray);
    color: var(--mud-palette-text-secondary);
    font-size: .72rem;
    font-weight: var(--dok-font-weight-bold);
    letter-spacing: .03em;
    text-transform: uppercase;
    white-space: nowrap;
}

.case-shares__status--live { background: rgba(var(--mud-palette-success-rgb), .14); color: var(--dok-tone-success-ink); }
.case-shares__status--done { background: rgba(var(--mud-palette-info-rgb), .14); color: var(--dok-tone-info-ink); }
.case-shares__status--stale { background: rgba(var(--mud-palette-warning-rgb), .14); color: var(--dok-tone-warning-ink); }
.case-shares__status--off { background: rgba(var(--mud-palette-error-rgb), .12); color: var(--dok-tone-error-ink); }

/* The invitation dialog. */
.case-shares__form { display: flex; flex-direction: column; gap: .85rem; }
.case-shares__form-note { margin: 0; color: var(--mud-palette-text-secondary); font-size: .78rem; line-height: 1.5; }

.case-shares__verification {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    padding: .7rem .85rem;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--dok-radius-sm, 8px);
    background: var(--mud-palette-background-gray);
}

.case-shares__verification-title { display: flex; align-items: center; gap: .4rem; margin: 0; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--mud-palette-text-secondary); }
.case-shares__verification-default { margin: 0; font-size: .82rem; line-height: 1.5; }

/* Only on screen while the switch is on: the price of the weaker option, said as it is taken. */
.case-shares__verification-cost {
    display: flex;
    align-items: flex-start;
    gap: .4rem;
    margin: .2rem 0 0;
    padding: .5rem .6rem;
    border-radius: var(--dok-radius-sm, 8px);
    background: rgba(var(--mud-palette-warning-rgb), .12);
    color: var(--mud-palette-warning-darken);
    font-size: .8rem;
    line-height: 1.5;
}

@media (max-width: 767.98px) {
    .case-shares__row { grid-template-columns: minmax(0, 1fr); }
    .case-shares__row-actions { justify-content: flex-end; }
}

/* DOK-1059 - the renewal origin, beside the dossier number in the case header. */
.dok-dossier-renewal {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.25rem;
    font-size: 0.85rem;
}