/* Growth Gusto — area: avis (« Votre avis sur Growth Gusto » + boîte admin) */
:root{--c-idee:#4A1FE6;--c-probleme:#D42A48;--c-jadore:#D63A7A;--c-question:#1F7AE0}

/* hero */
.av-hero{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:var(--r);color:#fff;background:linear-gradient(120deg,#5B2BFF,#3C3CF0 45%,#7A4DFF);background-size:220% 220%;animation:mesh 14s ease-in-out infinite;box-shadow:0 22px 40px -22px rgba(74,31,230,.8);position:relative;overflow:hidden}
.av-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(50% 80% at 95% -10%,rgba(158,215,255,.6),transparent 70%);pointer-events:none}
.av-hero b{display:block;font-size:17px;font-weight:800;letter-spacing:-.025em;position:relative;z-index:1}
.av-hero span{display:block;font-size:13px;opacity:.85;font-weight:600;margin-top:2px;position:relative;z-index:1}
.av-hico{width:46px;height:46px;flex:none;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.18);border:1px solid rgb(var(--hl) / calc(.3 * var(--hla)));position:relative;z-index:1;animation:avwig 3.6s 1s ease-in-out infinite}
.av-hico .ico{width:24px;height:24px}
@keyframes avwig{0%,86%,100%{transform:none}90%{transform:rotate(-10deg) scale(1.06)}95%{transform:rotate(8deg)}}

/* composer */
.av-cap{padding:18px;display:flex;flex-direction:column;gap:16px}
.av-types{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.av-type{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 4px 11px;border-radius:18px;background:var(--glass-2);border:1.5px solid var(--edge);color:var(--muted);transition:background .25s,border-color .25s,color .25s,transform .18s var(--ease);min-height:84px}
.av-type b{font-size:12.5px;font-weight:800;letter-spacing:-.01em;white-space:nowrap}
.av-type:active{transform:scale(.94)}
.av-type.on{background:var(--solid);color:var(--ink);border-color:var(--tc);box-shadow:0 10px 22px -14px var(--tc)}
.av-type.pop .av-tic{animation:avtic .55s var(--spring)}
@keyframes avtic{0%{transform:scale(.7) rotate(-14deg)}55%{transform:scale(1.2) rotate(6deg)}100%{transform:none}}
.av-type.idee,.av-tic.idee{--tc:var(--c-idee)}.av-type.probleme,.av-tic.probleme{--tc:var(--c-probleme)}.av-type.jadore,.av-tic.jadore{--tc:var(--c-jadore)}.av-type.question,.av-tic.question{--tc:var(--c-question)}
.av-tic{--tc:var(--accent);width:40px;height:40px;flex:none;border-radius:14px;display:grid;place-items:center;color:var(--tc);background:color-mix(in srgb,var(--tc) 11%,transparent)}
.av-tic .ico{width:21px;height:21px}
.av-tic.sm{width:32px;height:32px;border-radius:11px}.av-tic.sm .ico{width:17px;height:17px}
.av-type .av-tic{background:transparent;color:inherit;width:34px;height:34px}
.av-type.on .av-tic{color:#fff;background:var(--tc)}
@media (max-width:360px){.av-type b{font-size:11.5px}}
.av-areas{margin:0 -18px;padding:2px 18px;scroll-padding:0 18px}
.av-areas .chip{gap:7px}.av-areas .chip .ico{width:16px;height:16px}
.av-ta{min-height:0!important}
.av-addshot{gap:9px;font-size:14px}
.av-addshot em{font-style:normal;font-weight:650;font-size:12px;color:var(--faint)}
.av-shotrow{display:flex;align-items:center;gap:12px}
.av-thumb{position:relative;width:72px;height:72px;flex:none;border-radius:16px;overflow:hidden;box-shadow:0 8px 18px -10px rgba(40,30,120,.5);animation:avpopin .5s var(--spring)}
.av-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.av-thx{all:unset;cursor:pointer;position:absolute;top:4px;right:4px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:rgb(var(--k) / .65);color:#fff}
.av-thx::before{content:"";position:absolute;inset:-9px}
.av-thx .ico{width:14px;height:14px}
@keyframes avpopin{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}

/* NPS */
.av-nps{padding:14px;border-radius:18px;background:rgba(74,31,230,.05);border:1px solid rgba(74,31,230,.1);display:flex;flex-direction:column;gap:10px}
.av-npsq{font-weight:800;font-size:14.5px;letter-spacing:-.015em;line-height:1.35}
.av-npsq em{display:block;font-style:normal;font-weight:650;font-size:12px;color:var(--faint);margin-top:2px}
.av-npsg{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:4px}
.av-n{all:unset;box-sizing:border-box;cursor:pointer;height:44px;border-radius:12px;display:grid;place-items:center;font:700 15px var(--mono);background:var(--glass-hi);box-shadow:0 0 0 1px var(--line) inset;color:var(--muted);transition:background .2s,color .2s,transform .15s}
.av-n:active{transform:scale(.88)}
.av-n.on{color:#fff}
.av-n.on.lo{background:var(--bad)}.av-n.on.mid{background:#E0A030}.av-n.on.hi{background:var(--ok)}
.av-n.pop{animation:avtic .45s var(--spring)}
@media (max-width:420px){.av-npsg{grid-template-columns:repeat(6,minmax(0,1fr))}}
.av-npsl{display:flex;justify-content:space-between;font-size:11.5px;font-weight:700;color:var(--faint)}

/* context */
.av-ctx{all:unset;cursor:pointer;display:flex;align-items:center;gap:8px;min-height:40px;font-size:13px;font-weight:750;color:var(--muted);margin:-6px 0}
.av-ctx .ico{width:17px;height:17px}
.av-ctx>.ico:last-child{transition:transform .35s var(--spring)}
.av-ctx.on>.ico:last-child{transform:rotate(180deg)}
.av-ctxd{animation:rise .35s var(--ease) both}
.av-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:13px;padding:12px 14px;border-radius:14px;background:rgb(var(--k) / .035)}
.av-dl dt{color:var(--faint);font-weight:700}
.av-dl dd{margin:0;font-weight:650;min-width:0;overflow-wrap:anywhere}
.av-mnote{margin:-6px 0 0;text-align:center}
.av-spin{width:18px;height:18px;border-radius:50%;border:2.5px solid rgb(var(--hl) / calc(.35 * var(--hla)));border-top-color:var(--solid);animation:avspin .8s linear infinite;display:inline-block}
.av-spin.dark{border-color:rgba(74,31,230,.15);border-top-color:var(--accent);width:26px;height:26px}
@keyframes avspin{to{transform:rotate(360deg)}}

/* thank you */
.av-thanks{padding:28px 20px 22px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}
.av-thanks .sub{max-width:38ch;margin:0}
.av-tk{--tc:var(--ok);width:84px;height:84px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--tc);position:relative;margin-bottom:8px;animation:avtk .7s var(--spring) both;box-shadow:0 18px 36px -14px var(--tc)}
.av-tk.jadore{--tc:var(--c-jadore)}
.av-tk .ico{width:40px;height:40px;stroke-width:2.6;position:relative;z-index:1}
.av-tk.jadore .ico{animation:avbeat 1.2s .7s ease-in-out infinite}
.av-tk:not(.jadore) .ico path{stroke-dasharray:24;stroke-dashoffset:24;animation:drawc .5s .35s var(--ease) forwards}
.av-tkr{position:absolute;inset:0;border-radius:50%;border:3px solid var(--tc);animation:avring 1.4s .2s var(--ease) both}
.av-tkr.r2{animation-delay:.45s}
@keyframes avtk{0%{transform:scale(0) rotate(-40deg)}100%{transform:none}}
@keyframes avring{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.9)}}
@keyframes avbeat{0%,100%{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(.96)}45%{transform:scale(1.1)}}
.av-tkb{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:10px}

/* vos envois */
.av-lh{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.av-list{display:flex;flex-direction:column;gap:10px}
.av-mi{padding:14px 16px;display:flex;flex-direction:column;gap:9px}
.av-mi.fresh{box-shadow:0 0 0 2px rgba(74,31,230,.35) inset,var(--sh)}
.av-mih{display:flex;align-items:center;gap:10px}
.av-mit{flex:1;min-width:0}
.av-mit b{display:block;font-size:14px;font-weight:800;letter-spacing:-.015em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.av-mit em{display:block;font-style:normal;font-size:12px;color:var(--muted);font-weight:600}
.av-mtx{margin:0;font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.av-mshot{display:block;max-width:160px;max-height:160px;border-radius:12px;object-fit:cover;box-shadow:0 6px 16px -10px rgba(40,30,120,.5)}
.av-mshot.big{max-width:100%;max-height:340px;object-fit:contain;background:rgb(var(--k) / .04)}
.av-rep{display:flex;gap:10px;padding:11px 12px;border-radius:16px 16px 16px 6px;background:rgba(74,31,230,.07);animation:rise .5s var(--ease) both}
.av-repa{flex:none}
.av-rep b{display:flex;gap:8px;align-items:baseline;font-size:12.5px;font-weight:800;color:var(--accent)}
.av-rep b em{font-style:normal;font-weight:650;color:var(--faint);font-size:11.5px}
.av-rep p{margin:2px 0 0;font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.pill .ico{width:12px;height:12px}

/* admin */
.av-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.av-kpi{display:flex;flex-direction:column;gap:4px;padding:14px 16px;min-width:0}
.av-kpi>b{font-size:28px;font-weight:700;letter-spacing:-.05em;line-height:1.05}
.av-kpi>b.ok{color:var(--ok)}.av-kpi>b.warn{color:var(--warn)}.av-kpi>b.bad{color:var(--bad)}
.av-mix{display:grid;grid-template-columns:auto auto auto auto;align-items:center;gap:6px 6px;justify-content:start;margin-top:4px}
.av-mix b{font-size:15px;margin-right:6px}
.av-filt{display:flex;flex-direction:column;gap:12px}
.av-filt .chip{gap:7px}.av-filt .chip .ico{width:16px;height:16px}
.av-fsel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.av-fs{display:flex;flex-direction:column;gap:4px;min-width:0}
.av-fs span{font-size:11px;font-weight:800;color:var(--faint);text-transform:uppercase;letter-spacing:.06em}
.av-sel{height:44px;font-size:14px;padding:0 10px}
@media (max-width:560px){.av-fsel{grid-template-columns:1fr 1fr}.av-fs:first-child{grid-column:1/-1}}
.av-ai{all:unset;box-sizing:border-box;cursor:pointer;display:flex;gap:12px;align-items:flex-start;padding:14px 16px;background:var(--glass);border:1px solid var(--edge);border-radius:var(--r);box-shadow:var(--sh);transition:transform .18s var(--ease),background .2s}
.av-ai.unread{border-left:4px solid var(--accent)}
.av-ai:active{transform:scale(.985)}
@media (hover:hover){.av-ai:hover{background:var(--glass-hi)}}
.av-aib{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.av-aih{display:flex;align-items:center;justify-content:space-between;gap:8px}
.av-aih b{font-weight:800;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.av-aitx{font-size:14px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.av-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:12px;color:var(--muted);font-weight:600}
.av-meta .ico{width:14px;height:14px}
.av-sh{display:flex;flex-direction:column;gap:14px}
.av-shh{display:flex;align-items:center;gap:14px}
.av-quote{margin:0;padding:14px 16px;border-radius:16px;background:rgba(74,31,230,.05);border-left:3px solid var(--accent);font-size:15px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.av-link{color:var(--accent);font-weight:800}
.av-det summary::before{content:"›";font-size:18px;margin-right:8px;transition:transform .2s}.av-det[open] summary::before{transform:rotate(90deg)}
.av-det summary{cursor:pointer;list-style:none;font-size:13px;font-weight:800;color:var(--muted);min-height:36px;display:flex;align-items:center}
.av-det .av-dl{margin-top:6px}
.av-ua{margin:6px 0 0;font-family:var(--mono);font-size:11px;overflow-wrap:anywhere}
.av-sseg button{font-size:13px}
@media (min-width:700px){.av-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:960px){.av-alist{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start}}