/* wippso.css — habillage WippSo du kit Qovi OfL (31.10.2026).
   Charge APRES les styles du kit : ne fait que les surcharger. Le kit lui-meme
   n'est pas modifie, ses mises a jour se reportent sans conflit. */
:root {
  --ws-yellow: #F4F461;
  --ws-lime:   #9BCB3C;
  --ws-green:  #2F9A27;
  --ws-gray:   #5A675F;
  --ws-ink:    #2A2E32;
  --ws-grad:   linear-gradient(135deg, var(--ws-lime) 0%, var(--ws-green) 55%, var(--ws-gray) 100%);
}
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: linear-gradient(180deg, #FBFBFA 0%, #E3E6E8 100%) fixed;
  color: var(--ws-ink);
}

/* ── Accueil ─────────────────────────────────────────────────────────── */
.page {
  position: relative;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(31, 42, 34, .12), 0 1px 0 #fff inset;
}
.page::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px;
  border-radius: 18px 18px 0 0;
  background: linear-gradient(90deg, var(--ws-yellow), var(--ws-green), var(--ws-gray));
}
.ws-logo { display: block; width: 100%; max-width: 420px; height: auto; margin: 0 auto 28px; }
h1 { color: var(--ws-ink); }
/* Composant (320 x 480, place en absolu par le kit) : centre dans la carte */
.page { min-height: 560px; }
#qfa-wrapper {
  position: absolute; left: 50%; top: 50%; width: 320px; height: 480px;
  margin: -240px 0 0 -160px; display: block; pointer-events: none;
}
#qfa-container { pointer-events: auto; }
#qfa-btn-login {
  position: absolute; top: 18px; right: 18px; z-index: 100;   /* dans la carte, en haut a droite */
  width: 56px; height: 56px; padding: 8px;
  background: var(--ws-grad); border: none; border-radius: 12px; cursor: pointer;
  box-shadow: 0 4px 12px rgba(31, 42, 34, .30), inset 0 1px 0 rgba(255, 255, 255, .45);
  transition: transform .12s ease, box-shadow .12s ease;
}
#qfa-btn-login:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(31, 42, 34, .36), inset 0 1px 0 rgba(255, 255, 255, .5); }
#qfa-btn-login:active { transform: translateY(1px); }
#qfa-btn-login img { width: 100%; height: 100%; display: block; }

/* ── Espace prive et page des bornes ─────────────────────────────────── */
.head { border-bottom: 4px solid transparent; border-image: linear-gradient(90deg, var(--ws-yellow), var(--ws-green), var(--ws-gray)) 1; }
.head h1 { color: var(--ws-ink); }
.who, .head .who { color: var(--ws-green); }
.btn-out, .btn-go { background: var(--ws-grad); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35); }
.btn-out:hover, .btn-go:hover { filter: brightness(1.06); background: var(--ws-grad); }
.live { color: var(--ws-green); }
.dot { background: var(--ws-green); }
thead th, th { background: var(--ws-green); background-image: linear-gradient(180deg, #3AA82F, var(--ws-green)); }
.res-OK { color: var(--ws-green); }
.btn-alt { background: #fff; color: var(--ws-green); border: 2px solid var(--ws-green); }
.btn-alt:hover { background: #EEF5E9; }