/* ===== Agent PRIVVERT : entonnoir conversationnel ===== */
.ag{position:fixed;inset:0;z-index:999;display:flex;align-items:flex-end;justify-content:center;
    opacity:0;pointer-events:none;transition:opacity .45s ease}
.ag.on{opacity:1;pointer-events:auto}
.ag-bd{position:absolute;inset:0;background:color-mix(in srgb,var(--bg) 62%,transparent);
    backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2)}
.ag-panel{position:relative;width:min(560px,100%);max-height:min(94vh,860px);display:flex;flex-direction:column;
    background:var(--card);border:1px solid var(--line);border-radius:28px 28px 0 0;
    box-shadow:0 -30px 80px -20px rgba(0,0,0,.28);transform:translateY(26px);transition:transform .5s cubic-bezier(.22,1,.36,1)}
.ag.on .ag-panel{transform:translateY(0)}
@media (min-width:640px){.ag{align-items:center}.ag-panel{border-radius:28px;box-shadow:0 40px 110px -30px rgba(0,0,0,.4)}}

.ag-top{display:flex;align-items:center;gap:12px;padding:16px 18px 12px;border-bottom:1px solid var(--line);flex:none}
.ag-av{width:38px;height:38px;border-radius:50%;background:var(--green);display:grid;place-items:center;flex:none;color:#fff}
.ag-av svg{width:21px;height:21px}
.ag-id{flex:1;min-width:0}
.ag-id b{display:block;font-size:14.5px;font-weight:800;line-height:1.2}
.ag-id span{display:block;font-size:12px;color:var(--mut);display:flex;align-items:center;gap:5px}
.ag-dot{width:7px;height:7px;border-radius:50%;background:var(--green);animation:agPulse 2.2s infinite}
@keyframes agPulse{0%,100%{opacity:1}50%{opacity:.35}}
.ag-x{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink2);
    display:grid;place-items:center;cursor:pointer;flex:none}
.ag-x svg{width:16px;height:16px}
.ag-back{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink2);
    display:grid;place-items:center;cursor:pointer;flex:none}
.ag-back[hidden]{display:none}
.ag-bar{height:3px;background:var(--line);flex:none}
.ag-bar i{display:block;height:100%;width:0;background:var(--green);transition:width .55s cubic-bezier(.22,1,.36,1)}

.ag-flow{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:20px 18px 22px;-webkit-overflow-scrolling:touch}
.ag-msg{max-width:92%;font-size:16px;line-height:1.5;color:var(--ink);margin-bottom:14px;
    opacity:0;transform:translateY(8px);animation:agIn .45s cubic-bezier(.22,1,.36,1) forwards}
.ag-msg b{font-weight:800}
.ag-msg.sm{font-size:14.5px;color:var(--mut)}
@keyframes agIn{to{opacity:1;transform:none}}
.ag-type{display:inline-flex;gap:4px;padding:10px 0 16px}
.ag-type i{width:7px;height:7px;border-radius:50%;background:var(--mut);opacity:.5;animation:agT 1.1s infinite}
.ag-type i:nth-child(2){animation-delay:.16s}.ag-type i:nth-child(3){animation-delay:.32s}
@keyframes agT{0%,60%,100%{transform:translateY(0);opacity:.35}30%{transform:translateY(-5px);opacity:1}}

.ag-ch{display:grid;gap:9px;margin-top:4px}
.ag-c{display:flex;align-items:center;gap:13px;width:100%;text-align:left;padding:15px 16px;border-radius:17px;
    border:1px solid var(--line);background:var(--bg2);color:var(--ink);font:inherit;font-size:15.5px;font-weight:600;
    cursor:pointer;transition:border-color .2s,transform .18s,background .2s;
    opacity:0;transform:translateY(10px);animation:agIn .42s cubic-bezier(.22,1,.36,1) forwards}
.ag-c:hover{border-color:var(--green);transform:translateY(-1px)}
.ag-c:active{transform:scale(.985)}
.ag-c .ic{width:34px;height:34px;border-radius:11px;background:var(--card);border:1px solid var(--line);
    display:grid;place-items:center;flex:none;color:var(--green)}
.ag-c .ic svg{width:18px;height:18px}
.ag-c em{display:block;font-style:normal;font-size:12.5px;font-weight:500;color:var(--mut);margin-top:2px}
.ag-c .tx{min-width:0}

.ag-f{display:flex;gap:8px;margin-top:6px;opacity:0;animation:agIn .42s .1s cubic-bezier(.22,1,.36,1) forwards}
.ag-in{flex:1;min-width:0;padding:14px 15px;border-radius:15px;border:1px solid var(--line);background:var(--bg2);
    color:var(--ink);font:inherit;font-size:16px}
.ag-in:focus{outline:none;border-color:var(--green)}
.ag-go{flex:none;width:50px;border-radius:15px;border:none;background:var(--green);color:#fff;cursor:pointer;display:grid;place-items:center}
.ag-go svg{width:19px;height:19px}
.ag-go:disabled{opacity:.4;cursor:default}
.ag-opts{display:grid;gap:6px;margin-top:8px}
.ag-opt{text-align:left;padding:11px 14px;border-radius:13px;border:1px solid var(--line);background:var(--bg2);
    color:var(--ink);font:inherit;font-size:14.5px;cursor:pointer}
.ag-opt:hover{border-color:var(--green)}
.ag-opt small{display:block;color:var(--mut);font-size:12.5px;margin-top:1px}

/* carte du prix */
.ag-prix{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--bg2);margin-top:4px;
    opacity:0;animation:agIn .5s cubic-bezier(.22,1,.36,1) forwards}
.ag-route{position:relative;height:132px;background:linear-gradient(160deg,color-mix(in srgb,var(--green) 9%,var(--card)),var(--card))}
.ag-route svg{position:absolute;inset:0;width:100%;height:100%}
.ag-route .ln{fill:none;stroke:var(--green);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:var(--L);stroke-dashoffset:var(--L);
    animation:agDraw 1.5s .25s cubic-bezier(.4,0,.2,1) forwards}
@keyframes agDraw{to{stroke-dashoffset:0}}
.ag-route .pt{fill:var(--green)}
.ag-route .pt2{fill:none;stroke:var(--green);stroke-width:2;opacity:0;animation:agPop .5s 1.4s forwards}
@keyframes agPop{to{opacity:.45}}
.ag-route .lb{font-size:11.5px;font-weight:800;fill:var(--ink2)}
.ag-route .mid{font-size:11px;font-weight:700;fill:var(--mut)}
.ag-pbody{padding:20px 20px 22px}
.ag-pnum{font-family:var(--serif,inherit);font-size:clamp(36px,11vw,52px);font-weight:700;color:var(--green);line-height:1;white-space:nowrap}
.ag-plab{font-size:12px;font-weight:800;color:var(--mut);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.ag-pdet{font-size:13.5px;color:var(--ink2);font-weight:700;margin-top:8px}
.ag-pnote{font-size:13px;color:var(--mut);margin-top:5px}
.ag-pok{display:grid;gap:7px;margin-top:16px}
.ag-pok div{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink2)}
.ag-pok svg{width:15px;height:15px;color:var(--green);flex:none}

.ag-err{font-size:14px;color:#c0392b;margin-top:8px}
.ag-rappel{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:998;
    display:flex;align-items:center;gap:9px;padding:12px 17px;border-radius:999px;border:none;
    background:var(--green);color:#fff;font:inherit;font-size:14.5px;font-weight:800;cursor:pointer;
    box-shadow:0 14px 34px -10px color-mix(in srgb,var(--green) 70%,transparent);
    opacity:0;transform:translateY(14px);transition:opacity .4s,transform .4s}
.ag-rappel.on{opacity:1;transform:none}
.ag-rappel svg{width:17px;height:17px}
@media (max-width:640px){.ag-rappel{bottom:calc(74px + env(safe-area-inset-bottom))}}
@media (prefers-reduced-motion:reduce){
  .ag,.ag-panel,.ag-msg,.ag-c,.ag-f,.ag-prix,.ag-rappel{transition:none!important;animation:none!important;opacity:1!important;transform:none!important}
  .ag-route .ln{animation:none;stroke-dashoffset:0}
}
.ag-vous{max-width:88%;margin:0 0 14px auto;padding:11px 15px;border-radius:17px 17px 5px 17px;
    background:var(--green);color:#fff;font-size:15.5px;line-height:1.45;font-weight:600;
    opacity:0;animation:agIn .4s cubic-bezier(.22,1,.36,1) forwards}

/* ---------- traduction vers pv.css (18/10/2026) ----------
   L'agent a été écrit contre site.css, qui parlait en --ink, --card, --green.
   Le site est passé à pv.css, qui nomme les mêmes choses --fg, --bg-2, --vert,
   et qui porte un thème clair et un thème sombre. On traduit ici, sur la racine
   de l'agent seulement, avec les anciennes valeurs en repli : les pages encore
   sur site.css (essai-agent.html) gardent exactement leur apparence, et sur une
   page pv.css l'agent suit le thème du visiteur sans une ligne de plus.
   --bg n'a pas besoin de traduction : les deux feuilles le définissent. */
.ag,.ag-rappel{
  --ink:var(--fg,#0e1726);
  --ink2:var(--fg-2,#33414f);
  --mut:var(--fg-2,#5d6b80);
  --line:var(--rule,#e6ece9);
  --green:var(--vert,#0fae7e);
  --card:var(--bg-2,#ffffff);
  /* --bg2 remplit les champs et le bloc de prix, posés sur le panneau : un
     voile translucide les soulève vraiment, en clair comme en sombre, là où
     --bg-2 leur aurait donné la couleur du panneau lui-même. */
  --bg2:var(--rule-2,#f4f8f5);
}