/* AKWABA ASSISTANT — un écran, tenu à bout de bras dans un gbaka. Jour vert et parchemin, nuit verte.
   Tout est gros : on lit ça debout, dans le bruit, une main sur la portière. Les couleurs communes
   (commun/couleurs.css) sont redéfinies ici pour cette page seulement. */
:root{
  --fond:#F7F6F1; --carte:#E6F6F0; --bord:#D6E2DC; --creux:#FFFFFF;
  --vert:#00A67E; --sur-vert:#FFFFFF; --vert-doux:#0B7F63;
  --or:#B98A2E; --sur-or:#1E1600; --or-doux:rgba(185,138,46,.12);
  --texte:#10211B; --doux:#4A5A52; --faible:#6E7D75; --rouge:#B3332F;
}
:root.nuit{
  --fond:#0F1A16; --carte:#163A2E; --bord:#2C3D34; --creux:#0B1512;
  --vert:#1DBF8E; --sur-vert:#06201A; --vert-doux:#5FD3A9;
  --or:#D9B35B; --sur-or:#1E1600; --or-doux:rgba(217,179,91,.12);
  --texte:#E9EFEA; --doux:#8FA097; --faible:#6E7D75; --rouge:#E88B87;
}
/* LE CIEL EN TÊTE (Honoré, 05/10 : « c'est parfait pour assistant et client ») : la bande haute de son image, logo, ciel,
   pont, posée en tête de la page ; dessous, la page garde sa couleur de module. Assistant = bleu, Client = vert.
   Le halo est la seule fantaisie : il dit « en cours » (barre) et « un client » (rond), rien d'autre. */
.ciel{height:210px;position:relative;background:var(--ciel) center top/cover no-repeat;margin:0 auto;max-width:560px}
/* Le nom du module est peint dans la bande (06/10, comme Titulaire et Pixel ID) : le titre tapé reste pour les lecteurs d'écran. */
#laPorte>.surtitre,#laPorte>h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ciel:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,transparent 100%,var(--fond))}
/* Sur un écran large, la bande reste à la largeur de la page (jamais étirée : le logo se couperait) et ses bords se fondent. */
@media (min-width:600px){.ciel{-webkit-mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent)}}
:root[data-application="assistant"]{--ciel:url("/accueil/tete-assistant.webp?v=8");
  --vert:#1D7FD6; --sur-vert:#FFFFFF; --vert-doux:#155FA3; --carte:#E6F0FA; --bord:#D0DCE8; --halo:rgba(29,127,214,.45)}
:root[data-application="assistant"].nuit{--fond:#0A1420; --carte:#122236; --bord:#243A55; --creux:#070E18;
  --vert:#2EA8FF; --sur-vert:#06111C; --vert-doux:#8FD0FF; --doux:#93A6BF; --halo:rgba(46,168,255,.5)}
:root[data-application="client"]{--ciel:url("/accueil/tete-client.webp?v=7"); --halo:rgba(0,166,126,.4)}
:root[data-application="client"].nuit{--halo:rgba(29,191,142,.5)}
main{max-width:560px;padding:18px 16px}

.entete{display:flex;align-items:flex-start;gap:14px;margin:0 0 12px}
.entete .role{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--doux);font-weight:800}
.entete .voiture{font-size:17px;font-weight:800;margin-top:4px;line-height:1.3}
.entete .ligne{font-size:14px;color:var(--doux);margin-top:3px;line-height:1.4}
.entete .lettres{margin-left:auto;flex:0 0 auto;text-align:right;font-weight:700;font-size:46px;line-height:1;color:var(--or)}

.bandeau{background:var(--or);color:var(--sur-or);border-radius:12px;padding:13px 15px;font-size:15px;font-weight:700;line-height:1.35;margin:0 0 12px}
.arret{min-height:22px;font-size:15px;font-weight:700;color:var(--vert-doux);margin:0 0 12px;line-height:1.35}
.sans-voiture{background:var(--carte);border:1px solid var(--bord);border-radius:14px;padding:16px;font-size:16px;line-height:1.5;margin:0 0 12px}

/* (082) La ligne d'état : où en est la voiture, déduit du pouls ; la couleur suit l'étape (à un point, partie, sur sa ligne). */
.etat-trajet{display:flex;align-items:center;gap:12px;padding:16px 18px;border-radius:14px;background:var(--carte);border:1px solid var(--bord);font-size:18px;font-weight:800;line-height:1.3}
.etat-trajet .ic{flex:0 0 auto;margin:0;width:26px;height:26px;color:var(--or)}
.etat-trajet[data-etape="ligne"]{background:var(--vert);color:var(--sur-vert);border-color:transparent}
.etat-trajet[data-etape="ligne"] .ic{color:var(--sur-vert)}
.etat-trajet[data-etape="parti"],.etat-trajet[data-etape="annonce"]{border-color:var(--or)}
.etat-trajet[data-etape="rien"]{color:var(--doux);font-weight:700}
.sous-remplir{font-size:14px;color:var(--doux);line-height:1.45;margin:9px 2px 0;display:flex;align-items:center;gap:10px}
.sous-remplir span{flex:1 1 auto}
.sous-remplir button{width:auto;margin:0;padding:7px 12px;font-size:13px;flex:0 0 auto}

.zone-rond{display:grid;place-items:center;margin:22px 0 14px}
.rond{width:248px;height:248px;max-width:78vw;max-height:78vw;border-radius:50%;border:0;background:var(--vert);color:var(--sur-vert);
  margin:0;padding:16px;display:grid;place-items:center;gap:6px;text-align:center}
.rond .gros{font-family:"JetBrains Mono",monospace;font-weight:700;font-size:52px;line-height:1;letter-spacing:.03em}
.rond .quand{font-size:17px;font-weight:700;opacity:.92}
.rond .quoi{font-size:16px;font-weight:800;opacity:1;line-height:1.3;color:inherit;text-transform:none;letter-spacing:0;margin:0}
.rond.vide{background:transparent;border:2px dashed var(--bord);color:var(--faible);cursor:default;opacity:1}
.rond.vide .gros{font-family:inherit;font-size:24px;font-weight:800;letter-spacing:0}
.rond.creation{background:var(--vert)}
.rond.creation.arrivee{background:var(--or);color:var(--sur-or)}
.rond.creation .gros{font-family:inherit;font-size:34px;letter-spacing:0}
.puis{text-align:center;font-size:14px;color:var(--doux);min-height:20px;margin:0 0 4px}
.pas-monte{width:auto;margin:4px auto 10px;display:block;font-size:15px;padding:10px 18px}
.pas-monte.confirme{background:#E07A2E;border-color:#9A4A0E;color:#3A1A03;animation:attend .5s steps(2,end) infinite}

.bas{display:flex;align-items:center;gap:12px;border-top:1px solid var(--bord);padding-top:14px;margin-top:6px}
.bas .compte{font-size:16px;font-weight:800}
.bas button{width:auto;margin:0 0 0 auto;background:transparent;border:1px solid var(--bord);color:var(--doux);border-radius:999px;padding:9px 16px;font-size:14px;font-weight:700}
#secQui{margin-top:18px}

.nombre{font-family:"JetBrains Mono",monospace;font-size:34px;font-weight:700;text-align:center}
.feuille label{margin:14px 0 6px}
/* La feuille Départ (04/10) : la commune en grand, et les flèches de pagination comme chez le titulaire. */
.feuille select{width:100%;padding:14px 16px;border-radius:12px;border:2px solid var(--bord);background:var(--carte);color:var(--texte);font-size:18px;font-family:inherit;font-weight:800;margin:0 0 10px}
/* La zone de recherche se voit (Honoré, 04/10) : la loupe dedans, le cadre or, le mot au-dessus avec son icône. */
.recherche{position:relative;margin:0 0 12px}
.recherche>.ic{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:24px;height:24px;margin:0;color:var(--or);pointer-events:none}
.recherche input[type="search"]{width:100%;padding:15px 16px 15px 50px;border-radius:12px;border:2px solid var(--or);background:var(--creux);color:var(--texte);font-size:18px;font-family:inherit;font-weight:700;margin:0;box-shadow:0 0 0 3px var(--or-doux)}
.recherche input::placeholder{color:var(--doux);font-weight:600}
.pages{display:flex;align-items:center;justify-content:center;gap:16px;margin:12px 0 4px}
.pages .rond-page{width:48px;height:48px;border-radius:50%;padding:0;margin:0;display:grid;place-items:center;background:var(--creux);color:var(--or);border:1px solid var(--bord)}
.pages .rond-page[disabled]{opacity:.35}
.pages .ic{width:22px;height:22px;margin:0}
.entree b{font-weight:800;display:flex;align-items:center}
.liste{list-style:none;padding:0;margin:0}
.liste li{display:flex;gap:10px;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--bord);font-size:15px}
.liste li .code{font-family:"JetBrains Mono",monospace;font-weight:700}
.liste li .det{margin-left:auto;color:var(--doux);font-size:13px;text-align:right}
/* (08/10) Le premier de la liste « En attente » est le client du gros rond : un trait d'or le dit. */
.liste li.premier{border-left:4px solid var(--or);padding-left:10px}
.liste li.premier .det{color:var(--texte);font-weight:700}
/* (08/10) Compté au passage, sans appui de l'apprenti : en gris, pour ne pas le confondre avec un vrai « Il monte ». */
.liste li.passage{opacity:.55}
.liste li.passage .code{font-weight:400}


/* Le compteur du Départ (02/10) : deux gros ronds et le nombre en grand ; une main sur la portière, un pouce libre. */
.compteur{display:flex;align-items:center;justify-content:center;gap:18px;margin:6px 0 4px}
.compteur .nombre{min-width:96px;font-size:56px;line-height:1}
.compteur button{width:72px;height:72px;border-radius:50%;margin:0;padding:0;display:grid;place-items:center;border:0;flex:0 0 auto}
.compteur .moins{background:var(--creux);color:var(--texte);border:1px solid var(--bord)}
.compteur .plus{background:var(--vert);color:var(--sur-vert)}
.compteur svg{width:30px;height:30px;fill:currentColor}
.compteur button:disabled{opacity:.35}

/* L'ASSISTANT D'APRÈS SA PROPOSITION (06/10, « pose ») : la scène d'Abidjan en tête et en fond, la carte Titulaire blanche à
   pastille or, le bandeau or clair, la ligne d'état bleue en relief quand la voiture est sur sa ligne (082), le gros rond du
   client au centre, « Pas monté », à bord et Avancé, le compte. Pas de tuiles ni d'onglets : l'apprenti appuie sans lire. */
:root[data-application="assistant"]{--fond:#F2F5F9;--carte:#FFFFFF;--bord:#D6DEE8;--creux:#F7F9FC;--texte:#10213A;--doux:#4A5A72;--faible:#7A8799;--vert:#1C7FD6;--sur-vert:#fff;--vert-doux:#155FA3;--or:#C9A227;--sur-or:#1E1600;--halo:rgba(28,127,214,.35)}
:root[data-application="assistant"].nuit{--fond:#0B1626;--carte:#122236;--bord:#243A55;--creux:#0E1B2C;--texte:#EEF3FA;--doux:#A9B8CC;--faible:#7B8AA0;--vert:#2EA8FF;--sur-vert:#06111C}
:root[data-application="assistant"] body{background:url("/accueil/fond-assistant.webp?v=6") center top/100% auto repeat-y var(--fond)}
:root[data-application="assistant"] .ciel{height:52vw;min-height:0;max-width:none;background-size:100% auto;background-position:center top;mask-image:none;-webkit-mask-image:none}   /* la scène entière (1190×620), jamais rognée */
/* sur un écran large, la scène garde la largeur de la page, bords fondus, comme les autres têtes */
@media (min-width:600px){:root[data-application="assistant"] .ciel{height:292px;max-width:560px;border-radius:0 0 18px 18px;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}}
:root[data-application="assistant"] .ciel:after{display:none}
:root[data-application="assistant"] main{margin-top:-18px;position:relative}
/* la carte Titulaire blanche : pastille, plaque, « vers … depuis … », badge « En service » */
:root[data-application="assistant"] .entete{background:var(--carte);border-radius:20px;padding:14px 16px;box-shadow:0 10px 28px rgba(0,0,0,.25);gap:14px;align-items:center}
:root[data-application="assistant"] .entete .lettres{order:-1;margin:0;width:64px;height:64px;border-radius:50%;background:#B8902A;color:#fff;display:grid;place-items:center;font-size:24px;font-weight:800;text-align:center}
:root[data-application="assistant"] .entete .role{color:var(--doux)}
:root[data-application="assistant"] .entete .voiture{font-size:21px}
:root[data-application="assistant"] .entete .ligne{color:var(--doux)}
/* le bandeau « Branche le téléphone » en or clair, avec une flèche */
:root[data-application="assistant"] .bandeau{background:#E9D9A6;color:#3B2E07;border-radius:14px;display:flex;align-items:center;gap:12px;box-shadow:0 6px 16px rgba(0,0,0,.18)}
:root[data-application="assistant"] .bandeau::before{content:"";width:30px;height:30px;border-radius:9px;background:#B8902A;flex:0 0 auto}
/* la ligne d'état (082) : carte blanche en relief ; sur sa ligne, bleu vif comme l'ancienne barre « Arrivé » */
:root[data-application="assistant"] .etat-trajet{box-shadow:0 6px 16px rgba(0,0,0,.14)}
:root[data-application="assistant"] .etat-trajet[data-etape="ligne"]{border:0;border-radius:16px;background:linear-gradient(180deg,#2B8DE8,#1565C0);color:#fff;box-shadow:0 8px 0 #0E4A8F,0 10px 24px rgba(21,101,192,.35)}
:root[data-application="assistant"] .sous-remplir{color:var(--doux);font-weight:700}
:root[data-application="assistant"] .sous-remplir button{background:#C9A227;color:#1E1600;border:0;border-radius:12px;padding:8px 14px;font-weight:800}
/* le rond du client : grand, au centre, blanc à liseré bleu quand vide ; bleu plein quand il y a un numéro */
:root[data-application="assistant"] .zone-rond{margin:18px 0 10px}
/* (08/10) Vide, le rond a le même relief que les boutons éteints : clair à liseré bleu le jour, marine la nuit, l'épaisseur dessous. */
:root[data-application="assistant"] .rond.vide{border:1px solid #9CC4EE;color:#5B7A9E;text-shadow:0 1px 0 rgba(255,255,255,.8);cursor:default;
  background:radial-gradient(circle at 32% 26%,#FFFFFF 0%,#F3F7FC 18%,#E2EAF4 48%,#CFDAE8 76%,#BCC9DA 100%);
  box-shadow:0 9px 0 #8FA8C4,inset 0 -8px 14px rgba(20,50,90,.16),inset 0 8px 12px rgba(255,255,255,.85),inset 0 0 0 1px rgba(255,255,255,.6)}
:root.nuit[data-application="assistant"] .rond.vide{border-color:#2E4A6E;color:#8FB0D6;text-shadow:none;
  background:radial-gradient(circle at 32% 26%,#2E4A6E 0%,#223A58 22%,#182C46 55%,#122238 85%,#0E1C30 100%);
  box-shadow:0 9px 0 #08121F,inset 0 -8px 14px rgba(0,0,0,.4),inset 0 8px 12px rgba(255,255,255,.12)}
:root[data-application="assistant"] .pas-monte{background:var(--carte);border:1px solid var(--bord);color:#B3332F;box-shadow:0 4px 12px rgba(0,0,0,.12)}
/* en bas : le compte sur carte blanche, Avancé, et Déconnexion ; « Fermer la journée » n'est pas à l'assistant (c'est le titulaire) */
:root[data-application="assistant"] .bas{background:var(--carte);border-radius:16px;padding:12px 14px;border:0;box-shadow:0 6px 16px rgba(0,0,0,.14)}
:root[data-application="assistant"] .bas button{background:#EAF2FB;border-color:#C9DCF0;color:#1565C0;font-weight:800}
:root[data-application="assistant"] #secQui{border-radius:16px;box-shadow:0 6px 16px rgba(0,0,0,.14)}
:root[data-application="assistant"] .pied{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}

/* ce qui est écrit directement sur le fond prend une carte blanche, comme dans sa maquette */
:root[data-application="assistant"] .arret,:root[data-application="assistant"] .sous-remplir,:root[data-application="assistant"] .puis,:root[data-application="assistant"] #msgEcran{background:rgba(255,255,255,.92);border-radius:10px;padding:8px 12px;color:#10213A;font-weight:700}
:root[data-application="assistant"] .arret:empty,:root[data-application="assistant"] .puis:empty,:root[data-application="assistant"] #msgEcran:empty{display:none}
:root[data-application="assistant"] .arret{color:#1565C0}

:root[data-application="assistant"] #laPorte>.sous,:root[data-application="assistant"] .installer{background:rgba(255,255,255,.92);border-radius:12px;padding:10px 14px;color:#10213A}

/* LE CLIENT D'APRÈS SA PROPOSITION (06/10, « pose ») : la scène d'Abidjan en tête et en fond, l'interrupteur en pilule, « Je vais à »
   vert quand c'est choisi, la barre dorée en relief, le gros rond gardé, puis ses dernières destinations (049) en boutons, le compte.
   Pas de favoris inventés, pas d'onglets. */
:root[data-application="client"]{--fond:#F4F1E8;--carte:#FFFFFF;--bord:#DDD6C4;--creux:#F7F4EC;--texte:#10211B;--doux:#4A5A52;--faible:#6E7D75;--vert:#1B9E5A;--sur-vert:#fff;--or:#D9B35B;--sur-or:#1E1600;--halo:rgba(27,158,90,.35)}
:root[data-application="client"].nuit{--fond:#0F1A16;--carte:#163A2E;--bord:#2C3D34;--creux:#0B1512;--texte:#E9EFEA;--doux:#8FA097;--vert:#1DBF8E;--sur-vert:#06201A}
:root[data-application="client"] body{background:url("/accueil/fond-client.webp?v=2") center top/100% auto repeat-y var(--fond)}
:root[data-application="client"] .ciel{height:52vw;min-height:0;max-width:none;background-size:100% auto;background-position:center top;mask-image:none;-webkit-mask-image:none}   /* la scène entière (1190×620), jamais rognée */
@media (min-width:600px){:root[data-application="client"] .ciel{height:292px;max-width:560px;border-radius:0 0 18px 18px;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}}
:root[data-application="client"] .ciel:after{display:none}
:root[data-application="client"] main{margin-top:-12px;position:relative}
:root[data-application="client"] .haut,:root[data-application="client"] #laPorte>.sous,:root[data-application="client"] .installer,:root[data-application="client"] .bas,:root[data-application="client"] #secQui,:root[data-application="client"] #msgEcran:not(:empty),:root[data-application="client"] .gps:not(:empty){background:rgba(255,255,255,.94);border-radius:16px;padding:12px 14px;box-shadow:0 6px 16px rgba(0,0,0,.12)}
:root[data-application="client"].nuit .haut,:root[data-application="client"].nuit .bas,:root[data-application="client"].nuit #secQui{background:rgba(22,58,46,.94)}
:root[data-application="client"] .onoff{border-radius:999px;background:linear-gradient(180deg,#FFFFFF,#E8E6DD);border:2px solid #CFCABA;box-shadow:0 6px 0 #B9B4A4,0 8px 18px rgba(0,0,0,.15)}
:root[data-application="client"] .onoff[aria-pressed="true"]{background:linear-gradient(180deg,#4FD48F,#1B9E5A);border-color:#157A45;box-shadow:0 6px 0 #0F5C33,0 8px 18px rgba(27,158,90,.35);color:#fff}
:root[data-application="client"] #choixVers,:root[data-application="client"] #choixVehicule{border-radius:14px;border:2px solid #CFE8D8;background:#EEF8F1;color:#10211B}
:root[data-application="client"] #choixVers.choisi{background:#1B9E5A;border-color:#157A45;color:#fff}
:root[data-application="client"] .chercher{border-radius:999px;background:linear-gradient(180deg,#F6DD86,#D9B35B 55%,#B98A2E);box-shadow:0 7px 0 #8A6410,0 10px 22px rgba(185,138,46,.35)}
/* Dernières destinations (049) : un appui = la destination choisie */
.dernieres{margin:12px 0 0}
.dernieres .quoi{display:flex;justify-content:space-between;align-items:center;color:var(--texte);font-size:13px;letter-spacing:.06em;margin:0 2px 8px}
.dernieres .rangee{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.dernieres button{flex:0 0 auto;width:auto;margin:0;padding:12px 16px;border-radius:999px;background:var(--carte);color:var(--texte);border:1px solid var(--bord);font-weight:800;font-size:15px;display:flex;align-items:center;gap:8px;box-shadow:0 4px 10px rgba(0,0,0,.1)}
.dernieres button .ic{width:18px;height:18px;margin:0;color:var(--vert)}
/* (09/10) Dans la feuille « Historique » : en colonne, gros, un lieu par ligne. */
.dernieres.colonne .rangee{flex-direction:column;overflow:visible}
.dernieres.colonne button{width:100%;justify-content:flex-start;font-size:17px;padding:14px 16px;border-radius:14px}
:root[data-application="client"] .puis:not(:empty),:root[data-application="client"] .dernieres .quoi{background:rgba(255,255,255,.94);border-radius:10px;padding:8px 12px;color:#10211B}
:root[data-application="client"] .pied{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
/* (062) L'appui est gardé sur le téléphone, sans réseau : le rond passe au gris du bandeau, jusqu'au retour. */
.rond.garde,:root[data-application="assistant"] .rond.garde{background:#5B5F66;color:#F3F1EC;border-color:#5B5F66;box-shadow:none}
/* (064) Le tour de validation : le rond en bleu profond, le bandeau de même. */
.rond.validation,:root[data-application="assistant"] .rond.validation{background:#1F4E79;color:#F3F6FA;border-color:#1F4E79}
:root[data-application="assistant"] .bandeau.validation{background:#1F4E79;color:#F3F6FA;font-family:"JetBrains Mono",monospace;font-size:13px;letter-spacing:.02em}
:root[data-application="assistant"] .bandeau.validation::before{background:#9CC4EE}
/* (068) La liste des points : une ligne par point, deux boutons ; la couleur dit combien de fois c'est validé. */
.point{background:var(--carte);border:1px solid var(--bord);border-radius:14px;padding:12px 14px;margin:0 0 10px}
.point .nom{font-weight:800;font-size:17px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.point .nom .neuf{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:var(--or);color:var(--sur-or);border-radius:999px;padding:2px 8px}
.point .boutons{display:flex;gap:8px;margin-top:10px}
.point .boutons button{flex:1;margin:0;padding:12px 8px;font-size:15px;font-weight:800;border-radius:12px;border:2px solid transparent}
.point .boutons button.brun{background:#6B4423;color:#F3E9DC;border-color:#4A2E14}          /* (075) à confirmer */
/* (081) Les sept teintes de l'arc-en-ciel, à partir du vert : la teinte = le tour, pour voir que l'appui a été pris. */
.point .boutons button.teinte-1{background:#2F9E5B;color:#06200F;border-color:transparent}   /* vert */
.point .boutons button.teinte-2{background:#2B6FD8;color:#F2F6FF;border-color:transparent}   /* bleu */
.point .boutons button.teinte-3{background:#3F3A9E;color:#EEEDFF;border-color:transparent}   /* indigo */
.point .boutons button.teinte-4{background:#7A3FBF;color:#F6EEFF;border-color:transparent}   /* violet */
.point .boutons button.teinte-5{background:#D2452B;color:#FFF1EE;border-color:transparent}   /* rouge */
.point .boutons button.teinte-6{background:#E08A2B;color:#2A1300;border-color:transparent}   /* orange */
.point .boutons button.teinte-7{background:#E8C72C;color:#2A2200;border-color:transparent}   /* jaune */
.point .boutons button small{display:block;font-size:12px;font-weight:700;opacity:.9;margin-top:2px}
.point .boutons button.confirme{background:#C8762B;color:#1E0E00;border-color:#1E0E00}   /* armé : encore des appuis */

/* (073) Où sont les clients : la couleur du bord dit l'état de la route connue vers cette destination. */
.ou-client{border-left:8px solid var(--bord)}
.ou-client.etat-fluide{border-left-color:#3FA34D}
.ou-client.etat-lent{border-left-color:#E0A02E}
.ou-client.etat-bouche{border-left-color:#D2452B}
.ou-client.etat-inconnu{border-left-color:#7A7F88}
.ou-client.etat-sans{border-left-style:dashed}