:root {
  --bg: #f4f6f9; --card: #fff; --text: #1d2733; --muted: #6b7684; --line: #e2e7ee;
  --primary: #1f3a5f; --primary-h: #2c5282; --ok: #1e7b4f; --ok-bg: #e3f5ec;
  --warn: #8a5a00; --warn-bg: #fdf1d8; --danger: #b42318; --danger-bg: #fdecea;
}
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background: var(--bg); color: var(--text); }
a { color: var(--primary-h); }
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 16px; }
.top { background: var(--primary); color: #fff; }
.top .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; min-height: 64px; }
.brand { display: flex; align-items: center; padding: 6px 0; }
.brand img { height: 46px; width: auto; display: block; }
.login-logo { display: block; width: 100%; max-width: 280px; margin: 4px auto 22px; }
nav { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
nav a, nav .link { color: #dbe6f3; text-decoration: none; font-size: 14px; }
nav a:hover, nav .link:hover { color: #fff; }
main { padding: 28px 16px 60px; }
h1 { font-size: 24px; margin: 0 0 16px; }
h2 { font-size: 17px; margin: 0 0 14px; }
.mt { margin-top: 24px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 20px; overflow-x: auto; }
.card.narrow { max-width: 400px; margin: 40px auto; }
.card.narrow-lg { max-width: 620px; }
.card.empty { text-align: center; color: var(--muted); padding: 40px; }
.grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 20px; align-items: start; }
@media (max-width: 820px) { .grid { grid-template-columns: 1fr; } }
label { display: block; font-size: 13px; font-weight: 600; color: #3b4652; margin-bottom: 14px; }
input:not([type=checkbox]), textarea, select { display: block; width: 100%; margin-top: 5px; padding: 9px 11px; border: 1px solid #cfd6df; border-radius: 7px; font: inherit; background: #fff; }
input:focus, textarea:focus, select:focus { outline: 2px solid #9fb8d8; border-color: var(--primary-h); }
.row { display: flex; gap: 12px; } .row label { flex: 1; }
label.check { display: flex; gap: 8px; align-items: center; font-weight: 500; }
.btn { display: inline-block; padding: 8px 14px; border-radius: 7px; border: 1px solid #cfd6df; background: #fff; color: var(--text); font: inherit; font-size: 14px; text-decoration: none; cursor: pointer; white-space: nowrap; }
.btn:hover { background: #f0f3f7; }
.btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn.primary:hover { background: var(--primary-h); }
.btn.danger { color: var(--danger); border-color: #f1c4bf; }
.btn.danger:hover { background: var(--danger-bg); }
.btn.ghost { border-color: transparent; background: transparent; }
.btn.small { padding: 5px 10px; font-size: 13px; }
.btn.full { width: 100%; padding: 11px; }
button.link { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; }
form.inline { display: inline; margin: 0; }
.actions { display: inline-flex; gap: 6px; align-items: center; justify-content: flex-end; }
.actions input[type=date] { width: auto; margin: 0; padding: 4px 8px; font-size: 13px; }
table { width: 100%; border-collapse: collapse; }
th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; padding: 8px 10px; border-bottom: 1px solid var(--line); }
td { padding: 11px 10px; border-bottom: 1px solid var(--line); vertical-align: middle; }
tr:last-child td { border-bottom: 0; }
tr.inactive td { opacity: .55; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.right { text-align: right; }
.muted { color: var(--muted); } .small { font-size: 13px; }
.badge { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: 12px; font-weight: 600; background: #eef1f5; color: var(--muted); white-space: nowrap; }
.badge.ok { background: var(--ok-bg); color: var(--ok); }
.badge.wait { background: var(--warn-bg); color: var(--warn); }
.flash { padding: 11px 14px; border-radius: 8px; margin-bottom: 16px; background: var(--ok-bg); color: var(--ok); border: 1px solid #bfe5d1; }
.flash.error { background: var(--danger-bg); color: var(--danger); border-color: #f1c4bf; }
.monthbar { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.monthbar h1 { margin: 0; min-width: 200px; text-align: center; }
.sig { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); display: flex; gap: 16px; align-items: center; }
.sig img { max-height: 70px; max-width: 220px; border: 1px dashed #cfd6df; border-radius: 6px; padding: 4px; background: #fff; }
main.wrap { padding: 28px 16px 60px; }
form.actions { display: inline-flex; }
nav button.link { font-size: inherit; color: #dbe6f3; }
nav button.link:hover { color: #fff; }
@media (max-width: 640px) { form.actions { flex-wrap: wrap; justify-content: flex-end; } .brand img { height: 40px; } }
/* --- v3 --- */
h2.mt, .mt { margin-top: 20px; }
.mb { margin-bottom: 16px; }
.titlebar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.titlebar h1 { margin: 0; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.big { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pastille { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 9px; background: #e5484d; color: #fff; font-size: 11px; font-weight: 700; text-align: center; line-height: 18px; }
.lotbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 0 10px 12px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.lotbar input[type=date] { width: auto; margin: 0; padding: 4px 8px; font-size: 13px; }
.lotbar label.check { margin: 0; }
.cbcol { width: 28px; padding-right: 0; }
.copyrow { display: flex; gap: 8px; align-items: center; }
.copyrow input { margin: 0; }
.lienbox { border-color: #9fb8d8; background: #f5f9ff; margin-bottom: 20px; }
textarea[readonly] { background: #f8fafc; font-size: 13px; }
details summary { cursor: pointer; color: var(--primary-h); }
input.irl { width: 110px; margin: 0; padding: 6px 8px; }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.stat { padding: 16px; }
.bars { display: flex; gap: 6px; align-items: flex-end; height: 210px; padding-top: 10px; }
.barcol { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; min-width: 0; }
.bar { width: 100%; max-width: 46px; background: var(--primary); border-radius: 4px 4px 0 0; min-height: 2px; }
.barval { font-size: 10px; color: var(--muted); margin-bottom: 3px; white-space: nowrap; }
.barlab { font-size: 11px; color: var(--muted); margin-top: 5px; }
.scroll { overflow-x: auto; }
table.dense td, table.dense th { padding: 7px 6px; font-size: 13px; }
code { background: #eef1f5; padding: 1px 5px; border-radius: 4px; font-size: 12.5px; word-break: break-all; }
.menu-btn { display: none; background: none; border: 0; color: #fff; font-size: 24px; cursor: pointer; padding: 4px 8px; }
@media (max-width: 1040px) {
  .menu-btn { display: block; }
}
@media (max-width: 640px) {
  table { font-size: 14px; }
  td, th { padding: 9px 6px; }
  .copyrow { flex-wrap: wrap; }
  .bars { height: 160px; } .barval { display: none; }
}

a.badge { text-decoration: none; }
@media (max-width: 640px) {
  table.mobile thead { display: none; }
  table.mobile tr { display: grid; grid-template-columns: 1fr auto; column-gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
  table.mobile tr:last-child { border-bottom: 0; }
  table.mobile td { border: 0; padding: 2px 0; text-align: left; }
  table.mobile td[data-label]::before { content: attr(data-label) " : "; color: var(--muted); font-size: 13px; }
  table.mobile td.right { grid-column: 2; grid-row: 1 / span 4; align-self: center; }
}

.auto-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-bottom: 16px; }
.auto-item { border: 1px solid var(--line); border-radius: 8px; padding: 14px; }
.auto-item p { margin: 4px 0 10px; }
.auto-item label input[type=number] { width: 90px; display: inline-block; }

.badge.prive { background: #f1ecfb; color: #5b3fa0; }
.pieces { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.piece { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fff; display: flex; flex-direction: column; }
.piece img { width: 100%; height: 120px; object-fit: cover; display: block; background: #eef1f5; }
.piece .pdf { height: 120px; display: flex; align-items: center; justify-content: center; background: #fdecea; color: var(--danger); font-weight: 700; text-decoration: none; }
.piece-lib { padding: 8px 10px 4px; font-size: 13px; line-height: 1.3; flex: 1; }
.piece .actions { padding: 0 10px 10px; justify-content: flex-start; }
.upload { border-top: 1px solid var(--line); padding-top: 14px; }
.nomcell { display: flex; align-items: center; gap: 10px; }
.avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: none; }
.avatar.vide { display: inline-flex; align-items: center; justify-content: center; background: #e3ebf5; color: var(--primary); font-weight: 700; }

fieldset.choix { border: 1px solid var(--line); border-radius: 8px; padding: 10px 14px 4px; margin: 0 0 14px; }
fieldset.choix legend { font-size: 13px; font-weight: 600; color: #3b4652; padding: 0 4px; }
fieldset.choix label.check { align-items: flex-start; font-weight: 400; margin-bottom: 10px; }
fieldset.choix label.check input { margin-top: 3px; }
label.carte { border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
label.carte:has(input:checked) { border-color: var(--primary-h); background: #f5f9ff; }
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 17px; letter-spacing: .02em; }
.fiche-logo { display: none; }
.fiche-table { margin: 6px 0 10px; }
.fiche-table td { padding: 8px 10px; }
.fiche-table td:first-child { color: var(--muted); width: 40%; }
@media print {
  body:has(.fiche-acces) > *:not(main), main > *:not(.grid), .grid > *:not(:first-child),
  .grid > div > *:not(.fiche-acces), .noprint { display: none !important; }
  body { background: #fff; }
  main.wrap { padding: 0; }
  .grid { display: block; }
  .fiche-acces { border: 2px solid #1f3a5f; background: #fff; max-width: 560px; margin: 30px auto; padding: 30px; }
  .fiche-logo { display: block; width: 220px; margin: 0 auto 16px; }
  .fiche-acces h2 { text-align: center; }
  .mono { font-size: 20px; }
}
input[type=radio] { display: inline-block; width: auto; margin: 3px 0 0; padding: 0; flex: none; }
label.check { gap: 10px; }
.brand-pill img { background: #fff; border-radius: 8px; padding: 4px 8px; }
.logos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin: 6px 0 10px; }
.logo-item { border: 1px solid var(--line); border-radius: 8px; padding: 12px; }
.logo-apercu { height: 90px; display: flex; align-items: center; justify-content: center; border-radius: 6px; margin-bottom: 10px; padding: 8px; }
.logo-apercu.clair { background: #f4f6f9; }
.logo-apercu.fonce { background: var(--primary); }
.logo-apercu img { max-height: 74px; max-width: 100%; }
input.couleur { height: 42px; padding: 3px; width: 90px; }
button.var { font-family: ui-monospace, Menlo, monospace; font-size: 12px; padding: 3px 8px; }

.badge.danger { background: var(--danger-bg); color: var(--danger); }
.pastille.orange { background: #e8890c; }
.pt { font-size: 18px; line-height: 1; }
.pt.ok { color: var(--ok); } .pt.wait { color: #d9a400; } .pt.danger { color: var(--danger); }
.assur-liste { display: flex; flex-direction: column; gap: 12px; }
.assur-ligne { display: flex; gap: 14px; align-items: flex-start; }
.assur-info { flex: 1; min-width: 0; }
.assur-fic { flex: none; width: 74px; height: 96px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fdecea; color: var(--danger); font-weight: 700; text-decoration: none; }
.assur-fic img { width: 100%; height: 100%; object-fit: cover; }
form.decision { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
form.decision input { width: auto; margin: 0; padding: 5px 8px; font-size: 13px; flex: 1 1 120px; }
form.decision input[type=date] { flex: 0 0 auto; }
details.compte-menu summary { list-style: none; display: inline-block; }
details.compte-menu summary::-webkit-details-marker { display: none; }
.compte-panel { text-align: left; border: 1px solid var(--line); border-radius: 8px; padding: 12px; margin-top: 8px; background: #fafbfd; }

.msg-grid { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr); }
.msg-pref { gap: 12px; }
.msg-pref select { width: auto; margin: 0 0 0 8px; display: inline-block; }
.inline-lab { display: flex; align-items: center; margin: 0; white-space: nowrap; }
.msg-pref details { position: relative; }
.msg-pref .compte-panel { position: absolute; right: 0; z-index: 5; width: 280px; background: #fff; box-shadow: 0 6px 20px rgba(0,0,0,.08); }
.dest-liste { display: flex; flex-direction: column; gap: 2px; max-height: 520px; overflow-y: auto; }
label.dest { font-weight: 400; margin: 0; padding: 8px; border-radius: 6px; align-items: flex-start; }
label.dest:hover { background: #f5f8fc; }
label.dest .muted { display: block; }
label.dest.sans-mail { opacity: .5; }
.envoi-ligne { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--line); }
.envoi-ligne.envoye { opacity: .55; }
.envoi-ligne.envoye strong::after { content: "  ✓ ouvert"; color: var(--ok); font-weight: 600; font-size: 12px; }
.ecrire { padding: 12px 16px; background: #f5f9ff; border-color: #c8d8ee; }
@media (max-width: 820px) { .msg-grid { grid-template-columns: 1fr; } }

/* menu plus compact (10 entrées) */
.top .wrap { flex-wrap: nowrap; }
@media (max-width: 1040px) {
  .top .wrap { flex-wrap: wrap; }
  .menu-btn { display: block; margin-left: auto; }
}

/* liens d'invitation : rouge et surligné */
.lienbox.lien-rouge { border: 2px solid #d92d20; background: #fff5f4; }
.lienbox.lien-rouge h2 { color: #b42318; }
.lien-affiche { margin: 4px 0 12px; word-break: break-all; }
.lien-invitation, mark.lien-invitation { color: #c4170c; font-weight: 700; background: #fff176; padding: 2px 4px; border-radius: 3px;
  box-decoration-break: clone; -webkit-box-decoration-break: clone; text-decoration: underline; text-decoration-color: #c4170c; }
a.lien-invitation:hover { background: #ffe94d; }
input.url-rouge { color: #c4170c; font-weight: 700; background: #fff9c4; border: 2px solid #d92d20; }
.btn.rouge { background: #d92d20; border-color: #d92d20; color: #fff; }
.btn.rouge:hover { background: #b42318; }
.message-apercu { white-space: pre-wrap; word-break: break-word; background: #fff; border: 1px solid #f1c4bf; border-radius: 7px; padding: 10px 12px; font-size: 13.5px; margin: 6px 0 10px; }
.badge.invitation { background: #fde2e0; color: #c4170c; box-shadow: inset 0 0 0 1px #f5a39b; }
/* bouton unique d'enregistrement de la fiche locataire */
.barre-enregistrer { position: sticky; bottom: 0; z-index: 20; margin-top: 18px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
  background: rgba(255,255,255,.96); border: 1px solid var(--line); border-radius: 10px; padding: 12px 16px; box-shadow: 0 -4px 18px rgba(31,58,95,.10); backdrop-filter: blur(4px); }
.btn.grand { padding: 11px 26px; font-size: 16px; font-weight: 600; }
form[id^="act-"] { display: none; }
div.decision { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
div.decision input { width: auto; margin: 0; padding: 5px 8px; font-size: 13px; flex: 1 1 120px; }
div.decision input[type=date] { flex: 0 0 auto; }

/* afficher / masquer le mot de passe */
.mdp-wrap { position: relative; display: block; margin-top: 5px; }
.mdp-wrap input { margin-top: 0 !important; padding-right: 46px !important; }
.mdp-oeil { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 38px; height: 34px; border: 0; background: transparent;
  color: var(--muted); cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 6px; padding: 0; }
.mdp-oeil:hover, .mdp-oeil:focus-visible { color: var(--primary); background: #eef2f7; outline: none; }
.mdp-oeil[aria-pressed="true"] { color: var(--primary-h); }
.mdp-majuscules { display: block; font-size: 12px; font-weight: 600; color: #b54708; margin-top: 4px; }
.copyrow .mdp-wrap { flex: 1; }

/* validation multiple */
.d-block { display: block; }
.legende { margin-left: 8px; }
.matrice-card { padding: 14px 0 6px; }
.matrice-outils { display: flex; gap: 8px; flex-wrap: wrap; padding: 0 16px 12px; }
table.matrice { border-collapse: separate; border-spacing: 0; min-width: 100%; }
table.matrice th, table.matrice td { padding: 6px 4px; text-align: center; border-bottom: 1px solid var(--line); }
table.matrice .col-nom { text-align: left; position: sticky; left: 0; background: #fff; z-index: 2; min-width: 190px; padding-left: 16px; box-shadow: 1px 0 0 var(--line); }
table.matrice .col-nom label.check { margin: 0; align-items: flex-start; }
th.col-mois { font-size: 11px; text-transform: none; letter-spacing: 0; min-width: 52px; }
th.col-mois label { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 0; font-weight: 600; color: var(--muted); cursor: pointer; }
th.col-mois input { margin: 0; }
th.courant, td.courant { background: #f5f9ff; }
td.cell { cursor: default; }
td.cell.a_valider { cursor: pointer; background: #fffaf0; }
td.cell.a_valider.coche { background: #e3f5ec; }
td.cell input[type=checkbox] { width: 18px; height: 18px; cursor: pointer; }
.cell-paye { color: var(--ok); font-weight: 700; text-decoration: none; font-size: 16px; }
.cell-vide { color: #c3cad3; }
.jour-input { display: inline-block !important; width: 64px !important; margin: 0 4px !important; padding: 4px 6px !important; }
.date-inline { display: inline-block !important; width: auto !important; margin: 0 0 0 6px !important; padding: 4px 8px !important; }

/* nom du locataire cliquable → fiche */
a.lien-loc { color: inherit; text-decoration: none; border-bottom: 1px dashed #9fb3cc; }
a.lien-loc:hover, a.lien-loc:focus-visible { color: var(--primary-h); border-bottom-style: solid; border-bottom-color: var(--primary-h); outline: none; }
a.avatar-lien { display: inline-flex; }

/* dates des quittances */
form.filtres { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
form.filtres label { margin: 0; flex: 1 1 160px; }
.regles { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.regles select, .regles input { margin-top: 6px; }
.regles-btn { grid-column: 1 / -1; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.dates-table input[type=date] { margin: 0; padding: 4px 6px; font-size: 13px; width: auto; }
.dates-table input.modifie { background: #fff7d6; border-color: #e0a800; font-weight: 600; }
@media (max-width: 700px) { .regles { grid-template-columns: 1fr; } }

/* un élément masqué reste masqué, quel que soit son style */
[hidden] { display: none !important; }

/* bandeau d'accueil de l'espace locataire */
.apercu-bandeau { background: #f1ecfb; color: #4b2f8f; border-radius: 8px; padding: 10px 14px; margin-bottom: 16px; font-size: 14px; }
.accueil { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; align-items: stretch;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-h) 100%); color: #fff; border-radius: 14px; padding: 24px; margin-bottom: 18px; }
.accueil h1 { color: #fff; margin: 0 0 10px; font-size: 26px; }
.accueil p { margin: 0 0 10px; color: #dbe6f3; line-height: 1.55; }
.accueil-premiere { display: flex; gap: 10px; align-items: flex-start; background: rgba(242,184,75,.18); border: 1px solid rgba(242,184,75,.55);
  color: #fff3d6; border-radius: 8px; padding: 9px 12px; margin-bottom: 12px; font-size: 14px; }
.accueil-fermer { margin-left: auto; background: none; border: 0; color: #fff3d6; font-size: 20px; line-height: 1; cursor: pointer; padding: 0 2px; }
.accueil-perso { background: rgba(255,255,255,.1); border-left: 3px solid #f2b84b; border-radius: 6px; padding: 10px 12px; font-size: 14.5px; white-space: pre-wrap; }
.accueil-perso-lab { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #f2b84b; margin-bottom: 4px; font-weight: 700; }
.accueil-tuiles { display: grid; gap: 10px; }
.tuile { display: flex; flex-direction: column; background: #fff; color: var(--text); border-radius: 10px; padding: 12px 14px; text-decoration: none; border-left: 4px solid #c8d1dc; }
.tuile.ok { border-left-color: var(--ok); } .tuile.alerte { border-left-color: #e8890c; }
.tuile-lab { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.tuile strong { font-size: 18px; margin: 2px 0; }
.tuile-sous { font-size: 13px; color: var(--muted); }
a.tuile:hover { box-shadow: 0 2px 10px rgba(0,0,0,.12); }
@media (max-width: 760px) { .accueil { grid-template-columns: 1fr; padding: 18px; } .accueil h1 { font-size: 22px; } }

/* ===== messages de confirmation en vert, erreurs en orange ===== */
.flash { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; }
.flash-ico { flex: none; font-weight: 800; }
.flash.ok { background: #e6f6ea; color: #146c2e; border: 2px solid #2e9e4f; }
.flash.error { background: #fff4e0; color: #8a4b00; border: 2px solid #f0a020; }
.toasts { position: fixed; top: 76px; right: 18px; z-index: 1000; display: flex; flex-direction: column; gap: 10px; max-width: min(420px, calc(100vw - 36px)); }
.toast { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; font-weight: 600; font-size: 14.5px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18); animation: toast-entree .35s ease-out; transition: opacity .4s, transform .4s; }
.toast.ok { background: #1f8a3c; color: #fff; }
.toast.error { background: #f59e0b; color: #1d1d1d; }
.toast.sortie { opacity: 0; transform: translateX(30px); }
.toast-x { margin-left: auto; background: none; border: 0; color: inherit; font-size: 20px; line-height: 1; cursor: pointer; opacity: .8; padding: 0 0 0 6px; }
.toast-x:hover { opacity: 1; }
@keyframes toast-entree { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@media (max-width: 640px) { .toasts { top: auto; bottom: 14px; right: 12px; left: 12px; max-width: none; } }
@media print { .toasts { display: none !important; } }

/* ===== validation multiple : mois avant l'entrée, bouton inactif ===== */
td.cell.avant { cursor: pointer; }
td.cell.avant input.cb-avant, input.cb-avant-leg { opacity: .45; }
td.cell.avant.coche { background: #e3f5ec; }
td.cell.avant.coche input.cb-avant { opacity: 1; }
input.cb-avant-leg { width: 13px; height: 13px; vertical-align: -2px; margin: 0 2px; }
.alerte-entree { color: #b45309; }
.flash.info-vm { background: #eef4ff; color: #1e3a5f; border: 2px solid #9db8e0; font-weight: 500; margin-bottom: 14px; }
.btn:disabled, button:disabled { opacity: .45; cursor: not-allowed; }

/* ===== listes lisibles : liste des locataires, tableaux en cartes sur téléphone ===== */
table.liste-loc .nomcell strong { word-break: normal; }
table.liste-loc tr.actuel td { background: #eef4ff; }
@media (max-width: 700px) {
  table.cartes thead { display: none; }
  table.cartes, table.cartes tbody, table.cartes tr, table.cartes td { display: block; width: 100%; }
  table.cartes tr { position: relative; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; margin: 0 0 10px; background: #fff; }
  table.cartes td { border: 0 !important; padding: 3px 0; text-align: left !important; }
  table.cartes td:empty { display: none; }
  table.cartes td[data-label]::before { content: attr(data-label) " : "; color: var(--muted); font-size: 13px; }
  table.cartes td.cbcol { position: absolute; top: 12px; right: 12px; width: auto; padding: 0; }
  table.cartes td.cbcol + td { padding-right: 34px; }
  table.cartes .actions, table.cartes form.actions { justify-content: flex-start !important; flex-wrap: wrap; margin-top: 6px; }
  table.cartes td.right form.inline.actions input[type=date] { flex: 1 1 140px; }
}

/* ===== modèles de quittance ===== */
.mt-s { margin-top: 8px; }
.actions.gauche { justify-content: flex-start; flex-wrap: wrap; }
.lab { font-weight: 600; font-size: 14px; margin: 4px 0 6px; }
.nouveau-modele .nom-nouveau { max-width: 420px; }
.choix-mises { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 6px 0 10px; }
.choix-mises.compact { gap: 10px; }
.tuile-mise { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 10px; border: 2px solid var(--line);
  border-radius: 12px; background: #fff; cursor: pointer; text-align: center; font: inherit; color: inherit; transition: border-color .15s, box-shadow .15s; }
.tuile-mise:hover { border-color: #9db8e0; box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.tuile-mise.choisie { border-color: var(--primary, #1e3a5f); box-shadow: 0 0 0 3px rgba(30,58,95,.12); }
.tuile-mise input[type=radio] { position: absolute; opacity: 0; pointer-events: none; }
.compact .tuile-mise { padding: 10px 6px; }
.croquis { position: relative; width: 92px; aspect-ratio: 210 / 297; background: #fff; border: 1px solid #cfd6df; border-radius: 3px;
  box-shadow: 0 2px 6px rgba(0,0,0,.12); padding: 7px 8px; display: flex; flex-direction: column; gap: 3px; overflow: hidden; flex: none; }
.compact .croquis { width: 70px; padding: 5px 6px; }
.croquis i.l { display: block; height: 2px; background: #c3cad3; border-radius: 1px; }
.croquis i.l.court { width: 55%; }
.croquis .cq-logo { display: block; width: 26%; height: 6px; background: #d9a400; border-radius: 1px; opacity: .8; }
.croquis .cq-logo.centre { margin: 0 auto 2px; }
.croquis .cq-titre { height: 8px; background: var(--c); border: 1px solid #555; margin-bottom: 2px; }
.croquis .cq-cadre { height: 14px; border: 1px solid #777; margin: 2px 0; }
.croquis .cq-cadre.petit { height: 8px; width: 85%; }
.croquis .cq-sig { margin-top: auto; width: 38%; height: 7px; border-bottom: 1.5px solid #2a4a8a; border-radius: 0 0 40% 10%; }
.croquis .cq-sig.droite { align-self: flex-end; }
.croquis .cq-sig.decale { margin-left: 52%; }
.croquis.moderne { padding-top: 0; }
.croquis .cq-bandeau { margin: 0 -8px 4px; height: 20px; background: var(--c); display: flex; align-items: center; justify-content: space-between; padding: 0 6px; }
.compact .croquis .cq-bandeau { margin: 0 -6px 3px; height: 15px; }
.croquis .cq-bandeau .cq-logo { width: 30%; height: 7px; background: #fff; }
.croquis .cq-bandeau .cq-t { width: 34%; height: 3px; background: rgba(255,255,255,.85); }
.croquis .cq-blocs { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; margin-bottom: 3px; }
.croquis .cq-blocs span { height: 9px; background: #eef1f5; border-left: 2px solid var(--c); }
.croquis .cq-table { display: flex; flex-direction: column; gap: 1px; margin-top: 3px; }
.croquis .cq-table i { height: 4px; background: #eef1f5; }
.croquis .cq-table i.tot { background: var(--c); }
.croquis .cq-logo.petit { width: 22%; height: 5px; margin-bottom: 2px; }
.croquis i.l.decale { margin-left: 45%; }
.croquis i.l.obj { width: 70%; background: #8a929c; margin-top: 3px; }
.croquis .cq-trait { display: block; width: 25%; height: 2px; background: var(--c); margin-bottom: 2px; }
.croquis .cq-pts { display: flex; flex-direction: column; gap: 2px; margin: 3px 0 0 6%; width: 70%; }
.croquis .cq-pts i { height: 1px; border-bottom: 1px dotted #999; }
.liste-modeles { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 16px; }
.modele-carte { display: flex; gap: 18px; align-items: flex-start; margin: 0; }
.modele-carte.defaut { border: 2px solid #9fd8b4; }
.modele-entete { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.modele-entete h3 { margin: 0; font-size: 17px; }
.modele-entete h3 a { color: inherit; text-decoration: none; }
.modele-infos { flex: 1; min-width: 0; }
.sig-choix { display: flex; flex-direction: column; gap: 2px; margin-top: 6px; }
.sig-fichier { margin: 0 0 6px 28px; }
.sig-apercu { margin-top: 10px; padding: 10px; background: #f7f8fa; border-radius: 8px; display: flex; gap: 12px; align-items: center; }
.sig-apercu img { max-height: 60px; max-width: 220px; }
.liste-cases { display: flex; flex-direction: column; gap: 2px; max-height: 360px; overflow: auto; }
.nouveau-log { margin: 8px 0 4px; padding: 12px 14px; background: #f5f8fc; border: 1px dashed #9db8e0; border-radius: 10px; }
.nouveau-log summary { cursor: pointer; font-weight: 600; color: #1e3a5f; }
@media (max-width: 700px) {
  .choix-mises { grid-template-columns: 1fr; }
  .choix-mises.compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .liste-modeles { grid-template-columns: 1fr; }
  .modele-carte { flex-direction: column; align-items: center; text-align: center; }
  .modele-carte .actions { justify-content: center; }
}

/* ===== message d'assistance (accès au site) ===== */
.aide-acces { display: flex; gap: 10px; align-items: flex-start; margin-top: 16px; padding: 10px 14px; border-radius: 10px;
  background: #eef4ff; border: 1px solid #c9d9f2; color: #1e3a5f; font-size: 13.5px; line-height: 1.5; }
.aide-acces .aide-ico { flex: none; font-weight: 700; font-size: 15px; }
.fiche-aide { margin-top: 10px; padding-top: 8px; border-top: 1px dashed #bbb; }

/* ===== historique complet des loyers (espace locataire) ===== */
details.annee-histo { border-top: 1px solid var(--line); padding: 10px 0; }
details.annee-histo:first-of-type { border-top: 0; }
details.annee-histo summary { cursor: pointer; display: flex; gap: 12px; align-items: baseline; font-size: 16px; list-style: none; }
details.annee-histo summary::before { content: "▸"; color: var(--muted); transition: transform .15s; display: inline-block; }
details.annee-histo[open] summary::before { transform: rotate(90deg); }
details.annee-histo summary::-webkit-details-marker { display: none; }

/* ===== connexion à la place d'un locataire / super admin ===== */
.imp-bandeau { background: #b45309; color: #fff; position: sticky; top: 0; z-index: 900; }
.imp-bandeau .wrap { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; font-size: 14px; }
.imp-bandeau .btn { background: #fff; color: #7c2d12; border-color: #fff; font-weight: 700; }
.btn.imp-btn { border-color: #d97706; color: #92400e; }
.badge.proprio { background: #fff4d6; color: #8a5a00; }
.lien-details { cursor: pointer; font-weight: 600; color: var(--primary-h); }
.droit-form { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid var(--line); text-align: left; }
body:has(.imp-bandeau) .toasts { top: 132px; }
@media (max-width: 640px) { body:has(.imp-bandeau) .toasts { top: auto; } }

/* ===== RGPD : page « Vos données personnelles » ===== */
.pied { text-align: center; padding: 18px 16px 26px; font-size: 13px; }
.pied a { color: var(--muted); text-decoration: none; }
.pied a:hover { text-decoration: underline; }
.rgpd { max-width: 920px; margin: 0 auto; }
.rgpd-entete { display: flex; gap: 18px; align-items: flex-start; margin-bottom: 16px; }
.rgpd-entete h1 { margin: 0 0 6px; }
.rgpd-bouclier { flex: none; width: 58px; height: 58px; border-radius: 16px; background: #e3f5ec; display: grid; place-items: center; font-size: 28px; }
.rgpd-promesses { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.rgpd-promesses .card { margin: 0; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.rgpd-promesses .card span { color: var(--muted); font-size: 13px; line-height: 1.45; }
.rgpd-liste li { margin: 4px 0; }
.rgpd-texte h2 { font-size: 17px; margin: 20px 0 8px; }
.rgpd-texte h2:first-child { margin-top: 0; }
.rgpd-table td { vertical-align: top; }
.rgpd-encart { display: flex; gap: 12px; margin-top: 22px; padding: 14px 16px; border-radius: 12px; background: #eef8f2; border: 1px solid #bfe3cd; font-size: 14px; }
.rgpd-encart .rgpd-ico { font-size: 22px; }
@media (max-width: 1040px) { .rgpd-promesses { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .rgpd-promesses { grid-template-columns: 1fr; } .rgpd-entete { flex-direction: column; } }

/* ===== connexion par lien sécurisé ===== */
.acces-lien { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--line); }
.acces-lien h3 { margin: 0 0 4px; font-size: 15px; }
.acces-qr-ligne { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.acces-print { flex: 0 0 260px; text-align: center; border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fff; }
.acces-print h3 { font-size: 15px; margin: 6px 0; }
.acces-print .fiche-logo { width: 150px; margin: 0 auto 6px; display: block; }
.acces-qr svg { width: 180px; height: 180px; }
.acces-actions { flex: 1; min-width: 260px; }
.lien-court { word-break: break-all; font-size: 11px; }
.acces-direct { text-align: center; }
.acces-direct .grand { font-size: 18px; padding: 14px; }
@media print {
  body.imprime-acces .fiche-acces, body.imprime-acces #lien-acces-affiche > h2, body.imprime-acces #lien-acces-affiche > p,
  body.imprime-acces .acces-actions { display: none !important; }
  body.imprime-acces .grid > div > #lien-acces-affiche { display: block !important; border: 0; box-shadow: none; }
  body.imprime-acces .acces-print { margin: 30px auto; max-width: 480px; border: 2px solid #1f3a5f; padding: 30px; }
  body.imprime-acces .acces-qr svg { width: 260px; height: 260px; }
  body.imprime-acces .lien-court { font-size: 13px; }
}
@media print {
  body.imprime-acces { background: #fff; }
  body.imprime-acces > *:not(main), body.imprime-acces main > *:not(.grid), body.imprime-acces .grid > *:not(:first-child),
  body.imprime-acces .grid > div > *:not(#lien-acces-affiche) { display: none !important; }
  body.imprime-acces #lien-acces-affiche { background: #fff !important; }
  body.imprime-acces .acces-print { flex: none; }
}

/* ===== consommation eau / électricité ===== */
.conso-grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 16px; }
.conso-carte { margin: 0 0 16px; }
.conso-grille .conso-carte { margin: 0; }
.conso-entete { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.conso-entete h3 { margin: 0; font-size: 17px; }
.conso-ico { font-size: 20px; }
.conso-etat { font-size: 13px; font-weight: 600; padding: 3px 10px; border-radius: 999px; color: #0b0b0b; }
.conso-etat b { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: #fff; font-size: 11px; margin-right: 4px; }
.etat-bon { background: #e3f5ec; } .etat-bon b { background: #0ca30c; }
.etat-attention { background: #fff4d6; } .etat-attention b { background: #c98500; }
.etat-alerte { background: #fde8e7; } .etat-alerte b { background: #d03b3b; }
.etat-neutre { background: #eef4ff; } .etat-neutre b { background: #2a78d6; }
.conso-haut { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.jauge { width: 200px; flex: none; }
.jauge-pct { font-size: 26px; font-weight: 700; fill: #0b0b0b; }
.jauge-sous { font-size: 11px; fill: #52514e; }
.jauge-repere { font-size: 9px; fill: #52514e; text-anchor: middle; }
.conso-chiffres { flex: 1; min-width: 200px; }
.conso-hero { font-size: 30px; font-weight: 700; line-height: 1.1; }
.conso-hero span { font-size: 15px; font-weight: 500; color: var(--muted); }
.conso-ligne { font-size: 13.5px; margin-top: 4px; }
.conso-graph { margin-top: 14px; }
.conso-graph svg { width: 100%; height: auto; display: block; }
.g-grille { stroke: #e1e0d9; stroke-width: 1; }
.g-base { stroke: #c3c2b7; stroke-width: 1; }
.g-axe { font-size: 11px; fill: #898781; font-variant-numeric: tabular-nums; }
.g-val { font-size: 12px; font-weight: 700; fill: #0b0b0b; }
.g-objectif { stroke: #0b0b0b; stroke-width: 1.5; }
.g-objectif-txt { fill: #52514e; }
.g-barre { cursor: pointer; outline: none; }
.g-barre:hover path, .g-barre:focus path { opacity: .8; }
.conso-legende { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12.5px; color: #52514e; margin-top: 6px; }
.conso-legende i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.conso-legende i.trait { height: 2px; width: 16px; background: #0b0b0b; border-radius: 0; vertical-align: 3px; }
.conso-table { margin-top: 8px; font-size: 13px; }
.conso-table summary, .conso-conseils summary { cursor: pointer; color: var(--primary-h); font-weight: 600; font-size: 13.5px; }
.conso-conseils { margin-top: 12px; padding: 10px 12px; background: #f5f8fc; border-radius: 10px; }
.conso-conseils ul { margin: 8px 0 0; padding-left: 20px; font-size: 13.5px; }
.conso-tarif { margin: 10px 0 0; }
.g-bulle { position: fixed; z-index: 2000; pointer-events: none; background: #fff; border: 1px solid rgba(11,11,11,.12); border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0,0,0,.15); padding: 8px 12px; display: flex; flex-direction: column; gap: 1px; font-size: 12.5px; max-width: 260px; }
.g-bulle strong { order: 2; font-weight: 500; color: #52514e; }
.g-bulle span { order: 1; font-size: 15px; font-weight: 700; color: #0b0b0b; }
.g-bulle em { order: 3; font-style: normal; color: #52514e; }
.g-bulle small { order: 4; color: #0b0b0b; }
.releve-form.row, .conso-admin form.row { flex-wrap: wrap; } .releve-form .full, .conso-admin .full { flex-basis: 100%; }
@media (max-width: 520px) { .conso-grille { grid-template-columns: 1fr; } .jauge { width: 170px; margin: 0 auto; } .conso-hero { font-size: 26px; } }

/* v3.26 : jauges par locataire, source des tarifs */
.jauges-bascule{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tarif-source{background:#eef4fb;border-radius:8px;padding:8px 10px;color:#1f3b5c}
.mb-s{margin-bottom:8px}
.depot-doc{border-top:1px solid var(--border,#e3e7ee);padding-top:14px}
.tarifs-resume{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 10px}
.tarifs-resume .tarif{background:#f4f6fa;border-radius:10px;padding:8px 12px;min-width:140px}
.tarifs-resume .tarif strong{display:block;font-size:1.15em}
.tarif-verif{font-size:.85em}

/* v3.29 : grille de comparaison des consommations */
.conso-comp{margin-top:16px}
.comp-tete{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
.comp-tete h3{margin:0;flex:1 1 100%}
.seg{display:inline-flex;border:1px solid #d5dbe5;border-radius:8px;overflow:hidden}
.seg button{border:0;background:transparent;padding:6px 12px;font:inherit;font-size:.9em;cursor:pointer;color:inherit}
.seg button+button{border-left:1px solid #d5dbe5}
.seg button.actif{background:#1f3b5c;color:#fff}
.conso-comp[data-mode="q"] .v-e,.conso-comp[data-mode="e"] .v-q{display:none}
.comp-resume{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:12px}
.comp-tuile{background:#f4f6fa;border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.comp-tuile strong{font-size:1.2em}
.table-defile{overflow-x:auto;-webkit-overflow-scrolling:touch}
.grille-comp{border-collapse:separate;border-spacing:2px;width:100%;min-width:320px}
.grille-comp th,.grille-comp td{padding:6px 8px;white-space:nowrap}
.grille-comp thead th{font-size:.85em;color:#5b6573;font-weight:600;border-bottom:1px solid #e3e7ee}
.grille-comp tbody th{font-weight:500;text-align:left}
.grille-comp td.num{border-radius:4px}
.grille-comp .pic{font-size:.8em;margin-right:4px;opacity:.85}
.cell-bon{background:#e3f4e3}.cell-attention{background:#fdf0d2}.cell-alerte{background:#f8dede}.cell-neutre{background:#eef3fb}
.grille-comp td.partiel{opacity:.75}
.grille-comp tfoot th,.grille-comp tfoot td{border-top:1px solid #d5dbe5;padding-top:8px;vertical-align:top}
.var{font-weight:600}.var-baisse{color:#0a7d0a}.var-alerte{color:#b02a2a}
.legende-comp{display:flex;flex-wrap:wrap;gap:6px 14px;margin:10px 0 4px}
.legende-comp i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.pt-bon{background:#0ca30c}.pt-attention{background:#fab219}.pt-alerte{background:#d03b3b}
.grille-comp th{text-transform:none;letter-spacing:0}
.grille-comp tbody th,.grille-comp tfoot th,.grille-comp thead th:first-child{position:sticky;left:0;background:#fff;z-index:1}
.grille-comp .col-var{background:#f7f8fb}
@media (max-width:600px){.grille-comp th,.grille-comp td{padding:5px 6px;font-size:.9em}.grille-comp .pic{margin-right:2px}}

/* v3.30 : pages logements */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:20px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.kpi strong{font-size:22px;line-height:1.2}
.kpi-lab,.etat-lab{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.kpi-sous{font-size:13px;color:var(--muted)}
.kpi-alerte{border-color:#f3d48f;background:#fffaf0}
.cartes-logements{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;align-items:start}
.carte-log{display:flex;flex-direction:column;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;color:var(--text);text-decoration:none;transition:box-shadow .15s,transform .15s;position:relative}
a.carte-log:hover{box-shadow:0 6px 22px rgba(31,58,95,.12);transform:translateY(-2px)}
a.carte-log:focus-visible{outline:3px solid #9fb8d8}
.carte-log.vacant{background:#fafbfc}
.carte-log-tete{display:flex;gap:12px;align-items:flex-start}
.carte-log-tete>div{flex:1;min-width:0}
.carte-log-tete strong{font-size:17px}
.carte-log-ico,.log-ico{font-size:22px;width:42px;height:42px;border-radius:12px;background:#e8eef6;display:inline-flex;align-items:center;justify-content:center;flex:none}
.carte-log-loyer strong{font-size:20px}
.carte-log-occ{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.occ{display:flex;align-items:center;gap:10px}
.carte-log-pied{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.carte-log-voir{font-size:13px;color:var(--primary-h);font-weight:600;margin-top:auto}
.carte-log-ajout{border-style:dashed;background:transparent}
.carte-log-ajout summary{cursor:pointer;display:flex;align-items:center;gap:10px;list-style:none;color:var(--primary)}
.carte-log-ajout summary::-webkit-details-marker{display:none}
.carte-log-ajout .plus{width:42px;height:42px;border-radius:12px;background:#e8eef6;display:inline-flex;align-items:center;justify-content:center;font-size:22px}
.avatar.petit{width:28px;height:28px;font-size:13px}
.avatar.grand{width:52px;height:52px;font-size:20px}
.fil{margin:-8px 0 10px;font-size:14px}
.log-entete{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.log-entete h1{margin:0}
.log-titre{flex:1;min-width:200px}
.log-ico{width:54px;height:54px;font-size:28px;border-radius:14px}
.badge.gros{font-size:14px;padding:5px 14px}
h2.sec{margin:26px 0 12px;font-size:18px}
.cartes-loc{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.carte-loc{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:14px}
.carte-loc-tete{display:flex;gap:14px;align-items:center}
.carte-loc-nom{font-size:18px;font-weight:700;color:var(--text);text-decoration:none}
.carte-loc-nom:hover{color:var(--primary-h);text-decoration:underline}
.carte-loc-infos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:14px;word-break:break-word}
.carte-loc-etats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.etat{background:#f4f6fa;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:1px;border-left:4px solid #c8d1dc;min-width:0}
.etat strong{font-size:14px}
.etat .small{color:var(--muted)}
.etat-ok{border-left-color:#0ca30c}.etat-attention{border-left-color:#fab219}.etat-alerte{border-left-color:#d03b3b;background:#fdf3f2}
@media (max-width:420px){.carte-loc-etats{grid-template-columns:1fr 1fr}}
.empty-doux{text-align:center;padding:26px;color:var(--text)}
.conso-mini{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.conso-mini-tuile{background:#f4f6fa;border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.conso-mini-tuile strong{font-size:18px}
.point-etat{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:0}
.modif-log summary{cursor:pointer}
.cartes-loc{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
@media (min-width:760px){
  .carte-loc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);grid-template-areas:"tete etats" "infos etats" "chips chips";gap:12px 24px}
  .carte-loc-tete{grid-area:tete}.carte-loc-infos{grid-area:infos}.carte-loc-etats{grid-area:etats;align-self:start}.carte-loc>.chips{grid-area:chips}
  .cartes-loc:has(.carte-loc+.carte-loc) .carte-loc{display:flex}
}
.conso-comp .comp-tete h3:only-child{display:none}

/* v3.31 : balance des loyers */
.jauge-lin{display:block;height:8px;border-radius:99px;background:#e6eaf0;overflow:hidden;margin:6px 0 4px;min-width:90px}
.jauge-lin>span{display:block;height:100%;border-radius:99px;background:#9aa6b5}
.jauge-lin.solde>span,.jauge-lin.a_valider>span{background:#0ca30c}
.jauge-lin.partiel>span{background:#fab219}
.jauge-lin.attente>span{background:#d03b3b}
.mois-encours{background:#f4f6fa;border-radius:12px;padding:12px 14px;margin-top:12px}
.mois-encours-tete{display:flex;justify-content:space-between;align-items:center;gap:8px}
.mois-encours .jauge-lin{height:12px}
.kpis-serres{margin-bottom:0}
.kpis-serres .kpi{background:#fafbfc}
.balance-table tr.futur td{color:var(--muted)}
.v-info{margin:-6px 0 12px;color:var(--primary)}
.txt-danger{color:var(--danger)}
.solde-loc strong,.balance-table .num,.mois-encours strong{white-space:nowrap}
.balance-table td[data-label="État"]{white-space:nowrap}
.copie-bandeau{background:#fff3cd;color:#6b4e00;text-align:center;padding:8px 16px;font-size:14px;border-bottom:1px solid #f0d78c}

/* v3.35 : créateur de logo */
.cl-couleurs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}
.cl-pastille{margin:0;cursor:pointer}
.cl-pastille input{position:absolute;opacity:0;width:1px;height:1px}
.cl-pastille span{display:block;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)}
.cl-pastille input:checked+span{outline:3px solid #f2b84b;outline-offset:2px}
.cl-pastille input:focus-visible+span{outline:3px solid #9fb8d8;outline-offset:2px}
.cl-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:12px}
.cl-carte{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.cl-carte canvas.cl-clair,.cl-carte canvas.cl-fonce{width:100%;height:auto;display:block;padding:10px 14px;box-sizing:border-box}
.cl-carte canvas.cl-clair{background:#f7f8fb}
.cl-pied{display:flex;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid var(--line)}
.cl-pied strong{flex:1}
.cl-icone{width:40px;height:40px;border-radius:9px}
.row-couleur{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.row-couleur input[type=color]{width:70px;height:38px;padding:2px}

/* v3.37 : en-tête agrandi (grand logo) + barre d'onglets avec icônes */
.top .wrap.entete{min-height:88px;flex-wrap:nowrap;gap:16px}
.top .brand{padding:10px 0}
.top .brand img{height:68px;max-width:min(62vw,420px);object-fit:contain}
.entete-droite{display:flex;align-items:center;gap:14px;margin-left:auto}
.qui{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.82);font-size:14px}
.qui .ico{width:18px;height:18px}
.btn-sortie{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:999px;padding:7px 14px;font:inherit;font-size:14px;cursor:pointer}
.btn-sortie:hover{background:rgba(255,255,255,.2)}
.btn-sortie .ico{width:17px;height:17px}
nav.onglets{display:block;background:rgba(0,0,0,.18);border-top:1px solid rgba(255,255,255,.08)}
nav.onglets .wrap{display:flex;gap:2px;align-items:stretch;overflow-x:auto;scrollbar-width:none;padding-top:0;padding-bottom:0}
nav.onglets .wrap::-webkit-scrollbar{display:none}
.onglet{display:flex;align-items:center;gap:8px;padding:13px 14px 12px;color:rgba(255,255,255,.78);text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap;border-bottom:3px solid transparent;border-radius:8px 8px 0 0;background:none;border-top:0;border-left:0;border-right:0;font-family:inherit;cursor:pointer;position:relative}
.onglet .ico{width:19px;height:19px;flex:none;opacity:.9}
.onglet:hover{color:#fff;background:rgba(255,255,255,.08)}
.onglet.actif{color:#fff;background:rgba(255,255,255,.12);border-bottom-color:#f2b84b;font-weight:600}
.onglet .pastille{margin-left:2px}
.onglet-sortie{display:none}
.ico{display:inline-block;vertical-align:middle}
@media (max-width:1180px) and (min-width:1041px){.onglet{padding:12px 10px;font-size:14px;gap:6px}.onglet .ico{width:17px;height:17px}}
@media (max-width:1040px){
  .entete-droite{display:none}
  .top .wrap.entete{min-height:72px}
  .top .brand img{height:54px}
  nav.onglets{display:none}
  body.menu-ouvert nav.onglets{display:block}
  nav.onglets .wrap{flex-direction:column;overflow:visible;padding:6px 16px 14px}
  .onglet{border-radius:10px;border-bottom:0;padding:12px 12px;font-size:16px}
  .onglet.actif{background:rgba(255,255,255,.14);box-shadow:inset 4px 0 0 #f2b84b}
  .onglet-sortie{display:block}
  .onglet-sortie .onglet{width:100%}
}
@media (max-width:640px){.top .brand img{height:48px}}
.login-logo{max-width:360px}
@media (min-width:1041px){
  .top .wrap.entete,nav.onglets .wrap{max-width:1280px}
  nav.onglets .wrap{flex-wrap:wrap;justify-content:center;overflow:visible}
  .onglet{padding:12px 12px 11px}
}
nav.onglets .onglet-sortie{display:none}
@media (min-width:1041px){.onglet{padding:12px 10px 11px;font-size:14.5px;gap:7px}}
@media (min-width:1041px) and (max-width:1250px){.onglet{padding:11px 8px 10px;font-size:13.5px;gap:5px}.onglet .ico{width:16px;height:16px}}
@media (max-width:1040px){nav.onglets .onglet-sortie{display:block}}
@media (min-width:1041px) and (max-width:1199px){.onglet .ico{display:none}.onglet{padding:11px 9px 10px;font-size:14px}}
/* v3.38 : emblèmes prêts à l'emploi */
.cl-emblemes{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 14px}
.cl-emb{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 12px 6px 6px;cursor:pointer;font:inherit;font-size:13.5px;color:var(--text)}
.cl-emb img{width:44px;height:44px;object-fit:contain;background:#f4f6f9;border-radius:8px}
.cl-emb:hover{border-color:#c9d3df}
.cl-emb[aria-pressed="true"]{border-color:#d39a1e;box-shadow:0 0 0 2px #f2d08a}
.cl-emb-aucun{padding:6px 14px}
/* v3.39 : droits par onglet */
.bandeau-lecture{background:#eef4fb;border:1px solid #c9dbf0;color:#1f3b5c;border-radius:10px;padding:10px 14px;margin:0 0 16px;font-size:14px}
main.lecture-seule button[disabled],main.lecture-seule input[disabled],main.lecture-seule select[disabled],main.lecture-seule textarea[disabled]{opacity:.55;cursor:not-allowed}
.droits-grille{width:100%;border-collapse:collapse;margin:8px 0 10px}
.droits-grille th,.droits-grille td{padding:6px 6px;border-bottom:1px solid var(--line);font-size:13.5px;text-align:left}
.droits-grille td.niv{text-align:center;width:72px}
.droits-grille th.niv{text-align:center;font-size:12px;color:var(--muted);font-weight:600}
.droits-grille .ico{width:16px;height:16px;margin-right:6px;color:var(--muted)}
.droits-grille input[type=radio]{width:18px;height:18px;accent-color:var(--primary)}
.droits-profils{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 6px}
.droits-resume{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.droits-resume .badge{font-weight:500}
.badge.voir{background:#eef4fb;color:#1f3b5c}
.compte-panel{min-width:min(460px,86vw)}
.compte-carte{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;background:#fff}
.compte-carte.inactive{opacity:.7}
.compte-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px 14px;list-style:none;cursor:pointer}
div.compte-carte .compte-tete{cursor:default}
.compte-tete::-webkit-details-marker{display:none}
details.compte-carte[open]>.compte-tete{border-bottom:1px solid var(--line);background:#fafbfd;border-radius:12px 12px 0 0}
details.compte-carte>.compte-panel{padding:14px;min-width:0}
.compte-panel .droits-grille{max-width:560px}
.etapes-restau{margin:0 0 10px;padding-left:20px}.etapes-restau li{margin-bottom:6px}
/* v3.44 : main levée */
.badge.ml{background:#fff1d6;color:#8a5a00;box-shadow:inset 0 0 0 1px #f2d08a}
.ml-info{margin-top:4px;color:var(--muted)}
.lien-btn{background:none;border:0;padding:0;color:var(--primary-h);text-decoration:underline;cursor:pointer;font:inherit;font-size:12.5px}
tr.ml-ligne td{border-top:0;padding-top:0}
.ml-details summary{list-style:none;display:inline-block}
.ml-details summary::-webkit-details-marker{display:none}
.ml-form{background:#fffaf0;border:1px solid #f2d08a;border-radius:10px;padding:12px 14px;margin-top:8px}
.ml-form label.carte{align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-bottom:8px;font-weight:400}
.jauge-lin.main_levee>span{background:#d39a1e}

/* ---- maintenance ---- */
.maint-bandeau{padding:.6rem 0;font-size:.95rem;border-bottom:1px solid rgba(0,0,0,.08)}
.maint-bandeau .wrap{display:flex;gap:.8rem;align-items:center;justify-content:space-between;flex-wrap:wrap}
.maint-bandeau.annonce{background:#fff6dc;color:#6b4e00}
.maint-bandeau.ferme{background:#fde8e4;color:#8a2416}
.maint-page{text-align:center}
.maint-page .maint-icone{font-size:3rem;line-height:1;margin:.4rem 0 .2rem}
.maint-page .maint-texte{font-size:1.1rem;white-space:pre-line}
.maint-page .maint-fin{background:#f4f6f9;border-radius:8px;padding:.5rem .8rem;display:inline-block}
.maint-page .btn{margin:.3rem}
.maint-choix{display:grid;gap:.35rem;margin:.3rem 0 .8rem}
.maint-choix label.check{align-items:flex-start}
.badge.rouge{background:var(--danger-bg);color:var(--danger)}

/* ---- bouton rapide de maintenance (en-tête) ---- */
.maint-rapide{position:relative}
.maint-rapide>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:99px;
  background:rgba(255,255,255,.12);color:#fff;font-size:14px;font-weight:600;user-select:none}
.maint-rapide>summary::-webkit-details-marker{display:none}
.maint-rapide>summary:hover{background:rgba(255,255,255,.22)}
.maint-rapide.actif.annonce>summary{background:#f6c445;color:#3d2b00}
.maint-rapide.actif.ferme>summary{background:#d9472b;color:#fff}
.maint-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;background:#fff;color:var(--text);border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);padding:10px;min-width:250px;display:grid;gap:4px}
.maint-menu .muted{padding:2px 8px 6px}
.maint-menu button,.maint-menu a{all:unset;cursor:pointer;padding:8px 10px;border-radius:8px;font-size:14px;color:var(--text)}
.maint-menu button:hover,.maint-menu a:hover{background:#f1f4f8}
.maint-menu .ouvrir{background:var(--ok-bg);color:var(--ok);font-weight:600}
.maint-menu a{border-top:1px solid var(--line);margin-top:4px;padding-top:10px;color:var(--primary)}
@media (max-width:600px){.maint-rapide>summary span{display:none}.maint-menu{right:-60px}}

/* ---- Centre de contrôle ---- */
.ctrl-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.ctrl-tete h1{margin-bottom:2px}
.ctrl-etats{display:flex;gap:8px;flex-wrap:wrap}
.ctrl-pill{padding:6px 12px;border-radius:99px;font-size:13px;font-weight:600;background:#eef1f5}
.ctrl-pill.vert{background:var(--ok-bg);color:var(--ok)}
.ctrl-pill.orange{background:var(--warn-bg);color:var(--warn)}
.ctrl-pill.rouge{background:var(--danger-bg);color:var(--danger)}
.ctrl-sommaire{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 16px}
.ctrl-sommaire a{padding:6px 12px;border-radius:99px;background:#fff;border:1px solid var(--line);font-size:13px;text-decoration:none;color:var(--text)}
.ctrl-sommaire a:hover{border-color:var(--primary);color:var(--primary)}
.ctrl-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.ctrl-grille>.card{margin:0;scroll-margin-top:16px}
.ctrl-grille>.card.large{grid-column:1/-1}
@media (max-width:900px){.ctrl-grille{grid-template-columns:1fr}}
.ctrl-boutons{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 6px}
.ctrl-boutons .inline{margin:0}
.btn.danger-doux{background:#fff;color:var(--danger);border-color:#f1c4bf}
.btn.danger-doux:hover{background:var(--danger-bg)}
.point{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;background:#b8c0cc;vertical-align:middle;flex:none}
.point.vert{background:#22a06b}.point.orange{background:#e2a400}.point.rouge{background:#d9472b}
.sante-liste{display:grid;gap:10px}
.sante-ligne{display:grid;grid-template-columns:auto 130px 1fr;align-items:center;column-gap:4px;row-gap:4px;font-size:14px}
.sante-ligne .jauge-sante{grid-column:2/-1;height:6px;border-radius:99px;background:#edf0f4;overflow:hidden}
.jauge-sante i{display:block;height:100%;border-radius:99px;background:#22a06b}
.jauge-sante i.orange{background:#e2a400}.jauge-sante i.rouge{background:#d9472b}
@media (max-width:520px){.sante-ligne{grid-template-columns:auto 1fr}.sante-ligne>.muted{grid-column:1/-1;padding-left:18px}.sante-ligne .jauge-sante{grid-column:1/-1;margin-left:18px}}
.ops-liste{display:grid;gap:6px}
.op{border:1px solid var(--line);border-radius:10px;padding:8px 12px;background:#fff}
.op>summary{cursor:pointer;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.op.op-en_cours,.op.op-attente{border-color:#f2d08a;background:#fffaf0}
.op.op-erreur,.op.op-refus{border-color:#f1c4bf}
.op-sortie{white-space:pre-wrap;font-size:12px;background:#f6f8fa;border-radius:8px;padding:10px;margin:8px 0 0;max-height:320px;overflow:auto}
table.compact td,table.compact th{padding:6px 8px}
.maj-detail{margin:6px 0}
.maj-detail table{margin-top:8px}
form.ban{display:inline-flex;gap:6px;align-items:center;margin:2px 10px 2px 0}
input.court{width:80px;display:inline-block}
@media (min-width:1041px){nav.onglets.nombreux .onglet{padding:11px 7px 10px;font-size:13.5px;gap:5px}nav.onglets.nombreux .onglet .ico{width:16px;height:16px}}
@media (min-width:1200px) and (max-width:1300px){nav.onglets.nombreux .onglet .ico{display:none}}

/* ---- import de locataires ---- */
.imp-etapes{display:flex;gap:8px;list-style:none;padding:0;margin:4px 0 16px;flex-wrap:wrap}
.imp-etapes li{padding:6px 14px;border-radius:99px;background:#eef1f5;color:var(--muted);font-size:14px}
.imp-etapes li.actif{background:var(--primary);color:#fff;font-weight:600}
.imp-etapes li.fait{background:var(--ok-bg);color:var(--ok)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.grid2>.card{margin:0}
@media (max-width:820px){.grid2{grid-template-columns:1fr}}
.depot{display:block;border:2px dashed #c9d2de;border-radius:12px;padding:22px;text-align:center;background:#fafbfd;cursor:pointer}
.depot span{display:block;margin-top:8px;color:var(--muted);font-size:13px}
.table-scroll{overflow-x:auto}
.imp-table tr.imp-err td{background:#fff6f5}
.txt-err{color:var(--danger)}.txt-ok{color:var(--ok);font-weight:700}
.lien-copie{width:100%;min-width:220px;font-size:12px;padding:6px 8px}

/* ---- sécurité du compte ---- */
a.qui{color:inherit;text-decoration:none;border-radius:99px;padding:4px 8px}
a.qui:hover{background:rgba(255,255,255,.12)}
.pastille-secu{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;background:#f6c445;color:#3d2b00;font-size:11px;font-weight:800;margin-left:2px}
.code-2fa{font-size:22px;letter-spacing:4px;text-align:center;font-variant-numeric:tabular-nums}
.ligne-code{display:flex;gap:8px;align-items:center;margin-top:6px}.ligne-code .code-2fa{max-width:170px;margin:0}
.etapes-2fa li{margin-bottom:12px}
.qr-2fa{background:#fff;display:inline-block;padding:8px;border:1px solid var(--line);border-radius:10px;margin:8px 0}
.qr-2fa svg{width:190px;height:190px;display:block}
.cle-2fa{word-break:break-all}
.codes-secours{background:#fff8e6;border:1px solid #f2d08a;border-radius:10px;padding:12px;margin-bottom:12px}
.grille-codes{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin:8px 0}
.grille-codes code{font-size:16px;text-align:center;padding:6px;background:#fff}
