/* ============================================================================
   QZR vNext — Créer un live (RT6) : mode toggle Live rapide / Tournoi + panneau
   « Live rapide » (RT6a). Scopé au skin compétitions [data-qz-skin="competitions"].
   Le panneau Tournoi (wizard existant) est laissé tel quel pour l'instant.
   Chargé APRÈS vnext-tokens.css + vnext-competitions.css.
   ============================================================================ */

[data-qz-skin="competitions"] .competition-workspace-stack--create { max-width: 560px; margin: 0 auto; }

/* ── Bascule Live rapide / Tournoi ─────────────────────────────────────────── */
[data-qz-skin="competitions"] .ql-modeseg {
  display: flex; gap: 4px;
  background: var(--qz-surface, #fff); border: 1px solid var(--qz-line, #DCEFE8);
  border-radius: 14px; padding: 4px; margin-bottom: 16px;
}
[data-qz-skin="competitions"] .ql-modeseg__btn {
  flex: 1; border: 0; background: transparent; font: inherit; font-size: 14px;
  font-weight: var(--qz-fw-strong, 500); color: var(--qz-muted, #5E8A7C);
  padding: 10px; border-radius: 10px; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  transition: background var(--qz-dur-ui) ease, color var(--qz-dur-ui) ease;
}
[data-qz-skin="competitions"] .ql-modeseg__btn.on { background: var(--qz-accent, #16A87A); color: #fff; }
[data-qz-skin="competitions"] .ql-modeseg__btn:not(.on):hover { color: var(--qz-accent-ink, #0F6E56); }

/* ── Panneau Live rapide ───────────────────────────────────────────────────── */
[data-qz-skin="competitions"] .ql-panel {
  background: var(--qz-surface, #fff); border: 1px solid var(--qz-line, #DCEFE8);
  border-radius: var(--qz-r-card, 16px); padding: 22px 20px 24px;
}
[data-qz-skin="competitions"] .ql-title { font-size: 18px; font-weight: var(--qz-fw-strong, 500); color: var(--qz-text, #06342A); margin: 0 0 3px; }
[data-qz-skin="competitions"] .ql-sub { font-size: 12px; color: var(--qz-muted, #5E8A7C); margin: 0 0 20px; line-height: 1.45; }
[data-qz-skin="competitions"] .ql-field { margin-top: 25px; }
[data-qz-skin="competitions"] .ql-label {
  font-size: 11px; font-weight: var(--qz-fw-strong, 500); letter-spacing: .06em;
  text-transform: uppercase; color: var(--qz-muted, #5E8A7C); margin: 0 0 7px 2px;
}

/* Recherche de quiz (réutilise l'autocomplete .competition-room-quiz-search) */
[data-qz-skin="competitions"] .ql-quizcard { position: relative; }
[data-qz-skin="competitions"] .ql-quizinput {
  width: 100%; border: 1px solid var(--qz-line, #DCEFE8); border-radius: var(--qz-r-field, 13px);
  padding: 12px 14px; font: inherit; font-size: 14px; color: var(--qz-text, #06342A);
  background: var(--qz-surface, #fff);
}
[data-qz-skin="competitions"] .ql-quizinput::placeholder { color: var(--qz-muted, #5E8A7C); }
[data-qz-skin="competitions"] .ql-quizinput:focus {
  outline: none; border-color: var(--qz-accent, #16A87A); box-shadow: var(--qz-focus-ring, 0 0 0 3px var(--qz-accent-soft, #E1F5EE));
}
[data-qz-skin="competitions"] .ql-quizinput[data-selected-quiz-name] { border-color: var(--qz-accent-mid, #5DCAA5); background: var(--qz-accent-soft, #E1F5EE); font-weight: var(--qz-fw-strong, 500); }
[data-qz-skin="competitions"] .ql-quizhint { font-size: 11.5px; color: var(--qz-muted, #5E8A7C); margin: 6px 0 0 2px; }
[data-qz-skin="competitions"] .ql-quizhint:empty { display: none; }
[data-qz-skin="competitions"] .ql-quizhint.is-error { color: var(--qz-error, #C0392B); }
[data-qz-skin="competitions"] .ql-quizhint.is-error { color: var(--qz-error, #E24B4A); }

/* Segmenté (mode de jeu) */
[data-qz-skin="competitions"] .ql-seg {
  display: flex; background: var(--qz-accent-soft, #E1F5EE); border-radius: var(--qz-r-field, 13px); padding: 3px; gap: 3px;
}
[data-qz-skin="competitions"] .ql-seg button {
  flex: 1; border: 0; background: transparent; font: inherit; font-size: 13px;
  font-weight: var(--qz-fw-strong, 500); color: var(--qz-accent-ink, #0A4F40);
  padding: 12px 4px; border-radius: 10px; cursor: pointer;
}
[data-qz-skin="competitions"] .ql-seg button.on { background: var(--qz-surface, #fff); color: var(--qz-accent-ink, #0F6E56); box-shadow: 0 1px 3px rgba(6, 52, 42, .12); border:1px solid var(--qz-accent-ink, #0F6E56);}

/* Aide sous un champ. Existait dans le markup (.ql-fieldhint) sans aucune règle,
   d'où le font-size posé en style inline sur l'élément. Aligné sur .ql-quizhint,
   qui joue le même rôle sous la recherche de quiz. */
[data-qz-skin="competitions"] .ql-fieldhint {
  font-size: 11.5px; color: var(--qz-muted, #5E8A7C); margin: 6px 0 0 2px;
}
[data-qz-skin="competitions"] .ql-fieldhint:empty { display: none; }

/* .ql-chips / .ql-chip supprimées : le panneau « Live rapide » était leur seul
   usage, et ses trois groupes d'options partagent maintenant le segmenté
   ci-dessus. Vérifié avant suppression — plus une seule occurrence dans le JS,
   le PHP ou le HTML. */

/* Bouton Lancer */
[data-qz-skin="competitions"] .ql-launch {
  width: 100%; margin-top: 18px; border: 0; font: inherit; font-size: 15px;
  font-weight: var(--qz-fw-strong, 500); border-radius: var(--qz-r-control, 12px); padding: 14px;
  background: var(--qz-accent, #16A87A); color: #fff; border-bottom: 4px solid var(--qz-accent-deep, #0F6E56);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  transition: filter var(--qz-dur-ui) ease, transform var(--qz-dur-press, 80ms) ease;
}
[data-qz-skin="competitions"] .ql-launch:hover { filter: brightness(.97); }
[data-qz-skin="competitions"] .ql-launch:active { transform: scale(var(--qz-press-scale)); border-bottom-width: 2px; }
[data-qz-skin="competitions"] .ql-launch:disabled { opacity: .55; cursor: default; filter: none; }

/* ============================================================================
   RT6c — « Tournoi » : reskin du wizard legacy (orange/crème → teal vNext).
   Scopé au workspace de création uniquement, pour ne pas toucher les autres
   écrans compétitions. Surcharge les règles mono-classe de competitions(.pro).css.
   ============================================================================ */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-card,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-card--accent {
  background: var(--qz-surface, #fff);
  border: 1px solid var(--qz-line, #DCEFE8);
  border-radius: var(--qz-r-card, 16px);
  box-shadow: none;
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-workspace-intro { background: var(--qz-accent-soft, #E1F5EE); border-color: var(--qz-line-strong, #CDE7DC); }

/* Eyebrow + titres */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-eyebrow {
  color: var(--qz-muted, #5E8A7C); font-weight: var(--qz-fw-strong, 500);
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-card-head h2,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-card-head h3 {
  color: var(--qz-text, #06342A); font-weight: var(--qz-fw-strong, 500);
}

/* Étapes (dots) : orange → teal */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-wizard-dot {
  border: 1px solid var(--qz-line, #DCEFE8); background: var(--qz-surface, #fff); color: var(--qz-muted, #5E8A7C);
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-wizard-dot:hover { border-color: var(--qz-accent-mid, #5DCAA5); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-wizard-dot-index {
  background: var(--qz-accent-soft, #E1F5EE); color: var(--qz-accent-ink, #0F6E56);
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-wizard-dot.is-active {
  border-color: transparent; color: #fff;
  background: var(--qz-accent, #16A87A); box-shadow: 0 6px 16px rgba(15, 110, 86, .22);
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-wizard-dot.is-active .competition-wizard-dot-index {
  background: rgba(255, 255, 255, .26); color: #fff;
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-wizard-dot.is-complete {
  border-color: var(--qz-accent-mid, #5DCAA5); color: var(--qz-accent-ink, #0F6E56); background: var(--qz-accent-soft, #E1F5EE);
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-wizard-dot.is-complete .competition-wizard-dot-index {
  background: var(--qz-accent-mid, #5DCAA5); color: #fff;
}

/* Champs de formulaire */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field input,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field select,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field textarea {
  border: 1px solid var(--qz-line, #DCEFE8); border-radius: var(--qz-r-field, 13px);
  background: var(--qz-surface, #fff); color: var(--qz-text, #06342A);
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field input:focus,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field select:focus,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field textarea:focus {
  border-color: var(--qz-accent, #16A87A);
  box-shadow: var(--qz-focus-ring, 0 0 0 3px var(--qz-accent-soft, #E1F5EE));
  outline: none;
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field > span,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-field > label > span { color: var(--qz-muted, #5E8A7C); }
/* Petit sous-libellé plain-language (de-jargon) */
[data-qz-skin="competitions"] .competition-workspace-stack--create .ql-sublabel { display: block; font-size: 11.5px; font-weight: 400; color: var(--qz-muted, #5E8A7C); margin-top: 1px; }

/* Boutons : primaire orange → teal (liseré-bas), secondaire/ghost neutralisés */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-btn--primary {
  background: var(--qz-accent, #16A87A); color: #fff;
  border: 0; border-bottom: 4px solid var(--qz-accent-deep, #0F6E56);
  border-radius: var(--qz-r-control, 12px); box-shadow: none; font-weight: var(--qz-fw-strong, 500);
  transition: filter var(--qz-dur-ui) ease, transform var(--qz-dur-press, 80ms) ease;
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-btn--primary:hover { background: var(--qz-accent, #16A87A); color: #fff; filter: brightness(.97); box-shadow: none; }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-btn--primary:active { transform: scale(var(--qz-press-scale)); border-bottom-width: 2px; }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-btn--secondary {
  background: var(--qz-accent-soft, #E1F5EE); color: var(--qz-accent-ink, #0F6E56); border: 1px solid var(--qz-line-strong, #CDE7DC); box-shadow: none;
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-btn--ghost {
  background: var(--qz-surface, #fff); color: var(--qz-accent-ink, #0F6E56); border: 1px solid var(--qz-line, #DCEFE8); box-shadow: none;
}

/* Bracket : bleu/vert → teal doux + finale dorée (mockup RT6c) */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-preview {
  border: 1px dashed var(--qz-line-strong, #CDE7DC); background: var(--qz-accent-soft, #E1F5EE); border-radius: var(--qz-r-field, 13px);
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-node {
  background: #E6F7F0; border: 1px solid var(--qz-accent-mid, #5DCAA5); color: var(--qz-accent-ink, #0A4F40); border-radius: 12px;
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-node-value { color: var(--qz-accent-ink, #0F6E56); font-weight: var(--qz-fw-strong, 500); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-node-label { color: var(--qz-muted, #5E8A7C); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-node--final {
  background: var(--qz-energy, #F5C542); border-color: var(--qz-alert, #BA7517);
}
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-node--final .competition-bracket-node-value,
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-node--final .competition-bracket-node-label { color: #6B4400; }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-bracket-arrow { color: var(--qz-accent-mid, #5DCAA5); }
/* Légende plain-language sous le bracket */
[data-qz-skin="competitions"] .competition-workspace-stack--create .ql-brk-cap { font-size: 12.5px; color: var(--qz-text, #06342A); margin: 0 0 10px; line-height: 1.45; }
[data-qz-skin="competitions"] .competition-workspace-stack--create .ql-brk-cap b { color: var(--qz-accent-ink, #0F6E56); font-weight: var(--qz-fw-strong, 500); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .ql-brk-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 10px; font-size: 11.5px; color: var(--qz-muted, #5E8A7C); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .ql-brk-legend span { display: inline-flex; align-items: center; gap: 6px; }
[data-qz-skin="competitions"] .competition-workspace-stack--create .ql-brk-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }

/* Cartes room (vue organisateur post-brouillon) */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-room-card { background: var(--qz-surface, #fff); border: 1px solid var(--qz-line, #DCEFE8); border-radius: var(--qz-r-card, 16px); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-room-quiz-picker--selected .competition-room-quiz-search { border-color: var(--qz-accent-mid, #5DCAA5); background: var(--qz-accent-soft, #E1F5EE); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-status { background: var(--qz-accent-soft, #E1F5EE); color: var(--qz-accent-ink, #0F6E56); }

/* ── RT6c « Quiz du tournoi » : granularité 3 niveaux ─────────────────────── */
[data-qz-skin="competitions"] .ql-quizsection { gap: 10px; }
[data-qz-skin="competitions"] .ql-seg--wizard { margin-bottom: 2px; }
[data-qz-skin="competitions"] .ql-quizslots { display: grid; gap: 12px; }
[data-qz-skin="competitions"] .ql-quizslots.is-hidden { display: none; }
[data-qz-skin="competitions"] .ql-quizstage { display: grid; gap: 7px; }
[data-qz-skin="competitions"] .ql-quizstage__tag {
  display: inline-flex; align-items: center; gap: 6px; align-self: flex-start;
  font-size: 11px; font-weight: var(--qz-fw-strong, 500); letter-spacing: .04em;
  padding: 3px 10px; border-radius: var(--qz-r-pill, var(--qz-r-pill));
  background: var(--qz-accent-soft, #E1F5EE); color: var(--qz-accent-ink, #0F6E56);
}
[data-qz-skin="competitions"] .ql-quizstage__tag--final { background: var(--qz-energy, #F5C542); color: #6B4400; }
[data-qz-skin="competitions"] .ql-quizstage__tag--final::before { content: "\f091"; font-family: "Font Awesome 5 Free", "Font Awesome 6 Free"; font-weight: 900; }
[data-qz-skin="competitions"] .ql-quizsection .ql-quizhint {
  font-size: 12px; color: var(--qz-accent-ink, #0F6E56); margin: 2px 0 0;
  line-height: 1.45; background: var(--qz-accent-soft, #E1F5EE);
  padding: 8px 11px; border-radius: var(--qz-r-field, 13px);
}

/* Interrupteur check-in : on-state orange → teal */
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-switch input:checked + .competition-switch-ui { background: var(--qz-accent, #16A87A); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-switch input:focus + .competition-switch-ui { box-shadow: var(--qz-focus-ring, 0 0 0 3px var(--qz-accent-soft, #E1F5EE)); }
[data-qz-skin="competitions"] .competition-workspace-stack--create .competition-toggle-field { background: var(--qz-screen, #F1FAF6); border: 1px solid var(--qz-line, #DCEFE8); border-radius: var(--qz-r-field, 13px); }

/* ── S4 · bannière « compétition de groupe » (contexte création groupe) ─────── */
[data-qz-skin="competitions"] .ql-groupbanner {
  display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px;
  background: var(--qz-accent-soft, #E1F5EE); border: 1px solid var(--qz-line-strong, #CDE7DC);
  border-radius: var(--qz-r-pill, var(--qz-r-pill)); padding: 8px 16px;
  font-size: 13px; font-weight: var(--qz-fw-strong, 500); color: var(--qz-accent-ink, #0F6E56);
}
[data-qz-skin="competitions"] .ql-groupbanner .fa-users { color: var(--qz-accent, #16A87A); }
