/* =========================================================
   Trading Evolution — panneau Analytics (complète admin.css, même thème sombre)
   ========================================================= */
.wrap.an { max-width: 1400px; }
.small { font-size: 12px; }
.an-live { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.an-live i { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.an-live.on i { background: var(--pos); box-shadow: 0 0 0 0 rgba(34,197,94,.6); animation: an-pulse 1.8s infinite; }
.an-live.on { color: var(--ink2); }
@keyframes an-pulse { 70% { box-shadow: 0 0 0 7px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }

/* barre de filtres */
.an-bar { display: grid; gap: 12px; padding: 14px 16px; margin-bottom: 16px; }
.an-seg { display: flex; flex-wrap: wrap; gap: 4px; background: var(--bg2); border: 1px solid var(--line); border-radius: 12px; padding: 4px; width: fit-content; max-width: 100%; }
.an-seg button { border: 0; background: transparent; color: var(--ink2); font: 600 13px var(--f); padding: 8px 12px; border-radius: 9px; cursor: pointer; }
.an-seg button:hover { color: var(--ink); background: rgba(255,255,255,.05); }
.an-seg button[aria-pressed="true"] { background: var(--blue); color: #fff; }
.an-custom { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.an-custom label { display: inline-flex; gap: 6px; align-items: center; color: var(--ink2); font-size: 13px; }
.an-filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.an-filters select, .an-filters input[type="search"] { min-width: 180px; }
.an-filters input[type="search"] { flex: 1 1 220px; }
.an-period { margin: 0; font-size: 12px; }

/* indicateurs clés */
.an-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin-bottom: 16px; }
.an-kpi { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; display: grid; gap: 4px; }
.an-kpi small { color: var(--muted); font-size: 12px; font-weight: 600; }
.an-kpi strong { font: 800 26px/1.1 var(--f); color: var(--ink); font-variant-numeric: tabular-nums; }
.an-kpi span { color: var(--muted); font-size: 12px; }
.an-kpi.hot strong { color: var(--pos); }
.an-kpi.nt { border-color: rgba(255,74,18,.35); }
.an-kpi.nt strong { color: #ff8a4c; }
.an-kpi.dl strong { color: var(--blue2); }

/* graphique */
.an-chart-card { margin-bottom: 16px; }
.an-chart { width: 100%; overflow-x: auto; }
.an-chart svg { display: block; width: 100%; min-width: 620px; height: 280px; }
.an-chart .ax { stroke: var(--line); stroke-width: 1; }
.an-chart .lbl { fill: var(--muted); font: 11px var(--f); }
.an-chart .pv { fill: none; stroke: var(--blue); stroke-width: 2.2; }
.an-chart .pv-area { fill: rgba(59,130,246,.14); stroke: none; }
.an-chart .uv { fill: none; stroke: var(--pos); stroke-width: 2; stroke-dasharray: 5 4; }
.an-chart .b-files { fill: #8fb4ff; }
.an-chart .b-ninja { fill: #ff8a4c; }
.an-chart .b-auth { fill: var(--amber); }
.an-chart .hit { fill: transparent; }
.an-chart .hit:hover { fill: rgba(255,255,255,.05); }
.an-legend { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--ink2); }
.an-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-inline-end: 6px; vertical-align: -1px; }
.an-legend .k-pv { background: var(--blue); } .an-legend .k-uv { background: var(--pos); } .an-legend .k-files { background: #8fb4ff; }
.an-legend .k-ninja { background: #ff8a4c; } .an-legend .k-auth { background: var(--amber); }

/* grilles et tableaux */
.an-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 16px; margin-bottom: 16px; }
.an-grid .card, .an-detail { padding: 14px 16px; }
.card-head h2 { font-size: 16px; }
.an-t { width: 100%; font-size: 13px; }
.an-t td { vertical-align: middle; }
.an-t tr.click { cursor: pointer; }
.an-t tr.click:hover td { background: rgba(255,255,255,.03); }
.an-t .mono { font-family: var(--mono); font-size: 12px; }
.an-t .bar { position: relative; }
.an-t .bar em { position: absolute; inset-inline-start: 0; bottom: 2px; height: 3px; border-radius: 2px; background: var(--blue); opacity: .75; }
.an-t .flag { font-size: 16px; margin-inline-end: 6px; }
.an-t .yes { color: var(--pos); font-weight: 700; }
.an-t .no { color: var(--muted); }
.an-t a.q { color: var(--blue2); text-decoration: none; cursor: pointer; }
.an-t a.q:hover { text-decoration: underline; }
.an-wide { min-width: 1100px; }
.an-tech { display: grid; }
#techBox { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
#techBox h3 { font-size: 12px; color: var(--muted); margin: 0 0 6px; text-transform: uppercase; letter-spacing: .06em; }
#techBox ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; }
#techBox li { display: grid; grid-template-columns: 1fr auto; gap: 6px; position: relative; padding-bottom: 5px; }
#techBox li em { position: absolute; inset-inline-start: 0; bottom: 0; height: 3px; border-radius: 2px; background: var(--pos); opacity: .7; }

/* types d'événements */
.ev { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; border: 1px solid var(--line); color: var(--ink2); }
.ev.pageview { color: #9fb3d6; }
.ev.signup { background: rgba(245,158,11,.15); color: #fbbf24; border-color: rgba(245,158,11,.4); }
.ev.login { background: rgba(245,158,11,.08); color: #fcd34d; }
.ev.indicator_file_download { background: rgba(143,180,255,.15); color: #b8d0ff; border-color: rgba(143,180,255,.4); }
.ev.indicator_download_click, .ev.indicator_page_view { color: #8fb4ff; }
.ev.ninjatrader_click { background: rgba(255,74,18,.14); color: #ff9b66; border-color: rgba(255,74,18,.4); }
.ev.telegram_click, .ev.discord_click { color: #7dd3fc; }
.ev.calculator_used, .ev.landing_cta_click { color: #86efac; }
.adm { font-size: 10px; color: var(--amber); margin-inline-start: 6px; }

/* onglets */
.an-detail .card-head { flex-wrap: wrap; gap: 10px; }
.an-tabs { display: flex; flex-wrap: wrap; gap: 4px; }
.an-tabs button { border: 1px solid var(--line); background: transparent; color: var(--ink2); font: 600 13px var(--f); padding: 8px 12px; border-radius: 10px; cursor: pointer; }
.an-tabs button[aria-selected="true"] { background: var(--blue-50); color: var(--ink); border-color: rgba(59,130,246,.5); }
.an-tabs b { color: var(--muted); font-weight: 600; margin-inline-start: 4px; }
.an .foot-note { margin-top: 10px; font-size: 12px; }

@media (min-width: 1100px) { .an-grid > .card:first-child { grid-column: span 2; } }
@media (max-width: 720px) {
  .top { flex-wrap: wrap; gap: 10px; }
  .top-right { flex-wrap: wrap; justify-content: flex-start; gap: 6px; }
  .top-right .who { display: none; }
  .top-right .btn { padding: 7px 10px; font-size: 12px; }
  .an-grid { grid-template-columns: 1fr; }
  #techBox { grid-template-columns: 1fr; }
  .an-kpi strong { font-size: 22px; }
  .an-filters select, .an-filters input[type="search"] { min-width: 0; flex: 1 1 100%; }
}
