/* ═══════════════════════════════════════════
   Module finance + PWA admin (couleurs via admin.css)
   ═══════════════════════════════════════════ */

:root { --orange: #B7791F; --ko: #C0392B; --ok: #1E7B45; --sab: env(safe-area-inset-bottom, 0px); }
html { -webkit-text-size-adjust: 100%; }
body.modal-ouverte { overflow: hidden; }
.muted { color: var(--texte-clair); font-size: .88rem; }
.pos { color: var(--ok); } .neg { color: var(--ko); }
.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.bloc { display: block; color: var(--texte-clair); font-size: .78rem; font-weight: 400; margin-top: 2px; }
.toast-info { background: #2C5F7C; }
.toast { max-width: calc(100vw - 2rem); }

/* ─── Menu latéral ─── */
.sidebar { overflow-y: auto; }
.nav-groupe { padding: 1rem 1.5rem .3rem; font-size: .68rem; text-transform: uppercase; letter-spacing: 1px; color: var(--secondaire); opacity: .9; list-style: none; }
.sidebar-nav li a { padding: .62rem 1.5rem; }

/* ─── Barre d'application ─── */
.appbar { position: sticky; top: 0; z-index: 90; display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  margin: -2rem -2rem 1.25rem; padding: .6rem 2rem; background: rgba(245,240,232,.94); backdrop-filter: blur(6px); border-bottom: 1px solid var(--bordure); }
.appbar-titre { display: none; font-family: var(--police-titre); font-weight: 700; color: var(--primaire); }
.appbar-droite { display: flex; align-items: center; gap: .6rem; margin-left: auto; }
.statut-reseau { display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .8rem; border-radius: 99px; border: 1px solid var(--bordure); background: #fff; font: 600 .78rem var(--police-corps); cursor: pointer; color: var(--texte); min-height: 32px; }
.statut-reseau .point { width: 9px; height: 9px; border-radius: 50%; background: var(--ok); }
.statut-reseau.hors { background: #FDECEA; border-color: #F2B8B0; color: var(--ko); } .statut-reseau.hors .point { background: var(--ko); }
.statut-reseau.sync { background: #FFF6E0; border-color: #EBCB7A; color: #8A5A00; } .statut-reseau.sync .point { background: var(--orange); animation: pulse 1s infinite; }
@keyframes pulse { 50% { opacity: .3; } }
.bandeau-maj { display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: #E3F2FD; color: #0D47A1; padding: .6rem 1rem; border-radius: var(--rayon); margin-bottom: 1rem; font-size: .88rem; }
body.hors-ligne .appbar { border-bottom-color: #F2B8B0; }

/* ─── Navigation mobile ─── */
.bottom-nav { display: none; }
.feuille-plus { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1100; }
.feuille-contenu { position: absolute; left: 0; right: 0; bottom: 0; max-height: 82vh; overflow-y: auto; background: var(--surface); border-radius: 16px 16px 0 0; padding: 1rem 1rem calc(1rem + var(--sab)); display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.feuille-contenu h3 { grid-column: 1 / -1; margin: .6rem 0 0; font-size: .72rem; text-transform: uppercase; letter-spacing: 1px; color: var(--secondaire); }
.feuille-contenu a { display: flex; gap: .6rem; align-items: center; padding: .8rem; border-radius: var(--rayon); background: var(--fond-clair); color: var(--texte); font-size: .88rem; min-height: 48px; }
.feuille-contenu .btn { grid-column: 1 / -1; justify-content: center; min-height: 44px; margin-top: .5rem; }

@media (max-width: 900px) {
  .sidebar { display: none; }
  .admin-layout { flex-direction: column; }
  .main-content { margin-left: 0; padding: 1rem 1rem calc(86px + var(--sab)); }
  .appbar { margin: -1rem -1rem 1rem; padding: calc(.5rem + env(safe-area-inset-top, 0px)) 1rem .5rem; }
  .appbar-titre { display: block; }
  .topbar { margin-bottom: 1rem; }
  .topbar h1 { font-size: 1.2rem; }
  .bottom-nav { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 95; background: #fff; border-top: 1px solid var(--bordure); padding-bottom: var(--sab); box-shadow: 0 -2px 10px rgba(13,71,34,.08); }
  .bottom-nav a, .bottom-nav button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 58px; color: var(--texte-clair); font: 600 .68rem var(--police-corps); background: none; border: 0; cursor: pointer; }
  .bottom-nav .icone { font-size: 1.3rem; line-height: 1; }
  .bottom-nav a.actif { color: var(--primaire); box-shadow: inset 0 3px 0 var(--secondaire); }
  .toast { left: 1rem; right: 1rem; bottom: calc(80px + var(--sab)); text-align: center; }
}

/* ─── Modales ─── */
.fin-overlay { position: fixed; inset: 0; z-index: 1200; background: rgba(0,0,0,.5); display: flex; align-items: center; justify-content: center; padding: 1rem; }
.fin-modal { background: var(--surface); border-radius: 12px; width: 100%; max-width: 520px; max-height: 92vh; display: flex; flex-direction: column; box-shadow: 0 16px 48px rgba(0,0,0,.25); }
.fin-modal.large { max-width: 760px; }
.fin-modal-tete { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--bordure); }
.fin-modal-tete h2 { font-family: var(--police-titre); color: var(--primaire); font-size: 1.1rem; margin: 0; }
.fin-fermer { background: none; border: 0; font-size: 1.8rem; line-height: 1; cursor: pointer; color: var(--texte-clair); width: 44px; height: 44px; }
.fin-modal-corps { padding: 1.25rem; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.fin-modal-corps h3 { font-size: .95rem; color: var(--primaire); margin: 1.2rem 0 .5rem; }
.fin-modal-corps.inline { padding: 0; }
.fin-actions { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: flex-end; margin-top: 1.25rem; }
.confirm-texte { line-height: 1.5; }
@media (max-width: 700px) {
  .fin-overlay { padding: 0; align-items: flex-end; }
  .fin-modal, .fin-modal.large { max-width: none; border-radius: 16px 16px 0 0; max-height: 94vh; }
  .fin-modal-corps { padding-bottom: calc(1.25rem + var(--sab)); }
  .fin-actions .btn { flex: 1 1 auto; justify-content: center; min-height: 44px; }
}

/* ─── Formulaires ─── */
.champs { display: flex; flex-wrap: wrap; gap: .9rem 1rem; }
.champ { flex: 1 1 100%; min-width: 0; }
.champ.demi { flex: 1 1 calc(50% - .5rem); min-width: 180px; }
.champ label { display: block; font-size: .82rem; font-weight: 600; margin-bottom: .3rem; }
.champ .req { color: var(--ko); }
.champ input, .champ select, .champ textarea { width: 100%; padding: .65rem .8rem; min-height: 44px; border: 1.5px solid var(--bordure); border-radius: var(--rayon); background: var(--fond-clair); font: 16px var(--police-corps); color: var(--texte); }
.champ textarea { min-height: 80px; resize: vertical; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--secondaire); box-shadow: 0 0 0 3px rgba(212,175,55,.2); }
.champ small { display: block; color: var(--texte-clair); font-size: .75rem; margin-top: .25rem; }
.champ-case label { display: flex; align-items: center; gap: .6rem; min-height: 44px; font-weight: 500; }
.champ-case input { width: 22px; height: 22px; min-height: 0; }
.form-erreur { background: #FDECEA; color: var(--ko); padding: .6rem .8rem; border-radius: var(--rayon); font-size: .85rem; margin-top: .9rem; }
.photo-apercu img { max-width: 100%; max-height: 180px; border-radius: var(--rayon); margin-top: .5rem; display: block; }
.photo-apercu button { margin-top: .4rem; }
.justif { max-width: 100%; max-height: 320px; border-radius: var(--rayon); border: 1px solid var(--bordure); }
@media (max-width: 700px) { .champ.demi { flex-basis: 100%; } }

/* ─── Contenu des écrans ─── */
.fin-contenu { display: block; }
.sous-titre { font-family: var(--police-titre); font-size: 1rem; color: var(--primaire); margin: 1.4rem 0 .6rem; }
.actions-rapides { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1rem; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .9rem; }
.kpi { background: var(--surface); border-radius: var(--rayon); padding: 1rem 1.1rem; box-shadow: var(--ombre); border-left: 4px solid var(--secondaire); }
.kpi.kpi-ok { border-left-color: var(--ok); } .kpi.kpi-ko { border-left-color: var(--ko); }
.kpi-t { display: block; font-size: .78rem; color: var(--texte-clair); }
.kpi strong { display: block; font-size: 1.45rem; color: var(--primaire); margin: .15rem 0; font-variant-numeric: tabular-nums; }
.kpi strong.neg { color: var(--ko); }
.kpi small { color: var(--texte-clair); font-size: .78rem; }
.caisse-carte { cursor: pointer; } .caisse-carte.selection { outline: 2px solid var(--secondaire); } .caisse-carte.inactive { opacity: .6; }
.grille-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 1rem; margin-top: 1rem; }
.carte-bloc { background: var(--surface); border-radius: var(--rayon); padding: 1.1rem 1.2rem; box-shadow: var(--ombre); margin-bottom: 1rem; min-width: 0; }
.carte-bloc h2 { font-size: 1rem; color: var(--primaire); margin: 0 0 .75rem; font-family: var(--police-titre); }
.liste-simple { list-style: none; padding: 0; margin: 0 0 .75rem; }
.liste-simple li { display: flex; justify-content: space-between; gap: .8rem; align-items: center; padding: .55rem 0; border-bottom: 1px solid var(--bordure); font-size: .9rem; flex-wrap: wrap; }
.liste-simple li:last-child { border-bottom: 0; } .liste-simple li.cliquable { cursor: pointer; }
.alertes { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; max-height: 340px; overflow-y: auto; }
.alerte { display: flex; justify-content: space-between; gap: .8rem; align-items: center; padding: .65rem .8rem; border-radius: var(--rayon); font-size: .85rem; border-left: 4px solid; }
.alerte strong { display: block; } .alerte span { color: var(--texte-clair); font-size: .8rem; }
.a-danger { background: #FDECEA; border-color: var(--ko); } .a-attention { background: #FFF6E0; border-color: var(--orange); } .a-ok { background: #E8F5E9; border-color: var(--ok); }
.onglets { display: flex; gap: .4rem; margin-bottom: 1rem; }
.onglet { padding: .6rem 1.1rem; min-height: 44px; border: 1.5px solid var(--bordure); background: #fff; border-radius: 99px; font: 600 .85rem var(--police-corps); cursor: pointer; color: var(--texte-clair); }
.onglet.actif { background: var(--primaire); border-color: var(--primaire); color: #fff; }
.presets { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .6rem; }

/* ─── Graphiques ─── */
.graph { width: 100%; height: auto; display: block; }
.graph .grille { stroke: #E7E1D6; stroke-width: 1; } .graph .zero { stroke: #999; stroke-width: 1; stroke-dasharray: 3 3; }
.graph .axe { font: 10px var(--police-corps); fill: #6B7A70; }
.legende { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .78rem; color: var(--texte-clair); margin-top: .4rem; }
.legende i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; }

/* ─── Listes ─── */
.barre-liste { display: flex; flex-wrap: wrap; gap: .8rem; align-items: flex-end; justify-content: space-between; margin-bottom: 1rem; }
.filtres { display: flex; flex-wrap: wrap; gap: .6rem; flex: 1 1 320px; }
.flt { display: flex; flex-direction: column; gap: 2px; font-size: .72rem; color: var(--texte-clair); font-weight: 600; flex: 1 1 140px; max-width: 220px; }
.flt input, .flt select { padding: .5rem .6rem; min-height: 40px; border: 1.5px solid var(--bordure); border-radius: var(--rayon); background: #fff; font: 16px var(--police-corps); width: 100%; }
.actions-liste { display: flex; gap: .5rem; flex-wrap: wrap; }
.liste-corps.charge { opacity: .55; transition: opacity .15s; }
.totaux-liste { display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; background: var(--surface); padding: .7rem 1rem; border-radius: var(--rayon); box-shadow: var(--ombre); margin-bottom: .8rem; font-size: .86rem; }
.totaux-liste b { color: var(--primaire); } .totaux-liste .cats { color: var(--texte-clair); }
.tbl-wrap { background: var(--surface); border-radius: var(--rayon); box-shadow: var(--ombre); overflow-x: auto; }
.tbl tr.cliquable { cursor: pointer; }
.tbl.compact td, .tbl.compact th { padding: .5rem .7rem; font-size: .84rem; }
.col-actions { white-space: nowrap; text-align: right; }
.col-actions .btn { margin: 2px; }
.pager { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin: .8rem 0 0; font-size: .82rem; color: var(--texte-clair); flex-wrap: wrap; }
.squelette { height: 140px; border-radius: var(--rayon); background: linear-gradient(90deg, #ece6da 25%, #f5f0e8 50%, #ece6da 75%); background-size: 200% 100%; animation: sq 1.2s infinite; }
@keyframes sq { to { background-position: -200% 0; } }
.fiche { display: grid; grid-template-columns: 150px 1fr; gap: .35rem 1rem; margin: 0; font-size: .9rem; }
.fiche dt { color: var(--texte-clair); font-weight: 600; } .fiche dd { margin: 0; word-break: break-word; }
.file-liste { list-style: none; padding: 0; margin: 0; } .file-liste li { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid var(--bordure); } .file-liste small { display: block; color: var(--texte-clair); }
.detail-journal { color: var(--texte-clair); word-break: break-all; }

/* ─── Pastilles de statut ─── */
.pastille { display: inline-block; padding: .15rem .6rem; border-radius: 99px; font-size: .72rem; font-weight: 700; white-space: nowrap; }
.p-ok { background: #E8F5E9; color: #1B6B3A; } .p-att { background: #FFF3E0; color: #9A5B00; } .p-ko { background: #FDECEA; color: var(--ko); }
.p-info { background: #E3F2FD; color: #1565C0; } .p-neutre { background: #F0EEE9; color: #5B6660; }

/* ─── Tableaux → cartes sur mobile ─── */
@media (max-width: 700px) {
  .tbl-wrap { background: transparent; box-shadow: none; overflow: visible; }
  .tbl thead { display: none; }
  .tbl, .tbl tbody, .tbl tr, .tbl td { display: block; width: 100%; }
  .tbl tr { background: var(--surface); border-radius: var(--rayon); box-shadow: var(--ombre); margin-bottom: .7rem; padding: .5rem .8rem; }
  .tbl td { display: flex; justify-content: space-between; gap: 1rem; text-align: right; border: 0; padding: .3rem 0; }
  .tbl td::before { content: attr(data-label); color: var(--texte-clair); font-size: .76rem; font-weight: 600; text-align: left; flex: 0 0 38%; }
  .tbl td.col-actions { justify-content: flex-end; flex-wrap: wrap; border-top: 1px solid var(--bordure); margin-top: .3rem; padding-top: .5rem; }
  .tbl td.col-actions::before { display: none; }
  .tbl .btn-petit { min-height: 40px; padding: .4rem .9rem; }
  .fiche { grid-template-columns: 110px 1fr; }
  .flt { max-width: none; flex: 1 1 45%; }
  .filtres { flex-basis: 100%; }
  .actions-liste { width: 100%; } .actions-liste .btn { flex: 1; justify-content: center; min-height: 44px; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .kpi strong { font-size: 1.15rem; }
  .grille-2 { grid-template-columns: 1fr; }
}
@media (max-width: 340px) { .kpis { grid-template-columns: 1fr; } }
@media print { .sidebar, .bottom-nav, .appbar { display: none !important; } .main-content { margin: 0; padding: 0; } }

/* Filtres repliables (mobile) */
.filtres-det { flex: 1 1 320px; }
.filtres-det > summary { display: none; list-style: none; cursor: pointer; font-weight: 700; font-size: .88rem; padding: .7rem 1rem; min-height: 44px; background: #fff; border: 1.5px solid var(--bordure); border-radius: var(--rayon); }
.filtres-det > summary::-webkit-details-marker { display: none; }
.filtres-det > summary::after { content: '▾'; float: right; }
.filtres-det[open] > summary::after { content: '▴'; }
@media (max-width: 700px) { .filtres-det > summary { display: block; } .filtres-det .filtres { margin-top: .6rem; } .barre-liste { gap: .6rem; } }

/* ─── Devis / bons de commande / factures ─── */
.doc-bloc { border: 1px solid var(--bordure); border-radius: var(--rayon); padding: .9rem 1rem 1rem; margin: 0 0 1rem; min-width: 0; }
.doc-bloc legend { font-weight: 700; font-size: .85rem; color: var(--primaire); padding: 0 .4rem; }
.doc-ligne { display: grid; grid-template-columns: minmax(0, 1fr) 80px 90px 100px 70px 110px 40px; gap: .5rem; align-items: start; padding: .7rem 0; border-bottom: 1px dashed var(--bordure); }
.doc-ligne:last-of-type { border-bottom: 0; }
.doc-ligne label { display: block; font-size: .7rem; color: var(--texte-clair); font-weight: 600; margin-bottom: 2px; }
.doc-ligne input, .doc-ligne textarea { width: 100%; padding: .5rem .6rem; min-height: 42px; border: 1.5px solid var(--bordure); border-radius: var(--rayon); background: var(--fond-clair); font: 16px var(--police-corps); }
.doc-ligne textarea { margin-top: .35rem; min-height: 38px; font-size: 13px; resize: vertical; color: var(--texte-clair); }
.doc-ligne .dl-montant span { display: block; padding-top: .55rem; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.doc-ligne .dl-del { margin-top: 1.1rem; min-height: 42px; }
.doc-ligne:not(:has(.dl-tva)) { grid-template-columns: minmax(0, 1fr) 80px 90px 100px 110px 40px; }
.doc-totaux { margin: 1rem 0 1rem auto; max-width: 380px; background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon); padding: .7rem 1rem; }
.doc-totaux div { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; font-size: .9rem; font-variant-numeric: tabular-nums; }
.doc-totaux .total { border-top: 2px solid var(--secondaire); margin-top: .3rem; padding-top: .45rem; font-size: 1.05rem; color: var(--primaire); }
.doc-totaux .mention { margin: .5rem 0 0; font-size: .78rem; font-style: italic; color: var(--texte-clair); }
.doc-totaux.lecture { background: var(--fond-clair); }
.doc-entete { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: .6rem; }
.doc-meta { display: flex; gap: .6rem; align-items: center; }
.doc-statut { margin-top: .8rem; } .doc-actions { justify-content: flex-start; }
@media (max-width: 700px) {
  .doc-ligne, .doc-ligne:not(:has(.dl-tva)) { grid-template-columns: 1fr 1fr; background: var(--fond-clair); border: 1px solid var(--bordure); border-radius: var(--rayon); padding: .7rem; margin-bottom: .6rem; }
  .doc-ligne .dl-desc { grid-column: 1 / -1; }
  .doc-ligne .dl-del { grid-column: 1 / -1; margin-top: 0; }
  .doc-totaux { max-width: none; }
  .doc-actions .btn { flex: 1 1 45%; justify-content: center; }
}
