/* Épuration du Suivi — 22/10/2026. Chargé après styles.css. */

/* Barre du haut : la recherche au milieu */
.topbar-centre { flex: 1 1 auto; display: flex; justify-content: center; min-width: 0; }
.topbar-centre .search-box { width: 100%; max-width: 560px; }
.topbar-centre .search-box input { width: 100%; }
@media (min-width: 769px) { .topbar-right { flex: 0 0 auto; } }

/* Filtrer par service */
.filtre-service-menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 600; width: 250px; padding: 8px;
  display: flex; flex-direction: column; gap: 6px; background: var(--card-bg); border: 2px solid #111; box-shadow: 4px 4px 0 #111; }
.fs-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 9px 12px;
  border: 2px solid; border-radius: 0; color: #111; font-size: 12px; font-weight: 700; text-align: left; cursor: pointer; }
.fs-item b { font-size: 13px; font-weight: 900; }
.fs-item:hover { transform: translate(-1px, -1px); box-shadow: 3px 3px 0 #111; }
.fs-item.actif { outline: 3px solid #111; outline-offset: -1px; }
.fs-item.actif span::before { content: '✓ '; }
#btn-filtre-service { color: #111 !important; }

/* Compteurs Clôturés / Mis de côté : séparés des services, encre foncée */
.kpi-annexe .kpi-label { color: #1f2430 !important; }
.kpi-annexe .kpi-value { color: #111 !important; }
.kpi-annexe-active { outline: 3px solid #111; outline-offset: 2px; }

/* Kanban filtré : une seule colonne, cartes étalées sur la largeur */
.kanban-wrapper.kanban-filtre { min-width: 0 !important; display: block !important; }
.kanban-wrapper .kanban-col.kanban-col-seule { width: auto !important; }
.kanban-col-seule .kanban-card-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; align-content: start; }

/* Tableaux de service : sélecteur d'affichage */
.dash-vues { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: -8px 0 16px; }
.dash-vues:empty { display: none; }
.dash-vues-titre { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); margin-right: 4px; }
.dash-vue { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--card-bg); color: var(--text);
  border: 2px solid #111; font-size: 11px; font-weight: 700; cursor: pointer; }
.dash-vue.actif { background: #111; color: #fff; }
.dash-vue i { font-size: 11px; }
.fs-grille { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px !important; }
.fs-grille > * { margin: 0 !important; }
.fs-tableau { width: 100%; border-collapse: collapse; background: var(--card-bg); border: 2px solid #111; font-size: 12px; }
.fs-tableau th { text-align: left; padding: 7px 10px; background: var(--bg); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); border-bottom: 2px solid #111; }
.fs-tableau td { padding: 6px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; color: var(--text); }
.fs-tableau tbody tr { cursor: pointer; }
.fs-tableau tbody tr:hover td { background: var(--bg); }
.fs-tableau tr.u3 td:first-child { box-shadow: inset 4px 0 0 #9c2626; }
.fs-tableau tr.u2 td:first-child { box-shadow: inset 4px 0 0 #a17121; }
.fs-num { font-family: monospace; font-weight: 800; white-space: nowrap; width: 1%; }
.fs-tableau td:nth-last-child(2), .fs-tableau th:nth-last-child(2) { white-space: nowrap; width: 1%; }
.fs-tableau td:last-child, .fs-tableau th:last-child { width: 1%; }
.fs-sous { font-size: 11px; color: var(--text-muted); }
.fs-date { white-space: nowrap; font-size: 11px; }
.fs-retard { font-size: 10px; font-weight: 800; color: #9c2626; }
.fs-bat { display: inline-block; margin-right: 4px; padding: 1px 7px; font-size: 10px; font-weight: 700; background: #faeebd; color: #884923; }
.fs-bat.ok { background: #d0f9de; color: #267945; }
.fs-groupe { border-left: 4px solid; padding-left: 12px; margin-bottom: 18px; }
.fs-groupe-titre { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }

/* Encadré des changements */
#annonce-changements { padding: 16px 24px 0; }
.annonce-changements { position: relative; background: #fffbea; color: #1f2430; border: 2px solid #111; border-left: 8px solid #ffb43c; box-shadow: 4px 4px 0 #111; padding: 14px 18px 14px 18px; max-width: 980px; }
.annonce-tete { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 8px; }
.annonce-tete i { color: #a45b23; }
.annonce-tete span { margin-left: auto; font-size: 11px; color: #6b7280; }
.annonce-changements ul { margin: 0 0 10px 18px; padding: 0; font-size: 12px; line-height: 1.7; }
.annonce-changements button { padding: 7px 16px; background: #111; color: #fff; border: none; font-size: 12px; font-weight: 800; cursor: pointer; }
.dark .annonce-changements { background: #2a2614; color: #f3f4f6; }
.dark .annonce-changements .annonce-tete span { color: #c7cbd3; }

@media (max-width: 768px) {
  .topbar-left { flex: 0 0 auto !important; }
  .topbar-centre { flex: 1 1 0 !important; }
  .topbar-centre .search-box { max-width: none; }
  .filtre-service-menu { position: fixed; top: 110px; left: 12px; right: 12px; width: auto; }
  #annonce-changements { padding: 10px 12px 0; }
  .fs-grille { grid-template-columns: 1fr; }
  .fs-tableau th:nth-child(3), .fs-tableau td:nth-child(3) { display: none; }
}

/* ═══ 2e vague (22/10/2026) : fiche affaire ═══ */
/* En-tête : urgence, Modifier, téléphone, menu « … » */
#fiche-actions { position: relative; }
.fiche-urgence { display: inline-flex; align-items: center; gap: 2px; padding: 5px 9px; border: 2px solid; font-size: 11px; line-height: 1; cursor: help; }
#m-urgent { display: none !important; }
.fiche-btn { font-size: 11px !important; padding: 6px 11px !important; }
.menu-fiche { position: absolute; top: calc(100% + 6px); right: 0; z-index: 700; min-width: 230px; padding: 6px;
  display: flex; flex-direction: column; background: var(--card-bg); border: 2px solid #111; box-shadow: 4px 4px 0 #111; }
.menu-fiche[hidden] { display: none; }
.menu-fiche button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px; background: transparent; border: none;
  color: var(--text); font-size: 12px; font-weight: 700; text-align: left; cursor: pointer; }
.menu-fiche button i { width: 14px; text-align: center; color: var(--text-muted); }
.menu-fiche button:hover { background: var(--bg); }
.menu-fiche button.danger, .menu-fiche button.danger i { color: #b42323; }
.menu-fiche hr { border: none; border-top: 1px solid var(--border); margin: 4px 0; }
.dark .menu-fiche { border-color: #e5e7eb; box-shadow: 4px 4px 0 #000; }
.dark .menu-fiche button.danger, .dark .menu-fiche button.danger i { color: #f59a9a; }

/* Tuile « N° de devis » dans Infos */
.m-devis-tuile { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; cursor: pointer;
  background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 8px 12px; color: var(--text); font: inherit; }
.m-devis-tuile:hover { outline: 2px solid var(--indigo); outline-offset: -1px; }
.m-devis-tuile .fe-devis-nom { font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px; }
.m-devis-tuile .fe-devis-num { font-family: monospace; font-size: 12px; font-weight: 700; }
.m-devis-tuile .fa-chevron-right { margin-left: auto; color: var(--text-muted); }

/* Flèche de retour (Devis, Historique) */
.fiche-retour { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.fiche-retour button { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--card-bg); color: var(--text);
  border: 2px solid #111; font-size: 11px; font-weight: 800; cursor: pointer; }
.fiche-retour span { font-size: 13px; font-weight: 800; color: var(--text); display: inline-flex; align-items: center; gap: 6px; }
.dark .fiche-retour button { border-color: #e5e7eb; }

/* Statut client sur une ligne */
.fe-statut { display: flex; flex-direction: column; gap: 8px; }
.fe-statut-ligne { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fe-statut-titre { font-size: 9px; font-weight: 800; text-transform: uppercase; color: var(--text-muted); width: 56px; flex-shrink: 0; }
.fe-statut-choix { width: auto !important; min-width: 170px; font-size: 12px !important; padding: 5px 8px !important; }
.fe-bat-etat { font-size: 11px; font-weight: 600; color: var(--text); }
.fe-bat-etat.signe { color: #267945; }
.fe-ok { color: #267945; } .fe-non { color: var(--text-muted); }
.fe-lien { background: none; border: none; padding: 0; font-size: 11px; font-weight: 700; color: #1c6892; cursor: pointer; text-decoration: underline; }
.dark .fe-lien { color: #8cc8ef; }
#bat-etat-rapide { background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.fe-bloc-titre { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; color: var(--text-muted); margin: 0 0 8px; }
.fe-bloc-titre span { text-transform: none; letter-spacing: 0; font-weight: 600; margin-left: 6px; }

/* Notes : Email */
#chat-emails { flex-direction: column; gap: 8px; max-height: 240px; overflow-y: auto; padding: 8px; }
.fe-mail-depot { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 2px dashed var(--border); border-radius: 8px; cursor: pointer;
  font-size: 11px; color: var(--text-muted); }
.fe-mail-depot b { color: var(--text); }
.fe-mail-depot:hover { border-color: #1c6892; }

/* Bouton « Nouvelle idée » (Améliorations) : lisible en clair comme en sombre */
#btn-nouvelle-idee { background: #ffb43c !important; color: #111 !important; border: 2px solid #111 !important; box-shadow: 3px 3px 0 #111 !important; }
#btn-nouvelle-idee:hover { background: #ffc566 !important; }
.dark #btn-nouvelle-idee { border-color: #111 !important; box-shadow: 3px 3px 0 #000 !important; }
#amelio-filtres { background: var(--bg) !important; }

@media (max-width: 768px) {
  #btn-fiche-telephone span { display: none; }
  .fe-statut-choix { min-width: 0; flex: 1; }
}
.annonce-sous { margin: 4px 0 2px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #a45b23; }
.dark .annonce-sous { color: #f3c37a; }
#dash-admin-kpis { display: none !important; }   /* mêmes chiffres que les compteurs du haut */
#modal-detail .modal-xl > .modal-header, #modal-detail .modal-xl > .modal-header + div { flex-shrink: 0; }
.fe-attente { color: #a17121; }
.dark .fe-attente { color: #f3c37a; }
.dark .fe-ok { color: #6fdc9b; }
.dark .fe-statut-ligne > button:not([style*="color:#fff"]) { filter: brightness(1.9); }

/* Statut client en pastilles, en-tête de Dessin (22/10 après-midi) */
.fe-pastille { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--card-bg); color: var(--text); font-size: 11px; font-weight: 600; cursor: pointer; }
.fe-pastille b { font-weight: 800; }
.fe-pastille:hover { outline: 2px solid var(--indigo); outline-offset: -1px; }
.fe-pastille.ok { border-color: #82d9a2; }
.fe-pastille i { color: var(--text-muted); }
.fiche-urgence { cursor: pointer !important; }
.fiche-urgence:hover { transform: translate(-1px, -1px); box-shadow: 2px 2px 0 #111; }
.dessin-entete { display: flex; align-items: center; gap: 10px 22px; flex-wrap: wrap; background: var(--bg); border: 1px solid var(--border);
  border-radius: 10px; padding: 10px 12px; }
.fe-referent, .fe-releve { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 800; color: var(--text); }
.fe-referent i { color: #1c6892; }
.fe-referent select { width: auto !important; min-width: 150px; font-size: 12px !important; padding: 5px 8px !important; }
.fe-releve > span { color: #c2410c; text-transform: uppercase; font-size: 10px; }
.dark .fe-releve > span { color: #f59e6b; }
.dark .fe-statut-ligne span > button:not([style*="color:#fff"]) { filter: brightness(1.9); }

/* Envoi en production (22/10/2026) : contenu de la commande, affaires sans bon */
.fe-contenu { margin-top: 8px; }
.fe-contenu-titre { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.fe-contenu-case { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border: 1px solid var(--border); border-radius: 8px;
  font-size: 11px; font-weight: 700; color: var(--text-muted); background: var(--card-bg); cursor: pointer; }
.fe-contenu-case.on { color: var(--text); border-color: #1c6892; }
.fe-contenu-case input { width: 14px; height: 14px; accent-color: #1c6892; margin: 0; }
.fe-contenu-src { font-size: 10px; color: var(--text-muted); font-style: italic; }
.fe-contenu-vide { font-size: 12px; color: #a17121; font-weight: 700; margin: 0 0 8px; }
.fe-sans-bon { margin: 0 0 16px; padding: 12px 14px; background: #fff7e6; color: #1f2430; border: 2px solid #111; border-left: 8px solid #e8a33c; }
.fe-sans-bon p { margin: 0 0 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; }
.fe-sans-bon p i { color: #b4651c; }
.fe-sans-bon p span { font-size: 11px; color: #6b7280; }
.fe-sans-bon-liste { display: flex; flex-wrap: wrap; gap: 6px; }
.fe-sans-bon-liste button:not(.fe-lien) { padding: 4px 9px; background: #fff; color: #1f2430; border: 1px solid #d6c3a0; font-size: 11px; cursor: pointer; }
.fe-sans-bon-liste button:not(.fe-lien):hover { border-color: #111; }
.dark .fe-sans-bon { background: #2a2414; color: #f3f4f6; }
.dark .fe-sans-bon p span { color: #c7cbd3; }
.dark .fe-sans-bon-liste button:not(.fe-lien) { background: #1d1d14; color: #f3f4f6; border-color: #5a4a2a; }