/* Piclap — mise en page des trois écrans. Uniquement des variables --pl-* (check-theme.sh). */

.pl-input {
  width: 100%;
  min-height: 44px;
  padding: calc(var(--pl-spacing) * 1.25) calc(var(--pl-spacing) * 1.5);
  border: 1px solid var(--pl-border);
  border-radius: var(--pl-radius);
  background: var(--pl-bg);
  color: var(--pl-text);
  font: inherit;
}
.pl-input:disabled {
  background: var(--pl-surface);
  color: var(--pl-text-muted);
  border-style: dashed;
  cursor: not-allowed;
}
.pl-input--short { width: auto; }
textarea.pl-input { line-height: 1.45; }
.pl-check { display: inline-flex; gap: var(--pl-spacing); align-items: center; min-height: 44px; }
.pl-check input { width: 1.2rem; height: 1.2rem; accent-color: var(--pl-accent); }
.pl-field { display: grid; gap: calc(var(--pl-spacing) * 0.5); }
.pl-field > span { font-weight: 600; }
.pl-help { font-size: 0.85rem; color: var(--pl-text-muted); }
.pl-error { color: var(--pl-danger); font-weight: 600; }

.pl-toast {
  position: fixed;
  left: 50%;
  bottom: calc(var(--pl-spacing) * 2);
  transform: translateX(-50%);
  max-width: min(32rem, calc(100vw - 2rem));
  padding: calc(var(--pl-spacing) * 1.5) calc(var(--pl-spacing) * 2);
  border-radius: var(--pl-radius);
  background: var(--pl-inverse-bg);
  color: var(--pl-inverse-text);
  z-index: 10;
}

/* ---------------------------------------------------------------- Participant (mobile d'abord) */
.pl-p { max-width: 34rem; margin: 0 auto; padding: calc(var(--pl-spacing) * 2); min-height: 100vh; display: flex; flex-direction: column; }
.pl-p__header { display: flex; justify-content: space-between; align-items: center; gap: var(--pl-spacing); padding-bottom: calc(var(--pl-spacing) * 2); border-bottom: 1px solid var(--pl-border); }
.pl-p__header .pl-logo { height: 2rem; }
.pl-p__code { font-weight: 700; letter-spacing: 0.12em; color: var(--pl-text-muted); }
.pl-p__main { flex: 1; padding-top: calc(var(--pl-spacing) * 3); }
.pl-p__prompt { font-size: 1.5rem; margin-bottom: calc(var(--pl-spacing) * 2); overflow-wrap: anywhere; }
.pl-p__status { margin-top: calc(var(--pl-spacing) * 2); min-height: 1.5em; }
.pl-p__wait { text-align: center; padding-top: 20vh; }
.pl-p__nav { display: flex; justify-content: space-between; gap: var(--pl-spacing); margin-top: calc(var(--pl-spacing) * 3); }
.pl-accueil-code { font-size: 2rem; font-weight: 700; letter-spacing: 0.3em; text-transform: uppercase; text-align: center; }
.pl-p__footer { padding-top: calc(var(--pl-spacing) * 3); font-size: 0.8rem; color: var(--pl-text-muted); }

/* ---------------------------------------------------------------- Écran projeté (lisible de loin) */
.pl-ecran {
  min-height: 100vh;
  font-size: calc(clamp(18px, 1.55vw, 44px) * var(--pl-scale, 1));
  display: grid;
  grid-template-rows: auto 1fr;
  padding: 2.2em 3em;
}
.pl-ecran__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 2em; }
.pl-ecran__top .pl-logo { height: 2.2em; }
.pl-ecran__coin { display: flex; align-items: center; gap: 0.8em; font-weight: 700; }
.pl-ecran__coin .pl-qr { padding: 6px; }
.pl-ecran__coin .pl-qr__svg { width: 5.5em; height: 5.5em; display: block; }
.pl-ecran__coin-texte { text-align: right; line-height: 1.2; }
.pl-ecran__coin-code { font-size: 1.6em; letter-spacing: 0.12em; }
.pl-ecran__prompt { font-size: 2.2em; max-width: 30em; margin: 0.6em 0 1em; overflow-wrap: anywhere; }
.pl-ecran__body { display: flex; flex-direction: column; }
.pl-ecran__compteur { margin-top: auto; padding-top: 1em; color: var(--pl-text-muted); font-size: 1.1em; }
.pl-ecran__waiting { font-size: 1.4em; color: var(--pl-text-muted); }
.pl-ecran .pl-bar { grid-template-columns: minmax(8em, 1.2fr) 3fr 4em; font-size: 1.2em; }
.pl-ecran .pl-bar__track { height: 1.6em; }

/* Accueil : QR au centre, logo en haut, partenaires en bas */
.pl-accueil {
  position: fixed;
  inset: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  justify-items: center;
  padding: 2.5em;
  font-size: calc(clamp(18px, 1.55vw, 44px) * var(--pl-scale, 1));
  z-index: 5;
}
.pl-accueil[hidden] { display: none; }
.pl-accueil .pl-logo { height: 3em; }
.pl-accueil__centre { display: flex; align-items: center; gap: 3em; flex-wrap: wrap; justify-content: center; }
.pl-accueil .pl-qr__svg { width: min(52vh, 34vw); height: min(52vh, 34vw); display: block; }
.pl-accueil__titre { font-size: 1.6em; max-width: 18em; }
.pl-accueil__url { font-size: 2.2em; font-weight: 700; }
.pl-accueil__code { font-size: 3.2em; letter-spacing: 0.14em; font-weight: 800; }
.pl-accueil__partenaires { display: flex; gap: 2.5em; align-items: center; }
.pl-accueil__partenaires .pl-logo-partner { height: 2.4em; }

/* ---------------------------------------------------------------- Console animateur */
.pl-admin { max-width: 1200px; margin: 0 auto; padding: calc(var(--pl-spacing) * 3) calc(var(--pl-spacing) * 2) calc(var(--pl-spacing) * 8); }
.pl-admin__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: calc(var(--pl-spacing) * 2); padding-bottom: calc(var(--pl-spacing) * 2); border-bottom: 1px solid var(--pl-border); margin-bottom: calc(var(--pl-spacing) * 3); }
.pl-admin__bar .pl-logo { height: 2rem; }
.pl-admin h1 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
.pl-admin h2 { font-size: 1.3rem; margin-bottom: calc(var(--pl-spacing) * 1.5); }
.pl-table { width: 100%; border-collapse: collapse; }
.pl-table th, .pl-table td { text-align: left; padding: var(--pl-spacing); border-bottom: 1px solid var(--pl-border); vertical-align: middle; }
.pl-table th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--pl-text-muted); }
.pl-code { font-weight: 700; letter-spacing: 0.12em; }
.pl-tabs { display: flex; gap: var(--pl-spacing); margin: calc(var(--pl-spacing) * 2) 0; border-bottom: 1px solid var(--pl-border); }
.pl-tab { min-height: 44px; padding: 0 calc(var(--pl-spacing) * 2); border: 0; border-bottom: 3px solid transparent; background: none; color: var(--pl-text-muted); font: inherit; font-weight: 600; cursor: pointer; }
.pl-tab[aria-selected="true"] { color: var(--pl-text); border-bottom-color: var(--pl-accent); }
.pl-grid-2 { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: calc(var(--pl-spacing) * 3); align-items: start; }
@media (max-width: 900px) { .pl-grid-2 { grid-template-columns: 1fr; } }
.pl-settings { display: flex; flex-wrap: wrap; gap: calc(var(--pl-spacing) * 2); align-items: flex-end; }
.pl-settings .pl-field { min-width: 12rem; }

.pl-qlist { list-style: none; margin: 0; padding: 0; display: grid; gap: calc(var(--pl-spacing) * 1.5); }
.pl-qcard { display: grid; gap: var(--pl-spacing); }
.pl-qcard[draggable="true"] { cursor: grab; }
.pl-qcard--dragging { opacity: 0.5; }
.pl-qcard__head { display: flex; flex-wrap: wrap; gap: var(--pl-spacing); align-items: center; }
.pl-qcard__num { font-weight: 800; min-width: 2ch; }
.pl-qcard__head .pl-input { flex: 1; min-width: 14rem; }
.pl-editor-list { margin: 0; padding-left: 1.4rem; display: grid; gap: calc(var(--pl-spacing) * 0.75); }
.pl-editor-list .pl-input { flex: 1; min-width: 10rem; }

.pl-console__list { list-style: none; margin: 0; padding: 0; display: grid; gap: calc(var(--pl-spacing) * 0.75); }
.pl-console__item { display: grid; grid-template-columns: auto 1fr auto; gap: var(--pl-spacing); align-items: center; padding: var(--pl-spacing) calc(var(--pl-spacing) * 1.5); border: 1px solid var(--pl-border); border-radius: var(--pl-radius); }
.pl-console__item--active { border: 3px solid var(--pl-accent); }
.pl-console__controls { display: flex; flex-wrap: wrap; gap: var(--pl-spacing); }
.pl-console__big { font-size: 1.25rem; }
.pl-modlist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--pl-spacing); max-height: 60vh; overflow: auto; }
.pl-moditem { display: grid; gap: calc(var(--pl-spacing) * 0.75); }
.pl-moditem--hidden { opacity: 0.55; }
.pl-moditem p { overflow-wrap: anywhere; white-space: pre-line; }
.pl-kbd { font-size: 0.85rem; color: var(--pl-text-muted); }