/* Paolia — charte commune : mêmes couleurs, même police et même style pour toutes les interfaces (Ouest Hygiène, Marée Boissons, Vergers du Sud…)
   que sur le site public et l'écran de connexion. Couche de surcharge : elle ne change ni la structure ni les fonctions, uniquement les variables
   de couleur, la police et quelques rayons. Chargée après moderne.css ; supprimer ce fichier et ses deux références (index.html, sw.js) suffit à revenir à l'état précédent.
   Palette : bleu #30496F (titres, boutons, barre latérale), beige #FFEED6 (fonds), texte #272727 ; autres teintes de beige choisies. */

@font-face { font-family: "League Spartan"; src: url("/static/vendor/fonts/league-spartan-latin-wght-normal.woff2") format("woff2"); font-weight: 100 900; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "League Spartan"; src: url("/static/vendor/fonts/league-spartan-latin-ext-wght-normal.woff2") format("woff2"); font-weight: 100 900; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ---------- Mode clair : bleu #30496F, beige #FFEED6, texte #272727 ---------- */
:root {
  --oh-bleu: #30496F; --oh-bleu-2: #3D5882; --oh-nuit: #30496F; --oh-vert: #FFEED6; --oh-vert-2: #8F866B;
  --ink: #272727; --ink-2: #3A3730; --slate: #55514A; --muted: #645F54; --titre: #30496F;
  --bg: #FFEED6; --panel: #FDF7EF; --panel-2: #FFEED6; --line: #E8D7BD; --line-2: #F2E1C8;
  --accent: #30496F; --accent-2: #3D5882; --accent-soft: #F8E7CE; --on-accent: #FFEED6;
  --red-soft: #F4DDD7; --amber-soft: #F3E6C4; --green-soft: #E3E9D6; --blue: #30496F; --blue-soft: #F8E7CE; --violet-soft: #F8E7CE; --grey-soft: #F8E7CE;
  --side-bg: #30496F; --side-ink: #F2E1C8; --side-muted: #D3D9E2;
  --shadow: 0 1px 2px rgba(39,39,39,.06); --shadow-lg: 0 18px 50px rgba(48,73,111,.25);
  --ombre-1: 0 1px 2px rgba(39,39,39,.05); --ombre-2: 0 2px 4px rgba(39,39,39,.04), 0 12px 32px rgba(48,73,111,.1);
  --sans: "League Spartan", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --r: 14px; color-scheme: light;
}
/* ---------- Mode sombre : même famille de couleurs (bleu nuit #141D2D en fond, crème en accent) ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #FFEED6; --ink-2: #E8D7BD; --slate: #B4B7AE; --muted: #A3AAA5; --titre: #FFEED6;
    --bg: #141D2D; --panel: #1B2840; --panel-2: #223250; --line: #3A5075; --line-2: #2E4266;
    --accent: #FFEED6; --accent-2: #F2E1C8; --accent-soft: #2A3D61; --on-accent: #30496F;
    --red-soft: #3B1D24; --amber-soft: #3A2D12; --green-soft: #0F3432; --blue: #FFEED6; --blue-soft: #2A3D61; --violet-soft: #2A2256; --grey-soft: #223250;
    --side-bg: #141D2D; --side-ink: #F2E1C8; --oh-bleu: #FFEED6; --oh-bleu-2: #F2E1C8; --oh-nuit: #30496F; --oh-vert: #FFEED6; --oh-vert-2: #8F866B; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ink: #FFEED6; --ink-2: #E8D7BD; --slate: #B4B7AE; --muted: #A3AAA5; --titre: #FFEED6;
  --bg: #141D2D; --panel: #1B2840; --panel-2: #223250; --line: #3A5075; --line-2: #2E4266;
  --accent: #FFEED6; --accent-2: #F2E1C8; --accent-soft: #2A3D61; --on-accent: #30496F;
  --red-soft: #3B1D24; --amber-soft: #3A2D12; --green-soft: #0F3432; --blue: #FFEED6; --blue-soft: #2A3D61; --violet-soft: #2A2256; --grey-soft: #223250;
  --side-bg: #141D2D; --side-ink: #F2E1C8; --oh-bleu: #FFEED6; --oh-bleu-2: #F2E1C8; --oh-nuit: #30496F; --oh-vert: #FFEED6; --oh-vert-2: #8F866B; color-scheme: dark;
}

/* ---------- Police : League Spartan partout, graisse selon l'usage ---------- */
html { font-size: 104%; }
body { font-family: var(--sans); font-size: 14.5px; font-feature-settings: normal; background: var(--bg); color: var(--ink); }
button, input, select, textarea { font-family: inherit; }
h1, h2, h3 { color: var(--titre); }
h1 { font-weight: 700; letter-spacing: -.02em; }
h2 { font-weight: 650; letter-spacing: -.012em; }
h3 { font-weight: 600; }
.kpi .v { font-weight: 650; }
a { text-decoration: none; }
.muted, .small, .tiny { font-weight: 400; }

/* ---------- Style : boutons en pilule, angles francs, sans dégradé ---------- */
.btn { border-radius: 999px; font-weight: 600; }
.btn.small { border-radius: 999px; }
.btn:not(.sec):not(.ghost):not(.danger):not(.vert) { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn:not(.sec):not(.ghost):not(.danger):not(.vert):hover { background: var(--accent-2); border-color: var(--accent-2); }
.btn.vert { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn.vert:hover { background: var(--accent-2); border-color: var(--accent-2); }
.btn:active { transform: scale(.97); }
input[type=text], input[type=search], input[type=email], input[type=password], input[type=number], input[type=date], input[type=datetime-local], input[type=tel], input[type=month], select, textarea { border-radius: 12px; background: var(--panel); }
.card, .kpi { background: var(--panel); border-color: var(--line); box-shadow: none; }
.kpi.accent { background: var(--accent); box-shadow: none; color: var(--on-accent); }
.kpi.accent .l, .kpi.accent .v, .kpi.accent .s { color: var(--on-accent); }

/* Barre latérale : bleu #30496F, entrée active en beige */
.brand b { color: #FFEED6; font-weight: 600; letter-spacing: .01em; }
.nav a:hover { background: rgba(255,238,214,.1); color: #FFEED6; }
.nav a[aria-current="page"] { background: #FFEED6; color: #30496F; font-weight: 600; }
.nav .badge { background: #FFEED6; color: #30496F; }
.side .pied b { color: #FFEED6; }
.bandeau-demo .env-demo button[aria-pressed="true"] { background: #FFEED6; color: #30496F; border-color: #FFEED6; }
.statut.demo::before { background: #FFEED6; }

/* Courbes et repères : bleu #30496F et brun-beige pour la série comparée */
.legende i[style*="ouest_hygiene-vert"] { background: var(--oh-vert-2) !important; }

@media (prefers-reduced-motion: reduce) { .btn:active { transform: none; } }

/* Bandeau de démonstration : bleu #30496F uni (plus de motif rayé) */
.bandeau-demo { background: #30496F; background-image: none; color: #FFEED6; }

/* ---------- Contrôle qualité : contrastes (WCAG AA 4,5:1), anciennes couleurs, police unique, cibles tactiles ---------- */
/* Couleurs d'état un peu plus foncées en mode clair pour tenir 4,5:1 sur leurs fonds beiges */
:root { --green: #0A6A48; --amber: #7C4F00; --red: #A62A20; --f-formation: #7C4F00; --f-appel: #0A6A48; --f-terrain: #30496F; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --green: #52DDB2; --amber: #F2BE5C; --red: #FF8C7F; --f-formation: #F2BE5C; --f-appel: #52DDB2; --f-terrain: #FFEED6; } }
:root[data-theme="dark"] { --green: #52DDB2; --amber: #F2BE5C; --red: #FF8C7F; --f-formation: #F2BE5C; --f-appel: #52DDB2; --f-terrain: #FFEED6; }
.niv.orange, .niv.orange i, .prio-r { color: #963F00; }
:root[data-theme="dark"] .niv.orange, :root[data-theme="dark"] .niv.orange i, :root[data-theme="dark"] .prio-r { color: #FFB26B; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .niv.orange, :root:not([data-theme="light"]) .niv.orange i, :root:not([data-theme="light"]) .prio-r { color: #FFB26B; } }
.leg-pastille, .leg-pastille + i, i[style*="background"] > .leg-pastille { text-shadow: 0 1px 1px rgb(0 0 0 / .55), 0 0 3px rgb(0 0 0 / .3); font-weight: 700; }
.leg-pastille { font-weight: 700; text-shadow: 0 1px 1px rgb(0 0 0 / .55), 0 0 3px rgb(0 0 0 / .3); }

/* Anciennes couleurs de la marque restées en dur : bandeau, carte et repères */
.bandeau-demo select { color: #30496F; }
.marqueur.approx { border-color: #30496F; }
.marqueur.selection { outline-color: #30496F; }
.marqueur-jour { background: #30496F; color: #FFEED6; }
.marqueur-agence { background: #30496F; border-color: #FFEED6; }
.marker-cluster div { background: #30496F; color: #FFEED6; }
.marker-cluster-large div { background: #3D5882; }
.sect-label { color: #272727; }
path.leaflet-interactive[stroke="#003EE7" i], path.leaflet-interactive[stroke="#30496F" i] { stroke: #30496F; }
i[style*="2750C8" i], i[style*="003EE7" i] { background: #30496F !important; }

/* Une seule police : les identifiants (CMD-…, INT-…) et les contrôles de carte passent aussi en League Spartan, chiffres alignés */
.mono, .mono.tiny, td.mono, .sub.mono { font-family: var(--sans); font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.leaflet-container, .leaflet-container a, .leaflet-control-zoom a, .leaflet-bar a, .leaflet-control-attribution { font-family: var(--sans); }
code, kbd, samp, pre { font-family: var(--sans); }

/* Cibles de clic : écrans tactiles = au moins 44 px ; souris = légèrement agrandies sans changer la mise en page */
summary { padding-block: .3rem; }
@media (pointer: coarse) {
  a.small, a.nom, a.sit, summary, button.pl-libre, .nav a, .btn.small, .btn.ghost { min-height: 44px; display: inline-flex; align-items: center; }
  summary { display: flex; }
}
.login a#changer-entreprise, .login #fe a { display: inline-block; padding: .4rem 0; }

/* Chargement : les blocs d'attente battent doucement en opacité (plus de balayage dégradé) */
.sq { background: var(--line-2); background-image: none; animation: sq-souffle 1.3s ease-in-out infinite alternate; }
@keyframes sq-souffle { from { opacity: .55; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .sq { animation: none; opacity: .8; } }

/* Cibles de clic d'au moins 24 px sur ordinateur (liens isolés, boutons de planning) sans changer l'affichage des liens dans les phrases */
a.small, a.nom, a.sit { padding-block: .22rem; }
button.pl-libre { min-height: 28px; }
b.pl-zone[style*="003EE7" i], [style*="background:#003EE7" i] { background: #30496F !important; }
[style*="071A52" i] { border-color: #30496F !important; }

/* Mode sombre : pastille de notifications lisible, attribution de la carte lisible */
:root[data-theme="dark"] .badge-top { color: #141D2D; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .badge-top { color: #141D2D; } }
.leaflet-control-attribution { background: rgba(255,238,214,.88); color: #272727; }
.leaflet-control-attribution a { color: #30496F; }

/* Initiales sur pastilles colorées (couleurs par commercial) : voile sombre uni pour atteindre 4,5:1 ; même teinte, sans dégradé */
.leg-pastille, i[style*="background"]:not(:empty) { box-shadow: inset 0 0 0 100px rgba(0,0,0,.4); font-weight: 700; }
/* Orange de priorité lisible en mode clair */
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .prio-r, :root:not([data-theme="dark"]) .prio-r * { color: #963F00 !important; } }
:root[data-theme="light"] .prio-r, :root[data-theme="light"] .prio-r * { color: #963F00 !important; }
/* Écrans tactiles : liens courts atteignables (zone de clic agrandie sans changer l'affichage) */
@media (pointer: coarse) { a:not(.btn):not(.nav a) { padding-block: .6rem; } }

/* Tableau de priorités personnelles chargé après la page : on réserve sa place pour que le contenu en dessous ne saute pas */
#perso-dr:empty, #p-corps:empty { min-height: 480px; }

/* ---------- Teintes bleues de l'ancienne version : neutralisées. Aucun reflet bleu : seulement les couleurs du site (bleu nuit #30496F, beige #FFEED6, texte #272727) ---------- */
:root {
  --violet: #7A5C3E; --violet-soft: #F8E7CE; --niv-gris: #55514A; --niv-gris-bg: #F8E7CE;
  --f-terrain: #3D5882; --f-rendez_vous: #7A5C3E; --f-reunion: #55514A; --f-absence: #8B8574;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --violet: #D9C9A3; --violet-soft: #2B2A22; --niv-gris: #B4B7AE; --niv-gris-bg: #223250; --f-terrain: #D9C9A3; --f-rendez_vous: #C7A08A; --f-reunion: #B4B7AE; --f-absence: #9A9486; }
}
:root[data-theme="dark"] { --violet: #D9C9A3; --violet-soft: #2B2A22; --niv-gris: #B4B7AE; --niv-gris-bg: #223250; --f-terrain: #D9C9A3; --f-rendez_vous: #C7A08A; --f-reunion: #B4B7AE; --f-absence: #9A9486; }
/* reflets : plus de halo bleu autour de l'entrée de menu active, des boutons et des tuiles ; ombres neutres */
.nav a[aria-current="page"] { box-shadow: inset 3px 0 0 var(--oh-vert); }
.btn:not(.sec):not(.ghost):not(.danger):hover { box-shadow: 0 4px 14px rgba(39,39,39,.16); }
.kpi.accent { background: var(--accent); border-color: var(--accent); box-shadow: none; }
.barre-bas { box-shadow: 0 -6px 22px rgba(39,39,39,.1); }
.pl-ev { box-shadow: 0 1px 2px rgba(39,39,39,.1); } .pl-ev:hover { box-shadow: 0 3px 10px rgba(39,39,39,.2); }
.sect-label { color: #272727; box-shadow: 0 3px 10px rgba(39,39,39,.24); } .sect-label small { color: #55514A; }
.tip-secteur { box-shadow: 0 6px 18px rgba(39,39,39,.22); }
.modal-fond { background: rgba(39,39,39,.5); }
.login .marque p, .login .marque .points, .marque-bas { color: #E8D7BD; }
/* carte : marqueurs et regroupements aux couleurs du site */
.marker-cluster { background: rgba(48,73,111,.18); } .marker-cluster div, .marker-cluster-large div { background: #30496F; }
.marqueur.selection { outline-color: #30496F; } .marqueur.approx { border-color: #30496F; }
.marqueur-jour { background: #30496F; } .marqueur-jour.ajoutee { background: #7A5C3E; } .marqueur-agence { background: #30496F; }
.marqueur-prosp { background: var(--c, #3D5882); }
.dot.prospect { background: #6547C0; } .pt.pro { border-color: #55514A; }

/* Cartes des secteurs : le fond est adouci pour que les territoires ressortent ; étiquettes posées sur les aplats de couleur */
.carte-secteurs .leaflet-tile-pane, #carte .leaflet-tile-pane { filter: saturate(.45) contrast(.96) brightness(1.04); }
.carte-secteurs .sect-label { box-shadow: 0 2px 8px rgba(39,39,39,.35); border-width: 2.5px; }
.carte-secteurs .leaflet-interactive { cursor: pointer; }

/* ---------- Cartes : une couleur ne dit qu'une chose ----------
   États des établissements (identiques sur l'épingle, la pastille de liste et la légende) : rouge = baisse, ambre = potentiel, vert = sain, violet = prospect.
   Les aplats (jours de passage, secteurs) n'utilisent jamais ces quatre teintes ; les points de la carte d'équipe se lisent par leur forme. */
:root { --e-baisse: #D63B30; --e-potentiel: #D98A00; --e-sain: #0E9F6E; --e-prospect: #6547C0; }
.dot.decrochage, .marqueur.decrochage { background: var(--e-baisse); } .dot.potentiel, .marqueur.potentiel { background: var(--e-potentiel); }
.dot.sain, .marqueur.sain { background: var(--e-sain); } .dot.prospect, .marqueur.prospect { background: var(--e-prospect); }
.ep.decrochage { --c: var(--e-baisse); } .ep.potentiel { --c: var(--e-potentiel); } .ep.sain { --c: var(--e-sain); } .ep.prospect { --c: var(--e-prospect); }
.ep.jour, .ep.jour.acceptee, .ep.jour.ajoutee { --c: #30496F; }
.ep.concurrence { --c: #3B3B3B; }
.pt { display: inline-block; box-sizing: border-box; width: 12px; height: 12px; border-radius: 50%; vertical-align: -2px; margin-right: .3rem; }
.pt.vu { background: #30496F; border: 2px solid #fff; box-shadow: 0 0 0 1px #30496F; }
.pt.non { background: #fff; border: 2.5px solid #30496F; box-shadow: none; }
.pt.pro { width: 11px; height: 11px; background: #fff; border: 2.5px solid var(--e-prospect); border-radius: 2px; box-shadow: none; transform: rotate(45deg); margin-right: .45rem; }
.leaflet-marker-icon .pt { margin: 1px; filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .35)); }
.legende i.pt { border-radius: 50%; width: 12px; height: 12px; } .legende i.pt.pro { border-radius: 2px; width: 11px; height: 11px; }
.legende i.sw-approx { background: none; border: 2px dashed #30496F; border-radius: 50%; box-sizing: border-box; }

/* ---------- Tournées de livraison ---------- */
.tn-filtres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-bottom: .9rem }
.tn-resume { display: flex; flex-wrap: wrap; gap: .5rem .8rem; align-items: center; margin-bottom: 1rem }
.tn-g { display: inline-flex; gap: .3rem; align-items: baseline; padding: .2rem .65rem; border-radius: 99px; font-size: .8rem; background: var(--grey-soft, #F2E1C8); color: var(--slate, #55627C) }
.tn-g.a_preparer { background: #FFEED6; color: #7A4B00 } .tn-g.prete { background: #E1ECFF; color: #1F4A9A } .tn-g.en_route { background: #E4F4F6; color: #0B6470 }
.tn-g.livree { background: var(--green-soft, #DDF6EE); color: var(--green, #0B805A) } .tn-g.a_traiter { background: #FDE5E2; color: #8F2118 }
.tn-jour h2 { margin: 1.2rem 0 .5rem; text-transform: capitalize } .tn-jour h2 small { text-transform: none; font-weight: 500; margin-left: .5rem } .tn-auj { background: var(--accent, #30496F); color: #fff; text-transform: none }
.tn-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: .8rem }
.tn-carte { display: grid; gap: .55rem; align-content: start } .tn-carte h3 { margin: 0; font-size: 1rem }
.tn-barre { display: flex; height: 8px; border-radius: 99px; overflow: hidden; background: var(--grey-soft, #F2E1C8); gap: 2px }
.tn-barre i.a_preparer { background: #E0A100 } .tn-barre i.prete { background: #3A6FD0 } .tn-barre i.en_route { background: #12A5B5 } .tn-barre i.livree { background: var(--green, #0B805A) } .tn-barre i.a_traiter { background: #C6372C }
.tn-legende { display: flex; flex-wrap: wrap; gap: .3rem }
.tn-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; max-height: 260px; overflow: auto }
.tn-liste li { display: flex; justify-content: space-between; gap: .6rem; align-items: center; padding: .35rem 0; border-top: 1px solid var(--line-2, #EBEEF5); min-height: 40px } .tn-liste a { color: inherit; text-decoration: none; min-width: 0 }
@media (max-width: 700px) { .tn-filtres { grid-template-columns: 1fr } .tn-grille { grid-template-columns: 1fr } }

/* Pastille du jeton dans l'en-tête : toujours posée sur la barre bleue, donc crème pleine avec un texte foncé lisible dans les deux thèmes */
#jeton-chip .pill { background: #FDF7EF; color: #55514A; }
#jeton-chip .pill.g { color: #0A6A48; } #jeton-chip .pill.a { color: #7C4F00; } #jeton-chip .pill.b { color: #30496F; } #jeton-chip .pill.r { color: #A62A20; }

/* Pastilles d'état de « Gestion des données » : textes clairs en mode sombre (ils restaient verts, ambre, rouge foncés sur fond sombre) */
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pill.o { color: #F2BE5C; } :root:not([data-theme="light"]) .pill.r { color: #FF8C7F; } :root:not([data-theme="light"]) .pill.g { color: #52DDB2; } :root:not([data-theme="light"]) .pill.b { color: #A9BBDA; } }
:root[data-theme="dark"] .pill.o { color: #F2BE5C; } :root[data-theme="dark"] .pill.r { color: #FF8C7F; } :root[data-theme="dark"] .pill.g { color: #52DDB2; } :root[data-theme="dark"] .pill.b { color: #A9BBDA; }