/* TeamKit — la page /avis (4 oct. 2026). Grammaire du site : cartes sombres, cyan / violet, étoiles dorées. */
.av-conteneur { max-width: 920px; display: grid; gap: 1.25rem; }
.av-chargement, .av-rien { color: var(--text-muted); text-align: center; padding: 2rem 0; }
.av-resume { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.5rem 2rem; align-items: center; padding: 1.5rem; border-radius: var(--radius-lg, 16px); border: 1px solid var(--border-color); background: var(--bg-card); }
.av-note { text-align: center; display: grid; gap: .35rem; justify-items: center; }
.av-gros { font: 800 3.2rem/1 var(--font-display, 'Orbitron', sans-serif); }
.av-gros small { font-size: 1rem; color: var(--text-muted); margin-left: .25rem; }
.av-total { color: var(--text-muted); font-size: .9rem; }
.av-etoiles { --note: 0%; position: relative; display: inline-block; letter-spacing: 3px; line-height: 1; color: rgba(255, 255, 255, .18); font-size: 1rem; white-space: nowrap; }
.av-etoiles.grand { font-size: 1.4rem; }
.av-etoiles::before { content: '★★★★★'; }
.av-etoiles::after { content: '★★★★★'; position: absolute; left: 0; top: 0; width: var(--note); overflow: hidden; color: #FBBF24; }
.av-barres { display: grid; gap: .4rem; font-size: .88rem; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.av-barre { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) 2.5rem; gap: .6rem; align-items: center; }
.av-barre span:last-child { text-align: right; }
.av-piste { height: 9px; border-radius: 99px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.av-piste i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #FBBF24, #F97316); }
.av-sous-notes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .6rem; }
.av-sous { display: grid; gap: .1rem; padding: .65rem .8rem; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid var(--border-color); }
.av-sous span { font-size: .85rem; color: var(--text-secondary); }
.av-sous b { font: 800 1.3rem var(--font-display, 'Orbitron', sans-serif); }
.av-sous small { color: var(--text-muted); font-size: .75rem; }
.av-sous-attente { border-style: dashed; }
.av-outils { display: flex; flex-wrap: wrap; gap: .5rem; }
.av-puce { border: 1px solid var(--border-color); background: transparent; color: var(--text-secondary); border-radius: 999px; padding: .4rem .9rem; font: inherit; font-size: .88rem; font-weight: 600; cursor: pointer; }
.av-puce.on { border-color: var(--accent-primary); color: var(--text-primary); background: rgba(0, 240, 255, .1); }
.av-liste { display: grid; gap: .8rem; }
.av-carte { padding: 1.1rem 1.25rem; border-radius: var(--radius-lg, 16px); border: 1px solid var(--border-color); background: var(--bg-card); display: grid; gap: .6rem; min-width: 0; }
.av-carte header { display: flex; align-items: center; gap: .75rem; }
.av-av { width: 38px; height: 38px; flex: none; border-radius: 50%; display: grid; place-items: center; font-weight: 800; color: #071018; background: linear-gradient(135deg, var(--accent-primary, #00f0ff), #a855f7); }
.av-qui { display: grid; flex: 1; min-width: 0; }
.av-qui small { color: var(--text-muted); font-size: .8rem; }
.av-texte { margin: 0; color: var(--text-secondary); line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.av-meta { display: flex; flex-wrap: wrap; gap: .4rem; }
.av-meta span { font-size: .78rem; padding: .15rem .6rem; border-radius: 999px; background: rgba(255, 255, 255, .06); color: var(--text-muted); }
.av-reponse { border-left: 3px solid #a855f7; padding: .55rem .85rem; border-radius: 0 10px 10px 0; background: rgba(168, 85, 247, .08); }
.av-reponse b { font-size: .82rem; color: #D8B4FE; }
.av-reponse p { margin: .25rem 0 0; color: var(--text-secondary); font-size: .92rem; white-space: pre-wrap; }
.av-plus { text-align: center; }
.av-donner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.5rem; border-radius: var(--radius-lg, 16px); background: linear-gradient(135deg, rgba(0, 212, 255, .1), rgba(123, 44, 191, .12)); border: 1px solid var(--border-color); }
.av-donner h2 { margin: 0 0 .25rem; font-size: 1.15rem; }
.av-donner p { margin: 0; color: var(--text-secondary); }
.av-transparence { padding: 1.25rem 1.5rem; border-radius: var(--radius-lg, 16px); border: 1px dashed var(--border-color); }
.av-transparence h2 { margin: 0 0 .6rem; font-size: 1.05rem; }
.av-transparence ul { margin: 0; padding-left: 1.2rem; display: grid; gap: .45rem; color: var(--text-secondary); font-size: .92rem; }
.av-transparence b { color: var(--text-primary); }
.av-vide { grid-column: 1 / -1; text-align: center; padding: 1rem; display: grid; gap: .6rem; justify-items: center; }
.av-vide-ico { font-size: 2.5rem; }
.av-vide h2 { margin: 0; }
.av-vide p { margin: 0; color: var(--text-secondary); max-width: 52ch; }
@media (max-width: 680px) {
  .av-resume { grid-template-columns: 1fr; padding: 1.1rem; }
  .av-carte header { flex-wrap: wrap; }
}
