/* =========================================================
   Lo On Shing — console de l'Agent et archives de brèves
   Outil interne : dense, lisible, sans effet inutile.
   ========================================================= */

/* ---------- bandeau d'accès libre ---------- */
.access-open {
    background: #fff4e6;
    border: 1px solid #f0c48a;
    border-left: 4px solid var(--brand-orange, #e67e22);
    border-radius: var(--radius-md, 6px);
    padding: 0.75rem 1rem;
    font-size: 0.88rem;
    color: #7a4a12;
    margin-bottom: 1.5rem;
}
.access-open strong { color: #5e3708; }

/* ---------- ossature de la console ---------- */
.ag-shell {
    background: var(--bg-white, #fff);
    border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: var(--radius-md, 6px);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.06));
    overflow: hidden;
}
.ag-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border-bottom: 1px solid var(--bg-border, #e2e8f0);
    background: var(--bg-subtle, #eef3fa);
}
.ag-tabs button {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0.9rem 1.35rem;
    font-family: inherit;
    font-size: 0.92rem;
    color: var(--text-muted, #64748b);
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: var(--transition, all .2s ease);
}
.ag-tabs button:hover { color: var(--brand-primary-dark, #0d4494); }
.ag-tabs button.is-on {
    color: var(--brand-primary-dark, #0d4494);
    background: #fff;
    border-bottom-color: var(--brand-orange, #e67e22);
    font-weight: 700;
}
.ag-tabs .ag-count {
    display: inline-block;
    min-width: 1.35rem;
    margin-left: 0.45rem;
    padding: 0.05rem 0.4rem;
    border-radius: 999px;
    background: var(--brand-orange, #e67e22);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.45;
}
.ag-panel { padding: 1.5rem; display: none; }
.ag-panel.is-on { display: block; }

.ag-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 1.25rem;
}
.ag-bar .spacer { flex: 1 1 auto; }
.ag-note {
    font-size: 0.85rem;
    color: var(--text-muted, #64748b);
    margin-bottom: 1.1rem;
    line-height: 1.6;
}

/* ---------- fiche message ---------- */
.ag-item {
    border: 1px solid var(--bg-border, #e2e8f0);
    border-left: 4px solid var(--brand-primary-light, #4a80c6);
    border-radius: var(--radius-md, 6px);
    padding: 1.05rem 1.2rem;
    margin-bottom: 1rem;
    background: #fff;
}
.ag-item.is-auto { border-left-color: #2f9e5f; }
.ag-item.is-pending { border-left-color: var(--brand-orange, #e67e22); }
.ag-item.is-done { border-left-color: #cbd5e1; opacity: .72; }

.ag-item-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.5rem 0.85rem;
    margin-bottom: 0.5rem;
}
.ag-item-head h3 {
    font-size: 1rem;
    margin: 0;
    color: var(--brand-primary-darker, #092f66);
    flex: 1 1 18rem;
}
.ag-meta {
    font-size: 0.79rem;
    color: var(--text-muted, #64748b);
}
.ag-meta code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.76rem;
    background: var(--bg-subtle, #eef3fa);
    padding: 0.08rem 0.35rem;
    border-radius: 3px;
    color: var(--brand-primary-dark, #0d4494);
}

.ag-chip {
    display: inline-block;
    padding: 0.12rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.ag-chip.auto { background: #e3f5ea; color: #1d6b40; }
.ag-chip.pending { background: #fdf0e2; color: #a55d10; }
.ag-chip.info { background: var(--brand-accent, #dbe6f5); color: var(--brand-primary-dark, #0d4494); }
.ag-chip.admin { background: #ede4f8; color: #5b3a8e; }
.ag-chip.state { background: #eef2f6; color: #475569; }

.ag-why {
    font-size: 0.82rem;
    color: var(--text-muted, #64748b);
    font-style: italic;
    margin: 0.15rem 0 0.7rem;
}

.ag-quote {
    background: var(--bg-subtle, #eef3fa);
    border-radius: var(--radius-md, 6px);
    padding: 0.85rem 1rem;
    font-size: 0.86rem;
    line-height: 1.65;
    color: var(--text-body, #334155);
    white-space: pre-wrap;
    max-height: 15rem;
    overflow-y: auto;
    margin-bottom: 0.75rem;
}
.ag-subject {
    font-weight: 700;
    font-size: 0.88rem;
    color: var(--brand-primary-darker, #092f66);
    margin-bottom: 0.45rem;
}
.ag-missing {
    font-size: 0.8rem;
    color: #a55d10;
    background: #fdf0e2;
    border-radius: 4px;
    padding: 0.4rem 0.6rem;
    margin-bottom: 0.7rem;
}
.ag-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }

.ag-btn {
    appearance: none;
    border: 1px solid var(--bg-border, #e2e8f0);
    background: #fff;
    border-radius: 999px;
    padding: 0.4rem 0.95rem;
    font-family: inherit;
    font-size: 0.83rem;
    color: var(--text-body, #334155);
    cursor: pointer;
    transition: var(--transition, all .2s ease);
}
.ag-btn:hover { border-color: var(--brand-primary, #1a55a8); color: var(--brand-primary-dark, #0d4494); }
.ag-btn.primary { background: var(--brand-primary-dark, #0d4494); border-color: var(--brand-primary-dark, #0d4494); color: #fff; }
.ag-btn.primary:hover { background: var(--brand-primary-darker, #092f66); color: #fff; }
.ag-btn.warm { background: var(--brand-orange, #e67e22); border-color: var(--brand-orange, #e67e22); color: #fff; }
.ag-btn.warm:hover { background: var(--brand-orange-dark, #c75e0a); color: #fff; }
.ag-btn.ghost { color: var(--text-muted, #64748b); }
.ag-btn[disabled] { opacity: .5; cursor: default; }

/* ---------- tableau des dossiers ---------- */
.ag-table { width: 100%; border-collapse: collapse; font-size: 0.87rem; }
.ag-table th {
    text-align: left;
    padding: 0.6rem 0.7rem;
    border-bottom: 2px solid var(--bg-border, #e2e8f0);
    color: var(--text-muted, #64748b);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.ag-table td { padding: 0.65rem 0.7rem; border-bottom: 1px solid var(--bg-border, #e2e8f0); vertical-align: top; }
.ag-table tr:hover td { background: var(--bg-subtle, #eef3fa); }
.ag-table code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.8rem; }
.ag-scroll { overflow-x: auto; }

/* ---------- barre d'avancement d'un dossier ---------- */
.ag-track { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-top: 0.4rem; }
.ag-track span {
    height: 5px;
    flex: 1 1 12px;
    min-width: 12px;
    border-radius: 3px;
    background: var(--bg-border, #e2e8f0);
}
.ag-track span.done { background: var(--brand-primary, #1a55a8); }
.ag-track span.here { background: var(--brand-orange, #e67e22); }

/* ---------- veille ---------- */
.ag-news-jur {
    margin: 1.6rem 0 0.8rem;
    font-size: 1.02rem;
    color: var(--brand-primary-darker, #092f66);
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
}
.ag-news-jur .n { font-size: 0.8rem; color: var(--text-muted, #64748b); font-weight: 400; }
.ag-news-item {
    border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: var(--radius-md, 6px);
    padding: 0.95rem 1.1rem;
    margin-bottom: 0.75rem;
}
.ag-news-item.approved { border-color: #9ed4b4; background: #f6fcf8; }
.ag-news-item.rejected { border-color: #e2e8f0; opacity: .55; }
.ag-news-item.published { border-color: #b9c9e6; background: #f7faff; }
.ag-news-item h4 { font-size: 0.97rem; margin: 0 0 0.35rem; color: var(--brand-primary-darker, #092f66); }
.ag-news-item p { font-size: 0.86rem; line-height: 1.6; margin: 0 0 0.55rem; color: var(--text-body, #334155); }
.ag-news-item .src { font-size: 0.79rem; color: var(--text-muted, #64748b); }
.ag-news-item .src a { color: var(--brand-primary, #1a55a8); }

.ag-themes { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 0.55rem; }
.ag-theme {
    border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: var(--radius-md, 6px);
    padding: 0.65rem 0.8rem;
    font-size: 0.84rem;
}
.ag-theme b { display: block; color: var(--brand-primary-dark, #0d4494); font-size: 0.86rem; margin-bottom: 0.2rem; }
.ag-theme span { color: var(--text-muted, #64748b); line-height: 1.5; }

/* ---------- journal ---------- */
.ag-log { font-size: 0.82rem; }
.ag-log li {
    padding: 0.45rem 0;
    border-bottom: 1px dashed var(--bg-border, #e2e8f0);
    list-style: none;
    color: var(--text-body, #334155);
}
.ag-log time { color: var(--text-muted, #64748b); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.76rem; margin-right: 0.6rem; }

/* ---------- brèves publiées : compléments ---------- */
.news-source { display: inline-block; font-size: 0.78rem; color: var(--text-muted, #64748b); margin-top: 0.5rem; text-decoration: none; }
a.news-source:hover { color: var(--brand-primary, #1a55a8); text-decoration: underline; }
.news-effective { font-size: 0.79rem; color: var(--brand-primary, #1a55a8); margin: 0.2rem 0 0; }
.news-month { display: inline-block; font-size: 0.76rem; color: var(--text-muted, #64748b); margin-left: 0.5rem; }
.news-month-head {
    font-size: 1.05rem;
    color: var(--brand-primary-darker, #092f66);
    margin: 2rem 0 1rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--bg-border, #e2e8f0);
}
.news-month-head:first-child { margin-top: 0; }
.news-empty { color: var(--text-muted, #64748b); font-style: italic; }
.news-filter { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-bottom: 1.5rem; }
.news-filter button {
    appearance: none;
    border: 1px solid var(--bg-border, #e2e8f0);
    background: #fff;
    border-radius: 999px;
    padding: 0.35rem 0.95rem;
    font-family: inherit;
    font-size: 0.85rem;
    cursor: pointer;
    color: var(--text-body, #334155);
    transition: var(--transition, all .2s ease);
}
.news-filter button.is-on {
    background: var(--brand-primary-dark, #0d4494);
    border-color: var(--brand-primary-dark, #0d4494);
    color: #fff;
}
.news-filter select {
    border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: 999px;
    padding: 0.35rem 0.9rem;
    font-family: inherit;
    font-size: 0.85rem;
    background: #fff;
    color: var(--text-body, #334155);
}

@media (max-width: 640px) {
    .ag-panel { padding: 1rem; }
    .ag-tabs button { padding: 0.75rem 0.9rem; font-size: 0.85rem; }
}

/* ---------- fiche d'un dossier ---------- */
.ag-table.ag-clickable tbody tr { cursor: pointer; }
.ag-table.ag-clickable tbody tr:focus { outline: 2px solid var(--brand-primary, #1a55a8); outline-offset: -2px; }
.ag-table.ag-clickable tbody tr.is-open td { background: var(--brand-accent, #dbe6f5); }
.ag-open-cell { text-align: right; white-space: nowrap; }
.ag-open-arrow { font-size: 0.8rem; color: var(--brand-primary, #1a55a8); font-weight: 700; }

.ag-matter {
    margin-top: 1.25rem;
    border: 1px solid var(--bg-border, #e2e8f0);
    border-top: 4px solid var(--brand-primary-dark, #0d4494);
    border-radius: var(--radius-md, 6px);
    background: #fff;
    padding: 1.3rem 1.4rem;
}
.ag-matter-head {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem;
    padding-bottom: 0.8rem; margin-bottom: 1rem;
    border-bottom: 1px solid var(--bg-border, #e2e8f0);
}
.ag-matter-head h3 { margin: 0; font-size: 1.1rem; color: var(--brand-primary-darker, #092f66); }
.ag-matter-h {
    margin: 1.5rem 0 0.6rem; font-size: 0.82rem; text-transform: uppercase;
    letter-spacing: .06em; color: var(--text-muted, #64748b);
    padding-bottom: 0.3rem; border-bottom: 1px solid var(--bg-border, #e2e8f0);
}
.ag-matter-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 0.75rem 1.2rem;
}
.ag-matter-cell .k {
    display: block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: .05em;
    color: var(--text-muted, #64748b);
}
.ag-matter-cell .v { display: block; font-size: 0.9rem; color: var(--text-body, #334155); margin-top: 0.12rem; }
.ag-matter-row {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem 1rem;
    padding: 0.65rem 0; border-bottom: 1px dashed var(--bg-border, #e2e8f0);
    font-size: 0.89rem; color: var(--text-body, #334155);
}
.ag-matter-row:last-of-type { border-bottom: 0; }
.ag-matter-row > div:first-child { flex: 1 1 20rem; }
.ag-matter-row .ag-actions { margin-left: auto; }

.ag-kyc { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.ag-kyc-item {
    font-size: 0.79rem; padding: 0.28rem 0.7rem; border-radius: 999px;
    border: 1px solid var(--bg-border, #e2e8f0); background: #fff; color: var(--text-body, #334155);
}
.ag-kyc-item.received { background: #e3f5ea; border-color: #9ed4b4; color: #1d6b40; }
.ag-kyc-item.missing { background: #fdf0e2; border-color: #f0c48a; color: #a55d10; }
.ag-kyc-item.expired { background: #fbe9e9; border-color: #e6a8a8; color: #943d3d; }

/* ---------- collaborateurs et leurs dossiers ---------- */
.ag-handler-add {
    display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center;
    padding: 0.9rem 1rem; margin-bottom: 1.2rem;
    background: var(--bg-subtle, #eef3fa);
    border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: var(--radius-md, 6px);
}
.ag-handler-add input {
    flex: 1 1 11rem;
    padding: 0.45rem 0.7rem;
    border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: var(--radius-md, 6px);
    font-family: inherit; font-size: 0.86rem;
    color: var(--text-body, #334155); background: #fff;
}
.ag-handler-add input:focus {
    outline: none; border-color: var(--brand-primary, #1a55a8);
    box-shadow: 0 0 0 3px rgba(26,85,168,.12);
}

.ag-handler {
    border: 1px solid var(--bg-border, #e2e8f0);
    border-left: 4px solid var(--brand-primary, #1a55a8);
    border-radius: var(--radius-md, 6px);
    padding: 1rem 1.15rem;
    margin-bottom: 1rem;
    background: #fff;
}
.ag-handler.is-off { border-left-color: #cbd5e1; opacity: .68; }
.ag-handler-head {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem;
    padding-bottom: 0.75rem; margin-bottom: 0.8rem;
    border-bottom: 1px solid var(--bg-border, #e2e8f0);
}
.ag-handler-head strong { color: var(--brand-primary-darker, #092f66); font-size: 0.98rem; }

.ag-handler-matters {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: 0.5rem;
}
.ag-check {
    display: flex; align-items: flex-start; gap: 0.55rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: var(--radius-md, 6px);
    cursor: pointer;
    transition: var(--transition, all .2s ease);
}
.ag-check:hover { border-color: var(--brand-primary-light, #4a80c6); }
.ag-check.is-on { background: #f2f8f4; border-color: #9ed4b4; }
.ag-check input { margin-top: 0.15rem; accent-color: var(--brand-primary-dark, #0d4494); }
.ag-check input:disabled { cursor: default; }
.ag-check-text { display: flex; flex-direction: column; gap: 0.1rem; line-height: 1.35; }
.ag-check-text code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.78rem; color: var(--brand-primary-dark, #0d4494); }
.ag-check-client { font-size: 0.87rem; color: var(--text-body, #334155); font-weight: 700; }

/* =========================================================
   Objet social — le panneau de la fiche dossier
   L'oeil doit distinguer sans lire : ce qui vient du texte
   officiel, ce qui vient d'un dossier anterieur, et ce que
   la machine a seulement suggere.
   ========================================================= */
.scope-block { margin-top: 1.6rem; }
.scope-src { width: 100%; font-family: inherit; }
.scope-actions { margin: 0.6rem 0 0.2rem; }
.scope-line { margin: 1rem 0 0.4rem; }
.scope-demande {
    font-weight: 600; color: var(--brand-primary-dark, #0d4494);
    margin-bottom: 0.35rem;
}
.scope-vide { font-style: italic; }
.scope-cand {
    display: flex; align-items: baseline; gap: 0.6rem;
    padding: 0.32rem 0.5rem; border-radius: 6px; cursor: pointer;
}
.scope-cand:hover { background: rgba(13, 68, 148, 0.05); }
.scope-code {
    font-size: 0.82rem; color: #64748b; min-width: 4.2rem;
    font-variant-numeric: tabular-nums;
}
.scope-lib { flex: 1; display: flex; flex-direction: column; }
.scope-lib-zh:empty { display: none; }
.scope-lib-en { color: #475569; font-size: 0.9rem; }
.scope-score {
    font-size: 0.78rem; color: #94a3b8; font-variant-numeric: tabular-nums;
}
.scope-prov { font-size: 0.72rem; }
.scope-prov-officiel  { background: #dcfce7; color: #14532d; }
.scope-prov-precedent { background: #fef3c7; color: #78350f; }
.scope-prov-propose   { background: #e2e8f0; color: #334155; }
.scope-warn {
    background: #fef3c7; border-left: 3px solid #d97706;
    padding: 0.5rem 0.75rem; border-radius: 0 6px 6px 0; color: #78350f;
    font-size: 0.88rem;
}
.scope-retenu { margin-top: 1.2rem; }
.scope-sortie {
    background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px;
    padding: 0.8rem 1rem; white-space: pre-wrap; font-size: 0.9rem;
    line-height: 1.7;
}

/* =========================================================
   Traductions automatiques — aperçu du format
   Les couleurs sont celles du modèle d'Antoine, reprises
   telles quelles : l'aperçu doit montrer ce qui s'imprime,
   pas une approximation.
   ========================================================= */
.mt-block { margin-top: 1.6rem; }
.mt-doc { margin: 1.1rem 0; }
.mt-doc-head { display: flex; align-items: baseline; gap: 0.6rem; margin-bottom: 0.4rem; }
.mt-etat { font-size: 0.72rem; }
.mt-todo { background: #fee2e2; color: #7f1d1d; }
.mt-wait { background: #fef3c7; color: #78350f; }
.mt-done { background: #dcfce7; color: #14532d; }
.mt-apercu {
    border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden;
    background: #fff; margin-bottom: 0.6rem;
}
.mt-bandeau {
    background: #d9ebfa; color: #215c9e;
    display: flex; align-items: baseline; justify-content: space-between;
    gap: 1rem; padding: 0.55rem 1.1rem;
}
.mt-bandeau-g { font-weight: 700; font-size: 0.82rem; letter-spacing: 0.01em; }
.mt-bandeau-d { font-size: 0.74rem; text-align: right; }
.mt-corps { color: #cbd5e1; text-align: center; padding: 1.4rem 0 1rem; letter-spacing: 0.4em; }
.mt-mention {
    color: #215c9e; font-style: italic; font-size: 0.78rem; line-height: 1.5;
    margin: 0 1.1rem 0.5rem;
}
.mt-filet { height: 1px; background: #6b99d1; margin: 0 1.1rem 0.9rem; }
.mt-langues { display: flex; align-items: center; flex-wrap: wrap; gap: 0.55rem; margin: 0.5rem 0; }
.mt-langues-l { font-size: 0.82rem; color: #64748b; margin-right: 0.2rem; }
.mt-langue {
    display: inline-flex; align-items: center; gap: 0.32rem;
    padding: 0.24rem 0.6rem; border: 1px solid #e2e8f0; border-radius: 999px;
    font-size: 0.84rem; cursor: pointer; background: #fff;
}
.mt-langue:hover { border-color: #6b99d1; }
/* EN et FR sont les deux propositions courantes : elles se distinguent
   sans être présélectionnées — le choix reste entier. */
.mt-langue-mise-en-avant { border-color: #bcd4ee; background: #f4f9ff; font-weight: 600; }
.mt-attente { color: #78350f; margin: 0.1rem 0 0.5rem; }
.ag-tasks .ag-task-list { list-style: none; padding: 0; margin: 0.6rem 0 0; }
.ag-tasks .ag-task-list li { padding: 0.3rem 0; }
.ag-link {
    background: none; border: 0; padding: 0; cursor: pointer;
    color: var(--brand-primary-dark, #0d4494); font: inherit; font-weight: 600;
    text-decoration: underline;
}
.ag-btn-mini { font-size: 0.76rem; padding: 0.15rem 0.6rem; margin-left: 0.6rem; }
.ag-tasks a.ag-link { display: inline; }

/* ---- le flux, affiché en tête de la console ---- */
.ag-wf { background: #fff; border: 1px solid var(--bg-border, #e2e8f0); border-radius: 10px;
         padding: 1.2rem 1.5rem; margin-bottom: 1.4rem; }
.ag-wf-head h3 { margin: 0 0 0.2rem; }
.ag-wf-list { list-style: none; counter-reset: none; padding: 0; margin: 1rem 0 0; }
.ag-wf-step { padding: 0.55rem 0; border-top: 1px solid #f1f5f9; }
.ag-wf-step:first-child { border-top: 0; }
.ag-wf-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.5rem; }
.ag-wf-no { display: inline-flex; align-items: center; justify-content: center;
            min-width: 1.9rem; height: 1.5rem; border-radius: 999px;
            background: var(--brand-primary-dark, #0d4494); color: #fff;
            font-size: 0.76rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.ag-wf-step .ag-meta { margin: 0.25rem 0 0 2.4rem; display: block; }
.ag-wf-branch { margin: 0.5rem 0 0 2.4rem; padding-left: 0.8rem;
                border-left: 2px solid #dbe6f5; }
.ag-wf-tpl { font-size: 0.74rem; color: #64748b; }
.wf-auto  { background: #dcfce7; color: #14532d; }
.wf-draft { background: #fef3c7; color: #78350f; }
.wf-human { background: #e2e8f0; color: #334155; }

/* =========================================================
   Le flux, replié par défaut
   ---------------------------------------------------------
   La section faisait 945 px en haut de CHAQUE onglet — on
   descendait plus de trois fois la hauteur du journal pour
   atteindre le journal. Elle est désormais une ligne, et
   s'ouvre d'un clic ; l'état est retenu d'une visite à
   l'autre.
   ========================================================= */
.ag-wf-head {
    display: flex; align-items: baseline; gap: 0.65rem;
    width: 100%; padding: 0; border: 0; background: none;
    text-align: left; cursor: pointer; font: inherit; color: inherit;
}
.ag-wf-head:focus-visible { outline: 2px solid var(--brand-primary, #1a55a8); outline-offset: 4px; }
.ag-wf-chev {
    display: inline-flex; align-items: center; justify-content: center;
    width: 1.4rem; height: 1.4rem; flex: 0 0 auto;
    color: var(--brand-primary-dark, #0d4494);
    transition: transform 0.18s ease;
}
.ag-wf.is-open .ag-wf-chev { transform: rotate(90deg); }
.ag-wf-titres { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.ag-wf-titre {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.18rem; color: var(--brand-primary-darker, #092f66);
}
.ag-wf-head .ag-meta { font-size: 0.8rem; }
.ag-wf-corps { margin-top: 0.4rem; }

/*  Un `event` — ce que l'agent fait DANS l'étape, seul. Le liseré vert
    reprend celui de la pastille « agent, on its own », pour qu'on
    reconnaisse l'autonomie à la couleur avant de lire le mot. Une
    `branch`, elle, garde le bleu : c'est une bifurcation, pas une
    action.  */
.ag-wf-event {
    margin: 0.5rem 0 0 2.4rem; padding-left: 0.8rem;
    border-left: 2px solid #86efac;
}
.ag-wf-tpl-todo { color: #a55d10; }
.ag-wf-todo {
    margin-left: 0.35rem; padding: 0.05rem 0.35rem; border-radius: 3px;
    background: #fdf0e2; color: #a55d10; font-size: 0.68rem;
    letter-spacing: 0.02em; text-transform: uppercase;
}

/* =========================================================
   L'Inbox en boîte aux lettres
   ---------------------------------------------------------
   Une liste à gauche, la lecture à droite. Sous 900 px la
   liste passe au-dessus : sur un téléphone, deux colonnes de
   180 px ne se lisent pas.
   ========================================================= */
.ag-mail {
    display: grid; grid-template-columns: minmax(240px, 320px) 1fr;
    gap: 1rem; align-items: start;
}
.ag-mail-liste {
    border: 1px solid var(--bg-border, #e2e8f0); border-radius: 10px;
    background: #fff; overflow: hidden;
    max-height: 78vh; overflow-y: auto;
}
.ag-mail-liste-tete {
    display: flex; justify-content: space-between; align-items: baseline;
    gap: 0.5rem; padding: 0.6rem 0.8rem;
    background: var(--bg-subtle, #eef3fa);
    border-bottom: 1px solid var(--bg-border, #e2e8f0);
    font-size: 0.82rem; font-weight: 600;
    position: sticky; top: 0; z-index: 1;
}
.ag-mail-ligne {
    display: flex; gap: 0.6rem; width: 100%;
    padding: 0.7rem 0.8rem; border: 0; border-bottom: 1px solid #f1f5f9;
    background: none; text-align: left; cursor: pointer; font: inherit;
    border-left: 3px solid transparent;
}
.ag-mail-ligne:hover { background: var(--bg-subtle, #eef3fa); }
.ag-mail-ligne.is-on {
    background: var(--brand-accent, #dbe6f5);
    border-left-color: var(--brand-primary-dark, #0d4494);
}
.ag-mail-ligne.a-traiter .ag-mail-exp { font-weight: 700; }
.ag-mail-av {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2rem; height: 2rem; flex: 0 0 auto; border-radius: 50%;
    font-size: 0.72rem; font-weight: 700; letter-spacing: 0.02em; color: #fff;
}
.ag-mail-av.grand { width: 2.6rem; height: 2.6rem; font-size: 0.86rem; }
.av-info { background: var(--brand-primary-dark, #0d4494); }
.av-admin { background: #5b3a8e; }
.ag-mail-col { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; flex: 1; }
.ag-mail-l1 { display: flex; justify-content: space-between; gap: 0.5rem; align-items: baseline; }
.ag-mail-exp {
    font-size: 0.87rem; color: var(--brand-primary-darker, #092f66);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ag-mail-date { font-size: 0.72rem; color: var(--text-muted, #64748b); flex: 0 0 auto; }
.ag-mail-obj {
    font-size: 0.83rem; color: #1e293b;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ag-mail-ap {
    font-size: 0.76rem; color: var(--text-muted, #64748b); line-height: 1.35;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
}
.ag-mail-l4 { display: flex; flex-wrap: wrap; gap: 0.3rem; align-items: center; margin-top: 0.15rem; }
.ag-mail-ref {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.72rem; color: var(--text-muted, #64748b);
}
.ag-mail-lecture {
    border: 1px solid var(--bg-border, #e2e8f0); border-radius: 10px;
    background: #fff; padding: 1.1rem 1.3rem;
}
.ag-mail-tete { border-bottom: 1px solid #f1f5f9; padding-bottom: 0.8rem; margin-bottom: 0.9rem; }
.ag-mail-tete h3 { margin: 0 0 0.6rem; font-size: 1.14rem; }
.ag-mail-ident { display: flex; gap: 0.7rem; align-items: flex-start; }
.ag-mail-qui { font-size: 0.9rem; }
/*  Le message reçu, tel qu'il est arrivé : les retours à la ligne de
    l'expéditeur sont les siens, on ne les reflue pas.  */
.ag-mail-corps {
    white-space: pre-wrap; font-size: 0.88rem; line-height: 1.55;
    color: #1e293b; background: var(--bg-subtle, #eef3fa);
    border-radius: 8px; padding: 0.9rem 1rem;
}
.ag-mail-sep {
    display: flex; align-items: center; gap: 0.7rem;
    margin: 1.3rem 0 0.8rem; color: var(--text-muted, #64748b);
    font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em;
}
.ag-mail-sep::after { content: ""; flex: 1; height: 1px; background: var(--bg-border, #e2e8f0); }

/* ---------- un brouillon, à la façon d'un composeur ---------- */
.ag-dr {
    border: 1px solid var(--bg-border, #e2e8f0); border-left: 3px solid #cbd5e1;
    border-radius: 8px; padding: 0.85rem 1rem; margin-bottom: 0.9rem;
}
.ag-dr.is-auto { border-left-color: #2f9e5f; }
.ag-dr.is-pending { border-left-color: var(--brand-orange, #e67e22); }
.ag-dr.is-done { border-left-color: #cbd5e1; opacity: .72; }
.ag-dr-prop { border-left-color: var(--brand-primary, #1a55a8); background: #fbfdff; }
.ag-dr-tete { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem; }
.ag-dr-tete h4 {
    margin: 0; font-family: var(--font-display, Georgia, serif);
    font-size: 1rem; color: var(--brand-primary-darker, #092f66);
}
.ag-dr-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.74rem; color: var(--text-muted, #64748b);
}
.ag-dr-entete {
    margin: 0.7rem 0 0.5rem; padding: 0.5rem 0.7rem;
    background: #fbfcfe; border: 1px solid #eef2f6; border-radius: 6px;
    font-size: 0.8rem;
}
.ag-dr-l { display: flex; gap: 0.5rem; padding: 0.12rem 0; }
.ag-dr-cle {
    flex: 0 0 3.6rem; color: var(--text-muted, #64748b);
    text-transform: uppercase; font-size: 0.68rem; letter-spacing: 0.05em;
    padding-top: 0.12rem;
}
.ag-dr-val { color: #1e293b; word-break: break-word; }
/*  La copie ne se saisit pas ici : elle vient des accès cochés au
    dossier. Le fond léger dit « calculé », pas « à remplir ».  */
.ag-dr-cc {
    background: var(--brand-accent, #dbe6f5); border-radius: 4px;
    padding: 0.02rem 0.3rem;
}
.ag-dr-vide { color: var(--text-muted, #64748b); font-style: italic; }
.ag-dr-corps {
    white-space: pre-wrap; font-size: 0.86rem; line-height: 1.55;
    color: #1e293b; padding: 0.2rem 0.1rem;
}
.ag-dr-edit {
    width: 100%; font: inherit; font-size: 0.86rem; line-height: 1.5;
    padding: 0.6rem 0.7rem; border: 1px solid var(--brand-primary, #1a55a8);
    border-radius: 6px; resize: vertical;
}
.ag-dr-manque {
    margin-top: 0.5rem; padding: 0.4rem 0.6rem; border-radius: 5px;
    background: #fdf0e2; color: #a55d10; font-size: 0.78rem;
}
.ag-dr-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }

/* =========================================================
   Onglet « Email templates »
   ========================================================= */
.ag-tpl-table { margin-bottom: 0.8rem; }
.ag-tpl-table td { vertical-align: middle; }
.ag-tpl-step {
    font-variant-numeric: tabular-nums; font-weight: 700;
    color: var(--brand-primary-dark, #0d4494); white-space: nowrap;
}
.ag-tpl-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.78rem; white-space: nowrap;
}
.ag-tpl-manque td { background: #fffdf7; }
.ag-tpl-ctx { display: block; margin-top: 0.15rem; }
.ag-tpl-langs { white-space: nowrap; }
.ag-tpl-lang {
    display: inline-block; margin-right: 0.2rem; padding: 0.05rem 0.3rem;
    border-radius: 3px; background: #eef2f6; color: #475569; font-size: 0.7rem;
}
.ag-tpl-word {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2rem; height: 2rem; border-radius: 6px; cursor: pointer;
    border: 1px solid var(--bg-border, #e2e8f0); background: #fff;
    color: var(--brand-primary-dark, #0d4494);
}
.ag-tpl-word:hover { background: var(--brand-accent, #dbe6f5); }
.ag-tpl-pied { margin: 0.4rem 0 1rem; }
.ag-tpl-avert {
    border: 1px solid #f0d9b5; background: #fffaf2; border-radius: 8px;
    padding: 0.8rem 1rem; margin-bottom: 1.2rem; font-size: 0.85rem;
}
.ag-tpl-avert .ag-btn { margin: 0.6rem 0.4rem 0 0; }
.ag-tpl-form {
    border: 1px solid var(--bg-border, #e2e8f0); border-radius: 10px;
    background: #fff; padding: 1rem 1.2rem;
}
.ag-tpl-form h4 {
    margin: 0 0 0.8rem; font-family: var(--font-display, Georgia, serif);
    font-size: 1.02rem; color: var(--brand-primary-darker, #092f66);
}
.ag-tpl-row { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-bottom: 0.7rem; }
.ag-tpl-f { display: flex; flex-direction: column; gap: 0.2rem; }
.ag-tpl-f.court { flex: 0 0 8rem; }
.ag-tpl-f.large { flex: 1 1 18rem; }
.ag-tpl-f label {
    font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--text-muted, #64748b);
}
.ag-tpl-f input, .ag-tpl-f select, .ag-tpl-f textarea {
    font: inherit; font-size: 0.85rem; padding: 0.45rem 0.6rem;
    border: 1px solid var(--bg-border, #e2e8f0); border-radius: 6px;
    background: #fff; width: 100%; resize: vertical;
}
.ag-tpl-actions { display: flex; align-items: center; gap: 0.8rem; margin-top: 0.5rem; }
.ag-tpl-err { color: #b91c1c; font-size: 0.82rem; }

@media (max-width: 900px) {
    .ag-mail { grid-template-columns: 1fr; }
    .ag-mail-liste { max-height: 22rem; }
    .ag-mail-lecture { padding: 0.9rem; }
    .ag-tpl-table { display: block; overflow-x: auto; }
}
@media (max-width: 620px) {
    .ag-wf-event, .ag-wf-branch { margin-left: 0.6rem; }
    .ag-wf-step .ag-meta { margin-left: 0; }
    .ag-dr-l { flex-direction: column; gap: 0.05rem; }
    .ag-dr-cle { flex: none; }
}
.ag-tpl-table .ag-chip { white-space: nowrap; }

/* =========================================================
   Les onglets en vrais intercalaires
   ---------------------------------------------------------
   Angles supérieurs arrondis, et l'onglet actif se FOND dans
   le panneau : son bord bas blanc recouvre le trait de la
   barre, si bien qu'onglet et contenu ne font qu'une feuille.

   D'où le déplacement du repère de couleur, du bas vers le
   HAUT. Souligner un onglet qui se confond avec sa page
   reviendrait à tracer un trait au milieu de rien ; la barre
   orange se pose donc sur l'arête supérieure, là où l'oeil
   cherche le haut de l'intercalaire.
   ========================================================= */
.ag-tabs {
    gap: 0.22rem;
    padding: 0.45rem 0.55rem 0;
    align-items: flex-end;
}
.ag-tabs button {
    /*  1,15rem de flanc tenaient tant qu'il y avait huit onglets. Le
        neuvième — « Co. Files templates » — a fait déborder la barre de
        deux pixels, et une rangée d'intercalaires passée à la ligne ne
        se rattache plus à rien. On resserre le flanc plutôt que de
        rapetisser le texte : neuf tiennent à 1440 px avec de la marge.  */
    padding: 0.68rem 0.85rem;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
    margin-bottom: -1px;
    line-height: 1.2;
}
.ag-tabs button:hover:not(.is-on) { background: rgba(255, 255, 255, 0.6); }
.ag-tabs button.is-on {
    background: #fff;
    border-color: var(--bg-border, #e2e8f0);
    border-bottom: 1px solid #fff;
    box-shadow: inset 0 3px 0 var(--brand-orange, #e67e22);
}
.ag-tabs button:focus-visible {
    outline: 2px solid var(--brand-primary, #1a55a8);
    outline-offset: -3px;
}

/*  Huit onglets tiennent à 1440 px, pas en dessous. Plutôt que de les
    laisser passer à la ligne — une deuxième rangée d'intercalaires ne
    se rattache à rien et le bord bas blanc y devient un trait perdu —
    la barre défile latéralement, d'un seul tenant.  */
@media (max-width: 1180px) {
    .ag-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
    .ag-tabs button { flex: 0 0 auto; white-space: nowrap; }
}

/*  Le compteur ne doit pas commander la hauteur de l'onglet. Sa
    line-height de 1,45 rendait « Inbox » et « Scheduled » un pixel plus
    hauts que les six autres ; avec des angles arrondis et des bords
    alignés en bas, ce pixel se voit comme une marche. On aligne donc le
    contenu au centre et l'on ramène le compteur sous la ligne de texte.  */
.ag-tabs button { display: inline-flex; align-items: center; }
.ag-tabs .ag-count { line-height: 1.2; margin-left: 0.4rem; }

/* ---------- Documents : télécharger, redéposer ---------- */
/*  Le champ de fichier natif est laid et large ; on le garde dans le
    DOM — c'est lui qui ouvre le sélecteur — mais hors de vue, et c'est
    le bouton qui le déclenche.  */
.ag-doc-fichier { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ag-doc-dit {
    margin: 0.35rem 0 0.6rem; padding: 0.5rem 0.7rem; border-radius: 6px;
    background: var(--bg-subtle, #eef3fa); border-left: 3px solid var(--brand-primary, #1a55a8);
}
.ag-doc-trace { margin: 0.15rem 0 0.6rem; }
.ag-doc-perdu { color: #a55d10; }

/* =========================================================
   Onglet « Co. Files templates »
   ---------------------------------------------------------
   Trois juridictions dépliables, sur le modèle de la frise :
   on ouvre celle qu'on traite, l'état est retenu.
   ========================================================= */
.ag-gb-jur {
    background: #fff; border: 1px solid var(--bg-border, #e2e8f0);
    border-radius: 10px; padding: 0.9rem 1.2rem; margin-bottom: 0.9rem;
}
.ag-gb-tete {
    display: flex; align-items: baseline; gap: 0.65rem; width: 100%;
    padding: 0; border: 0; background: none; text-align: left;
    cursor: pointer; font: inherit; color: inherit;
}
.ag-gb-tete:focus-visible { outline: 2px solid var(--brand-primary, #1a55a8); outline-offset: 4px; }
.ag-gb-chev {
    display: inline-flex; align-items: center; justify-content: center;
    width: 1.3rem; height: 1.3rem; flex: 0 0 auto;
    color: var(--brand-primary-dark, #0d4494); transition: transform 0.18s ease;
}
.ag-gb-jur.is-open .ag-gb-chev { transform: rotate(90deg); }
.ag-gb-titres { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.ag-gb-nom {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.1rem; color: var(--brand-primary-darker, #092f66);
}
.ag-gb-corps { margin-top: 0.9rem; }
.ag-gb-groupe { margin-bottom: 1.4rem; }
.ag-gb-groupe:last-child { margin-bottom: 0; }
.ag-gb-groupe h4 {
    margin: 0 0 0.15rem; font-size: 0.78rem; letter-spacing: 0.07em;
    text-transform: uppercase; color: var(--brand-primary-dark, #0d4494);
}
.ag-gb-groupe > .ag-meta { margin-bottom: 0.7rem; }
.ag-gb-row {
    display: flex; flex-wrap: wrap; gap: 0.8rem; align-items: flex-start;
    justify-content: space-between;
    padding: 0.6rem 0; border-top: 1px solid #f1f5f9;
}
.ag-gb-quoi { flex: 1 1 22rem; min-width: 0; }
.ag-gb-titre { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.45rem; }
.ag-gb-fmt {
    padding: 0.05rem 0.35rem; border-radius: 3px; background: #eef2f6;
    color: #475569; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.04em;
}
/*  Le chemin du maître sur le disque du cabinet. Il tient lieu de
    téléchargement tant que la banque de documents n'est pas connectée :
    savoir où est le fichier vaut mieux qu'un bouton qui ne rend rien.  */
.ag-gb-chemin {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.72rem; color: #94a3b8; word-break: break-all;
}
.ag-gb-trace { color: var(--brand-primary-dark, #0d4494); }
.ag-gb-perdu { color: #a55d10; }
.ag-gb-fichier { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ag-gb-dit {
    margin: 0.35rem 0 0.2rem; padding: 0.5rem 0.7rem; border-radius: 6px;
    background: var(--bg-subtle, #eef3fa); border-left: 3px solid var(--brand-primary, #1a55a8);
    flex: 1 1 100%;
}
.ag-gb-attendus { background: #fffdf7; border-radius: 8px; padding: 0.8rem 1rem; }
.ag-gb-attendus .ag-gb-row:first-of-type { border-top: 0; }
.ag-gb-pied { margin-top: 0.6rem; }
.ag-tpl-hors { color: #a55d10; }


/* le formulaire « nouveau dossier » — 20 septembre 2026 */
.ag-dn { margin-bottom: 1.4rem; }
.ag-dn-form { border: 1px solid #d7dde6; border-radius: 6px; padding: 1rem 1.1rem; margin-top: .6rem; }
.ag-dn-form h4 { margin: 1.1rem 0 .3rem; font-size: .95rem; }
.ag-dn-form h4:first-child { margin-top: 0; }
.ag-dn-l { display: block; margin: .55rem 0 .15rem; font-size: .82rem; letter-spacing: .02em; text-transform: uppercase; color: #5b6b80; }
.ag-dn-i { width: 100%; box-sizing: border-box; padding: .42rem .5rem; border: 1px solid #c8d2df; border-radius: 4px; font: inherit; }
textarea.ag-dn-i { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .86rem; }
.ag-dn-case { display: block; margin: .18rem 0; font-size: .9rem; }
.ag-dn-fait { border: 1px solid #bcd3bc; background: #f4faf4; border-radius: 6px; padding: .8rem 1rem; margin-bottom: .8rem; }
.ag-dn-fait h4 { margin: 0 0 .3rem; }


/* un bloc sans objet pour ce dossier — 20 septembre 2026 */
.ui-card.mt-grise { opacity: .55; background: #f6f7f9; }
.ui-card.mt-grise h3 { color: #6b7684; }
.mt-grise-dit { margin: .2rem 0 .6rem; font-size: .84rem; font-style: italic; color: #6b7684; }
.mt-desarme { color: #8a93a0 !important; text-decoration: none !important; cursor: default; }


/* la porte vers l'espace du client, depuis la fiche — 19 septembre 2026 */
.mt-ec-porte { margin: .1rem 0 .9rem; display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; }
.mt-ec-porte .ag-btn { text-decoration: none; }
.mt-ec-dit { font-size: .84rem; color: #6b7684; }


/* les champs des actes, dans la fiche — 19 septembre 2026 */
.ch-etat { margin: .2rem 0 1.1rem; }
.ch-etat h4 { margin: 0 0 .5rem; font-size: .95rem; }
.ch-actes { display: grid; gap: .25rem; }
.ch-acte { display: grid; grid-template-columns: 2.2rem minmax(10rem, 22rem) auto; gap: .6rem;
           align-items: baseline; padding: .28rem .5rem; border-radius: 4px; background: #f6f7f9;
           font-size: .86rem; }
.ch-acte.ch-pret { background: #eef7ee; }
.ch-num { font-variant-numeric: tabular-nums; color: #6b7684; }
.ch-titre { color: #2c3440; }
.ch-dit { color: #6b7684; }
.ch-acte.ch-pret .ch-dit { color: #2f7d32; }
.ch-manque { grid-column: 2 / -1; font-size: .78rem; color: #8a93a0; word-break: break-word; }

.ch-partie { margin: 1.3rem 0 0; }
.ch-partie-titre { margin: 0 0 .5rem; font-size: 1rem; border-bottom: 1px solid #e3e6ea; padding-bottom: .3rem; }
.ch-famille { margin: .8rem 0 0; }
.ch-famille h5 { margin: 0 0 .3rem; font-size: .84rem; font-weight: 600; color: #6b7684; }
.ch-grille { display: grid; gap: .2rem; }
.ch-ligne { display: grid; grid-template-columns: minmax(8rem, 14rem) 1fr 1fr; gap: .5rem; align-items: center; }
.ch-entete { font-size: .76rem; color: #8a93a0; }
.ch-lib { font-size: .84rem; color: #2c3440; }
.ch-val input { width: 100%; box-sizing: border-box; padding: .28rem .4rem; font-size: .85rem;
                border: 1px solid #d4d9df; border-radius: 4px; background: #fff; }
.ch-val input.ch-vide { background: #fffaf3; border-color: #e8c9a0; }
.ch-sans { color: #c8cdd4; text-align: center; }
.ch-pied { margin-top: 1.1rem; display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.ch-mot { font-size: .84rem; color: #6b7684; }

@media (max-width: 720px) {
  .ch-ligne { grid-template-columns: 1fr; }
  .ch-entete { display: none; }
  .ch-acte { grid-template-columns: 2rem 1fr; }
}


/* écrire au client, depuis la fiche — 19 septembre 2026 */
.cr-acces { margin: .2rem 0 1.2rem; }
.cr-acces h4, .cr-ecrire h4, .cr-journal h4 { margin: 0 0 .5rem; font-size: .95rem; }
.cr-gens { display: grid; grid-template-columns: 8rem minmax(7rem, 14rem) minmax(10rem, 18rem) auto;
           gap: .6rem; align-items: baseline; padding: .28rem .5rem; border-radius: 4px;
           background: #f6f7f9; font-size: .86rem; margin-bottom: .22rem; }
.cr-gens.cr-etat-actif { background: #eef7ee; }
.cr-gens.cr-etat-aucun { background: #fffaf3; }
.cr-role { color: #6b7684; }
.cr-mail { color: #4a5563; word-break: break-all; }
.cr-dit { color: #6b7684; }
.cr-note { margin-top: .6rem; }

.cr-ecrire { margin: 1.3rem 0 0; }
.cr-barre { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .5rem; }
.cr-barre select, .cr-adresse { padding: .3rem .4rem; font-size: .85rem;
  border: 1px solid #d4d9df; border-radius: 4px; background: #fff; }
.cr-sujet, .cr-corps { width: 100%; box-sizing: border-box; padding: .35rem .5rem;
  font-size: .87rem; border: 1px solid #d4d9df; border-radius: 4px; margin-bottom: .45rem; }
.cr-corps { font-family: inherit; line-height: 1.5; }
.cr-manque { color: #7a4b10; }
.cr-pied { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.cr-mot { font-size: .84rem; color: #6b7684; }

.cr-journal { margin: 1.4rem 0 0; }
.cr-ligne { display: grid; grid-template-columns: 9rem minmax(9rem, 16rem) 1fr auto; gap: .6rem;
            align-items: baseline; padding: .24rem .5rem; font-size: .84rem; border-radius: 4px; }
.cr-ligne.cr-echec { background: #fdf0ef; color: #8a2f28; }
.cr-quand { color: #6b7684; font-variant-numeric: tabular-nums; }

@media (max-width: 760px) {
  .cr-gens, .cr-ligne { grid-template-columns: 1fr; gap: .1rem; }
}


/* la Fiche de Dossier : titre et numeros de section — 20 septembre 2026 */
.ch-fiche-titre { margin: 1.6rem 0 .2rem; font-size: 1.05rem;
                  border-bottom: 2px solid #263E60; padding-bottom: .35rem; }
.ch-no { display: inline-block; min-width: 2.1rem; color: #6b7684;
         font-variant-numeric: tabular-nums; }
.ch-partie-titre .ch-no { min-width: 1.4rem; }