/* « hidden » gagne toujours (21/10/2026 : un « display: flex » de composant affichait « Calcul en cours… » sur un calcul
   jamais lancé dans « Construire l'horaire »). */
[hidden] { display: none !important; }

/* Jetons de la charte (couleurs, rayons, ombres, espacements, textes, polices) : core/static/core/theme.css, chargé avant.
   Composants de base (boutons, champs, cartes, puces, alertes, onglets, barre du haut, avatars, tableaux) :
   core/static/core/components.css, chargé après ce fichier. « Affichage : Sobre / Sombre » redéfinit les jetons. */

* { box-sizing: border-box; } body { margin: 0; color: var(--ink); background: var(--color-bg); font-family: var(--font-text); font-size: var(--text-md); line-height: var(--leading-normal); } a { color: inherit; }
.topbar { display: flex; align-items: center; justify-content: space-between; padding: 18px clamp(20px, 5vw, 72px); border-bottom: 1px solid var(--line); background: var(--surface); color: var(--ink); } .topbar-left { display: flex; align-items: center; gap: 16px; } .brand { display: inline-flex; align-items: center; gap: 10px; font-size: 1.5rem; font-weight: 700; letter-spacing: .08em; text-decoration: none; } .brand img { display: block; } .topbar nav { display: flex; align-items: center; gap: 24px; } .topbar nav a, .back-link { color: var(--color-ink); font: 700 .92rem var(--font-text); text-decoration: none; } .back-link { font-size: 1.6rem; line-height: 1; } .home-link { font-size: 1.5rem !important; line-height: 1; } .settings-link { font-size: 1.45rem !important; line-height: 1; }
.page { max-width: 1180px; margin: 0 auto; padding: 56px clamp(20px, 5vw, 72px) 90px; } .intro, .form-header { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 36px; } .form-header { display: block; max-width: 680px; } .eyebrow { margin: 0 0 10px; color: var(--accent-dark); font: 700 .75rem/1.2 var(--font-text); letter-spacing: .14em; text-transform: uppercase; }
.portal-intro { max-width: 680px; margin-bottom: 44px; } .portal-intro h1 { margin-bottom: 14px; } .module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; } .module-card { position: relative; display: flex; min-height: 250px; flex-direction: column; justify-content: flex-start; gap: 10px; overflow: hidden; padding: 28px; border: 0; background: var(--surface); color: var(--ink); text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; border-radius: var(--radius-lg); } .module-card::before { position: absolute; top: 0; right: 0; left: 0; height: 5px; background: var(--color-accent); content: ""; } .module-card:hover { transform: translateY(-4px); border-color: var(--accent-pink); box-shadow: 0 14px 30px rgb(var(--accent-rgb) / 0.12); } .module-icon { align-self: flex-start; flex: none; width: 56px; height: 56px; margin-bottom: 18px; padding: 7px; border-radius: 16px; background: var(--soft); fill: none; stroke: url(#oasis-icon-gradient); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; overflow: visible; } .module-name { font-size: 1.55rem; font-weight: 700; } .module-description { max-width: 18rem; color: var(--muted); font: .84rem/1.45 var(--font-text); } .module-placeholder { max-width: 650px; padding-top: 24px; }
h1, h2, p { margin-top: 0; } h1 { margin-bottom: 10px; font-size: clamp(1.75rem, 3.4vw, 2.8rem); line-height: 1.15; overflow-wrap: break-word; } h2 { margin: 0; font-size: 1.2rem; } .muted, small { color: var(--muted); } small { font-size: max(.8333em, var(--text-min, 0px)); } .muted { font-size: 1.05rem; line-height: 1.5; }
.button { display: inline-block; border: 0; padding: 13px 18px; font: 700 .86rem var(--font-text); text-decoration: none; cursor: pointer; } .primary { background: var(--color-accent); color: var(--color-on-accent); } .primary:hover { background: var(--color-accent); } .group-picker { display: flex; align-items: center; gap: 14px; margin-bottom: 32px; font: 700 .8rem var(--font-text); }
select, input, textarea { width: 100%; border: 1px solid var(--line); border-radius: 0; padding: 12px 13px; color: var(--ink); background: var(--surface); font: 1rem var(--font-text); } .group-picker select { width: auto; min-width: 220px; } .columns { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 48px; }
.section-heading { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid var(--ink); padding-bottom: 12px; margin-bottom: 10px; } .section-heading span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--soft); font: 700 .8rem var(--font-text); }
.resident-row, .observation-row { border-bottom: 1px solid var(--line); padding: 16px 0; } .resident-row { display: flex; align-items: center; gap: 14px; } .avatar { display: grid; place-items: center; flex: 0 0 42px; height: 42px; border-radius: 50%; background: var(--soft); color: var(--accent-dark); font: 700 .75rem var(--font-text); } .resident-row strong, .resident-row small { display: block; } .resident-row small, .observation-row small { margin-top: 5px; font: .76rem var(--font-text); }
.observation-row { padding-left: 14px; border-left: 3px solid var(--soft); } .observation-row.importance-2 { border-left-color: var(--color-warning-line); } .observation-row.importance-3 { border-left-color: var(--accent); } .observation-meta { display: flex; justify-content: space-between; gap: 16px; font: .78rem var(--font-text); } .observation-meta time { color: var(--muted); } .observation-row p { margin: 9px 0 0; line-height: 1.45; }
.empty { padding: 20px 0; color: var(--muted); font-style: italic; } .notice { margin-bottom: 24px; padding: 14px 16px; background: var(--soft); font: .9rem var(--font-text); } .form-panel { max-width: 720px; padding: clamp(22px, 4vw, 42px); background: var(--surface); border-top: 0; border-radius: var(--radius-lg); } .field { margin-bottom: 20px; } .field label { display: block; margin-bottom: 7px; font: 700 .8rem var(--font-text); } .field textarea { resize: vertical; } .has-error input, .has-error textarea, .has-error select { border-color: var(--accent); } .error { display: block; margin-top: 5px; color: var(--accent-dark); } .form-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 28px; font: .88rem var(--font-text); } .health { display: grid; place-items: center; min-height: 50vh; text-align: center; } .health-dot { width: 14px; height: 14px; margin-bottom: 18px; border-radius: 50%; background: var(--color-success); }
@media (max-width: 900px) { .module-grid { grid-template-columns: 1fr; } .module-card { min-height: 170px; } .module-icon { width: 48px; height: 48px; padding: 6px; border-radius: 14px; } } @media (max-width: 760px) { .intro { display: block; } .intro .button { margin-top: 18px; } .columns { grid-template-columns: 1fr; gap: 42px; } .page { padding-top: 38px; } .form-actions { align-items: stretch; flex-direction: column-reverse; } .form-actions .button { text-align: center; } }
.secondary { border: 1px solid var(--line); background: var(--surface); color: var(--ink); } .secondary:hover { border-color: var(--accent-pink); color: var(--accent-dark); }
.resident-search { max-width: 760px; margin-bottom: 42px; } .resident-search label { display: block; margin-bottom: 8px; font: 700 .8rem var(--font-text); } .resident-search div { display: flex; gap: 10px; } .resident-search input { min-width: 0; } .directory { max-width: 860px; } .directory-row { display: flex; align-items: center; gap: 14px; border-bottom: 1px solid var(--line); padding: 16px 8px; text-decoration: none; } .directory-row:hover { background: var(--soft); } .directory-identity { flex: 1; } .directory-identity strong, .directory-identity small { display: block; } .directory-identity small { margin-top: 4px; font: .78rem var(--font-text); } .directory-arrow { color: var(--accent); font-size: 1.8rem; } .detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .detail-panel { border: 0; padding: 24px; box-shadow: var(--shadow-sm); background: var(--color-surface); border-radius: var(--radius-lg); } .detail-panel h2 { margin-bottom: 20px; } dl { margin: 0; } dt { margin-top: 14px; color: var(--muted); font: max(.72rem, var(--text-min, 0px)) var(--font-text); text-transform: uppercase; letter-spacing: .06em; } dt:first-child { margin-top: 0; } dd { margin: 4px 0 0; }
@media (max-width: 900px) { .detail-grid { grid-template-columns: 1fr; } } @media (max-width: 760px) { .resident-search div { align-items: stretch; flex-direction: column; } }
.intro-actions { display: flex; align-items: center; gap: 10px; } .resident-form { max-width: 900px; } .form-section { margin-bottom: 28px; border-top: 2px solid var(--ink); padding-top: 14px; } .form-section h2 { margin-bottom: 20px; } .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; } .field-wide { grid-column: 1 / -1; } .checkbox-field { display: flex; align-items: center; gap: 8px; padding-top: 28px; } .checkbox-field label { margin: 0; } .checkbox-field input { width: auto; }
.date-alert.warning { color: var(--color-warning); font-weight: 700; } .date-alert.expired { color: var(--color-danger); font-weight: 700; }
.regime-summary { display: flex; gap: 10px; margin: 0 0 24px; font: 700 .78rem var(--font-text); } .regime-summary span { border: 1px solid var(--line); padding: 8px 12px; background: var(--soft); }
.status-pill, .warning-pill { margin-left: 10px; padding: 5px 9px; font: 700 max(.7rem, var(--text-min, 0px)) var(--font-text); white-space: nowrap; } .status-pill { color: var(--color-success); background: var(--color-success-soft); } .warning-pill { color: var(--color-warning); background: var(--color-warning-soft); } .inactive-row { opacity: .65; }
.context-back { display: inline-block; margin-bottom: 26px; color: var(--accent-pink); font: 700 .9rem var(--font-text); text-decoration: none; } .context-back:hover { color: var(--accent-dark); }
.credential-card { max-width: 620px; margin-bottom: 24px; border: 0; border-top: 0; padding: 26px; box-shadow: var(--shadow-sm); background: var(--color-surface); border-radius: var(--radius-lg); } .credential-card p { display: flex; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); padding: 12px 0; } .credential-card code { font-family: monospace; font-size: 1rem; } .credential-card .warning { color: var(--accent-dark); font-size: .9rem; }
@media (max-width: 760px) { .intro-actions { align-items: stretch; flex-direction: column; margin-top: 18px; } .form-grid { grid-template-columns: 1fr; } .field-wide { grid-column: auto; } }
h1, h2, .section-heading h2, .form-section h2, .module-name { color: var(--color-ink); font-family: var(--font-title); font-weight: 700; } h2 { font-weight: 600; } .eyebrow { color: var(--color-accent); }
/* Le logo (20/10/2026) : le mot « OAISIS » à l'encre, « AI » en orange d'action, le palmier en orange (plus de dégradé). */
h1, h2, .module-name { padding-bottom: .05em; }
.brand-name { color: var(--color-ink); font-family: var(--font-logo); font-weight: 700; } .brand-name b { font-weight: 800; color: var(--logo-ai); } .brand-mark { display: block; flex: none; fill: var(--logo-mark); } .brand-mark-trunk { fill: none; stroke: var(--logo-mark); stroke-width: 3.6; stroke-linecap: round; } .section-heading, .form-section { border-image: none; }

.directory-arrow { color: var(--color-accent); }
.message-badge { display: inline-grid; min-width: 1.35rem; height: 1.35rem; place-items: center; border-radius: 50%; background: var(--color-danger); color: var(--color-on-accent); font: 700 max(.7rem, var(--text-min, 0px)) var(--font-text); }
.recipient-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 10px; max-height: 240px; overflow: auto; border: 1px solid var(--line); padding: 12px; } .recipient-option { display: flex; align-items: center; gap: 8px; font: .82rem var(--font-text); } .recipient-option input { width: auto; } .resident-message-hint { display: none; margin: 8px 0 0; color: var(--accent-dark); font: .8rem var(--font-text); } #resident:not([value=""]) + .resident-message-hint { display: block; }
.message-tabs { display: flex; gap: 22px; margin-bottom: 22px; border-bottom: 1px solid var(--line); font: 700 .82rem var(--font-text); }
.message-tabs a { padding: 0 0 12px; text-decoration: none; color: var(--muted); } .message-tabs a.active { color: var(--accent-dark); border-bottom: 2px solid var(--accent); }
.message-filters { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; } .message-filters input[type="search"] { max-width: 360px; } .message-filters label { display: flex; align-items: center; gap: 5px; white-space: nowrap; font: .78rem var(--font-text); } .message-filters label input { width: auto; }
.message-row { display: flex; align-items: center; gap: 16px; border-bottom: 1px solid var(--line); padding: 17px 8px; text-decoration: none; } .message-row:hover { background: var(--soft); } .message-row-main { display: grid; flex: 1; gap: 4px; min-width: 0; } .message-row-main strong, .message-subject { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .message-row.unread .message-subject { font-weight: 700; } .message-preview { overflow: hidden; color: var(--muted); font: .82rem var(--font-text); text-overflow: ellipsis; white-space: nowrap; } .message-row-meta { display: flex; align-items: flex-end; flex-direction: column; gap: 5px; min-width: 130px; color: var(--muted); font: .75rem var(--font-text); } .message-pill { padding: 4px 7px; font: 700 max(.68rem, var(--text-min, 0px)) var(--font-text); } .message-pill.important { background: var(--color-accent-soft); color: var(--accent-dark); } .message-pill.confirm { background: var(--color-danger-soft); color: var(--color-danger); }
.pagination { display: flex; justify-content: center; gap: 22px; margin-top: 28px; font: .8rem var(--font-text); } .pagination a { color: var(--accent-dark); }
.thread-list { max-width: 850px; } .thread-message { border: 0; border-top: 0; padding: 22px; margin-bottom: 16px; box-shadow: var(--shadow-sm); background: var(--color-surface); border-radius: var(--radius-lg); } .thread-message.latest { border-top-color: var(--accent); } .thread-message header { display: flex; justify-content: space-between; gap: 16px; } .thread-message header strong, .thread-message header small { display: block; } .thread-message header small { margin-top: 5px; color: var(--muted); font: .78rem var(--font-text); } .thread-message details { margin: 20px 0; font: .8rem var(--font-text); } .thread-message summary { cursor: pointer; color: var(--muted); } .thread-body { line-height: 1.55; } .thread-attachments { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; font: .8rem var(--font-text); } .thread-attachments a { color: var(--accent-dark); }
@media (max-width: 700px) { .message-filters { align-items: stretch; flex-direction: column; } .message-filters input[type="search"] { max-width: none; } .message-filters .button { width: 100%; } .message-row { align-items: flex-start; } .message-row-meta { min-width: 86px; } .message-tabs { gap: 12px; overflow-x: auto; } }
@media (max-width: 700px) { .message-row { gap: 10px; padding: 14px 0; } .message-row-meta { min-width: 72px; font-size: max(.68rem, var(--text-min, 0px)); } .message-compose, .thread-message, .thread-list + .form-panel { padding: 18px; } .recipient-options { grid-template-columns: 1fr; max-height: 300px; } .thread-message header { align-items: flex-start; flex-direction: column; } .thread-message .button { width: 100%; } }
/* « Réagir » sous un message (10/11/2026) : puces groupées, six choix, « Qui a réagi ? » ; cibles de 44 px. */
.thread-message { scroll-margin-top: var(--space-4); } .thread-message .message-reactions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-top: var(--space-4); }
.reaction-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.reaction-chip, .reaction-choice { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-width: 44px; min-height: 44px; padding: 0 var(--space-3); border: 1px solid var(--color-field-border); border-radius: var(--radius-pill); background: var(--color-surface-sunken); color: var(--color-ink); font: var(--text-sm) var(--font-text); cursor: pointer; }
.reaction-choice { padding: 0; font-size: var(--text-lg); }
.reaction-chip.is-mine, .reaction-choice.is-mine { border: 2px solid var(--color-accent); background: var(--color-accent-soft); color: var(--color-accent-ink); font-weight: 700; }
.reaction-chip:hover, .reaction-choice:hover { border-color: var(--color-accent); }
.reaction-chip:focus-visible, .reaction-choice:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.thread-message .reaction-picker, .thread-message .reaction-who { margin: 0; font: var(--text-sm) var(--font-text); }
.thread-message .reaction-picker[open], .thread-message .reaction-who[open] { flex-basis: 100%; }
.thread-message .reaction-picker > summary, .thread-message .reaction-who > summary { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-3); border-radius: var(--radius-pill); color: var(--color-accent-ink); list-style: none; }
.thread-message .reaction-picker > summary::-webkit-details-marker, .thread-message .reaction-who > summary::-webkit-details-marker { display: none; }
.thread-message .reaction-picker > summary:focus-visible, .thread-message .reaction-who > summary:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.reaction-choices { display: flex; flex-wrap: wrap; gap: var(--space-2); padding-top: var(--space-2); }
.reaction-who ul { margin: var(--space-2) 0 0; padding: 0; list-style: none; color: var(--color-ink); }
.reaction-who li { padding: var(--space-1) 0; }

/* Protection juridique, prises en charge, échéances */
.deadline-pill { display: inline-block; margin-left: 6px; padding: 3px 8px; font: 700 max(.68rem, var(--text-min, 0px)) var(--font-text); white-space: nowrap; vertical-align: middle; }
.deadline-pill.warning { color: var(--color-accent-hover); background: var(--color-warning-soft); }
.deadline-pill.urgent { color: var(--color-on-accent); background: var(--color-danger); }
.deadline-pill.expired { color: var(--color-on-accent); background: var(--color-danger-strong); }
.deadline-pill.ok { color: var(--color-success); background: var(--color-success-soft); }
.deadline-pill.muted-pill { color: var(--muted); background: var(--color-surface-sunken); }
.deadline-summary { display: flex; flex-wrap: wrap; gap: 8px; margin: -18px 0 30px; }
.deadline-summary .deadline-pill { margin: 0; padding: 7px 11px; font-size: .76rem; }
.deadline-list { margin-bottom: 40px; }
.deadline-row { display: flex; align-items: center; gap: 14px; border-bottom: 1px solid var(--line); border-left: 4px solid transparent; padding: 14px 10px; text-decoration: none; }
.deadline-row:hover { background: var(--soft); }
.deadline-row.warning { border-left-color: var(--color-accent); }
.deadline-row.urgent { border-left-color: var(--color-danger); }
.deadline-row.expired { border-left-color: var(--color-danger-strong); }
.deadline-date { min-width: 104px; text-align: right; font: .82rem var(--font-text); }
.deadline-date strong, .deadline-date small { display: block; }
.deadline-settings { max-width: 860px; color: var(--muted); font: .82rem var(--font-text); }
.deadline-settings summary { cursor: pointer; }
.detail-panel-wide { grid-column: span 2; }
.detail-panel h3 { margin: 22px 0 8px; font: 700 .8rem var(--font-text); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.history-list { margin: 0; padding: 0; list-style: none; }
.history-list li { border-top: 1px solid var(--line); padding: 10px 0; }
.history-list li:first-child { border-top: 0; }
.representative-line { margin: 0; border-top: 1px solid var(--line); padding: 10px 0; }
.inline-link { margin-left: 6px; color: var(--accent-dark); font: 700 .76rem var(--font-text); }
.panel-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.button.small { padding: 8px 12px; font-size: .76rem; }
.form-hint { font-size: .86rem; }
.error-notice { color: var(--accent-dark); }
.errorlist { margin: 6px 0 0; padding: 0; list-style: none; color: var(--accent-dark); font: .8rem var(--font-text); }
.danger-zone { max-width: 900px; margin-top: 18px; text-align: right; }
.org-lookup { position: relative; }
.org-suggestions { position: absolute; z-index: 20; right: 0; left: 0; margin: 2px 0 0; padding: 0; max-height: 280px; overflow: auto; list-style: none; border: 1px solid var(--line); background: var(--surface); box-shadow: 0 12px 26px rgb(var(--shadow-rgb) / 0.1); }
.org-suggestions button { display: block; width: 100%; border: 0; padding: 10px 12px; background: none; color: var(--ink); text-align: left; font: .95rem var(--font-text); cursor: pointer; }
.org-suggestions button:hover, .org-suggestions button:focus { background: var(--soft); outline: none; }
.org-suggestions small { display: block; margin-top: 3px; font: max(.72rem, var(--text-min, 0px)) var(--font-text); }
.org-candidates { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; font: .8rem var(--font-text); }
@media (max-width: 900px) { .detail-panel-wide { grid-column: auto; } }
@media (max-width: 700px) { .deadline-row { flex-wrap: wrap; } .deadline-date { min-width: 0; text-align: left; } }
.detail-panel-full { grid-column: 1 / -1; }
.missing-pieces { margin-bottom: 18px; border-left: 4px solid var(--color-accent); padding: 4px 0 4px 14px; background: var(--color-warning-soft); border-radius: var(--radius-md); }
.missing-pieces h3 { margin-top: 8px !important; color: var(--color-accent-hover) !important; }
.missing-pieces ul { margin: 0 0 8px; padding: 0; list-style: none; font: .88rem var(--font-text); }
.missing-pieces li { padding: 3px 0; }
.missing-pieces .deadline-pill { margin: 0 6px 0 0; }
.document-upload { margin: 8px 0 18px; }
.dropzone { position: relative; display: block; border: 2px dashed var(--line); padding: 22px; text-align: center; cursor: pointer; background: var(--color-surface-sunken); transition: border-color .15s ease, background .15s ease; }
.dropzone.is-dragover, .dropzone:hover { border-color: var(--accent); background: var(--soft); }
.dropzone input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.dropzone-text { display: block; margin-bottom: 6px; }
.dropzone-button { color: var(--accent-dark); text-decoration: underline; }
.dropzone small { color: var(--muted); font: .76rem var(--font-text); }
.dropzone-list { margin: 10px 0 0; padding: 0; list-style: none; text-align: left; font: .82rem var(--font-text); }
.dropzone-list li { padding: 3px 0; }
.dropzone-list li.has-problem { color: var(--accent-dark); font-weight: 700; }
/* Progress of an upload (core/static/core/documents.js). */
.upload-progress { display: grid; gap: 6px; margin: 14px 0 4px; }
.upload-progress-bar { height: 10px; overflow: hidden; border-radius: 6px; background: var(--soft); }
.upload-progress-bar span { display: block; width: 0; height: 100%; border-radius: 6px; background: var(--color-accent); transition: width .25s ease; }
.upload-progress.is-waiting .upload-progress-bar span { animation: upload-waiting 1.4s ease-in-out infinite; }
@keyframes upload-waiting { 50% { opacity: .45; } }
.upload-progress-text { margin: 0; color: var(--muted); font: .86rem/1.4 var(--font-text); }
.upload-progress.is-error .upload-progress-text { color: var(--accent-dark); font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .upload-progress-bar span { transition: none; } .upload-progress.is-waiting .upload-progress-bar span { animation: none; } }
.upload-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-top: 12px; }
.upload-actions .field { flex: 1; min-width: 220px; margin-bottom: 0; }
.document-search { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 6px 0 10px; }
.document-search input[name="dq"] { flex: 1; min-width: 220px; }
.checkbox-inline { display: inline-flex; align-items: center; gap: 6px; font: .8rem var(--font-text); }
.checkbox-inline input { width: auto; }
.document-type-group { margin-bottom: 10px; }
.document-type-name { margin: 10px 0 2px; font: 700 .86rem var(--font-text); }
.document-row.archived .document-label { color: var(--muted); }
.document-actions { display: block; margin-top: 4px; }
.document-actions .inline-link:first-child { margin-left: 0; }
@media (max-width: 760px) { .upload-actions { align-items: stretch; flex-direction: column; } }
.inline-form { display: inline; }
.link-button { margin-left: 6px; border: 0; padding: 0; background: none; color: var(--accent-dark); font: 700 .76rem var(--font-text); text-decoration: underline; cursor: pointer; }
.ai-pill { text-decoration: none; }
.ai-ready { margin-bottom: 18px; border-left: 4px solid var(--color-success); padding: 4px 0 4px 14px; background: var(--color-success-soft); border-radius: var(--radius-md); }
.ai-ready h3 { margin-top: 8px !important; color: var(--color-success) !important; }
.ai-ready ul { margin: 0 0 8px; padding: 0; list-style: none; font: .88rem var(--font-text); }
.ai-ready li { padding: 4px 0; }
.ai-ready .button { margin: 0 8px 0 0; width: auto; }
.ai-proposal { display: block; margin-top: 4px; color: var(--color-success); }
.ai-choice { display: block; border-bottom: 1px solid var(--line); padding: 10px 0; font: .92rem var(--font-text); cursor: pointer; }
.ai-choice input { width: auto; }
.ai-documents { display: grid; gap: 12px; }
.ai-document, .ai-record { border: 0; padding: 12px 14px; box-shadow: var(--shadow-sm); background: var(--color-surface); border-radius: var(--radius-lg); }
.ai-document.is-duplicate { background: var(--color-surface-sunken); }
.ai-document-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 8px; font: .86rem var(--font-text); }
.ai-document-head .inline-link { margin-left: 0; }
.ai-document-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.ai-document-grid .field { margin-bottom: 10px; }
.ai-rubric { margin: 22px 0 8px; font: 700 .8rem var(--font-text); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.ai-table { border-top: 1px solid var(--line); }
.ai-row { display: grid; grid-template-columns: 1.2fr 1fr 1.4fr auto; gap: 12px; align-items: start; border-bottom: 1px solid var(--line); padding: 10px 0; font: .88rem var(--font-text); }
.ai-row small { display: block; margin-top: 3px; }
.ai-row-head { color: var(--muted); font-weight: 700; font-size: max(.74rem, var(--text-min, 0px)); text-transform: uppercase; letter-spacing: .05em; }
.ai-row.is-unsure, .ai-record.is-unsure { background: var(--color-warning-soft); }
.ai-decision { display: inline-flex; flex-wrap: wrap; gap: 10px; font: .82rem var(--font-text); }
.ai-decision label { display: inline-flex; align-items: center; gap: 4px; margin: 0; font-weight: 400; }
.ai-decision input { width: auto; }
.ai-record { margin-bottom: 10px; }
.ai-record .ai-decision { margin-left: auto; }
.ai-review .button.small { width: auto; margin-top: 0; }
@media (max-width: 760px) { .ai-row { grid-template-columns: 1fr; } .ai-row-head { display: none; } .ai-document-grid { grid-template-columns: 1fr; } }
/* Documents: folder header, upload page and triage screen (écran de tri). */
.sort-form [hidden], .documents-head [hidden] { display: none !important; }
.sort-form { max-width: none; }
.documents-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.documents-head h2 { margin: 0; }
.dropzone-large { padding: 48px 22px; }
.to-sort { border-left-color: var(--accent); background: var(--soft); }
.to-sort h3 { color: var(--accent-dark) !important; }
.sort-intro { line-height: 1.5; }
.sort-source-head h2 { margin-bottom: 4px; overflow-wrap: anywhere; }
.sort-source-head p { margin: 0 0 12px; font: .84rem var(--font-text); }
.sort-manual { display: flex; flex-wrap: wrap; align-items: end; gap: 0 14px; margin-bottom: 12px; }
.sort-manual .field { flex: 1; min-width: 180px; margin-bottom: 10px; }
.sort-manual .button { margin-bottom: 10px; }
.sort-help { margin: 0 0 8px; }
.sort-pages { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px 0; margin: 0 0 16px; padding: 12px; background: var(--color-surface-sunken); }
.sort-pages-single .sort-page img { display: block; max-width: min(320px, 100%); height: auto; border: 1px solid var(--line); background: var(--color-surface); }
.sort-page { position: relative; margin: 0; padding: 6px; border-top: 4px solid var(--color-line-strong); background: var(--color-surface); text-align: center; transition: opacity .15s ease; }
.sort-page figcaption { margin-top: 4px; font: max(.72rem, var(--text-min, 0px)) var(--font-text); color: var(--muted); white-space: nowrap; }
.sort-page .link-button { margin-left: 0; font-size: max(.72rem, var(--text-min, 0px)); }
.sort-thumb { display: block; width: 120px; min-height: 150px; border: 1px solid var(--line); padding: 0; background: var(--color-surface); cursor: zoom-in; }
.sort-thumb canvas { display: block; max-width: 100%; }
.sort-page.is-removed { opacity: .45; }
.sort-page.is-removed .sort-thumb { background: repeating-linear-gradient(135deg, var(--color-surface), var(--color-surface) 8px, var(--color-surface-sunken) 8px, var(--color-surface-sunken) 16px); }
.sort-page.is-broken .sort-thumb::after { content: "Aperçu indisponible"; display: block; padding: 40px 6px; font: max(.7rem, var(--text-min, 0px)) var(--font-text); color: var(--muted); }
.sort-cut { align-self: center; display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 34px; margin: 0 2px; border: 1px dashed transparent; padding: 10px 2px; background: none; color: var(--muted); font: 700 max(.66rem, var(--text-min, 0px)) var(--font-text); cursor: pointer; }
.sort-cut span[aria-hidden] { font-size: 1.1rem; line-height: 1; }
.sort-cut .sort-cut-text { writing-mode: vertical-rl; transform: rotate(180deg); letter-spacing: .04em; }
.sort-cut:hover, .sort-cut:focus-visible { border-color: var(--accent); color: var(--accent-dark); }
.sort-cut.is-cut { align-self: stretch; justify-content: center; margin: 0 8px; border: 0; border-left: 3px solid var(--accent-dark); color: var(--accent-dark); background: var(--color-accent-soft); }
.sort-pieces { display: grid; gap: 12px; }
.sort-piece { border: 0; border-left: 6px solid var(--color-line-strong); padding: 12px 14px; box-shadow: var(--shadow-sm); background: var(--color-surface); border-radius: var(--radius-lg); }
.sort-piece-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px; font: .86rem var(--font-text); }
.sort-piece-head .deadline-pill { margin-left: 0; }
.sort-keep { margin-left: auto; font-weight: 700; }
.sort-piece-swatch { display: none; }
.sort-piece.is-excluded { background: var(--color-surface-sunken); }
.sort-piece.is-excluded .ai-document-grid { opacity: .5; }
.sort-piece.is-excluded [data-piece-title] { text-decoration: line-through; }
.sort-piece[data-color="0"] { border-left-color: var(--palette-pink); } .sort-piece[data-color="1"] { border-left-color: var(--palette-orange); } .sort-piece[data-color="2"] { border-left-color: var(--palette-teal); }
.sort-piece[data-color="3"] { border-left-color: var(--palette-indigo); } .sort-piece[data-color="4"] { border-left-color: var(--palette-yellow); } .sort-piece[data-color="5"] { border-left-color: var(--palette-slate); }
.sort-page[data-color="0"] { border-top-color: var(--palette-pink); } .sort-page[data-color="1"] { border-top-color: var(--palette-orange); } .sort-page[data-color="2"] { border-top-color: var(--palette-teal); }
.sort-page[data-color="3"] { border-top-color: var(--palette-indigo); } .sort-page[data-color="4"] { border-top-color: var(--palette-yellow); } .sort-page[data-color="5"] { border-top-color: var(--palette-slate); }
.sort-actions { position: sticky; bottom: 0; z-index: 2; margin-top: 18px; border-top: 1px solid var(--line); padding: 12px 0; background: var(--paper); }
.unassigned-notice { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
@media (max-width: 760px) {
  .documents-head .button { width: 100%; text-align: center; }
  .sort-pages { padding: 8px; }
  .sort-thumb { width: 92px; min-height: 118px; }
  .sort-cut { min-width: 36px; } .sort-cut .sort-cut-text { display: none; } .sort-cut span[aria-hidden] { font-size: 1.3rem; }
  .sort-keep { margin-left: 0; }
  .sort-actions { flex-direction: row; align-items: center; } .sort-actions .button { flex: 1; }
}
@media (max-width: 480px) { .topbar { gap: 12px; padding: 14px 16px; } .topbar nav { flex-wrap: wrap; justify-content: flex-end; gap: 4px 14px; } .topbar nav a { font-size: .8rem; } .brand { font-size: 1.25rem; } }
/* Configuration et annuaire des organismes (écrans sans l'administration technique) */
.config-tabs { display: flex; gap: 22px; max-width: 900px; margin: -12px 0 32px; border-bottom: 1px solid var(--line); overflow-x: auto; font: 700 .82rem var(--font-text); }
.config-tabs a { flex: 0 0 auto; padding: 0 0 12px; color: var(--muted); text-decoration: none; }
.config-tabs a.active { border-bottom: 2px solid var(--accent); color: var(--accent-dark); }
.config-tabs a:hover { color: var(--accent-dark); }
.plain-link { text-decoration: none; } .plain-link:hover { color: var(--accent-dark); text-decoration: underline; }
.duplicate-warning { margin-bottom: 28px; border-left: 4px solid var(--color-accent); padding: 16px 18px; background: var(--color-warning-soft); font: .9rem/1.45 var(--font-text); border-radius: var(--radius-md); }
.duplicate-warning h2 { margin-bottom: 8px; font: 700 1rem var(--font-text); background: none; color: var(--accent-dark); }
.duplicate-warning ul { margin: 12px 0; padding: 0; list-style: none; }
.duplicate-warning li { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--color-accent-soft); padding: 10px 0; }
.duplicate-warning li strong, .duplicate-warning li small { display: block; } .duplicate-warning li small { margin-top: 3px; font-size: .76rem; }
.duplicate-warning .checkbox-field { margin: 4px 0 0; padding-top: 6px; }
.organization-extra { margin-top: 34px; }
.alias-list { margin: 0 0 18px; padding: 0; list-style: none; }
.alias-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding: 10px 0; }
.alias-list li.empty { display: block; border-bottom: 0; padding: 4px 0; }
.alias-add { margin-bottom: 0; } .alias-add .button { white-space: nowrap; }
.org-action-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); padding: 14px 0; }
.org-action-row p { margin: 0; max-width: 620px; font: .88rem/1.45 var(--font-text); }
.org-action-row .button { white-space: nowrap; }
.merge-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 28px; }
.merge-card { position: relative; display: block; border: 0; border-top: 0; padding: 22px; cursor: pointer; box-shadow: var(--shadow-sm); background: var(--color-surface); border-radius: var(--radius-lg); }
.merge-card:has(input:checked) { border-color: var(--accent); background: var(--soft); }
.merge-card input { position: absolute; top: 22px; right: 22px; width: auto; }
.merge-card-body { display: block; }
.merge-card-body > strong { display: block; margin: 6px 36px 4px 0; font-size: 1.15rem; }
.merge-card-body > small { display: block; font: .78rem var(--font-text); }
.merge-card-choice { color: var(--accent-dark); font: 700 max(.7rem, var(--text-min, 0px)) var(--font-text); letter-spacing: .08em; text-transform: uppercase; }
.merge-card dl { margin-top: 16px; }
.merge-summary ul { margin: 0; padding-left: 18px; font: .9rem/1.6 var(--font-text); }
.settings-table { display: grid; gap: 0; }
.settings-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: 0 18px; border-bottom: 1px solid var(--line); padding: 14px 0 0; }
.settings-label { align-self: center; padding-bottom: 20px; }
.settings-row > .errorlist { grid-column: 1 / -1; margin: -10px 0 12px; }
.document-type-domain { margin-top: 28px; }
.type-pills { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.ai-state { margin-bottom: 18px; border-left: 4px solid var(--line); padding: 8px 0 8px 14px; border-radius: var(--radius-md); }
.ai-state.is-on { border-left-color: var(--color-success); background: var(--color-success-soft); } .ai-state.is-off { border-left-color: var(--color-accent); background: var(--color-warning-soft); }
.ai-state strong, .ai-state small { display: block; } .ai-state small { margin-top: 4px; font: .82rem var(--font-text); }
.ai-paused-note { margin: 8px 0; border-left: 4px solid var(--color-danger); padding: 8px 12px; background: var(--color-danger-soft); font: .86rem/1.45 var(--font-text); border-radius: var(--radius-md); }
.ai-status-list { margin: 0 0 14px; padding: 0; list-style: none; font: .88rem var(--font-text); }
.ai-status-list li { display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); padding: 10px 0; }
.ai-status-list .deadline-pill { min-width: 46px; margin-left: 0; text-align: center; }
.ai-switch { padding-top: 0; font-size: 1rem; }
.ai-switch.is-locked label { color: var(--muted); }
.ai-budget { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
.ai-budget div { border-bottom: 1px solid var(--line); padding: 10px 0; }
.ai-budget dt { margin-top: 0; }
/* Configuration › Analyse IA : consommation par utilisateur (direction) */
.usage-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px; }
.usage-month { display: flex; align-items: center; gap: 10px; font: .88rem var(--font-text); }
.usage-month label { font-weight: 700; }
.usage-total { margin: 8px 0 16px; }
.usage-total small { display: block; color: var(--muted); }
.usage-scroll { max-width: 100%; overflow-x: auto; margin-bottom: 18px; }
.usage-table { width: 100%; border-collapse: collapse; color: var(--ink); font: .9rem var(--font-text); }
.usage-table caption { padding: 6px 0; text-align: left; font-weight: 700; }
.usage-table th, .usage-table td { padding: 7px 8px; border-bottom: 1px solid var(--line); text-align: left; }
.usage-table thead th { color: var(--muted); font-size: max(.72rem, var(--text-min, 0px)); text-transform: uppercase; letter-spacing: .04em; }
.usage-table tfoot th, .usage-table tfoot td { font-weight: 700; border-bottom: 0; }
.usage-table .num { text-align: right; white-space: nowrap; }
.usage-exports { display: flex; flex-wrap: wrap; gap: 10px; }
.button[disabled] { cursor: not-allowed; opacity: .45; }
@media (max-width: 760px) {
  .config-tabs { gap: 16px; margin-top: -18px; }
  .org-action-row, .duplicate-warning li { align-items: stretch; flex-direction: column; }
  .org-action-row .button, .duplicate-warning .button { width: 100%; text-align: center; }
  .merge-cards, .ai-budget { grid-template-columns: 1fr; }
  .settings-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-label { grid-column: 1 / -1; padding-bottom: 10px; }
  .type-pills { justify-content: flex-start; }
  .type-row { flex-wrap: wrap; }
}

/* Residents list: Candidats / Présents / Sortis */
.status-tabs { display: flex; gap: 22px; margin: 0 0 24px; border-bottom: 1px solid var(--line); overflow-x: auto; font: 700 .82rem var(--font-text); }
.status-tab { flex: 0 0 auto; padding: 0 0 12px; color: var(--muted); text-decoration: none; }
.status-tab span { margin-left: 4px; font-weight: 400; }
.status-tab.active { border-bottom: 2px solid var(--accent); color: var(--accent-dark); }
.status-tab:hover { color: var(--accent-dark); }
/* Candidate file: admission banner */
.candidate-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin: 0 0 28px; padding: 16px 18px; border: 1px solid var(--color-accent-soft); border-radius: 10px; background: var(--color-warning-soft); }
.candidate-banner p { flex: 1 1 320px; margin: 0; }
.candidate-banner form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.candidate-banner label { font: 700 .82rem var(--font-text); }
/* Drawers (tiroirs) of a folder: one per document type, « Autres » last (spec documents IA §13). */
.drawers { display: grid; gap: 10px; margin-top: 8px; }
.drawer { border: 0; border-left: 4px solid var(--color-line-strong); padding: 10px 14px 6px; background: var(--surface); box-shadow: var(--shadow-sm); border-radius: var(--radius-lg); }
.drawer.is-missing { border-left-color: var(--color-accent); background: var(--color-surface-sunken); }
.detail-panel .drawer-title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 6px; color: var(--ink); font: 700 .92rem var(--font-text); letter-spacing: 0; text-transform: none; }
.drawer-title .deadline-pill { margin-left: 0; }
.drawer-count { min-width: 22px; padding: 1px 7px; border-radius: 11px; background: var(--color-surface-sunken); color: var(--muted); font-size: max(.74rem, var(--text-min, 0px)); text-align: center; }
.drawer-empty { margin: 0 0 8px; font: .82rem var(--font-text); }
.drawer-list .document-label { font-weight: 700; overflow-wrap: anywhere; }
.drawer-archives, .folder-archives { margin: 4px 0 8px; font: .84rem var(--font-text); }
.drawer-archives summary, .folder-archives summary { cursor: pointer; color: var(--accent-dark); font-weight: 700; }
.folder-archives { margin-top: 16px; border-top: 1px solid var(--line); padding-top: 10px; }
.danger-link { color: var(--color-danger) !important; }
/* Triage screen: progress of the analyses, names, data found. */
.analysis-progress { max-width: 900px; margin: 0 0 16px; border-left: 4px solid var(--palette-indigo); padding: 10px 14px; background: var(--color-info-soft); font: .88rem var(--font-text); border-radius: var(--radius-md); }
.analysis-progress p { margin: 0 0 6px; }
.analysis-progress progress { width: 100%; height: 10px; accent-color: var(--palette-indigo); }
.analysis-progress-manual { margin: 6px 0 0; }
.analysis-progress-manual .link-button { margin-left: 0; font-size: .84rem; }
.warning-notice { border-left: 4px solid var(--color-accent); background: var(--color-warning-soft); color: var(--color-accent-hover); }
.sort-piece-name { margin: -4px 0 10px; font: .86rem var(--font-text); overflow-wrap: anywhere; }
.sort-version-hint { margin: -4px 0 10px; color: var(--color-accent-hover); }
.sort-custom-name summary { cursor: pointer; font: .8rem var(--font-text); color: var(--muted); }
.sort-custom-name[open] summary { margin-bottom: 6px; }
.sort-wait { margin-right: 10px; font: .8rem var(--font-text); }
.sort-actions .button[disabled] { opacity: .45; cursor: not-allowed; }
.ai-row-found { grid-template-columns: 1.1fr 1fr 1.3fr 1fr auto; }
.ai-source { overflow-wrap: anywhere; }
.ai-row .ai-mobile-label { display: none; }
@media (max-width: 760px) { .ai-row-found { grid-template-columns: 1fr; } .ai-row .ai-mobile-label { display: inline; color: var(--muted); } .drawer { padding: 10px 10px 6px; } }
.danger-button { border-color: var(--color-danger) !important; background: var(--color-danger) !important; color: var(--color-on-accent) !important; }
/* Waiting screen of a deposit while the assistant reads the files (then the sort screen appears). */
.analysis-waiting { max-width: 720px; margin: 8px 0 32px; padding: 24px 24px 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.analysis-waiting h2 { margin-bottom: 10px; font-size: 1.35rem; }
.analysis-waiting .analysis-step { min-height: 2.8em; margin: 0 0 14px; font: 1.05rem/1.4 var(--font-text); color: var(--ink); animation: oasis-step-fade .5s ease; }
.analysis-waiting progress { width: 100%; height: 12px; margin-bottom: 8px; accent-color: var(--accent); }
.analysis-feed { margin: 14px 0 12px; padding: 0; list-style: none; font: .86rem/1.5 var(--font-text); color: var(--muted); }
.analysis-feed li { padding: 3px 0; overflow-wrap: anywhere; }
.analysis-feed li.is-done { color: var(--ink); }
.analysis-waiting .analysis-progress-manual { margin-top: 6px; font: .82rem var(--font-text); }
@keyframes oasis-step-fade { from { opacity: .2; } to { opacity: 1; } }
/* Viewer: zoom dialog shared by the triage screen, the folder lists and the document page (viewer.js). */
.viewer-dialog { width: min(1100px, calc(100vw - 16px)); max-width: none; height: calc(100vh - 16px); height: calc(100dvh - 16px); max-height: none; margin: auto; border: 1px solid var(--line); padding: 0; background: var(--color-surface-sunken); }
.viewer-dialog[open] { display: flex; flex-direction: column; }
.viewer-dialog::backdrop { background: rgb(var(--shadow-rgb) / 0.6); }
.viewer-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 12px; border-bottom: 1px solid var(--line); background: var(--surface); font: .84rem var(--font-text); }
.viewer-title { flex: 1 1 200px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.viewer-pager, .viewer-tools { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.viewer-pager[hidden] { display: none; }
.viewer-bar .button.small { min-width: 38px; padding: 8px 10px; }
.viewer-bar [hidden] { display: none; }
.viewer-level { min-width: 48px; text-align: center; color: var(--muted); }
.viewer-stage { position: relative; flex: 1 1 auto; overflow: auto; padding: 12px; cursor: grab; touch-action: pan-x pan-y pinch-zoom; -webkit-overflow-scrolling: touch; }
.viewer-stage.is-dragging { cursor: grabbing; user-select: none; }
.viewer-stage canvas { display: block; margin: 0 auto; background: var(--color-surface); box-shadow: 0 1px 6px rgb(var(--shadow-rgb) / 0.18); }
.viewer-stage[data-error]::before { content: attr(data-error); display: block; padding: 30px; text-align: center; font: .9rem var(--font-text); color: var(--muted); }
.viewer-hint { margin: 0; padding: 6px 12px; border-top: 1px solid var(--line); background: var(--surface); font: max(.74rem, var(--text-min, 0px)) var(--font-text); color: var(--muted); }
@media (max-width: 760px) { .viewer-dialog { width: 100vw; height: 100vh; height: 100dvh; border: 0; } .viewer-bar { gap: 6px; padding: 8px; } .viewer-bar .button.small { min-width: 34px; padding: 7px 9px; } .viewer-title { flex-basis: 100%; } .viewer-level { min-width: 40px; } .viewer-hint { display: none; } }
/* Thumbnails of the first page in the folder lists (drawn lazily by viewer.js; images shown as they are). */
.document-row.has-thumb { display: flex; align-items: flex-start; gap: 12px; }
.document-body { flex: 1 1 auto; min-width: 0; }
.doc-thumb { position: relative; display: grid; place-items: center; flex: 0 0 56px; width: 56px; height: 72px; overflow: hidden; border: 1px solid var(--line); padding: 0; background: var(--color-surface-sunken); cursor: zoom-in; }
.doc-thumb canvas { display: block; max-width: 100%; max-height: 100%; }
.doc-thumb-image { max-width: 100%; max-height: 100%; object-fit: contain; }
.doc-thumb-image.rotate-90, .doc-thumb-image.rotate-270 { max-width: 72px; max-height: 56px; }
.doc-thumb-image.rotate-90 { transform: rotate(90deg); } .doc-thumb-image.rotate-180 { transform: rotate(180deg); } .doc-thumb-image.rotate-270 { transform: rotate(270deg); }
.doc-thumb:empty::after, .doc-thumb.is-broken::after { content: attr(data-ext); font: 700 max(.68rem, var(--text-min, 0px)) var(--font-text); color: var(--muted); }
.doc-thumb.is-broken canvas { display: none; }
.doc-thumb-large { width: 100%; max-width: 240px; height: 320px; }
.document-preview-panel .doc-thumb-large { margin-bottom: 8px; }
@media (max-width: 760px) { .doc-thumb { flex-basis: 44px; width: 44px; height: 58px; } .doc-thumb-large { width: 100%; height: 280px; } }
/* Triage screen: rotation, page askew, notes. */
.sort-rotate { font-size: .8rem; }
.sort-rotate.is-turned { color: var(--accent-dark); font-weight: 700; }
.sort-skewed { position: absolute; top: 8px; left: 8px; padding: 1px 6px; border-radius: 9px; background: var(--color-warning-soft); color: var(--color-accent-hover); font: 700 max(.64rem, var(--text-min, 0px)) var(--font-text); }
.sort-piece-note, .ai-note { color: var(--color-accent-hover); }
.sort-piece-note { margin: -4px 0 8px; }
.ai-row .ai-note, .ai-record .ai-note { display: block; margin-top: 3px; font-weight: 700; }
.ai-skipped { margin: 0 0 12px; padding-left: 18px; font: .86rem var(--font-text); }
.ai-skipped li { margin: 4px 0; }
.expired-text { color: var(--color-danger); }
/* « Historique des données » folded at the bottom of a resident's or a document's page. */
.data-history { margin: 28px 0 0; font: .84rem var(--font-text); color: var(--muted); }
.data-history summary { cursor: pointer; padding: 6px 0; }
.data-history[open] summary { color: var(--ink); font-weight: 700; }
.data-history .table-scroll { overflow-x: auto; }
.data-history-table { width: 100%; border-collapse: collapse; color: var(--ink); }
.data-history-table th, .data-history-table td { padding: 6px 8px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.data-history-table th { color: var(--muted); font-size: max(.72rem, var(--text-min, 0px)); text-transform: uppercase; letter-spacing: .04em; }
.data-history-table small { display: block; }
/* Cards (11/10/2026, Vincent: « les titres et textes ne sont pas alignés ») : icon, title and text start at the top, at
   the same height in every card of a row, whatever the length of the text. */
/* Icons of the module cards (portal, Administratif): inline SVG sprite, Oasis gradient stroke, never a CDN. */
.icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.module-card:hover .module-icon { background: var(--color-accent-soft); }
/* Psycho-social and support files: every drawer is shown, the empty ones folded to their title. */
.drawer.is-empty { border-left-color: var(--color-line); padding-bottom: 4px; background: var(--color-surface-sunken); }
.drawer.is-empty .drawer-title { margin-bottom: 4px; color: var(--muted); font-weight: 600; }
.drawer-empty-note { color: var(--color-muted); font: italic 400 .76rem var(--font-text); }
.resident-row .inline-link { margin-left: auto; white-space: nowrap; }
/* « ✕ » to cancel a deposit still « à trier » */
.to-sort li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.upload-cancel { display: inline; margin: 0; }
.upload-cancel .icon-button { width: 28px; height: 28px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--muted); font: 700 1.05rem/1 var(--font-text); cursor: pointer; }
.upload-cancel .icon-button:hover { border-color: var(--color-danger); color: var(--color-danger); }
/* Header actions (resident file…): same height and look for every button, on one line each; they wrap as a
   block under the title when there are many, instead of squeezing their labels onto 2–3 lines. */
.intro { flex-wrap: wrap; }
.intro > div:first-child { flex: 1 1 340px; min-width: 0; }
.intro-actions { flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.intro-actions .button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; margin: 0; padding: 0 16px; border: 1px solid transparent; line-height: 1.2; white-space: nowrap; }
.intro-actions .button.secondary { border-color: var(--line); }
@media (max-width: 760px) { .intro-actions .button { width: 100%; white-space: normal; } }
/* Notification bell (placeholder: reminders will come later) */
.notif-bell { position: relative; display: inline-block; }
.notif-bell > summary { list-style: none; display: inline-flex; align-items: center; padding: 4px; color: var(--accent); cursor: pointer; }
.notif-bell > summary::-webkit-details-marker { display: none; }
.notif-bell > summary:hover { color: var(--accent-dark); }
.notif-panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 50; width: min(300px, 86vw); padding: 14px 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: 0 12px 28px rgb(var(--shadow-rgb) / 0.12); font: .86rem/1.45 var(--font-text); color: var(--ink); text-align: left; }
.notif-panel p { margin: 0 0 6px; }
.notif-title { font-weight: 700; }
.notif-empty { color: var(--ink); }
.notif-hint { color: var(--muted); font-size: .8rem; }
.notif-bell > summary { position: relative; }
.notif-count { position: absolute; top: -4px; right: -6px; min-width: 1.2rem; height: 1.2rem; font-size: .75rem; }
.notif-items { display: grid; gap: 2px; margin: 4px 0 0; padding: 0; list-style: none; }
.notif-items a { display: block; min-height: 44px; padding: 10px 4px; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.notif-items a:hover { color: var(--accent-dark); }

/* Échéances par section (§16) */
.section-tabs { margin-bottom: 18px; }
.deadline-filters div { flex-wrap: wrap; }
.deadline-filters select { flex: 1 1 180px; min-width: 0; }
@media (max-width: 760px) { .deadline-filters select { flex: 0 0 auto; } }
.deadline-note { display: block; margin-top: 2px; color: var(--muted); font: italic max(.74rem, var(--text-min, 0px)) var(--font-text); }
.deadline-section { max-width: 860px; margin-bottom: 18px; }
.deadline-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; border-top: 2px solid var(--ink); padding-top: 14px; }
.deadline-section-head h2 { margin: 0; }
.deadline-section-head h2 span { margin-left: 6px; color: var(--muted); font: 400 .9rem var(--font-text); }
.deadline-section .deadline-list { margin-bottom: 22px; }
.deadline-section .section-heading h2 { font-size: 1rem; }
/* Droits (matrice rôles × droits, droits particuliers) */
.rights-table-wrap { max-width: 100%; overflow-x: auto; margin-bottom: 18px; -webkit-overflow-scrolling: touch; }
.rights-table { border-collapse: collapse; min-width: 640px; font: .84rem var(--font-text); }
.rights-table th, .rights-table td { padding: 10px 8px; border-bottom: 1px solid var(--line); text-align: center; vertical-align: middle; }
.rights-table th:first-child, .rights-table td:first-child { position: sticky; left: 0; z-index: 1; min-width: 150px; background: var(--surface, var(--color-surface)); text-align: left; }
.rights-table thead th { font-size: max(.74rem, var(--text-min, 0px)); font-weight: 700; vertical-align: bottom; }
.rights-table input[type="checkbox"] { width: 20px; height: 20px; }
.rights-table .changed { background: var(--color-warning-soft); }
.rights-list { display: grid; gap: 0; max-width: 760px; margin: 0 0 18px; padding: 0; list-style: none; }
.rights-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding: 10px 0; }
.rights-list small { display: block; color: var(--muted); font: .76rem var(--font-text); }
.rights-list select { width: auto; min-width: 170px; }
@media (max-width: 700px) { .rights-list li { align-items: stretch; flex-direction: column; } .rights-list select { width: 100%; } }
/* Droits plus fins (11/10/2026) : blocs repliables, cases à trois états, changements proposés */
.rights-block { margin-bottom: 14px; }
.rights-block > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; cursor: pointer; list-style: none; }
.rights-block > summary::-webkit-details-marker { display: none; }
.rights-block > summary::before { content: "▸"; color: var(--muted); }
.rights-block[open] > summary::before { content: "▾"; }
.rights-block > summary h2, .rights-block > summary h3 { margin: 0; }
.rights-block > summary .muted { font-size: .84rem; }
.rights-table select.rights-select { width: auto; min-width: 0; max-width: 132px; padding: 4px 6px; font-size: .8rem; }
.rights-table select.level-0 { color: var(--muted); }
.rights-table thead th { min-width: 96px; }
.rights-table .rights-gesture, .rights-table .rights-count, .rights-included { display: block; color: var(--muted); font: 400 .75rem var(--font-text); }
.rights-table .rights-referent-row th, .rights-table .rights-referent-row td { background: var(--color-violet-soft); }
.rights-locked { font-size: .8rem; white-space: nowrap; }
.rights-focus { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 14px; }
.rights-focus select { width: auto; max-width: 100%; }
.rights-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.rights-notice { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 14px; }
.rights-focus-list li.changed { background: var(--color-warning-soft); }
.rights-default { color: var(--muted); }
.rights-proposals-all { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.rights-proposal-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.rights-proposal-head h2 { margin: 0; }
.rights-proposal-list { margin: 10px 0 0; padding: 0; list-style: none; }
.rights-proposal-list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line); }
.rights-proposal-list small { display: block; margin-top: 4px; }
.rights-change { display: inline-flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-left: 6px; }
.rights-proposal-actions { display: flex; gap: 6px; align-items: flex-start; }
.rights-overview th small { display: block; color: var(--muted); font-weight: 400; }
.rights-overview td { white-space: nowrap; font-size: .76rem; }
.rights-overview td.level-0 { color: var(--muted); }
.rights-overview-block { text-align: center; background: var(--surface-muted, var(--color-surface-sunken)); }
@media print { .rights-overview-wrap { overflow: visible; } .rights-overview { min-width: 0; font-size: 7pt; } .rights-overview th, .rights-overview td { padding: 2px 3px; } .no-print, .topbar, .config-tabs { display: none !important; } }
@media (max-width: 700px) { .rights-proposal-list li { flex-direction: column; } .rights-proposal-actions { width: 100%; } .rights-proposal-actions form, .rights-proposal-actions button { flex: 1; } }
/* Santé au quotidien, contacts utiles, qui est là ?, occupation, suivi paramédical */
.health-list { margin: 0; padding: 0; list-style: none; }
.health-list > li { padding: 8px 0; border-bottom: 1px solid var(--line); }
.health-list > li:last-child { border-bottom: 0; }
.health-list small { display: block; color: var(--muted); }
.health-list p { margin: 4px 0 0; }
.health-list ul { margin: 4px 0 0 16px; padding: 0; }
.health-form { margin-top: 10px; }
.contact-phone { display: inline-block; margin: 4px 12px 0 0; font-weight: 700; }
.who-row { flex-wrap: wrap; }
.who-move { width: 100%; margin: 4px 0 0 44px; }
.who-move form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 6px; }
.who-move select { width: auto; }
@media (max-width: 700px) { .who-move { margin-left: 0; } }

/* --- Séjours et présences (docs/spec-presences-sejours.md) --- */
.reason-blue { --reason: var(--reason-blue); --reason-ink: var(--reason-blue-ink); } .reason-green { --reason: var(--reason-green); --reason-ink: var(--reason-green-ink); } .reason-red { --reason: var(--reason-red); --reason-ink: var(--reason-red-ink); } .reason-violet { --reason: var(--reason-violet); --reason-ink: var(--reason-violet-ink); } .reason-amber { --reason: var(--reason-amber); --reason-ink: var(--reason-amber-ink); } .reason-teal { --reason: var(--reason-teal); --reason-ink: var(--reason-teal-ink); } .reason-pink { --reason: var(--reason-pink); --reason-ink: var(--reason-pink-ink); } .reason-grey { --reason: var(--reason-grey); --reason-ink: var(--reason-grey-ink); }
.swatch { display: inline-grid; flex: none; place-items: center; width: 1.25rem; height: 1.25rem; border-radius: 4px; background: var(--reason, var(--color-line-strong)); color: var(--reason-ink, var(--ink)); font: 700 max(.66rem, var(--text-min, 0px))/1 var(--font-text); font-style: normal; vertical-align: middle; }
.swatch-large { width: 2rem; height: 2rem; font-size: .8rem; }
.state-half-sample { background: linear-gradient(135deg, var(--palette-blue-light) 50%, var(--color-surface) 50%); border: 1px solid var(--line); } .state-out-sample { background: repeating-linear-gradient(135deg, var(--color-surface-sunken) 0 4px, var(--color-surface) 4px 8px); border: 1px solid var(--line); }
.absence-pill { display: inline-block; margin-left: 6px; padding: 3px 8px; border-radius: 3px; background: var(--reason); color: var(--reason-ink); font: 700 max(.68rem, var(--text-min, 0px)) var(--font-text); text-decoration: none; white-space: nowrap; vertical-align: middle; }
.absence-pill.alert { box-shadow: 0 0 0 2px var(--color-surface), 0 0 0 3px var(--color-danger); }
.left-banner { border-color: var(--color-line-strong); background: var(--color-surface-sunken); }
.stay-action { margin-top: 18px; } .stay-action summary { list-style: none; } .stay-action summary::-webkit-details-marker { display: none; } .stay-action[open] summary { margin-bottom: 14px; } .stay-action form { border-top: 1px solid var(--line); padding-top: 14px; } .stay-action .field { margin-bottom: 12px; }
.panel-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 18px; margin-bottom: 18px; } .detail-panel .panel-head h2 { margin: 0; } .inline-actions { margin-top: 0; }
.resident-presence { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 32px; } .resident-presence > * { min-width: 0; }
.month-nav { display: flex; align-items: center; gap: 12px; font: 700 .9rem var(--font-text); } .month-nav a { display: inline-grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--line); color: var(--accent-dark); font-size: 1.3rem; text-decoration: none; } .month-nav a:hover { border-color: var(--accent-pink); } .month-nav strong { min-width: 9.5rem; text-align: center; }
.mini-calendar .month-nav { justify-content: space-between; margin-bottom: 10px; }
.mini-calendar-grid { width: 100%; border-collapse: separate; border-spacing: 3px; table-layout: fixed; font: .78rem var(--font-text); } .mini-calendar-grid th { color: var(--muted); font-weight: 700; }
.cal-day { height: 2.1rem; padding: 0; border-radius: 4px; background: var(--color-success-soft); text-align: center; vertical-align: middle; } .cal-day a { display: grid; place-items: center; width: 100%; height: 100%; min-height: 1.9rem; color: inherit; text-decoration: none; } .cal-day a:hover, .cal-day a:focus-visible { outline: 2px solid var(--accent-pink); outline-offset: -2px; }
.cal-day.state-absent { background: var(--reason); color: var(--reason-ink); font-weight: 700; } .cal-day.state-half { background: linear-gradient(135deg, var(--reason) 50%, var(--reason-half-bg) 50%); color: var(--reason-half-ink); font-weight: 700; } .cal-day.state-out { background: repeating-linear-gradient(135deg, var(--color-surface-sunken) 0 4px, var(--color-surface) 4px 8px); color: var(--muted); }
.cal-day.is-today { box-shadow: inset 0 0 0 2px var(--brand-pink-dark); } .cal-empty { background: transparent; }
.presence-totals { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 12px 0 0; font: .8rem var(--font-text); } .legend-item { display: inline-flex; align-items: center; gap: 6px; } .small-note { font-size: .8rem; }
.absence-lists h3:first-child { margin-top: 0; } .absence-line { display: flex; align-items: flex-start; gap: 10px; margin: 0; border-top: 1px solid var(--line); padding: 9px 0; } .absence-line > span:nth-child(2) { flex: 1; } .absence-line .swatch { margin-top: 2px; } .absence-line small { font: .78rem var(--font-text); }
.absence-history { margin-top: 14px; font: .82rem var(--font-text); } .absence-history summary { cursor: pointer; color: var(--muted); font-weight: 700; } .absence-history .absence-line { font-family: var(--font-text); }
.away-block { margin: 0 0 32px; border: 0; border-top: 0; padding: 18px 20px; box-shadow: var(--shadow-sm); background: var(--color-surface); border-radius: var(--radius-lg); } .away-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-bottom: 12px; } .away-head .inline-link { margin-left: 0; }
.away-alert { margin: 0 0 10px; border-left: 4px solid var(--color-danger); padding: 9px 12px; background: var(--color-danger-soft); color: var(--color-danger-strong); font: .86rem var(--font-text); border-radius: var(--radius-md); }
.away-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 28px; } .away-columns h3 { margin: 6px 0 4px; color: var(--muted); font: 700 max(.74rem, var(--text-min, 0px)) var(--font-text); letter-spacing: .06em; text-transform: uppercase; } .away-columns h3 span { margin-left: 4px; color: var(--ink); }
.away-line { display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 7px 0; } .away-line .swatch { margin-top: 3px; } .away-line strong, .away-line small { display: block; } .away-line small { margin-top: 2px; font: .76rem var(--font-text); } .away-block .empty { padding: 6px 0; }
.presence-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-bottom: 22px; font: 700 .8rem var(--font-text); } .presence-toolbar select { width: auto; min-width: 200px; } .presence-toolbar .inline-link { margin-left: 0; }
.presence-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 14px; font: .78rem var(--font-text); }
.presence-scroll { max-width: 100%; overflow-x: auto; border: 1px solid var(--line); -webkit-overflow-scrolling: touch; } .presence-scroll:focus-visible { outline: 2px solid var(--accent-pink); }
.presence-grid { border-collapse: separate; border-spacing: 0; font: max(.74rem, var(--text-min, 0px)) var(--font-text); }
.presence-grid th, .presence-grid td { border-bottom: 1px solid var(--line); }
.presence-grid thead th { position: sticky; top: 0; z-index: 1; padding: 6px 0; background: var(--color-surface); font-weight: 700; text-align: center; }
.page:has(.presence-grid) { max-width: 1480px; } .presence-scroll { width: fit-content; }
.presence-grid .day-col { min-width: 1.7rem; } .presence-grid .day-col span { display: block; color: var(--muted); font-size: max(.64rem, var(--text-min, 0px)); font-weight: 400; } .presence-grid .day-col.is-weekend { background: var(--color-surface-sunken); } .presence-grid .day-col.is-today { background: var(--color-accent-soft); color: var(--color-accent); }
.presence-grid .resident-col { position: sticky; left: 0; z-index: 2; min-width: 10rem; max-width: 13rem; padding: 6px 10px; border-right: 1px solid var(--line); background: var(--color-surface); text-align: left; } .presence-grid thead .resident-col { z-index: 3; }
.presence-grid tbody .resident-col a { color: var(--ink); text-decoration: none; } .presence-grid tbody .resident-col a:hover { color: var(--accent-dark); } .presence-grid .resident-col small { display: block; font-size: max(.66rem, var(--text-min, 0px)); font-weight: 400; } .presence-grid .resident-col .absence-pill { margin: 3px 0 0; }
.presence-grid .cal-day { height: 2.5rem; border-radius: 0; border-left: 1px solid var(--color-surface); } .presence-grid .cal-day.is-weekend.state-present { background: var(--color-success-soft); } .presence-grid .cal-day a { min-height: 2.4rem; }
.presence-grid .total-col { min-width: 2.4rem; padding: 6px; border-left: 1px solid var(--line); text-align: center; font-variant-numeric: tabular-nums; } .presence-grid tfoot th, .presence-grid tfoot td { border-bottom: 0; font-weight: 700; }
@media (max-width: 900px) { .resident-presence { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .away-columns { grid-template-columns: 1fr; } .presence-grid .resident-col { min-width: 8.5rem; max-width: 9.5rem; } .presence-toolbar select { min-width: 0; flex: 1; } .presence-toolbar label { flex-basis: 100%; } }
/* Annuaire des organismes : « + Nouvel organisme » (fenêtre superposée) et rubrique de l'écran de tri (spec §17). */
.org-new { display: block; width: fit-content; margin-top: 6px; padding: 4px 0; color: var(--accent-dark); font: 700 .8rem var(--font-text); text-decoration: none; }
.org-new:hover, .org-new:focus { text-decoration: underline; }
.org-new-status { display: block; margin-top: 4px; color: var(--color-success); font: .78rem var(--font-text); }
.org-window { width: min(760px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); overflow: auto; border: 1px solid var(--line); border-top: 4px solid var(--accent-pink); padding: 0; background: var(--surface); color: var(--ink); box-shadow: 0 24px 60px rgb(var(--shadow-rgb) / 0.25); }
.org-window::backdrop { background: rgb(var(--shadow-rgb) / 0.45); }
.org-window .organization-window-form { max-width: none; margin: 0; padding: 20px 22px 8px; }
.organization-window-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.organization-window-head h2 { margin: 0; }
.organization-window-head .link-button { font-size: 1.2rem; }
.org-window .form-actions { position: sticky; bottom: 0; padding: 12px 0; background: var(--surface); }
.ai-org-variant { display: flex; align-items: flex-start; gap: 8px; margin: 6px 0; font: .86rem var(--font-text); }
.ai-org-variant input, .ai-org .ai-decision input { width: auto; }
@media (max-width: 760px) { .org-window { width: 100vw; max-width: 100vw; max-height: 100dvh; height: 100dvh; margin: 0; border: 0; } .org-window .organization-window-form { padding: 16px 14px 4px; } }
@media (max-height: 520px) { .org-window .form-actions { position: static; } }
/* Photo d'identification ({% avatar %}, core/templatetags/photo_tags.py) : rond, la photo ou les initiales (couleur neutre). */
.avatar { width: var(--avatar-size, 42px); height: var(--avatar-size, 42px); flex: 0 0 var(--avatar-size, 42px); overflow: hidden; font-size: clamp(max(.62rem, var(--text-min, 0px)), calc(var(--avatar-size, 42px) * .3), 2rem); line-height: 1; }
.avatar-initials { background: var(--line); color: var(--muted); }
.avatar-photo { background: var(--line); }
.avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.intro-identity { display: flex; align-items: center; gap: 18px; }
.intro-identity > div { min-width: 0; }
.person-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; vertical-align: middle; }
/* Tailles : 20 px dans une phrase ou un tableau ({% person_chip %}), 24 à 32 px dans les listes, 64 px et plus dans les en-têtes. */
.person-chip > .avatar { font-weight: 700; letter-spacing: 0; text-transform: none; }
td .person-chip, th .person-chip { vertical-align: top; }
.thread-sender { display: flex; align-items: center; gap: 10px; min-width: 0; }
.recipient-chips { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.field .recipient-option { display: flex; margin-bottom: 0; }
.presence-grid .resident-col .person-chip + small { padding-left: 26px; }
.away-line .avatar, .absence-line .avatar { margin-top: 1px; }
.observation-row small.observation-people { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.ai-choice .person-chip { vertical-align: -6px; }
.photo-block { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px 18px; margin: 4px 0 18px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.photo-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; }
.photo-actions > form { display: flex; margin: 0; }
.photo-actions small { flex-basis: 100%; color: var(--muted); font: max(.74rem, var(--text-min, 0px))/1.4 var(--font-text); }
.photo-pick { position: relative; overflow: hidden; }
.photo-pick input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; opacity: 0; }
.photo-pick:focus-within { outline: 2px solid var(--accent-pink); outline-offset: 2px; }
.photo-remove summary { list-style: none; } .photo-remove summary::-webkit-details-marker { display: none; }
.photo-remove[open] summary { margin-bottom: 8px; }
.photo-remove form { padding: 10px 12px; border: 1px solid var(--line); background: var(--soft); }
.photo-remove p { margin: 0 0 8px; font: .82rem var(--font-text); }
.photo-note { grid-column: 1 / -1; margin: 0; color: var(--muted); font: max(.74rem, var(--text-min, 0px))/1.4 var(--font-text); }
.sheet-person { display: flex; align-items: center; gap: 14px; }
.sheet-photo .avatar { border: 1px solid var(--color-ink); }
@media (max-width: 760px) { .intro-identity { gap: 12px; } .photo-block { grid-template-columns: 1fr; justify-items: start; } }
@media print { .sheet-photo .avatar { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
/* Top menu between 480 and 760 px: the entries wrap instead of overflowing the screen. */
@media (max-width: 760px) { .topbar { gap: 12px; } .topbar nav { flex-wrap: wrap; justify-content: flex-end; gap: 4px 16px; min-width: 0; } }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Protocoles (folder of the establishment): section icon, drawer icons, badges, reflex sheet. */
.section-icon { margin-bottom: 0; }
.detail-panel .drawer-title .drawer-icon { flex: none; width: 22px; height: 22px; fill: none; stroke: url(#oasis-icon-gradient); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.institution-pill { margin-left: 0; }
.institution-title { display: block; margin-top: 2px; color: var(--ink); font: .84rem/1.35 var(--font-text); overflow-wrap: anywhere; }
.reflex-sheet { grid-column: 1 / -1; border: 1px solid var(--color-accent-soft); border-left: 5px solid var(--accent); background: var(--color-surface-sunken); }
.reflex-sheet.is-draft { border-color: var(--color-warning-soft); border-left-color: var(--color-warning-line); background: var(--color-warning-soft); }
.detail-panel.reflex-sheet h2 { margin-bottom: 6px; }
.reflex-meta { margin: 0 0 14px; color: var(--muted); font: .8rem/1.4 var(--font-text); }
.reflex-steps { margin: 0; padding-left: 1.6em; font: 1rem/1.5 var(--font-text); }
.reflex-steps li { margin: 0 0 8px; padding-left: 4px; }
.reflex-steps li::marker { color: var(--accent-dark); font-weight: 700; }
.reflex-form textarea { width: 100%; min-height: 220px; font: .95rem/1.5 var(--font-text); }
.reflex-form .panel-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 12px; }
.reflex-form .panel-actions .inline-form { margin: 0; }
/* « Diffusion à l'équipe » (management only): full width, amber while the document is not distributed. */
.distribution-panel { grid-column: 1 / -1; border-left: 5px solid var(--color-success); }
.distribution-panel.is-pending { border-left-color: var(--color-warning-line); background: var(--color-warning-soft); }
.distribution-state { margin: 0 0 8px; }
.distribution-panel .inline-form { margin: 6px 0 0; }
.document-full-text { grid-column: 1 / -1; }
.document-full-text pre { max-height: 480px; margin: 10px 0 0; padding: 14px; overflow: auto; border: 1px solid var(--line); background: var(--color-surface-sunken); white-space: pre-wrap; overflow-wrap: anywhere; font: .86rem/1.5 var(--font-text); }
.document-full-text summary { cursor: pointer; color: var(--accent-dark); font: 700 .88rem var(--font-text); }
@media (max-width: 760px) { .section-icon { width: 44px; height: 44px; padding: 5px; border-radius: 12px; } .reflex-form .panel-actions { align-items: stretch; flex-direction: column; } .reflex-form .panel-actions .button { width: 100%; text-align: center; } .reflex-steps { font-size: .95rem; } }
.document-body .institution-title + br { display: none; }
.detail-grid > * { min-width: 0; } .detail-panel dd { overflow-wrap: anywhere; }
.drawers { grid-template-columns: minmax(0, 1fr); } .drawer-list .document-body { min-width: 0; }
.document-actions { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; } .document-actions .inline-link, .document-actions .inline-form { margin-left: 0; }
.document-actions .link-button { margin-left: 0; line-height: inherit; }
/* Contrôle qualité (10/2026) — corrections centralisées de mise en page, sans changer l'identité visuelle. */
/* Phone: a one-column grid never grows wider than the screen (1fr = minmax(auto, 1fr) took the widest word or table). */
.detail-grid > * { min-width: 0; }
@media (max-width: 900px) { .detail-grid { grid-template-columns: minmax(0, 1fr); } }
/* Contrast of small texts (WCAG AA, 4.5:1): same hues, one shade darker. */
.context-back { color: var(--color-accent); }
.avatar-initials { color: var(--color-muted); }
.deadline-pill.ok, .status-pill { color: var(--color-success); }
.deadline-pill.muted-pill { color: var(--color-muted); }
.drawer-empty-note { color: var(--muted); }
/* Triage screen: its action bar sticks to the bottom of the screen; « Signaler » and « Besoin d'aide ? » sit above it, and
   at the end of the page the bar stops above them (it used to stop under the pill, which hid « Valider le tri »). */
html body:has(.sort-actions) .feedback { bottom: 91px; }
body:has(.sort-actions) .page { padding-bottom: 160px; }
/* Search of the documents of a folder: the button as high as the field beside it. */
.document-search { align-items: stretch; } .document-search .inline-link { align-self: center; }
/* Box « Financement » of the resident's file (core/funding_rules.py): category and expected shares. */
.funding-box { margin: 0 0 18px; padding: 14px 16px; border: 1px solid var(--line); border-left: 4px solid var(--color-success); background: var(--color-success-soft); font-family: var(--font-text); border-radius: var(--radius-md); }
.funding-box.is-uncovered { border-left-color: var(--color-danger); background: var(--color-danger-soft); }
.funding-box-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.funding-box-head h3, .detail-panel .funding-box-head h3 { margin: 0; }
.funding-box-head .deadline-pill { margin-left: 0; }
.funding-category { margin: 10px 0 6px; font-size: .9rem; } .funding-category strong, .funding-category small { display: block; } .funding-category small { margin-top: 4px; color: var(--muted); font-size: .8rem; } .funding-category .deadline-pill { margin-left: 0; }
.funding-shares { margin: 6px 0 0; padding: 0; list-style: none; font-size: .88rem; }
.funding-share { position: relative; padding: 5px 0 5px 18px; overflow-wrap: anywhere; }
.funding-share::before { content: ""; position: absolute; left: 2px; top: 11px; width: 8px; height: 8px; border-radius: 50%; background: var(--color-success); }
.funding-share.missing::before { background: var(--color-danger); } .funding-share.missing strong { color: var(--color-danger); }
.funding-box .form-hint { margin: 8px 0 0; font-size: .8rem; }
/* Several choices as checkboxes (CDAPH orientations of the form and of the triage screen). */
.choice-options { display: flex; flex-wrap: wrap; gap: 8px 16px; padding: 6px 0 2px; }
.choice-options label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font: .9rem var(--font-text); text-transform: none; letter-spacing: 0; color: var(--ink); }
.choice-options input { width: auto; margin: 0; }
/* Management's table « Financement par catégorie » (page Administratif). */
.funding-table-section { max-width: 860px; margin: 32px 0; }
.funding-table-section .usage-table td a { text-decoration: none; }
.funding-table-section .usage-table .uncovered-count { color: var(--color-danger); font-weight: 700; }
.category-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: -24px 0 24px; font: .88rem var(--font-text); }
.field .field-label { display: block; margin-bottom: 7px; font: 700 .8rem var(--font-text); }

/* Accompagnement: tiles first, then the living unit. */
.support-tiles { margin-bottom: 52px; } .support-tiles .module-name, .planning-catalogs .module-name { font-size: 1.3rem; overflow-wrap: break-word; hyphens: auto; } .unit-intro { margin-bottom: 18px; } .unit-intro h2 { margin: 0 0 8px; font-size: 1.8rem; }

/* Without photo (Vincent, 07/10): a « user » icon on a disc whose colour is stable for the person (white on a medium
   tone: contrast >= 4.5:1 for the icon). */
.avatar-user { width: 62%; height: 62%; fill: currentColor; display: block; }
@media print { .avatar-initials[class*="avatar-tone-"] { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
/* A deadline opens the resident's form at the date to renew (core/deadlines.py): the field is shown, not hidden in 79. */
.resident-form :target { scroll-margin-top: 120px; outline: 3px solid var(--brand-orange); outline-offset: 2px; }
/* The reminders of the bell (assistant/welcome.py::bell), in the list of the bell (.notif-items). */
.notif-link { color: var(--accent-dark, var(--color-accent)); font-weight: 600; white-space: nowrap; }
/* The lines of the bell in ink, as `.notif-items a` meant (the gradient of `.topbar nav a` hid the pictograms, 🚨 of the
   alerts — app `alerts` — included, behind a coloured block). */
.topbar nav .notif-items a { background: none; color: var(--ink); -webkit-text-fill-color: currentColor; }
.topbar nav .notif-items a:hover { color: var(--accent-dark); }
.topbar nav .notif-items .notif-link { -webkit-text-fill-color: currentColor; }
.notif-count[hidden] { display: none; }
/* Dépôt unique (docs/spec-documents-ia.md § 18): the « Dossier » of each piece and what happens to it. */
.sort-destination { display: block; margin-top: 5px; color: var(--muted); }
.sort-destination.is-review { color: var(--color-accent-hover); font-weight: 700; }
/* Identity check (spec documents IA § 19): the piece seems to concern someone else. */
.identity-warning { margin: -2px 0 12px; border: 2px solid var(--color-accent); border-radius: 8px; padding: 10px 12px; background: var(--color-warning-soft); }
.identity-warning-text { margin: 0 0 8px; color: var(--color-accent-hover); font: .92rem/1.4 var(--font-text); }
.identity-choices { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; font: .86rem var(--font-text); }
.identity-choices label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 700; cursor: pointer; }
.identity-choices input[type="radio"] { width: auto; margin: 0; flex: none; }
.identity-target { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.identity-target .identity-filter { max-width: 150px; padding: 6px 8px; }
.identity-target select { max-width: 320px; padding: 6px 8px; }
@media (max-width: 760px) {
  .identity-choices { flex-direction: column; align-items: stretch; gap: 10px; }
  .identity-target { flex-direction: column; align-items: stretch; }
  .identity-target .identity-filter, .identity-target select { max-width: 100%; }
}
.unified-folders { margin: -6px 0 14px; padding-left: 20px; font: .9rem/1.5 var(--font-text); }
.review-row { flex-wrap: wrap; } .review-row .directory-identity { min-width: 220px; }
.review-refuse > summary { list-style: none; cursor: pointer; } .review-refuse > summary::-webkit-details-marker { display: none; }
.review-refuse-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; font: .85rem var(--font-text); text-align: left; }
.review-refuse-form label { flex-basis: 100%; } .review-refuse-form input[type="text"], .review-refuse-form select { flex: 1 1 260px; min-width: 0; }
.review-notice { border-left: 3px solid var(--color-warning-line); }
.deposit-line { display: block; margin-top: 4px; } .deposit-refusal { color: var(--color-accent-hover); }
.my-deposits-link { margin-left: 12px; font: .85rem var(--font-text); }
/* Top bar: « Courrier (mails) » (service mailboxes, app correspondence) beside « Messagerie (interne) » — two icons, two names. */
.topbar nav .nav-mail, .topbar nav .nav-messages.has-icon { position: relative; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.topbar .nav-icon { flex: none; width: 21px; height: 21px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.topbar .nav-mail .nav-icon { stroke: var(--accent-pink); }
.topbar .nav-qualifier { font-weight: 400; font-size: .82em; }
.topbar .nav-count { margin-left: 2px; }
@media (max-width: 1180px) { .topbar .nav-qualifier { display: none; } }
@media (min-width: 761px) and (max-width: 980px) { .topbar nav { gap: 16px; } .topbar nav .nav-mail .nav-label, .topbar nav .nav-messages.has-icon .nav-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
.tabbar-more-mail a { color: var(--accent-dark); }
.tabbar-more-mail .nav-icon { flex: none; width: 24px; height: 24px; fill: none; stroke: var(--accent-pink); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tabbar-more-mail small { display: block; color: var(--muted); font: 400 .78rem var(--font-text); }

/* Horaires du personnel / Mon horaire (app `workforce`, 15/10/2026): an entry of the top bar, like the Courrier. */
.topbar nav .nav-horaires { position: relative; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
@media (min-width: 761px) and (max-width: 980px) { .topbar nav .nav-horaires .nav-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
.tabbar-more-horaires .nav-icon { flex: none; width: 24px; height: 24px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.topbar nav .nav-horaires .nav-qualifier { font-weight: inherit; font-size: inherit; }
/* « Mon compte › Affichage » (templates/core/includes/display_settings.html): the two samples keep their own colours. */
.account-jump { margin: 6px 0 0; font: .9rem var(--font-text); } .account-jump .inline-link { margin-left: 0; }
.display-settings { max-width: 720px; margin-top: 28px; scroll-margin-top: 90px; } .display-settings h2 { margin-bottom: 8px; }
.display-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px; margin: 14px 0 0; border: 0; padding: 0; }
.display-choice { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; border: 1px solid var(--line); padding: 14px; background: var(--surface); cursor: pointer; font-family: var(--font-text); }
.display-choice:has(input:checked) { border-color: var(--accent-dark); box-shadow: inset 0 0 0 1px var(--accent-dark); }
.display-choice input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--accent-dark); }
.display-text strong, .display-text small { display: block; } .display-text small { margin-top: 4px; line-height: 1.4; }
.display-sample { display: grid; flex: none; gap: 4px; width: 56px; padding: 7px 0 8px; place-items: center; border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); font: 700 1.15rem/1 var(--font-title); }
.display-sample i { display: block; width: 30px; height: 6px; }
.display-sample-habituel { background: var(--sample-habituel-bg); } .display-sample-habituel b { color: var(--sample-habituel-ink); }
.display-sample-habituel i { border-radius: 999px; background: var(--sample-habituel-accent); }
.display-sample-sobre { background: var(--sample-sobre-bg); } .display-sample-sobre b { color: var(--sample-sobre-ink); } .display-sample-sobre i { background: var(--sample-sobre-accent); }
.display-sample-sombre { background: var(--sample-sombre-bg); } .display-sample-sombre b { color: var(--sample-sombre-ink); } .display-sample-sombre i { border-radius: 999px; background: var(--sample-sombre-accent); }
.display-settings [hidden] { display: none; }
.display-status { min-height: 1.4em; margin: 10px 0 0; color: var(--muted); font: .86rem var(--font-text); }
@media (max-width: 600px) { .display-choices { grid-template-columns: 1fr; } }
/* Candidacies (docs/spec-candidatures.md): « Suivi des candidatures » (Administratif › Candidats), checklist of a file. */
.candidate-banner .candidacy-banner-file { flex: 1 1 100%; }
.candidacy-intro { margin: 0 0 16px; font: .88rem/1.45 var(--font-text); }
.candidacy-overview { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap: 16px; }
.candidacy-overview > .section-heading, .candidacy-overview > .candidacy-intro, .candidacy-overview > .empty { grid-column: 1 / -1; }
.candidacy-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 16px 18px; border: 0; background: var(--surface); box-shadow: var(--shadow-sm); border-radius: var(--radius-lg); }
.candidacy-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.candidacy-name { flex: 1 1 auto; min-width: 0; font-weight: 700; overflow-wrap: anywhere; }
.candidacy-head .deadline-pill { margin-left: 0; }
.candidacy-dates { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; font: .86rem var(--font-text); }
.candidacy-dates dt { color: var(--muted); font-size: .76rem; }
.candidacy-dates dd { margin: 0; font-weight: 700; }
.candidacy-pieces { margin: 0; padding: 0; list-style: none; font: .88rem/1.4 var(--font-text); }
.candidacy-pieces li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; padding: 3px 0; }
.candidacy-pieces small { color: var(--muted); }
.candidacy-pieces .piece-mark { flex: 0 0 1.2em; font-weight: 700; text-align: center; }
.candidacy-pieces .piece-received .piece-mark { color: var(--color-success); }
.candidacy-pieces .piece-in_review .piece-mark { color: var(--color-accent-hover); }
.candidacy-pieces .piece-missing .piece-mark { color: var(--color-danger); }
.candidacy-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.candidacy-edit { flex: 1 1 100%; font: .86rem var(--font-text); }
.candidacy-edit summary { cursor: pointer; color: var(--accent-dark); }
.candidacy-edit form { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 6px 12px; align-items: end; margin-top: 8px; }
.candidacy-edit label { font-weight: 700; font-size: .78rem; }
.candidacy-requirement { flex-wrap: wrap; gap: 8px 14px; }
.candidacy-requirement .directory-identity { flex: 1 1 240px; }
.candidacy-inline { flex: 1 1 260px; }
.candidacy-row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.candidacy-add { margin-top: 24px; }
/* Session fermée après inactivité (core/idle.py, audit PIF SEC-003) : avertissement quelques minutes avant. */
.session-idle-warning { position: fixed; z-index: 1000; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); width: min(440px, calc(100vw - 32px)); padding: 18px 20px; border: 2px solid var(--accent-dark); border-radius: 12px; background: var(--surface); color: var(--ink); box-shadow: 0 12px 40px rgb(var(--shadow-rgb) / 0.22); font: .95rem/1.45 var(--font-text); }
.session-idle-warning p { margin: 0 0 10px; }
.session-idle-warning .button { width: 100%; min-height: 44px; }
.has-tabbar .session-idle-warning { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }

/* Focus visible au clavier (audit PIF A11Y-004). */
.org-suggestions button:focus-visible { outline: 3px solid var(--accent-dark); outline-offset: -3px; }

/* Fiche d'un résident, style A (18/10/2026, maquette « A-Fiche ») : en-tête avec la grande photo, puces d'état, actions,
   onglets des dossiers, puis une colonne principale et une colonne « En bref » (une seule colonne sur téléphone). */
.resident-back::before { content: "← "; }
.resident-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; margin-bottom: var(--space-5); }
.resident-hero > .avatar { border-radius: 30px; font-size: var(--text-3xl); }
.resident-hero-text { flex: 1 1 320px; min-width: 0; }
.resident-hero h1 { margin: 0 0 6px; }
.resident-hero .eyebrow { margin-bottom: 4px; }
.resident-hero-meta { margin: 0 0 10px; }
.resident-hero-pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.resident-hero-pills .absence-pill, .resident-hero-pills .deadline-pill { margin: 0; }
.resident-actions { flex: 0 1 620px; justify-content: flex-end; }
.resident-sections { margin-bottom: var(--space-6); }
.resident-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); gap: var(--space-6); align-items: start; }
.resident-main, .resident-aside { display: flex; flex-direction: column; gap: var(--space-6); min-width: 0; }
.resident-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); align-items: start; }
.resident-layout .detail-panel { margin: 0; }
@media (max-width: 1100px) { .resident-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .resident-pair { grid-template-columns: minmax(0, 1fr); } .resident-hero > .avatar { --avatar-size: 72px !important; border-radius: 24px; } .resident-actions { flex-basis: 100%; } }
/* Configuration › une unité de vie (retour #5, 01/11/2026) : ranger les résidents qui y habitent, en colonnes. Jetons seulement. */
.unit-residents { margin: var(--space-5) 0 0; padding: 0; border: 0; }
.unit-residents legend { margin-bottom: var(--space-2); padding: 0; color: var(--color-ink); font: 700 var(--text-md) var(--font-text); }
.unit-residents .form-hint { max-width: 72ch; margin: 0 0 var(--space-3); line-height: 1.45; }
.unit-resident-options { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: 0 var(--space-4); margin-top: var(--space-3); }
.unit-resident { display: flex; align-items: center; gap: var(--space-2); min-height: 44px; margin: 0; color: var(--color-ink); font: var(--text-md)/1.3 var(--font-text); }
.unit-resident input { flex: none; }
.unit-resident span { display: grid; min-width: 0; }
.unit-resident strong { font-weight: 600; overflow-wrap: anywhere; }
.unit-resident small { color: var(--color-muted); font-size: var(--text-sm); }
.unit-resident.is-here { color: var(--color-muted); }
.sites-section { margin-top: var(--space-8); }
.sites-section > .form-hint { max-width: 72ch; margin: 0 0 var(--space-3); }
/* Reprise de PEPS : historique (core/peps_views.py). */
.peps-history-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-bottom: var(--space-4); }
.peps-history-filters .tabs { flex: 1 1 100%; flex-wrap: wrap; }
.peps-history-text { margin: 0; overflow-wrap: anywhere; }