/* Dotační monitor V3 — "položkový rozpočet" (itemised budget sheet).
   Loaded after app.css. It remaps app.css's own tokens, so every existing
   screen picks up the new palette, and adds the V3 shell (side rail),
   the ledger list pattern and the dashboard recap sheet.
   Design system: docs/DESIGN_SYSTEM_V3.md. */

:root {
    /* Shell */
    --dm-rail: #10302a;
    --dm-rail-hover: #18413a;
    --dm-rail-active: #215248;
    --dm-rail-line: #23493f;
    --dm-rail-ink: #e6eeea;
    --dm-rail-muted: #9cb5ad;

    /* Sheet */
    --dm-ground: #f2f3f0;
    --dm-surface: #ffffff;
    --dm-band: #f7f8f5;
    --dm-rule: #dde1da;
    --dm-rule-strong: #c2c8bf;
    --dm-ink: #17201b;
    --dm-ink-2: #434d47;
    --dm-ink-3: #5f6963;

    /* Action */
    --dm-accent: #1b5c4f;
    --dm-accent-strong: #123f36;
    --dm-accent-bg: #e3eeea;

    /* Reserved: deadlines within 14 days. Never used for anything else. */
    --dm-deadline: #b3340d;
    --dm-deadline-bg: #fbe8e1;
    --dm-deadline-line: #efc1b0;

    --dm-font: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
    --dm-font-display: "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;
    --dm-rail-width: 236px;

    /* app.css tokens remapped onto the V3 palette */
    --color-bg: var(--dm-ground);
    --color-surface: var(--dm-surface);
    --color-border: var(--dm-rule);
    --color-border-strong: var(--dm-rule-strong);
    --color-text: var(--dm-ink);
    --color-muted: var(--dm-ink-3);
    --color-muted-light: #8b948e;

    --color-primary: var(--dm-accent);
    --color-primary-dark: var(--dm-accent-strong);
    --color-primary-bg: var(--dm-accent-bg);

    --color-success: #1a6a44;
    --color-success-bg: #e6f2eb;
    --color-success-border: #bcdcc9;
    --color-warning: #855700;
    --color-warning-bg: #fbf0d6;
    --color-warning-border: #e9cf91;
    --color-danger: #9f1f1a;
    --color-danger-bg: #f8e5e3;
    --color-danger-border: #e8b9b4;
    --color-info: #2a5786;
    --color-info-bg: #e7eef7;
    --color-info-border: #c1d3e8;
    --color-neutral: #48514c;
    --color-neutral-bg: #edefea;
    --color-neutral-border: #d6dad3;

    --radius-sm: 3px;
    --radius-md: 4px;
    --shadow-sm: none;
    --shadow-md: 0 6px 18px -8px rgba(16, 32, 27, 0.25);

    --content-max-width: 1480px;
}

/* ---------- Base ---------- */

html { scrollbar-color: var(--dm-rule-strong) transparent; }

body {
    font-family: var(--dm-font);
    font-size: 15px;
    line-height: 1.5;
    background: var(--dm-ground);
    color: var(--dm-ink);
}

::selection { background: #cfe3db; color: var(--dm-ink); }

h1, h2, h3 { font-family: var(--dm-font-display); color: var(--dm-ink); }
h1 { font-size: 1.6rem; font-weight: 650; letter-spacing: -0.012em; }
h2 { font-size: 1.02rem; font-weight: 650; }
h3 { font-size: 0.92rem; font-weight: 650; }

a { color: var(--dm-accent); text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { color: var(--dm-accent-strong); }

:focus-visible {
    outline: 2px solid var(--dm-accent);
    outline-offset: 2px;
    border-radius: 2px;
}

input:focus, select:focus, textarea:focus {
    border-color: var(--dm-accent);
    box-shadow: 0 0 0 3px rgba(27, 92, 79, 0.16);
}

input, select, textarea { accent-color: var(--dm-accent); }

.num, table.data td, .ledger td { font-variant-numeric: tabular-nums; }

/* ---------- Shell ---------- */

.app-shell {
    display: grid;
    grid-template-columns: var(--dm-rail-width) minmax(0, 1fr);
    min-height: 100vh;
}

.rail {
    background: var(--dm-rail);
    color: var(--dm-rail-ink);
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    scrollbar-color: var(--dm-rail-line) transparent;
}

.rail-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 1rem 0.9rem 1.1rem;
    border-bottom: 1px solid var(--dm-rail-line);
}

.rail-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--dm-rail-ink);
    font-weight: 650;
    font-size: 0.98rem;
    letter-spacing: -0.005em;
    text-decoration: none;
}

.rail-brand:hover { color: #fff; }
.rail-mark { color: #8fd0b9; flex: none; }

.rail-toggle { display: none; }

.rail-nav {
    display: flex;
    flex-direction: column;
    padding: 0.4rem 0.6rem 1rem;
    flex: 1;
}

.rail-group {
    margin: 1.1rem 0 0.35rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--dm-rail-muted);
}

.rail .nav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    color: var(--dm-rail-ink);
    font-size: 0.9rem;
    font-weight: 450;
    padding: 0.42rem 0.55rem;
    border-radius: var(--radius-sm);
    white-space: nowrap;
    opacity: 0.92;
}

.rail .nav-link:hover { background: var(--dm-rail-hover); color: #fff; opacity: 1; }

.rail .nav-link.active {
    background: var(--dm-rail-active);
    color: #fff;
    font-weight: 600;
    opacity: 1;
}

.nav-count {
    font-size: 0.74rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--dm-rail-ink);
    background: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    padding: 0.05rem 0.4rem;
    min-width: 1.6rem;
    text-align: center;
}

.nav-count-alert { background: #c4472a; color: #fff; }

.rail-user {
    margin-top: auto;
    padding: 1rem 0.55rem 0;
    border-top: 1px solid var(--dm-rail-line);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    white-space: normal;
}

.rail .header-user .user-chip {
    color: var(--dm-rail-muted);
    font-size: 0.8rem;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rail .header-user .btn-link {
    color: var(--dm-rail-ink);
    padding: 0.3rem 0;
    font-size: 0.84rem;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.rail .header-user .btn-link:hover { background: none; color: #fff; }

.workspace {
    width: 100%;
    max-width: var(--content-max-width);
    margin: 0;
    padding: 1.75rem 2.25rem 3rem;
}

.workspace.narrow { max-width: calc(var(--content-max-width-narrow) + 4.5rem); }

.auth-main {
    max-width: 440px;
    margin: 0 auto;
    padding: 12vh 1.25rem 3rem;
}

@media (max-width: 900px) {
    .app-shell { display: block; }
    .rail { position: sticky; top: 0; z-index: 20; height: auto; overflow: visible; }
    .rail-head { padding: 0.7rem 1rem; border-bottom: none; }
    .rail-toggle {
        display: inline-flex;
        background: transparent;
        border: 1px solid var(--dm-rail-line);
        color: var(--dm-rail-ink);
        padding: 0.35rem 0.75rem;
        font-size: 0.85rem;
    }
    .rail-toggle:hover { background: var(--dm-rail-hover); border-color: var(--dm-rail-line); }
    .rail.rail-js .rail-nav { display: none; }
    .rail.rail-js.rail-open .rail-nav {
        display: flex;
        max-height: calc(100vh - 56px);
        overflow-y: auto;
        border-top: 1px solid var(--dm-rail-line);
    }
    .workspace { padding: 1.1rem 1rem 2.5rem; }
}

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

.page-header { margin-bottom: 1.5rem; align-items: flex-end; }
.page-header .page-lead { color: var(--dm-ink-3); font-size: 0.9rem; max-width: 72ch; }
.page-header .actions { margin-top: 0; }

/* ---------- Surfaces ---------- */

.card {
    border-radius: var(--radius-md);
    border-color: var(--dm-rule);
    box-shadow: none;
}

.section h2 { border-bottom-color: var(--dm-rule); }

.alert { border-radius: var(--radius-sm); }
.alert-success { background: var(--color-success-bg); border-color: var(--color-success-border); }
.alert-error { background: var(--color-danger-bg); border-color: var(--color-danger-border); }

/* ---------- Controls ---------- */

button, .btn {
    border-radius: var(--radius-sm);
    font-weight: 550;
    padding: 0.48rem 0.95rem;
}

.btn-secondary { color: var(--dm-ink); background: var(--dm-surface); }
.btn-secondary:hover { color: var(--dm-ink); background: var(--dm-band); border-color: var(--dm-rule-strong); }

button:disabled, .btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; }

/* Status tags: squared, like a stamp in a column, not a pill. */
.badge {
    border-radius: 3px;
    padding: 0.1rem 0.45rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.005em;
}

/* ---------- Tables ---------- */

table.data th, table.data td { border-bottom-color: var(--dm-rule); }

table.data th {
    background: var(--dm-band);
    color: var(--dm-ink-3);
    font-size: 0.74rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.01em;
    border-bottom: 1px solid var(--dm-rule-strong);
}

table.data tbody tr:hover { background: #f6f8f4; }

.table-responsive {
    background: var(--dm-surface);
    border: 1px solid var(--dm-rule);
    border-radius: var(--radius-md);
}

.card .table-responsive { border: none; border-radius: 0; }

/* ---------- Ledger (signature): deadline-grouped rows with subtotals ---------- */

.ledger { width: 100%; border-collapse: collapse; font-size: 0.88rem; }

.ledger th {
    text-align: left;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--dm-ink-3);
    background: var(--dm-band);
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--dm-rule-strong);
    white-space: nowrap;
}

.ledger td {
    padding: 0.62rem 0.75rem;
    border-bottom: 1px solid var(--dm-rule);
    vertical-align: top;
}

.ledger tbody tr.ledger-row:hover { background: #f6f8f4; }

.ledger .col-no { width: 2.6rem; color: var(--dm-ink-3); font-size: 0.78rem; text-align: right; padding-right: 0.25rem; }
.ledger .col-check { width: 2.2rem; }
.ledger .col-check input { margin: 0.2rem 0 0; }
.ledger .num, .ledger .col-date, .ledger .col-amount { text-align: right; white-space: nowrap; }
.ledger .col-date { width: 6.5rem; }

.ledger-group th {
    background: var(--dm-surface);
    color: var(--dm-ink);
    font-size: 0.8rem;
    font-weight: 650;
    padding-top: 1rem;
    border-bottom: 1px solid var(--dm-ink);
}

.ledger-group.is-current th { color: var(--dm-deadline); border-bottom-color: var(--dm-deadline); }

.ledger-subtotal td {
    background: var(--dm-band);
    font-size: 0.8rem;
    color: var(--dm-ink-2);
    border-bottom: 1px solid var(--dm-rule-strong);
    border-top: 1px solid var(--dm-rule-strong);
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.ledger-subtotal .subtotal-label { font-weight: 600; }
.ledger-subtotal .subtotal-note { color: var(--dm-ink-3); }

.row-title { font-weight: 550; color: var(--dm-ink); text-decoration: none; }
.row-title:hover { color: var(--dm-accent); text-decoration: underline; }
.row-meta { display: block; margin-top: 0.15rem; font-size: 0.78rem; color: var(--dm-ink-3); }
.row-meta .sep { margin: 0 0.3rem; color: var(--dm-rule-strong); }

.deadline-date { display: block; font-weight: 550; }
.deadline-left { display: block; font-size: 0.76rem; color: var(--dm-ink-3); }
.deadline-left.is-near { color: var(--dm-deadline); font-weight: 650; }
.deadline-left.is-past { color: var(--dm-ink-3); }

.state-cell .badge + .badge { margin-left: 0.2rem; }
.state-sub { display: block; margin-top: 0.25rem; font-size: 0.76rem; color: var(--dm-ink-3); }

.flags { display: flex; flex-wrap: wrap; gap: 0.25rem; }

/* ---------- Toolbar (call list filters) ---------- */

.toolbar {
    background: var(--dm-surface);
    border: 1px solid var(--dm-rule);
    border-radius: var(--radius-md);
    padding: 0.85rem 0.9rem 0.25rem;
    margin-bottom: 1rem;
}

.toolbar-main {
    display: grid;
    grid-template-columns: minmax(220px, 2.2fr) repeat(4, minmax(140px, 1fr)) auto;
    gap: 0.6rem;
    align-items: end;
}

.toolbar label { font-size: 0.76rem; font-weight: 600; color: var(--dm-ink-3); margin-bottom: 0.2rem; }
.toolbar input[type="text"], .toolbar select { margin-bottom: 0.6rem; padding: 0.45rem 0.6rem; font-size: 0.88rem; }
.toolbar .toolbar-submit { margin-bottom: 0.6rem; }

.toolbar-more { border-top: 1px solid var(--dm-rule); margin-top: 0.1rem; }
.toolbar-more > summary {
    cursor: pointer;
    list-style: none;
    padding: 0.55rem 0 0.6rem;
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--dm-accent);
}
.toolbar-more > summary::-webkit-details-marker { display: none; }
.toolbar-more > summary::before { content: "+ "; }
.toolbar-more[open] > summary::before { content: "− "; }
.toolbar-more-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0 0.6rem;
}
.toolbar-checks { padding: 0.1rem 0 0.7rem; }
.toolbar-checks label { font-size: 0.85rem; color: var(--dm-ink-2); font-weight: 400; }
.toolbar-reset { font-size: 0.84rem; margin-left: 0.75rem; }

.list-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    margin: 0 0 0.6rem;
    font-size: 0.86rem;
    color: var(--dm-ink-3);
}

.list-meta strong { color: var(--dm-ink); font-variant-numeric: tabular-nums; }

@media (max-width: 1100px) {
    .toolbar-main { grid-template-columns: 1fr 1fr 1fr; }
    .toolbar-main .toolbar-search { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
    .toolbar-main { grid-template-columns: 1fr 1fr; }
}

/* Ledger rows become two-line entries on phones. */
@media (max-width: 760px) {
    .ledger thead { display: none; }
    .ledger, .ledger tbody { display: block; }
    .ledger tr.ledger-row {
        display: grid;
        grid-template-columns: auto 1fr auto;
        gap: 0.15rem 0.6rem;
        padding: 0.7rem 0.75rem;
        border-bottom: 1px solid var(--dm-rule);
    }
    .ledger tr.ledger-row td { border: none; padding: 0; }
    .ledger tr.ledger-row .col-title { grid-column: 2 / 4; }
    .ledger tr.ledger-row .col-no, .ledger tr.ledger-row .col-check { grid-row: 1; }
    .ledger tr.ledger-row .col-source { grid-column: 2 / 3; font-size: 0.8rem; }
    .ledger tr.ledger-row .state-cell { grid-column: 2 / 3; }
    .ledger tr.ledger-row .col-date { grid-column: 3 / 4; grid-row: 2 / 4; align-self: start; }
    .ledger tr.ledger-row .col-flags { grid-column: 2 / 4; }
    .ledger tr.ledger-row .col-flags:empty { display: none; }
    .ledger tr.ledger-group, .ledger tr.ledger-subtotal { display: block; }
    .ledger tr.ledger-group th, .ledger tr.ledger-subtotal td { display: block; }
    .ledger-subtotal td:empty { display: none; }
    .table-responsive.ledger-wrap { overflow-x: visible; }
}

/* ---------- Dashboard recap sheet ---------- */

.recap {
    display: grid;
    grid-template-columns: minmax(300px, 0.8fr) minmax(0, 1.2fr);
    gap: 1.25rem;
    align-items: start;
    margin-bottom: 1.5rem;
}

.sheet {
    background: var(--dm-surface);
    border: 1px solid var(--dm-rule);
    border-radius: var(--radius-md);
}

.sheet-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem 0.7rem;
    border-bottom: 1px solid var(--dm-ink);
}

.sheet-head h2 { margin: 0; padding: 0; border: none; font-size: 1rem; }
.sheet-head .sheet-link { font-size: 0.84rem; white-space: nowrap; }
.sheet-body { padding: 0; }
.sheet-foot { padding: 0.6rem 1rem; font-size: 0.82rem; color: var(--dm-ink-3); border-top: 1px solid var(--dm-rule); }

.todo-list { list-style: none; margin: 0; padding: 0; }

.todo-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.15rem 1rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--dm-rule);
    text-decoration: none;
    color: inherit;
}

.todo-list li:last-child .todo-item { border-bottom: none; }
a.todo-item:hover { background: #f6f8f4; }
.todo-item .todo-label { font-weight: 600; color: var(--dm-ink); }
.todo-item .todo-hint { grid-column: 1 / 2; font-size: 0.8rem; color: var(--dm-ink-3); }
.todo-item .todo-count {
    grid-row: 1 / 3;
    grid-column: 2;
    align-self: center;
    font-family: var(--dm-font-display);
    font-size: 1.55rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    color: var(--dm-ink);
    min-width: 2.5ch;
    text-align: right;
}
.todo-item.is-zero .todo-count, .todo-item.is-zero .todo-label { color: var(--dm-ink-3); font-weight: 500; }
.todo-item.is-alert .todo-count { color: var(--color-danger); }

.recap-totals {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.5rem;
    margin: 0 0 1.75rem;
    padding: 0.6rem 0;
    border-top: 1px solid var(--dm-rule-strong);
    border-bottom: 1px solid var(--dm-rule-strong);
    font-size: 0.88rem;
    color: var(--dm-ink-2);
}

.recap-totals b { font-variant-numeric: tabular-nums; color: var(--dm-ink); font-weight: 650; margin-right: 0.2rem; }

.dash-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.dash-grid > .sheet { min-width: 0; }
.sheet table.data th:first-child, .sheet table.data td:first-child { padding-left: 1rem; }
.sheet .empty-state { padding: 1rem; color: var(--dm-ink-3); font-size: 0.88rem; }
.sheet .empty-state p { margin: 0; }

.health-dot {
    display: inline-block;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    margin-right: 0.4rem;
    vertical-align: 0.05em;
    background: var(--dm-rule-strong);
}
.health-dot.is-ok { background: var(--color-success); }
.health-dot.is-warn { background: #c48a12; }
.health-dot.is-error { background: var(--color-danger); }

@media (max-width: 1100px) {
    .recap, .dash-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Call detail ---------- */

.detail-head { margin-bottom: 1.25rem; }
.detail-head h1 { margin: 0 0 0.35rem; font-size: 1.55rem; max-width: 46ch; }
.detail-id { font-size: 0.86rem; color: var(--dm-ink-3); }
.detail-id .sep { margin: 0 0.35rem; color: var(--dm-rule-strong); }

.detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 1.25rem;
    align-items: start;
}

.detail-aside { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: 1rem; }

.facts { margin: 0; }
.facts > div {
    display: grid;
    grid-template-columns: 11rem minmax(0, 1fr);
    gap: 0.75rem;
    padding: 0.55rem 1rem;
    border-bottom: 1px solid var(--dm-rule);
}
.facts > div:last-child { border-bottom: none; }
.facts dt { font-size: 0.82rem; color: var(--dm-ink-3); }
.facts dd { margin: 0; font-size: 0.9rem; overflow-wrap: anywhere; }
.facts dd.num { font-variant-numeric: tabular-nums; }
.facts .prose { white-space: pre-line; max-width: 75ch; }

.aside-facts > div { grid-template-columns: 7.5rem minmax(0, 1fr); padding: 0.5rem 0.9rem; }

.deadline-panel { padding: 0.9rem 1rem; }
.deadline-panel .deadline-big {
    font-family: var(--dm-font-display);
    font-size: 1.35rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    margin: 0;
}
.deadline-panel .deadline-left { font-size: 0.86rem; margin-top: 0.15rem; }
.deadline-panel.is-near { border-color: var(--dm-deadline-line); background: var(--dm-deadline-bg); }
.deadline-panel.is-near .deadline-big { color: var(--dm-deadline); }

.source-links { list-style: none; margin: 0; padding: 0.4rem 0; }
.source-links li a { display: block; padding: 0.45rem 1rem; font-size: 0.88rem; overflow-wrap: anywhere; }

@media (max-width: 1100px) {
    .detail-layout { grid-template-columns: minmax(0, 1fr); }
    .detail-aside { position: static; }
}

@media (max-width: 620px) {
    .facts > div, .aside-facts > div { grid-template-columns: minmax(0, 1fr); gap: 0.1rem; }
    h1, .detail-head h1 { font-size: 1.3rem; }
}

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; }
}

/* Deadline urgency badges keep their semantic classes (badge-danger for
   0–7 days, badge-warning for 8–30) but use the reserved deadline colour. */
.deadline-badge { margin-top: 0.2rem; }
.deadline-badge.badge-danger { background: var(--dm-deadline-bg); color: var(--dm-deadline); border-color: var(--dm-deadline-line); }
.deadline-badge.badge-warning { background: transparent; color: var(--dm-deadline); border-color: var(--dm-deadline-line); font-weight: 550; }
.ledger .col-date .badge { display: inline-block; }
.ledger .col-source .badge { margin-top: 0.25rem; }
.list-meta .toolbar-reset { margin-left: 0; }

input[type="search"] {
    width: 100%;
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-sm);
    font: inherit;
    font-size: 0.88rem;
    background: var(--dm-surface);
    color: var(--dm-ink);
    margin-bottom: 0.6rem;
}
input::placeholder, textarea::placeholder { color: #6f7872; }

/* ---------- Detail helpers ---------- */

.crumbs { display: flex; flex-wrap: wrap; gap: 0.4rem; font-size: 0.84rem; color: var(--dm-ink-3); margin-bottom: 0.6rem; }
.crumbs a { color: var(--dm-ink-2); }
.detail-head .flag-row { margin-top: 0.7rem; }
.sheet-pad { padding: 0.85rem 1rem; margin: 0; }
.sheet-head .muted { font-size: 0.8rem; }
p.prose, .prose { max-width: 75ch; line-height: 1.6; }
.aside-title { font-size: 0.8rem; font-weight: 650; color: var(--dm-ink-3); margin: 0 0 0.3rem; padding: 0; border: none; }
.deadline-panel .aside-facts { margin: 0.75rem -1rem -0.9rem; border-top: 1px solid var(--dm-rule); }
.deadline-panel.is-near .aside-facts { border-top-color: var(--dm-deadline-line); }
.deadline-panel.is-near .aside-facts > div { border-bottom-color: var(--dm-deadline-line); }
.detail-main > .sheet + .sheet { margin-top: 0; }
.secondary-actions { margin-top: 0.5rem; padding-top: 1rem; border-top: 1px solid var(--dm-rule); }
.review-action-bar { border-top: 1px solid var(--dm-rule); border-left: none; background: var(--dm-surface); }

@media (max-width: 760px) {
    .ledger .col-check { width: auto; }
    .ledger tr.ledger-row td.col-check:empty { display: none; }
    .ledger tr.ledger-subtotal {
        display: flex;
        justify-content: space-between;
        gap: 0.75rem;
        background: var(--dm-band);
        border-top: 1px solid var(--dm-rule-strong);
        border-bottom: 1px solid var(--dm-rule-strong);
    }
    .ledger tr.ledger-subtotal td { display: block; border: none; background: none; }
}

.rail .rail-user { margin-left: 0; margin-right: 0; width: auto; justify-content: flex-start; order: 0; }

/* ---------- Public catalogue: same system, airier ----------
   app.css builds every public rule from the brand block on .public-body;
   remapping that block here moves the public surface onto the V3 palette
   without touching its layout. Status colours keep their meaning: open
   stays green, "končí brzy" uses the reserved deadline colour. */
.public-body {
    --brand-primary: #1b5c4f;
    --brand-dark: #10302a;
    --brand-hover: #123f36;
    --brand-light: #e3eeea;
    --brand-light-line: #bfd6cd;
    --brand-surface: #f5f7f4;
    --brand-surface-strong: #eef1ed;
    --brand-line: #e0e4de;
    --brand-line-strong: #c8cec5;
    --text-primary: #17201b;
    --text-muted: #5b655f;
    --pub-ink-soft: #3b453f;
    --pub-muted-strong: #4d5751;
    --pub-on-deep: #c6d8d0;
    --pub-on-deep-strong: #e6efeb;
    --pub-on-deep-muted: #9cb5ad;
    --pub-ok: #1a6a44;
    --pub-ok-soft: #e6f2eb;
    --pub-ok-line: #bcdcc9;
    --pub-urgent: #b3340d;
    --pub-urgent-soft: #fbe8e1;
    --pub-urgent-line: #efc1b0;
    --pub-r-sm: 4px;
    --pub-r-md: 6px;
    --pub-shadow-sm: 0 1px 2px rgba(16, 32, 27, 0.06);
    --pub-shadow-md: 0 4px 16px -4px rgba(16, 32, 27, 0.12);
    --pub-shadow-lg: 0 12px 32px -8px rgba(16, 32, 27, 0.18);
    font-family: var(--dm-font);
}
.public-body h1, .public-body h2, .public-body h3 { font-family: var(--dm-font-display); }

/* ---------- Sign-in ---------- */

.auth-body { background: var(--dm-ground); }
.auth-brand {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1.25rem;
    font-family: var(--dm-font-display);
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--dm-ink);
}
.auth-brand .rail-mark { color: var(--dm-accent); }
.auth-card { padding: 1.75rem 1.75rem 1.5rem; border-top: 1px solid var(--dm-ink); }
.auth-card h1 { font-size: 1.35rem; margin-bottom: 0.35rem; }
.auth-card p.muted { font-size: 0.88rem; margin: 0 0 1.25rem; }
.auth-card button[type="submit"] { width: 100%; justify-content: center; padding: 0.6rem 1rem; }
.auth-foot { margin-top: 1rem; font-size: 0.86rem; }

/* Below the two-column breakpoint the deadline is the first thing read,
   the source/record panels follow the content. */
@media (max-width: 1100px) {
    .detail-layout { display: flex; flex-direction: column; gap: 0; }
    .detail-aside { display: contents; }
    .detail-aside > .deadline-panel { order: -1; margin-bottom: 1.25rem; }
    .detail-aside > .sheet:not(.deadline-panel) { order: 2; margin-bottom: 1.25rem; }
}

/* ==========================================================================
   Shared patterns used by the remaining screens (Ke kontrole, Publikace,
   Změny, Zdroje, Monitoring, Matice zdrojů, Kontrola zdrojů, MS2021 pokrytí,
   formuláře). Restyled here once so every screen speaks the same sheet
   language without touching each template.
   ========================================================================== */

/* KPI tiles become one ruled recap strip: figures side by side in a single
   sheet, no coloured caps, no hover lift. */
.stat-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    background: var(--dm-surface);
    border: 1px solid var(--dm-rule);
    border-radius: var(--radius-md);
    margin-bottom: 1.25rem;
}
.stat-card {
    flex: 1 1 118px;
    background: transparent;
    border: none;
    border-right: 1px solid var(--dm-rule);
    border-radius: 0;
    box-shadow: none;
    padding: 0.7rem 1rem 0.65rem;
    transition: none;
}
.stat-card:last-child { border-right: none; }
.stat-card:hover { box-shadow: none; transform: none; }
.stat-card .value {
    font-family: var(--dm-font-display);
    font-size: 1.35rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    color: var(--dm-ink);
}
.stat-card .label { font-size: 0.78rem; margin-top: 0.1rem; color: var(--dm-ink-3); }
.stat-card.accent .value { color: var(--dm-accent); }
.stat-card.warn .value { color: var(--color-warning); }
.stat-card.danger .value { color: var(--color-danger); }
@media (max-width: 620px) {
    .stat-card { flex-basis: 50%; border-bottom: 1px solid var(--dm-rule); }
    .stat-card:nth-child(2n) { border-right: none; }
}

/* Filter forms: toolbar density. */
.filters {
    padding: 0.85rem 0.9rem;
    grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));
    gap: 0.6rem 0.6rem;
}
.filters .field label { font-size: 0.76rem; font-weight: 600; color: var(--dm-ink-3); }
.filters input[type="text"], .filters input[type="search"], .filters select { padding: 0.45rem 0.6rem; font-size: 0.88rem; }
.filters .field-checkboxes label { font-size: 0.85rem; color: var(--dm-ink-2); font-weight: 400; }
.filters .field-actions a { font-size: 0.84rem; }

/* A card whose first child is its heading reads as a sheet: the heading
   becomes the sheet head with the 1px ink rule, tables run edge to edge. */
.card > h2:first-child {
    margin: calc(-1 * var(--card-pad)) calc(-1 * var(--card-pad)) var(--space-4);
    padding: 0.85rem var(--card-pad) 0.7rem;
    border-bottom: 1px solid var(--dm-ink);
    font-size: 1rem;
}
.card > .table-responsive {
    width: auto;
    margin-left: calc(-1 * var(--card-pad));
    margin-right: calc(-1 * var(--card-pad));
}
.card > .table-responsive:last-child { margin-bottom: calc(-1 * var(--card-pad)); }
.card > .table-responsive table.data th:first-child,
.card > .table-responsive table.data td:first-child { padding-left: var(--card-pad); }
.card > .table-responsive table.data th:last-child,
.card > .table-responsive table.data td:last-child { padding-right: var(--card-pad); }
.card > .table-responsive table.data tbody tr:last-child td { border-bottom: none; }

/* Description lists: ruled rows like the detail page's facts. */
dl.detail-grid { gap: 0; }
dl.detail-grid dt, dl.detail-grid dd { padding: 0.5rem 0; border-bottom: 1px solid var(--dm-rule); }
dl.detail-grid dt { padding-right: 1.25rem; font-size: 0.82rem; color: var(--dm-ink-3); }
dl.detail-grid dt:last-of-type, dl.detail-grid dd:last-of-type { border-bottom: none; }

.empty-state { text-align: left; padding: 1rem 0; }
.card > .empty-state:only-of-type { padding-bottom: 0; }

.pagination a, .pagination .page-current { border-radius: var(--radius-sm); font-variant-numeric: tabular-nums; }

.row-actions a { font-size: 0.84rem; }
.review-call-title { font-weight: 550; color: var(--dm-ink); text-decoration: none; }
.review-call-title:hover { color: var(--dm-accent); text-decoration: underline; }
.review-call-meta { color: var(--dm-ink-3); }

@media (max-width: 620px) {
    dl.detail-grid { grid-template-columns: minmax(0, 1fr); }
    dl.detail-grid dt { border-bottom: none; padding-bottom: 0; }
}

/* Review queue rows: at most three whole meta lines instead of a clipped
   fourth; long relevance labels may wrap inside the fixed-width column. */
.review-call-meta { max-height: none; gap: 0.1rem; }
.review-call-meta-row { line-height: 1.25; }
.review-call-meta-row:nth-child(n+4) { display: none; }
.review-table .badge { white-space: normal; }
.review-table .row-actions .btn-sm { padding: 0.2rem 0.55rem; }

/* Content is visible from the first frame; no opacity entrance. */
main.workspace, main.auth-main { animation: none; }

/* ---------- Sectioned forms ---------- */

.form-sheet { max-width: 980px; }
.form-section { margin: 0 0 1.25rem; padding: 0; min-width: 0; }
.form-section > legend.sheet-head { display: block; width: 100%; float: left; }
.form-section > legend.sheet-head + * { clear: both; }
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 1rem;
    padding: 1rem 1rem 0.25rem;
}
.form-field-wide { grid-column: 1 / -1; }
.form-field label { font-size: 0.84rem; font-weight: 600; color: var(--dm-ink-2); }
.form-field.has-error input, .form-field.has-error select, .form-field.has-error textarea { border-color: var(--color-danger); }
.form-actions { position: sticky; bottom: 0; background: var(--dm-ground); padding: 0.75rem 0; margin-top: 0; border-top: 1px solid var(--dm-rule); }
@media (max-width: 760px) {
    .form-grid { grid-template-columns: minmax(0, 1fr); }
}
.public-body main { animation: none; }
.card > .table-responsive:first-child { margin-top: calc(-1 * var(--card-pad)); }

/* One source of truth for card padding, so the edge-to-edge rules above
   follow app.css's own narrower padding on small screens. */
.card { --card-pad: var(--space-5); padding: var(--card-pad); }
@media (max-width: 900px) { .card { --card-pad: var(--space-4); } }

/* Focus ring on the dark rail needs the light mint, not the accent. */
.rail :focus-visible { outline-color: #8fd0b9; }

/* ---------- Change list: before -> after ---------- */
.change-diff { font-size: 0.84rem; max-width: 40ch; }
.change-diff .diff-old { color: var(--dm-ink-3); text-decoration: line-through; text-decoration-color: var(--dm-rule-strong); }
.change-diff .diff-arrow { margin: 0 0.35rem; color: var(--dm-ink-3); }
.change-diff .diff-new { color: var(--dm-ink); font-weight: 550; }
.change-table form { margin: 0; }
@media (max-width: 760px) {
    .change-table thead { display: none; }
    .change-table, .change-table tbody, .change-table tr, .change-table td { display: block; width: auto; }
    .change-table tr { padding: 0.7rem var(--card-pad, 1rem); border-bottom: 1px solid var(--dm-rule); }
    table.data.change-table td { border: none; padding: 0.15rem 0; max-width: none; }
    .change-table td:nth-child(3), .change-table td:nth-child(4), .change-table td:nth-child(5) { display: inline-block; margin-right: 0.6rem; vertical-align: middle; }
    .table-responsive:has(.change-table) { overflow-x: visible; }
}
.provider-table td:first-child { min-width: 17rem; }