v2026.5.41 — Suppression des hardcodes runtime + UX admin + thème unifié

src/background.js

@@ -115,11 +115,74 @@ self.addEventListener("unhandledrejection", (event) => {
 
 LOG.info("boot", "service worker démarré", { version: LOG.version() });
 
-// Domaines EasyVista reconnus (interne d'abord, externe en fallback)
-const EV_ORIGINS = [
-  "https://itsma.etat-de-vaud.ch",
-  "https://itsma.vd.ch"
+// ============================================================================
+// v2026.5.41 : Configuration runtime — lue depuis admin_config (chrome.storage.local).
+//
+// Les domaines EV et le group_id ont des défauts (filet de sécurité 1er install).
+// La liste de techniciens, elle, n'a AUCUN défaut : tant que l'utilisateur n'a
+// rien coché dans Paramètres → Équipe, l'extension ne fetche aucun planning et
+// invite à configurer.
+//
+// chrome.storage.local survit aux mises à jour d'extension → la sélection de
+// l'utilisateur est conservée d'une version à l'autre.
+// ============================================================================
+const DEFAULT_EV_ORIGINS = [
+  "https://itsma.etat-de-vaud.ch",  // interne DGNSI
+  "https://itsma.vd.ch"             // externe Internet
 ];
+const DEFAULT_GROUP_ID = "191";        // SI-CSS
+
+/**
+ * Lit admin_config depuis chrome.storage.local. Retourne {} si absent ou
+ * en cas d'erreur.
+ */
+async function getAdminConfig() {
+  try {
+    const stored = await chrome.storage.local.get("admin_config");
+    return stored.admin_config || {};
+  } catch (e) {
+    LOG.warn("config", "getAdminConfig failed, using defaults", e);
+    return {};
+  }
+}
+
+/** Origines EV à surveiller, depuis admin_config ou défaut. */
+async function getEvOrigins() {
+  const cfg = await getAdminConfig();
+  const o = Array.isArray(cfg.evOrigins) ? cfg.evOrigins.filter(Boolean) : [];
+  return o.length >= 1 ? o : DEFAULT_EV_ORIGINS;
+}
+
+/** Group ID effectif (défaut SI-CSS). */
+async function getGroupId() {
+  const cfg = await getAdminConfig();
+  return cfg.groupId || DEFAULT_GROUP_ID;
+}
+
+/**
+ * Support IDs effectifs (CSV des clés de cfg.team).
+ * Retourne "" si aucun tech sélectionné — l'appelant doit alors signaler
+ * à l'utilisateur d'aller configurer son équipe.
+ */
+async function getSupportIds() {
+  const cfg = await getAdminConfig();
+  const ids = Object.keys(cfg.team || {}).filter(Boolean);
+  return ids.join(",");
+}
+
+/**
+ * Plage horaire d'affichage (heures pleines).
+ * Lue depuis admin_config (Paramètres → Apparence → Heures de la journée),
+ * défaut 8h-18h. Utilisée pour les paramètres day_start_hour / day_end_hour /
+ * begin_hour / end_hour des requêtes EV. Le viewer utilise déjà ces mêmes
+ * valeurs pour dessiner la timeline (cf. _initDayBoundsFromConfig dans viewer.js).
+ */
+async function getDayBounds() {
+  const cfg = await getAdminConfig();
+  const start = (typeof cfg.dayStart === "number" && cfg.dayStart >= 0 && cfg.dayStart <= 23) ? cfg.dayStart : 8;
+  const end = (typeof cfg.dayEnd === "number" && cfg.dayEnd > start && cfg.dayEnd <= 24) ? cfg.dayEnd : 18;
+  return { start, end };
+}
 
 // ============================================================================
 // Clic sur l'icône → ouvrir le viewer
@@ -147,8 +210,10 @@ chrome.action.onClicked.addListener(async () => {
  * @author Quentin Rouiller
  */
 async function findEasyVistaSession() {
-  // Chercher tous les onglets sur un domaine EasyVista
-  for (const origin of EV_ORIGINS) {
+  // v2026.5.41 : les origines EV viennent de admin_config (éditables dans
+  // Paramètres → EasyVista), avec fallback sur DEFAULT_EV_ORIGINS.
+  const origins = await getEvOrigins();
+  for (const origin of origins) {
     const tabs = await chrome.tabs.query({ url: origin + "/*" });
     for (const tab of tabs) {
       const m = (tab.url || "").match(/[?&]PHPSESSID=([a-zA-Z0-9]+)/);
@@ -175,8 +240,20 @@ async function findEasyVistaSession() {
  * @author Quentin Rouiller
  */
 async function fetchPlanningXml(origin, phpsessid, unixDate) {
-  const techIds = "76272,83725,66635,92235,90070,40944,72485,86874";
-  const groupId = "191";
+  // v2026.5.41 : groupId vient de admin_config (défaut SI-CSS).
+  // techIds vient de admin_config — si vide, on lève une erreur claire pour
+  // que le viewer affiche "Aucun technicien sélectionné" plutôt qu'un planning vide.
+  const groupId = await getGroupId();
+  const techIds = await getSupportIds();
+  if (!techIds) {
+    const err = new Error("no_team_configured");
+    err.kind = "no_team_configured";
+    throw err;
+  }
+  // v2026.5.41 : heures synchronisées avec admin_config (Paramètres → Apparence).
+  // EV utilise day_end_hour exclusif (la plage rendue va jusqu'à end-1:59),
+  // donc on envoie end+1 pour que la dernière heure pleine soit incluse.
+  const { start, end } = await getDayBounds();
   const url =
     `${origin}/planning_xhr.php` +
     `?PHPSESSID=${encodeURIComponent(phpsessid)}` +
@@ -190,8 +267,8 @@ async function fetchPlanningXml(origin, phpsessid, unixDate) {
     `&end_date_label=Date` +
     `&click_here_label=Ici` +
     `&mail_title=mail` +
-    `&day_start_hour=8` +
-    `&day_end_hour=19`;
+    `&day_start_hour=${start}` +
+    `&day_end_hour=${end + 1}`;
   // v2026.5.38 : on retire les logs verbose à chaque fetch (URL/status/taille).
   // En cas de souci, le throw plus bas porte assez d'info pour debug.
   const r = await evFetch(url, origin);
@@ -714,6 +791,8 @@ async function submitAbsence(origin, phpsessid, opts) {
   const emplIds = (opts.techIds || []).join(",");
   if (!emplIds) throw new Error("Aucun technicien sélectionné");
 
+  // v2026.5.41 : heures synchronisées avec admin_config.
+  const { start, end } = await getDayBounds();
   const internalurltime = Math.floor(Date.now() / 1000);
   const url = `${origin}/include/components/staff/planning/plan_set_holidays_popup.php`
     + `?PHPSESSID=${encodeURIComponent(phpsessid)}`
@@ -722,8 +801,8 @@ async function submitAbsence(origin, phpsessid, opts) {
     + `&ROOT_DIRECTORY=${encodeURIComponent("/ccv/data/www/itsma/htdocs/")}`
     + `&current_date=${encodeURIComponent(opts.currentDate)}`
     + `&empl_ids=${encodeURIComponent(emplIds)}`
-    + `&begin_hour=8`
-    + `&end_hour=18`
+    + `&begin_hour=${start}`
+    + `&end_hour=${end}`
     + `&plagehoraire=0`;
 
   const body = new URLSearchParams();
@@ -785,6 +864,8 @@ async function submitDouchette(origin, phpsessid, opts) {
   const techIds = opts.techIds || [];
   if (techIds.length === 0) throw new Error("Aucun technicien sélectionné");
 
+  // v2026.5.41 : heures synchronisées avec admin_config.
+  const { start, end } = await getDayBounds();
   const emplIds = techIds.join(",");
   const internalurltime = Math.floor(Date.now() / 1000);
   const url = `${origin}/include/components/staff/planning/plan_set_tech_planif_popup.php`
@@ -794,8 +875,8 @@ async function submitDouchette(origin, phpsessid, opts) {
     + `&ROOT_DIRECTORY=${encodeURIComponent("/ccv/data/www/itsma/htdocs/")}`
     + `&current_date=${encodeURIComponent(opts.currentDate)}`
     + `&empl_ids=${encodeURIComponent(emplIds)}`
-    + `&begin_hour=8`
-    + `&end_hour=18`
+    + `&begin_hour=${start}`
+    + `&end_hour=${end}`
     + `&plagehoraire=0`;
 
   const body = new URLSearchParams();
@@ -1034,18 +1115,14 @@ async function detectGroupsFromEV(origin, phpsessid) {
  * Retourne { ids: [{id, name, alreadyInTeam}], groupId }.
  */
 async function detectTeamFromEV(origin, phpsessid, groupIdArg, supportIdsArg) {
-  // v5.0.1 : valeurs par défaut (correspondent au groupe actuel).
-  // v2026.5.41 : on accepte un groupId en argument (ex: switch SI-CSS → SI-EXT).
-  // Quand on change de groupe, on n'a pas la liste support_ids du nouveau
-  // groupe → on passe une chaîne vide, le serveur retourne quand même tous
-  // les membres, juste sans pré-cochage "alreadyInTeam".
-  const DEFAULT_GROUP_ID = "191";
-  const DEFAULT_SUPPORT_IDS = "76272,83725,66635,92235,90070,40944,72485,86874";
-
-  const groupId = groupIdArg || DEFAULT_GROUP_ID;
+  // v2026.5.41 : groupId vient de l'argument, sinon de admin_config (défaut SI-CSS).
+  // supportIds vient de l'argument, sinon de admin_config (vide tant que rien n'est
+  // sélectionné). Le serveur retourne tous les membres du groupe quoi qu'il arrive ;
+  // supportIds sert juste à pré-cocher les techs déjà inclus dans l'équipe.
+  const groupId = groupIdArg || await getGroupId();
   const supportIds = (typeof supportIdsArg === "string")
     ? supportIdsArg
-    : (groupId === DEFAULT_GROUP_ID ? DEFAULT_SUPPORT_IDS : "");
+    : await getSupportIds();
   console.log("[bg] detectTeamFromEV : group_id =", groupId, "| support_ids =", supportIds);
 
   // Fetch la popup de sélection des intervenants du groupe
@@ -1068,8 +1145,9 @@ async function detectTeamFromEV(origin, phpsessid, groupIdArg, supportIdsArg) {
     if (looksLikeLoginPage(popupHtml)) throw new Error("session_expired");
   } catch (e) {
     console.warn("[bg] detectTeam: fetch popup failed:", e);
-    // Fallback : au moins on retourne les IDs connus avec noms vides
-    const ids = DEFAULT_SUPPORT_IDS.split(",").filter(Boolean);
+    // v2026.5.41 : on retourne les IDs déjà sélectionnés par l'user (s'il y en a)
+    // plutôt qu'une liste hardcodée. Si vide, le viewer affichera juste 0 résultat.
+    const ids = supportIds.split(",").filter(Boolean);
     return {
       ids: ids.map(id => ({ id, name: "? (" + id + ")", alreadyInTeam: true })),
       groupId

src/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Planification",
-  "version": "2026.5.40",
+  "version": "2026.5.41",
   "description": "Vue claire et rapide du planning des techniciens EasyVista. Développé par Quentin Rouiller — DGNSI, Canton de Vaud.",
   "permissions": [
     "activeTab",
@@ -14,6 +14,9 @@
     "https://itsma.etat-de-vaud.ch/*",
     "https://itsma.vd.ch/*"
   ],
+  "optional_host_permissions": [
+    "https://*/*"
+  ],
   "action": {
     "default_title": "Ouvrir la Planification"
   },

src/viewer.css

@@ -896,6 +896,43 @@ html.view-horizontal .timeline-noon {
   position: relative;
 }
 
+/* ==========================================================================
+   v2026.5.41 : Conflit absence/réservation × intervention.
+   Quand une intervention est planifiée pendant qu'un tech est marqué
+   "absent" (toute la journée ou demi-journée) ou qu'il a une réservation
+   sur le même créneau, on signale visuellement le conflit en peignant la
+   carte de l'intervention en rouge plein. S'applique à la row classique
+   (.intervention-v2) ET à la mini-card (.iv-mini-card) en vue horizontale.
+   ========================================================================== */
+.intervention-v2.intervention-conflict-absence,
+.iv-mini-card.intervention-conflict-absence {
+  background: #b03030 !important;
+  color: #ffffff !important;
+  border-color: #7a1f1f !important;
+}
+.intervention-v2.intervention-conflict-absence::before {
+  /* Renforce la barre gauche pour rester cohérent avec le rouge plein. */
+  background: #7a1f1f !important;
+}
+.intervention-v2.intervention-conflict-absence .intervention-dot,
+.intervention-v2.intervention-conflict-absence .iv-status-check,
+.intervention-v2.intervention-conflict-absence a,
+.iv-mini-card.intervention-conflict-absence .iv-mini-card-bar,
+.iv-mini-card.intervention-conflict-absence .iv-mini-time-vertical,
+.iv-mini-card.intervention-conflict-absence .iv-mini-card-text {
+  color: #ffffff !important;
+  background: transparent !important;
+}
+/* La barre couleur catégorie à gauche de la mini-card devient un blanc
+   semi-transparent pour rester visible sur le rouge. */
+.iv-mini-card.intervention-conflict-absence .iv-mini-card-bar {
+  background: rgba(255, 255, 255, 0.45) !important;
+}
+.intervention-v2.intervention-conflict-absence:hover,
+.iv-mini-card.intervention-conflict-absence:hover {
+  background: #c44040 !important;
+}
+
 /* ==========================================================================
    Interventions — layout v2 (heures verticales)
    ========================================================================== */
@@ -1482,7 +1519,9 @@ html.view-horizontal .timeline-noon {
   position: fixed;
   bottom: 20px;
   right: 20px;
-  z-index: 200;
+  /* v2026.5.41 : au-dessus du modal-overlay du panel admin (z-index 10000)
+     pour que les toasts de feedback restent visibles avec le flou en arrière. */
+  z-index: 11000;
   display: flex;
   flex-direction: column-reverse;   /* les nouveaux en bas, les anciens au-dessus */
   gap: 8px;

src/viewer.js

@@ -158,22 +158,27 @@ LOG.info("boot", "viewer.js chargé", { version: LOG.version() });
 // Configuration
 // ============================================================================
 
-// Équipe : ID EasyVista → nom affiché
-const TEAM = {
-  "76272": "Ciuppa, Mathieu",
-  "83725": "De Almeida Martins, Solange",
-  "66635": "Makonda, Yannick",
-  "92235": "Mamouni, Anas",
-  "90070": "Paisana, David",
-  "40944": "Pillonel, Olivier",
-  "72485": "Rosset, Pascal",
-  "86874": "Rouiller, Quentin"
-};
+// v2026.5.41 : plus aucune équipe / absence récurrente codée en dur.
+// L'utilisateur configure tout depuis Paramètres → Équipe :
+//   - cfg.team           = { id: name }   — techniciens à afficher
+//   - cfg.recurringAbsences = { id: [days] } — jours d'absence récurrente
+// (chrome.storage.local["admin_config"], persiste entre les mises à jour)
+//
+// TEAM et RECURRING_ABSENCES sont rechargées au boot depuis admin_config par
+// _initTeamFromConfig() (appelée tôt dans init()). Tant qu'elles ne sont pas
+// chargées, elles restent vides → aucun fetch tenté.
+let TEAM = {};
+let RECURRING_ABSENCES = {};
 
-// Absences récurrentes (id tech → [jour JS, 0=dim..6=sam])
-const RECURRING_ABSENCES = {
-  "40944": [5]  // Pillonel absent tous les vendredis
-};
+async function _initTeamFromConfig() {
+  try {
+    const cfg = await loadAdminConfig();
+    TEAM = cfg.team || {};
+    RECURRING_ABSENCES = cfg.recurringAbsences || {};
+  } catch (e) {
+    console.warn("[boot] _initTeamFromConfig err", e);
+  }
+}
 
 // Statuts EasyVista qui déclenchent l'affichage "clos"
 const CLOSED_STATUS = ["Clôturé", "Cloture", "Clôture"];
@@ -183,9 +188,7 @@ const RESOLVED_STATUS = ["Résolu", "Resolu"];
 const CANCELLED_STATUS = ["Annulé", "Annule", "Supprimé", "Supprime"];
 
 // Clés de stockage
-const LS_THEME = "planning_theme";
 const CACHE_PREFIX = "planning_cache_"; // + YYYY-MM-DD
-const CACHE_DAYS = 7;
 
 // v4.1 : plus de constante de concurrence. Les fiches sont fetchées
 // séquentiellement (1 à la fois) car le serveur EasyVista est lent de toute
@@ -372,12 +375,17 @@ function cleanupAbortResolver(myToken) {
 document.addEventListener("DOMContentLoaded", init);
 
 async function init() {
-  initTheme();
+  await initTheme();
   // v2026.5.39 : appliquer le zoom texte enregistré dès le boot, avant que
   // le DOM ne soit affiché (sinon "flash" à la taille par défaut).
   _initTextZoomFromConfig();
   // v2026.5.39 : lire les heures de la journée depuis admin_config (8-18 défaut).
   await _initDayBoundsFromConfig();
+  // v2026.5.41 : charger l'équipe et les absences récurrentes depuis admin_config.
+  // Avant ce point, TEAM = {} → aucun fetch ne tournera tant que la config
+  // n'est pas chargée. Si l'utilisateur n'a rien configuré, le fetch retournera
+  // l'erreur "no_team_configured" qui invite à ouvrir les paramètres.
+  await _initTeamFromConfig();
   bindTopbar();
   bindTooltipInteractions();
   initModalScrollLock();  // v4.2.9 : bloquer le scroll arrière quand modal
@@ -763,10 +771,19 @@ function _getSessionRemainingMs() {
 // Thème clair/sombre
 // ============================================================================
 
-function initTheme() {
-  const saved = localStorage.getItem(LS_THEME);
-  const theme = (saved === "light" || saved === "dark") ? saved : detectDefaultTheme();
-  applyTheme(theme);
+// v2026.5.41 : thème unifié sur admin_config.theme (chrome.storage.local).
+// Le toggle topbar écrit dans la même clé que le select Apparence du panel,
+// pour que les deux soient toujours en accord.
+async function initTheme() {
+  let pref = "auto";
+  try {
+    const cfg = await loadAdminConfig();
+    if (cfg.theme === "light" || cfg.theme === "dark" || cfg.theme === "auto") {
+      pref = cfg.theme;
+    }
+  } catch (e) {}
+  _applyTheme(pref);
+  _watchOsThemeChanges();
 }
 
 function detectDefaultTheme() {
@@ -776,17 +793,20 @@ function detectDefaultTheme() {
   return "light";
 }
 
-function applyTheme(theme) {
-  document.documentElement.setAttribute("data-theme", theme);
-  const icon = document.getElementById("theme-icon");
-  if (icon) icon.textContent = theme === "dark" ? "☀️" : "🌙";
-}
-
-function toggleTheme() {
-  const current = document.documentElement.getAttribute("data-theme") || "light";
-  const next = current === "dark" ? "light" : "dark";
-  applyTheme(next);
-  localStorage.setItem(LS_THEME, next);
+async function toggleTheme() {
+  // L'effectif courant (light ou dark), même si pref="auto"
+  const currentAttr = document.documentElement.getAttribute("data-theme");
+  const effective = (currentAttr === "light" || currentAttr === "dark")
+    ? currentAttr : detectDefaultTheme();
+  const next = effective === "dark" ? "light" : "dark";
+  _applyTheme(next);
+  try {
+    const cfg = await loadAdminConfig();
+    cfg.theme = next;
+    await saveAdminConfig(cfg);
+  } catch (e) {
+    console.warn("[theme] toggle save err", e);
+  }
 }
 
 // ============================================================================
@@ -1587,12 +1607,8 @@ function updateNowLine() {
   });
 }
 
-// v5.0.0 : menu admin caché via 5 clics sur le titre "Planification".
-// v2026.5.38 : initAdminMenu() retiré — l'accès admin passe maintenant par le
-// bouton "⚙ Paramètres" du popup user-badge (clic sur les initiales).
-
 // ============================================================================
-// v5.0.9 : Surveillance du timeout de session EasyVista
+// Surveillance du timeout de session EasyVista
 // ============================================================================
 
 /**
@@ -2005,7 +2021,6 @@ async function loadAdminConfig() {
 async function saveAdminConfig(cfg) {
   try {
     await chrome.storage.local.set({ [ADMIN_CONFIG_KEY]: cfg });
-    console.log("[admin] config sauvegardée");
     return true;
   } catch (e) {
     console.error("[admin] saveAdminConfig err", e);
@@ -2107,7 +2122,17 @@ async function showAdminPanel() {
   async function saveAndReload(updatedCfg) {
     const ok = await saveAdminConfig(updatedCfg);
     if (ok) {
-      showToast("Config enregistrée", "Rechargez l'extension pour appliquer");
+      // v2026.5.41 : application immédiate sans demander de recharger.
+      // 1) repeupler TEAM / RECURRING_ABSENCES en mémoire depuis la nouvelle config.
+      // 2) refetcher le planning du jour courant.
+      // 3) le toast reste visible au-dessus du panel grâce au z-index 11000.
+      await _initTeamFromConfig();
+      showToast("Config enregistrée", "Mise à jour du planning…");
+      try {
+        await loadForDate(state.currentDate);
+      } catch (e) {
+        console.warn("[admin] reload planning err", e);
+      }
     } else {
       showAlertModal({
         title: "Erreur",
@@ -2192,7 +2217,7 @@ function renderAdminSectionTeam(container, cfg, saveFn) {
     cfg.groupName = name;
     updateGroupIdCaption(id);
     await saveAdminConfig(cfg);
-    showToast("Groupe enregistré", `${name || id} (rechargez l'extension pour appliquer)`);
+    showToast("Groupe enregistré", name || id);
     // v2026.5.41 : refresh auto de la liste d'équipe avec le nouveau group_id.
     await refreshTeamForGroup(id);
   });
@@ -2521,12 +2546,45 @@ function renderAdminSectionEV(container, cfg, saveFn) {
     }
     internalInput.value = a;
     externalInput.value = b;
+
+    // v2026.5.41 : si un domaine n'est pas dans le host_permissions par défaut
+    // du manifest, demander la permission au navigateur. Sans ça, le service
+    // worker ne peut pas fetcher ces nouveaux domaines.
+    const hardcodedDefaults = [DEFAULT_EV_ORIGIN_INTERNAL, DEFAULT_EV_ORIGIN_EXTERNAL];
+    const customOrigins = [a, b].filter(o => !hardcodedDefaults.includes(o));
+    if (customOrigins.length > 0) {
+      const origins = customOrigins.map(o => o + "/*");
+      try {
+        const granted = await chrome.permissions.request({ origins });
+        if (!granted) {
+          status.textContent = "⚠ Permission refusée pour " + customOrigins.join(", ") + ". Les fetches échoueront sur ces domaines.";
+          showAlertModal({
+            title: "Permission refusée",
+            message: "Vous avez refusé l'accès aux domaines personnalisés. L'extension ne pourra pas y fetcher de données. Vous pouvez réessayer en cliquant à nouveau sur Enregistrer.",
+            buttons: [{ label: "OK", variant: "secondary", action: () => {} }]
+          });
+          return;
+        }
+      } catch (e) {
+        console.warn("[admin] permissions.request err", e);
+        status.textContent = "Erreur permission : " + (e.message || e);
+        return;
+      }
+    }
+
     cfg.evOrigins = [a, b];
     const ok = await saveAdminConfig(cfg);
-    status.textContent = ok
-      ? "Domaines enregistrés. Rechargez l'extension pour appliquer."
-      : "Erreur lors de l'enregistrement.";
-    if (ok) showToast("Domaines enregistrés", `${a}  •  ${b}`);
+    if (!ok) {
+      status.textContent = "Erreur lors de l'enregistrement.";
+      return;
+    }
+    status.textContent = "Domaines enregistrés.";
+    showToast("Domaines enregistrés", `${a}  •  ${b}`);
+    try {
+      await refreshSessionAndLoad();
+    } catch (e) {
+      console.warn("[admin] reload after EV domain change err", e);
+    }
   });
   btnWrap.appendChild(saveBtn);
 
@@ -2661,12 +2719,14 @@ function renderAdminSectionAppearance(container, cfg, saveFn) {
   container.appendChild(zoomRow);
 
   // ---- Heures de la journée (4e) ----
+  // v2026.5.41 : bouton "Appliquer" explicite (au lieu de save direct au change),
+  // avec toast de confirmation et reload du planning + de la timeline.
   const hoursRow = _makeAdminRow(
     "Heures de la journée",
-    "Plage horaire affichée sur la timeline. Défaut : 8h - 18h."
+    "Plage horaire affichée sur la timeline. Défaut : 8h - 18h. Cliquez sur Appliquer pour valider et recharger."
   );
   const hoursWrap = document.createElement("div");
-  hoursWrap.style.cssText = "display:flex; align-items:center; gap:6px;";
+  hoursWrap.style.cssText = "display:flex; align-items:center; gap:6px; flex-wrap:wrap;";
   const hStart = document.createElement("input");
   hStart.type = "number"; hStart.min = "0"; hStart.max = "23"; hStart.step = "1";
   hStart.className = "admin-input admin-input-num";
@@ -2681,7 +2741,13 @@ function renderAdminSectionAppearance(container, cfg, saveFn) {
   const hSuffix = document.createElement("span");
   hSuffix.textContent = "h";
   hSuffix.style.cssText = "color: var(--text-muted); font-size: 13px;";
-  const _saveHours = async () => {
+
+  const applyBtn = document.createElement("button");
+  applyBtn.type = "button";
+  applyBtn.className = "btn btn-primary";
+  applyBtn.textContent = "✓ Appliquer";
+  applyBtn.style.marginLeft = "10px";
+  applyBtn.addEventListener("click", async () => {
     let s = parseInt(hStart.value, 10);
     let e = parseInt(hEnd.value, 10);
     if (isNaN(s) || s < 0) s = 0;
@@ -2690,16 +2756,53 @@ function renderAdminSectionAppearance(container, cfg, saveFn) {
     if (e > 24) e = 24;
     hStart.value = String(s);
     hEnd.value = String(e);
+
+    // Pas de changement effectif → on évite le reload inutile
+    const unchanged = (cfg.dayStart === s) && (cfg.dayEnd === e);
     cfg.dayStart = s;
     cfg.dayEnd = e;
-    await saveAdminConfig(cfg);
-  };
-  hStart.addEventListener("change", _saveHours);
-  hEnd.addEventListener("change", _saveHours);
+
+    applyBtn.disabled = true;
+    const oldLabel = applyBtn.textContent;
+    applyBtn.textContent = "Application…";
+    try {
+      const ok = await saveAdminConfig(cfg);
+      if (!ok) {
+        showAlertModal({
+          title: "Erreur",
+          message: "Impossible d'enregistrer les heures.",
+          buttons: [{ label: "OK", variant: "secondary", action: () => {} }]
+        });
+        return;
+      }
+      // Mettre à jour les bornes en mémoire pour la timeline (utilisées
+      // par buildTimeline / updateNowLine sans re-fetch).
+      DAY_START = s * 60;
+      DAY_END = e * 60;
+      showToast("Heures appliquées", `${s}h → ${e}h`);
+      if (!unchanged) {
+        // Refetch le planning pour que les requêtes EV repartent avec
+        // les nouvelles bornes (day_start_hour / day_end_hour).
+        await loadForDate(state.currentDate);
+      }
+    } catch (err) {
+      console.warn("[admin] apply hours err", err);
+      showAlertModal({
+        title: "Erreur",
+        message: "Échec de l'application : " + (err.message || err),
+        buttons: [{ label: "OK", variant: "secondary", action: () => {} }]
+      });
+    } finally {
+      applyBtn.disabled = false;
+      applyBtn.textContent = oldLabel;
+    }
+  });
+
   hoursWrap.appendChild(hStart);
   hoursWrap.appendChild(sep);
   hoursWrap.appendChild(hEnd);
   hoursWrap.appendChild(hSuffix);
+  hoursWrap.appendChild(applyBtn);
   hoursRow.querySelector(".admin-row-control").appendChild(hoursWrap);
   container.appendChild(hoursRow);
 }
@@ -2859,12 +2962,32 @@ function renderAdminSectionAbout(container, cfg, saveFn) {
 // Helper applique un thème (utilisé par le sélecteur Apparence).
 // Si "auto", on retire data-theme pour laisser le CSS detecter prefers-color-scheme.
 function _applyTheme(theme) {
+  // v2026.5.41 : on résout "auto" en JS plutôt que de retirer data-theme,
+  // car le CSS n'a pas de bloc @media (prefers-color-scheme: dark) et
+  // retomberait sur le thème clair par défaut. On lit prefers-color-scheme
+  // du navigateur et on pose data-theme="dark" ou "light" en conséquence.
   const html = document.documentElement;
-  if (theme === "light" || theme === "dark") {
-    html.setAttribute("data-theme", theme);
-  } else {
-    html.removeAttribute("data-theme");
-  }
+  const effective = (theme === "light" || theme === "dark") ? theme : detectDefaultTheme();
+  html.setAttribute("data-theme", effective);
+  // Sync l'icône topbar avec le thème effectif.
+  const icon = document.getElementById("theme-icon");
+  if (icon) icon.textContent = effective === "dark" ? "☀️" : "🌙";
+}
+
+// v2026.5.41 : écoute les changements de thème OS pour les répercuter
+// quand l'utilisateur est en mode "auto" (cfg.theme === "auto" ou absent).
+function _watchOsThemeChanges() {
+  if (!window.matchMedia) return;
+  const mq = window.matchMedia("(prefers-color-scheme: dark)");
+  const handler = async () => {
+    try {
+      const cfg = await loadAdminConfig();
+      const pref = cfg.theme || "auto";
+      if (pref === "auto") _applyTheme("auto");
+    } catch (e) {}
+  };
+  if (mq.addEventListener) mq.addEventListener("change", handler);
+  else if (mq.addListener) mq.addListener(handler);  // fallback Safari ancien
 }
 
 function renderAdminSectionDiagnostics(container, cfg, saveFn) {
@@ -3840,6 +3963,12 @@ async function fetchPlanningForDate(isoDate) {
         } else {
           showEvUnreachable();
         }
+      } else if (resp.error === "no_team_configured") {
+        // v2026.5.41 : aucun technicien sélectionné dans Paramètres → Équipe
+        showError(
+          "Aucun technicien sélectionné. Ouvrez ⚙ Paramètres → Équipe pour " +
+          "choisir le groupe EasyVista et cocher les techniciens à afficher."
+        );
       } else {
         showError("Erreur de fetch : " + (resp.error || "inconnue"));
       }
@@ -5727,17 +5856,21 @@ function isTechAbsent(tech, isoDate) {
 // Construction d'une carte
 // ============================================================================
 
-// v4.1.20 : détecte si tech = Pillonel Olivier ET jour = vendredi.
-// Hardcodé car c'est une absence récurrente connue spécifique à lui.
-function isPillonelAbsentFriday(tech, isoDate) {
-  if (!tech || !tech.name) return false;
-  // Normaliser le nom (tolère "Pillonel, Olivier", "Pillonel Olivier", etc.)
-  const name = tech.name.toLowerCase();
-  if (!name.includes("pillonel")) return false;
-  if (!name.includes("olivier")) return false;
-  // Jour de la semaine : 5 = vendredi (en JS, 0=dim, 1=lun, ..., 5=ven)
-  const d = isoToDate(isoDate);
-  return d.getDay() === 5;
+// v2026.5.41 : générique. Plus aucun nom hardcodé. Lit cfg.recurringAbsences
+// (chargé depuis admin_config) : pour chaque tech.id, un tableau de jours JS
+// (0=dim, 1=lun, …, 6=sam) où il est marqué absent récurrent.
+function isRecurringAbsence(tech, isoDate) {
+  if (!tech || !tech.id) return false;
+  const days = RECURRING_ABSENCES[tech.id];
+  if (!Array.isArray(days) || days.length === 0) return false;
+  const day = isoToDate(isoDate).getDay();
+  return days.includes(day);
+}
+
+// Libellé "Absent le <jour>" — calculé depuis la date au lieu d'être hardcodé.
+function _recurringAbsenceLabel(isoDate) {
+  const names = ["dimanche", "lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi"];
+  return "Absent le " + names[isoToDate(isoDate).getDay()];
 }
 
 /**
@@ -5752,9 +5885,9 @@ function buildCard(tech, isoDate) {
 
   const isPompier = tech.interventions.some(iv => iv.isPompier);
   const isAbsent = isTechAbsent(tech, isoDate);
-  // v2026.5.30 : détecter aussi les absences récurrentes hardcodées (Pillonel vendredi)
-  // pour leur appliquer le code couleur cyan (comme Congé) au lieu du rouge Pompier.
-  const isRecurring = isPillonelAbsentFriday(tech, isoDate);
+  // v2026.5.41 : absence récurrente générique (configurée par tech dans
+  // Paramètres → Équipe). Code couleur cyan (comme Congé).
+  const isRecurring = isRecurringAbsence(tech, isoDate);
 
   if (isPompier) card.classList.add("is-pompier");
   if (isAbsent) card.classList.add("is-absent");
@@ -5782,6 +5915,37 @@ function buildCard(tech, isoDate) {
   const absenceBlocks = tech.interventions.filter(iv => iv.type === "AL-Absence");
   const pompierBlocks = tech.interventions.filter(iv => iv.isPompier);
 
+  // v2026.5.41 : conflit absence/réservation × intervention.
+  // Si une intervention est planifiée alors que le tech a une absence (non-pompier)
+  // ou une réservation au même créneau, on marque la carte de l'intervention en
+  // rouge plein. Cas full-day : toutes les interv réelles sont marquées.
+  const conflictPeriods = [];
+  for (const iv of tech.interventions) {
+    const isAbsenceConflict = iv.type === "AL-Absence" && !iv.isPompier;
+    const isReservationConflict = iv.type === "AL-Reservation";
+    if (!isAbsenceConflict && !isReservationConflict) continue;
+    const s = timeToMinutes(iv.startTime);
+    const e = timeToMinutes(iv.endTime);
+    if (s === null || e === null) {
+      // Pas d'horaires précis → on considère que ça couvre toute la journée
+      conflictPeriods.push([DAY_START, DAY_END]);
+    } else {
+      conflictPeriods.push([s, e]);
+    }
+  }
+  // Absence récurrente ce jour ou full-day → toute la journée est en conflit
+  if (isAbsent || isRecurring) {
+    conflictPeriods.push([DAY_START, DAY_END]);
+  }
+  // Stamp chaque intervention réelle (uniquement type AL-Intervention)
+  for (const iv of realInterventions) {
+    if (iv.type !== "AL-Intervention") { iv._absenceConflict = false; continue; }
+    const ivS = timeToMinutes(iv.startTime);
+    const ivE = timeToMinutes(iv.endTime);
+    if (ivS === null || ivE === null) { iv._absenceConflict = false; continue; }
+    iv._absenceConflict = conflictPeriods.some(([cs, ce]) => ivS < ce && ivE > cs);
+  }
+
   const morning = realInterventions.filter(iv => {
     const s = timeToMinutes(iv.startTime);
     return s !== null && s < 12 * 60;
@@ -5810,7 +5974,7 @@ function buildCard(tech, isoDate) {
     const badge = document.createElement("div");
     badge.className = "card-tech-badge";
     if (isRecurring) {
-      // v2026.5.30 : absence récurrente (Pillonel vendredi) → badge "Absent" cyan
+      // v2026.5.41 : absence récurrente (configurée par tech) → badge "Absent" cyan
       badge.classList.add("badge-recurring");
       badge.textContent = "Absent";
     } else if (isPompier) {
@@ -5946,19 +6110,16 @@ function buildCard(tech, isoDate) {
     }
   }
 
-  // v4.1.20 : cas spécifique Pillonel Olivier, absent tous les vendredis.
-  // Affichage d'un message explicite au lieu de "Pas d'intervention planifiée".
-  // v4.2 : prioritaire même si un bloc AL-Absence couvre le vendredi (ce qui
-  //        est le cas normal), pour TOUJOURS afficher "Absent le vendredi".
-  const isPillonelFriday = isPillonelAbsentFriday(tech, isoDate);
+  // v2026.5.41 : absence récurrente générique. Affichage d'un message
+  // "Absent le <jour>" priorité, même si un bloc AL-Absence couvre le jour.
+  const isRecurringDay = isRecurringAbsence(tech, isoDate);
 
-  // Absent sans interv → on stop là (après avoir posé le message Pillonel
-  // si vendredi).
+  // Absent sans interv → on stop là (après avoir posé le message récurrent si applicable).
   if (isAbsent && realInterventions.length === 0) {
-    if (isPillonelFriday) {
+    if (isRecurringDay) {
       const note = document.createElement("div");
       note.className = "tech-absence-recurring";
-      note.textContent = "Absent le vendredi";
+      note.textContent = _recurringAbsenceLabel(isoDate);
       body.appendChild(note);
     }
     card.appendChild(body);
@@ -5980,10 +6141,10 @@ function buildCard(tech, isoDate) {
   });
 
   if (realInterventions.length === 0 && !isPompier && !hasPartialAbsences) {
-    if (isPillonelFriday) {
+    if (isRecurringDay) {
       const note = document.createElement("div");
       note.className = "tech-absence-recurring";
-      note.textContent = "Absent le vendredi";
+      note.textContent = _recurringAbsenceLabel(isoDate);
       body.appendChild(note);
     } else {
       const empty = document.createElement("div");
@@ -5995,11 +6156,11 @@ function buildCard(tech, isoDate) {
     return card;
   }
 
-  // Pillonel vendredi avec quand même des interv planifiées ? Rare mais possible.
-  if (isPillonelFriday && realInterventions.length > 0) {
+  // Tech avec absence récurrente ce jour mais quand même des interv planifiées ? Rare mais possible.
+  if (isRecurringDay && realInterventions.length > 0) {
     const note = document.createElement("div");
     note.className = "tech-absence-recurring";
-    note.textContent = "Absent le vendredi";
+    note.textContent = _recurringAbsenceLabel(isoDate);
     body.appendChild(note);
   }
 
@@ -6163,6 +6324,8 @@ function _buildMiniCardsRow(realInterventions, cardEl) {
     const ivIdx = realInterventions.indexOf(iv);
     const card = document.createElement("div");
     card.className = "iv-mini-card color-" + colorKey;
+    // v2026.5.41 : conflit avec absence/réservation → mini-card rouge plein
+    if (iv._absenceConflict) card.classList.add("intervention-conflict-absence");
     card.dataset.ivIdx = String(ivIdx);
     if (iv.ref) card.dataset.ref = iv.ref;
 
@@ -6243,10 +6406,17 @@ function _buildMiniCardsRow(realInterventions, cardEl) {
           openInterventionFromTimeline(card, { background: true });
           return;
         }
-        // v2026.5.40 r10 : forcer l'affichage IMMÉDIAT de la grande popup
-        // ancrée AVANT pinTooltip(). Sans ça, si le délai showTooltip 500ms
-        // n'est pas encore écoulé OU si la petite popup timeline était
-        // affichée juste avant, c'est elle qui se faisait épingler.
+        // v2026.5.41 : en vue horizontale, le clic simple ouvre la fiche EV
+        // dans un nouvel onglet (au lieu d'épingler la popup, comportement
+        // peu utile en horizontal car la popup est déjà visible au survol).
+        const isHorizontal = document.documentElement.classList.contains("view-horizontal");
+        if (isHorizontal) {
+          e.preventDefault();
+          e.stopPropagation();
+          openInterventionFromTimeline(card, { background: false });
+          return;
+        }
+        // Vue classique : clic = épingle la grande popup ancrée.
         e.stopPropagation();
         _cancelPendingShowTooltip();
         _cancelPendingTimelinePopover();
@@ -6695,6 +6865,8 @@ function buildInterventionRow(iv, cardEl) {
   row.className = "intervention-v2";
   row.dataset.actionId = iv.actionId;
   if (iv.isPompier) row.classList.add("is-pompier-line");
+  // v2026.5.41 : intervention en conflit avec une absence/réservation → rouge plein
+  if (iv._absenceConflict) row.classList.add("intervention-conflict-absence");
   // v4.3.3 : on ne marque plus les ghosts visuellement (classe is-ghost
   // retirée). Les tickets disparus sont soit retirés (_disappearRemove),
   // soit affichés en vert (_disappearStatus). Plus de barrage.
@@ -8110,14 +8282,23 @@ function positionTooltipAnchored(sourceEl, opts) {
 
   // 4 candidats (ordre : droite → gauche → dessous → dessus)
   //   Préférence opts.anchorBelow = true : dessous en premier (ex: clic timeline)
+  // v2026.5.41 : en vue horizontale, on n'autorise QUE dessous/dessus (la
+  // sidebar à gauche et la timeline pleine largeur rendent gauche/droite
+  // peu praticables et le popup masquerait la row source).
   const rightCandidate  = { x: srcRect.right + pad, y: srcRect.top,             label: "droite"  };
   const leftCandidate   = { x: srcRect.left - tipW - pad, y: srcRect.top,       label: "gauche"  };
   const belowCandidate  = { x: srcRect.left, y: srcRect.bottom + pad,           label: "dessous" };
   const aboveCandidate  = { x: srcRect.left, y: srcRect.top - tipH - pad,       label: "dessus"  };
 
-  const candidates = opts.anchorBelow
-    ? [belowCandidate, aboveCandidate, rightCandidate, leftCandidate]
-    : [rightCandidate, leftCandidate, belowCandidate, aboveCandidate];
+  const isHorizontal = document.documentElement.classList.contains("view-horizontal");
+  let candidates;
+  if (isHorizontal) {
+    candidates = [belowCandidate, aboveCandidate];
+  } else if (opts.anchorBelow) {
+    candidates = [belowCandidate, aboveCandidate, rightCandidate, leftCandidate];
+  } else {
+    candidates = [rightCandidate, leftCandidate, belowCandidate, aboveCandidate];
+  }
 
   const pinnedRects = (typeof _getPinnedPopupsViewportRects === "function")
     ? _getPinnedPopupsViewportRects()
@@ -8147,10 +8328,16 @@ function positionTooltipAnchored(sourceEl, opts) {
   }
 
   if (!chosen) {
-    // Fallback : droite clampée à tout prix, même si ça chevauche (cas rare
-    // avec écran minuscule ou beaucoup de popups épinglés)
-    let fx = srcRect.right + pad;
-    let fy = srcRect.top;
+    // Fallback : en horizontal, dessous clampé. En classique, droite clampée.
+    // Même si ça chevauche (cas rare : écran minuscule ou beaucoup de popups épinglés).
+    let fx, fy;
+    if (isHorizontal) {
+      fx = srcRect.left;
+      fy = srcRect.bottom + pad;
+    } else {
+      fx = srcRect.right + pad;
+      fy = srcRect.top;
+    }
     if (fx + tipW > safe.right) fx = safe.right - tipW;
     if (fx < safe.left) fx = safe.left;
     if (fy + tipH > safe.bottom) fy = safe.bottom - tipH;
@@ -8227,13 +8414,20 @@ function _findFreePopupPosition(rowEl, w, h) {
   // v2026.5.20 : utiliser la safe area (en dessous topbar, au-dessus dock)
   const safe = _getPopupSafeArea();
 
-  // 4 candidats d'abord, autour de la row source (en coords viewport)
-  const candidates = [
-    { x: rowRect.right + pad, y: rowRect.top,         name: "droite"  },
-    { x: rowRect.left - w - pad, y: rowRect.top,      name: "gauche"  },
-    { x: rowRect.left, y: rowRect.bottom + pad,       name: "dessous" },
-    { x: rowRect.left, y: rowRect.top - h - pad,      name: "dessus"  }
-  ];
+  // 4 candidats d'abord, autour de la row source (en coords viewport).
+  // v2026.5.41 : en vue horizontale, on n'autorise QUE dessous/dessus.
+  const isHorizontal = document.documentElement.classList.contains("view-horizontal");
+  const candidates = isHorizontal
+    ? [
+        { x: rowRect.left, y: rowRect.bottom + pad,       name: "dessous" },
+        { x: rowRect.left, y: rowRect.top - h - pad,      name: "dessus"  }
+      ]
+    : [
+        { x: rowRect.right + pad, y: rowRect.top,         name: "droite"  },
+        { x: rowRect.left - w - pad, y: rowRect.top,      name: "gauche"  },
+        { x: rowRect.left, y: rowRect.bottom + pad,       name: "dessous" },
+        { x: rowRect.left, y: rowRect.top - h - pad,      name: "dessus"  }
+      ];
 
   // v2026.5.20 : ajouter une grille de positions de fallback couvrant toute
   // la safe area (pas de 60px × 60px) — garantit qu'on trouve ~toujours une
@@ -10036,7 +10230,7 @@ function buildTooltipHTML(iv) {
     if (iv.startTime && iv.endTime) {
       rows.push(row("Horaire", `${iv.startTime}–${iv.endTime}`));
     }
-    // Pour les absences récurrentes (Pillonel vendredi), pas d'actionId réel
+    // Pour les absences récurrentes (configurées par tech), pas d'actionId réel
     // → pas de bouton supprimer. Pour les autres → oui.
     if (iv.actionId) {
       rows.push(`<dt></dt><dd><button type="button" class="tooltip-delete-btn" data-action="delete-item" data-action-id="${escapeHtml(iv.actionId)}" data-kind="absence">🗑 Supprimer cette absence</button></dd>`);