/* ══════════════════════════════════════════
   Prompto Damamme — CSS commun
   Variables, reset, utilitaires partagés
   ══════════════════════════════════════════ */

:root {
  /* Palette PC/smartphone */
  --bg:       #0a0a0f;
  --surface:  #12121a;
  --surface2: #16161f;
  --border:   #1e1e2e;
  --accent:   #00e5ff;
  --accent2:  #7c3aed;
  --text:     #e8e8f0;
  --muted:    #6b6b80;
  --green:    #22c55e;
  --red:      #ef4444;
  --folder-color: #f59e0b;

  /* Palette lunettes (600×600) */
  --gl-bg:          #141419;
  --gl-surface:     #2d3748;
  --gl-border:      #4a5568;
  --gl-accent:      #00e5ff;
  --gl-accent-text: #00ff66;
  --gl-text:        #ffffff;
  --gl-muted:       #cbd5e1;
  --gl-bg-reader:   #0a192f;
  --gl-text-reader: #e2d0a7;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* ── Sélecteur de langue (PC/smartphone) ── */
.lang-selector-wrap {
  margin-top: 1.5rem;
  border-top: 1px solid var(--border);
  padding-top: 1rem;
  font-size: 0.85rem;
  color: var(--muted);
}
.lang-label {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.7rem;
  display: block;
  margin-bottom: 0.3rem;
}
.lang-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.lang-item a {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.25rem 0.5rem;
  border-radius: 999px;
  border: 1px solid transparent;
  color: var(--text);
  text-decoration: none;
  font-size: 0.8rem;
  background: var(--surface);
}
.lang-item a.active {
  border-color: var(--accent);
  background: #041924;
  color: var(--accent);
}