/*
Theme Name: J'enquête
Theme URI: https://jenquete.mouvementmarianne.org
Author: Mouvement Marianne
Description: Thème de la plateforme de mobilisation « J'enquête » (grande enquête sociologique citoyenne). Fonctionne avec l'extension « J'enquête – Plateforme de mobilisation ».
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jenquete
*/

/* ---------- Polices (hébergées sur le site : aucune requête vers Google) ---------- */
@font-face { font-family: "Luckiest Guy"; font-weight: 400; font-display: swap; src: url("assets/fonts/luckiest-guy-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Luckiest Guy"; font-weight: 400; font-display: swap; src: url("assets/fonts/luckiest-guy-latin-ext-400-normal.woff2") format("woff2"); unicode-range: U+0100-024F, U+1E00-1EFF; }
@font-face { font-family: "Permanent Marker"; font-weight: 400; font-display: swap; src: url("assets/fonts/permanent-marker-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Archivo"; font-weight: 500; font-display: swap; src: url("assets/fonts/archivo-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Archivo"; font-weight: 600; font-display: swap; src: url("assets/fonts/archivo-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Archivo"; font-weight: 700; font-display: swap; src: url("assets/fonts/archivo-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Archivo"; font-weight: 800; font-display: swap; src: url("assets/fonts/archivo-latin-800-normal.woff2") format("woff2"); }
@font-face { font-family: "Archivo"; font-weight: 500; font-display: swap; src: url("assets/fonts/archivo-latin-ext-500-normal.woff2") format("woff2"); unicode-range: U+0100-024F, U+1E00-1EFF; }
@font-face { font-family: "Archivo"; font-weight: 700; font-display: swap; src: url("assets/fonts/archivo-latin-ext-700-normal.woff2") format("woff2"); unicode-range: U+0100-024F, U+1E00-1EFF; }
@font-face { font-family: "Archivo"; font-weight: 800; font-display: swap; src: url("assets/fonts/archivo-latin-ext-800-normal.woff2") format("woff2"); unicode-range: U+0100-024F, U+1E00-1EFF; }

/* ---------- Couleurs et bases ---------- */
:root {
	--ink: #13191C;
	--night: #1A1E2A;
	--night-2: #262B3A;
	--night-line: #4A5163;
	--dots: #2E3446;
	--paper: #FAF9F5;
	--sand: #EFEBE2;
	--sand-line: #C9C3B5;
	--yellow: #FECD0E;
	--yellow-soft: #FFF6CC;
	--muted: #4A505A;
	--muted-on-night: #C9CCD6;
	--white: #FFFFFF;
	--radius: 16px;
	--display: "Luckiest Guy", "Arial Black", sans-serif;
	--marker: "Permanent Marker", "Comic Sans MS", cursive;
	--text: "Archivo", "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--text); font-size: 16px; line-height: 1.5; }
img { max-width: 100%; height: auto; }
a { color: var(--ink); text-underline-offset: 3px; }
a:hover { color: #000; }
h1, h2, h3 { margin: 0; line-height: 1.15; }
p { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--yellow); outline-offset: 2px; box-shadow: 0 0 0 6px var(--ink); }
[hidden] { display: none !important; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.jq-skip { position: absolute; left: -9999px; top: 8px; z-index: 100; background: var(--yellow); padding: 10px 14px; font-weight: 800; border-radius: 8px; }
.jq-skip:focus { left: 8px; }

/* ---------- Typo de la DA ---------- */
.jq-display { font-family: var(--display); font-weight: 400; letter-spacing: 1px; line-height: 1; text-transform: uppercase; }
.jq-marker { font-family: var(--marker); font-weight: 400; }
.jq-h1 { font-family: var(--display); font-weight: 400; font-size: clamp(32px, 5vw, 46px); line-height: 1; letter-spacing: 1px; text-transform: uppercase; }
.jq-kicker { font-family: var(--marker); font-size: 22px; line-height: 1.15; }
.jq-h2 { font-size: 20px; font-weight: 800; }
.jq-h3 { font-size: 17px; font-weight: 800; }
.jq-muted { color: var(--muted); }
.jq-small { font-size: 14px; }
.jq-tiny { font-size: 13px; }
.jq-strong { font-weight: 800; }
.jq-caps { font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }

/* Bandeau jaune aux bords déchirés (comme sous « J'ENQUÊTE ») */
.jq-band {
	display: inline-block; position: relative; padding: .38em .55em .12em; color: var(--ink);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 30' preserveAspectRatio='none'%3E%3Cpath d='M1 3 L12 1 L25 2.5 L40 0.8 L55 2 L70 0.5 L85 2.2 L99 1 L97.5 9 L100 16 L98 24 L99.5 29 L85 27.5 L70 29.5 L55 28 L40 29.6 L25 28.2 L12 29.4 L0.5 28 L2 20 L0 12 Z' fill='%23FECD0E'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	transform: rotate(-2deg);
}
.jq-halftone { position: absolute; border-radius: 50%; background-image: radial-gradient(var(--dots) 2.4px, transparent 2.9px); background-size: 13px 13px; pointer-events: none; }

/* ---------- Boutons ---------- */
.jq-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 18px;
	border: 2px solid var(--ink); border-radius: 12px; background: var(--white); color: var(--ink);
	font-family: var(--text); font-size: 15px; font-weight: 800; text-decoration: none; cursor: pointer; line-height: 1.1; text-align: center;
}
.jq-btn:hover { background: var(--sand); color: var(--ink); }
.jq-btn--primary { background: var(--yellow); border-width: 3px; box-shadow: 4px 4px 0 var(--ink); }
.jq-btn--primary:hover { background: #FFD83D; transform: translate(1px, 1px); box-shadow: 3px 3px 0 var(--ink); }
.jq-btn--dark { background: var(--ink); color: var(--yellow); }
.jq-btn--dark:hover { background: #000; color: var(--yellow); }
.jq-btn--ghost-light { background: transparent; color: var(--paper); border-color: var(--paper); }
.jq-btn--ghost-light:hover { background: var(--night-2); color: var(--paper); }
.jq-btn--sm { min-height: 44px; padding: 0 14px; font-size: 14px; border-radius: 10px; }
.jq-btn--block { width: 100%; }
.jq-btn--big { min-height: 64px; font-family: var(--display); font-weight: 400; font-size: 22px; letter-spacing: 1px; padding-top: 4px; text-transform: uppercase; }
.jq-btn--danger { border-color: #8A1C1C; color: #8A1C1C; }
.jq-linkbtn { background: none; border: 0; padding: 0; font-weight: 700; text-decoration: underline; cursor: pointer; min-height: 44px; }

/* ---------- En-tête des espaces ---------- */
.jq-topbar { background: var(--night); color: var(--paper); position: sticky; top: 0; z-index: 30; box-shadow: 0 2px 0 rgba(0,0,0,.25); }
.jq-topbar__in { max-width: 1280px; margin: 0 auto; padding: 8px 24px; display: flex; align-items: center; gap: 12px 20px; min-height: 68px; }
.jq-topbar__logo { flex-shrink: 0; }
.jq-topbar__logo img { width: 78px; height: 78px; object-fit: contain; margin: -12px -6px -12px -10px; display: block; }
.jq-topbar__title { flex: 1; font-family: var(--display); font-size: 20px; letter-spacing: 1px; text-transform: uppercase; padding-top: 3px; }
.jq-nav { display: flex; gap: 2px; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.jq-nav::-webkit-scrollbar { display: none; }
.jq-nav a { position: relative; flex-shrink: 0; color: #DADCE3; text-decoration: none; font-size: 15px; font-weight: 600; padding: 10px 13px; border-radius: 10px; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.jq-nav a:hover { background: var(--night-2); color: var(--paper); }
.jq-nav a[aria-current="page"] { background: var(--yellow); color: var(--ink); font-weight: 800; }
.jq-topbar__right { display: flex; align-items: center; gap: 10px; margin-left: auto; flex-shrink: 0; }
.jq-iconbtn { position: relative; width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: var(--paper); background: var(--night-2); }
.jq-iconbtn:hover { color: var(--yellow); background: #30364A; }
.jq-badge { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: #E5484D; color: #fff; font-size: 12px; font-weight: 800; line-height: 20px; text-align: center; display: inline-block; }
.jq-iconbtn .jq-badge, .jq-tabbar__ico .jq-badge { position: absolute; top: -6px; right: -8px; border: 2px solid var(--night); }
.jq-tabbar__ico .jq-badge { border-color: var(--white); }
.jq-nav a[aria-current="page"] .jq-badge { background: var(--ink); color: var(--yellow); }

.jq-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--yellow); color: var(--ink); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px; flex-shrink: 0; }
.jq-avatar--group { background: var(--night); color: var(--yellow); }

.jq-usermenu { position: relative; }
.jq-usermenu summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 5px 10px 5px 5px; border-radius: 999px; background: var(--night-2); cursor: pointer; min-height: 48px; }
.jq-usermenu summary::-webkit-details-marker { display: none; }
.jq-usermenu summary:hover { background: #30364A; }
.jq-usermenu[open] summary { background: var(--paper); color: var(--ink); }
.jq-usermenu__who { display: flex; flex-direction: column; line-height: 1.15; }
.jq-usermenu__who b { font-size: 15px; }
.jq-usermenu__chev { transition: transform .15s; }
.jq-usermenu[open] .jq-usermenu__chev { transform: rotate(180deg); }
.jq-rolechip { display: inline-block; margin-top: 3px; font-size: 11px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; padding: 2px 7px; border-radius: 6px; background: var(--yellow); color: var(--ink); align-self: flex-start; }
.jq-rolechip--chef { background: #9FD3B4; }
.jq-rolechip--enqueteur { background: #FFFFFF; }
.jq-rolechip--enquete { background: #C9D7F2; }
.jq-usermenu__panel { position: absolute; right: 0; top: calc(100% + 10px); width: 290px; background: var(--white); color: var(--ink); border: 2px solid var(--ink); border-radius: 16px; box-shadow: 6px 6px 0 var(--yellow); padding: 8px; display: flex; flex-direction: column; z-index: 40; }
.jq-usermenu__id { display: flex; gap: 12px; align-items: center; padding: 10px 10px 14px; border-bottom: 2px solid var(--sand); margin-bottom: 6px; }
.jq-usermenu__panel a { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border-radius: 10px; text-decoration: none; font-weight: 700; font-size: 15px; }
.jq-usermenu__panel a:hover, .jq-usermenu__panel a[aria-current="page"] { background: var(--paper); }
.jq-usermenu__panel .jq-usermenu__logout { margin-top: 6px; border-top: 2px solid var(--sand); border-radius: 0 0 10px 10px; color: #8A1C1C; }
.jq-usermenu__panel .jq-usermenu__logout:hover { background: #FBE3E1; color: #8A1C1C; }

/* Barre d'onglets (enquêteur, enquêté) : en bas de l'écran, comme une appli */
.jq-tabbar { display: none; }
.jq-has-tabbar { padding-bottom: 84px; }
.jq-has-tabbar .jq-tabbar {
	display: grid; grid-template-columns: repeat(var(--tabs, 4), minmax(0, 1fr)); position: fixed; left: 50%; transform: translateX(-50%); bottom: 0; z-index: 25;
	width: 100%; max-width: 560px; background: var(--white); border-top: 2px solid var(--sand); padding: 6px 6px calc(10px + env(safe-area-inset-bottom));
}
@media (min-width: 600px) { .jq-has-tabbar .jq-tabbar { bottom: 14px; border: 2px solid var(--ink); border-radius: 18px; box-shadow: 4px 4px 0 var(--ink); padding: 6px; } }
.jq-tabbar a { display: flex; flex-direction: column; align-items: center; gap: 4px; text-decoration: none; font-size: 12px; font-weight: 600; color: var(--muted); padding: 6px 0; min-height: 44px; border-radius: 12px; }
.jq-tabbar a[aria-current="page"] { color: var(--ink); font-weight: 800; background: var(--yellow-soft); }
.jq-tabbar__ico { position: relative; display: inline-flex; }
.jq-tabbar svg { width: 22px; height: 22px; }

/* ---------- Mise en page ---------- */
.jq-main { max-width: 1280px; margin: 0 auto; padding: 32px 24px 56px; display: flex; flex-direction: column; gap: 24px; }
.jq-main--narrow { max-width: 560px; }
.jq-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; }
.jq-head__titles { display: flex; flex-direction: column; gap: 6px; }
.jq-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.jq-row { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.jq-col-main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.jq-col-side { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.jq-stack { display: flex; flex-direction: column; gap: 12px; }
.jq-stack--lg { gap: 20px; }
.jq-wrap { display: flex; flex-wrap: wrap; gap: 12px; }
.jq-between { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; }

/* ---------- Cartes ---------- */
.jq-card { background: var(--white); border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.jq-card--outline { border: 2px solid var(--ink); box-shadow: 6px 6px 0 var(--yellow); }
.jq-card--line { border: 2px solid var(--ink); }
.jq-card--night { background: var(--night); color: var(--paper); }
.jq-card--night a:not(.jq-btn) { color: var(--yellow); }
.jq-card--yellow { background: var(--yellow); border: 2px solid var(--ink); }
.jq-card--dashed { border: 2px dashed var(--ink); }
.jq-card--sm { padding: 16px; border-radius: 16px; gap: 10px; }

.jq-stat { flex: 1 1 150px; background: var(--paper); border-radius: 14px; padding: 14px 16px; }
.jq-card--night .jq-stat { background: var(--night-2); }
.jq-stat__n { font-family: var(--display); font-size: 32px; line-height: 1; }
.jq-stat__l { font-size: 14px; font-weight: 600; color: var(--muted); }
.jq-card--night .jq-stat__l { color: var(--muted-on-night); }
.jq-bignum { font-family: var(--display); font-size: 60px; line-height: .9; }
.jq-yellow { color: var(--yellow); }

.jq-progress { height: 22px; background: var(--sand); border: 2px solid var(--ink); border-radius: 999px; overflow: hidden; }
.jq-progress > span { display: block; height: 100%; background: var(--yellow); border-right: 2px solid var(--ink); }
.jq-progress--thin { height: 12px; border: 0; background: var(--dots); }
.jq-progress--thin > span { border: 0; border-radius: 999px; }
.jq-bar { height: 10px; background: var(--sand); border-radius: 999px; }
.jq-bar > span { display: block; height: 100%; background: var(--ink); border-radius: 999px; }

/* Frise des phases */
.jq-card.jq-timeline, .jq-timeline { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 24px 40px; }
.jq-timeline ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; flex: 1 1 520px; }
.jq-timeline li { flex: 1 1 140px; border-top: 5px solid var(--night-line); padding-top: 10px; }
.jq-timeline li.is-current { border-color: var(--yellow); }
.jq-timeline li small { display: block; font-size: 13px; font-weight: 800; color: var(--muted-on-night); text-transform: uppercase; letter-spacing: 1px; }
.jq-timeline li.is-current small { color: var(--yellow); }
.jq-timeline li span { font-weight: 700; }

/* Liste « à pourvoir » */
.jq-open { background: var(--white); border-radius: 16px; padding: 14px 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.jq-open__badge { width: 56px; height: 56px; border-radius: 14px; background: var(--night); color: var(--yellow); display: flex; align-items: center; justify-content: center; font-family: var(--display); font-size: 22px; padding-top: 4px; flex-shrink: 0; }
.jq-open__badge.is-half { background: var(--sand); color: var(--ink); }
.jq-open__txt { flex: 1 1 220px; }

/* Pastilles de prénoms */
.jq-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--night); color: var(--paper); border-radius: 999px; padding: 5px 10px; font-weight: 700; font-size: 14px; }
.jq-chip.is-new { background: var(--yellow); color: var(--ink); border: 2px solid var(--ink); padding: 3px 9px; }
.jq-chip form { display: inline; }
.jq-chip button { background: none; border: 0; color: inherit; cursor: pointer; padding: 0 2px; font-weight: 800; line-height: 1; min-height: 24px; }
.jq-pill { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 4px 10px; font-size: 13px; font-weight: 800; background: var(--sand); }
.jq-pill--yellow { background: var(--yellow); }
.jq-pill--night { background: var(--night); color: var(--yellow); }

/* Grille de planning */
.jq-scroll { overflow-x: auto; }
.jq-grid { display: grid; gap: 8px; min-width: 680px; font-size: 14px; }
.jq-grid__head { font-weight: 800; padding: 6px 4px; }
.jq-grid__spot { display: flex; flex-direction: column; justify-content: center; }
.jq-grid__spot b { font-size: 15px; }
.jq-cell { background: var(--paper); border-radius: 12px; padding: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-content: flex-start; min-height: 64px; }
.jq-cell--open { background: var(--yellow-soft); border: 2px dashed var(--ink); flex-direction: column; flex-wrap: nowrap; }
.jq-cell--empty { background: transparent; border: 2px dashed var(--sand-line); }
.jq-cell select { width: 100%; min-height: 36px; border: 2px solid var(--ink); border-radius: 8px; background: var(--white); font-size: 13px; }
.jq-cell .jq-btn { min-height: 36px; font-size: 13px; padding: 0 10px; }

/* Onglets */
.jq-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.jq-tabs a { min-height: 44px; display: inline-flex; align-items: center; padding: 0 16px; border: 2px solid var(--ink); border-radius: 999px; background: var(--white); font-size: 14px; font-weight: 700; text-decoration: none; }
.jq-tabs a[aria-current="page"] { background: var(--ink); color: var(--yellow); font-weight: 800; }

/* ---------- Formulaires ---------- */
.jq-field { display: flex; flex-direction: column; gap: 6px; }
.jq-field label, .jq-label { font-size: 15px; font-weight: 700; }
.jq-input, .jq-field input[type="text"], .jq-field input[type="email"], .jq-field input[type="tel"], .jq-field input[type="password"], .jq-field input[type="date"], .jq-field input[type="time"], .jq-field input[type="number"], .jq-field input[type="search"], .jq-field select, .jq-field textarea {
	width: 100%; min-height: 50px; border: 2px solid var(--ink); border-radius: 12px; padding: 0 14px; font-size: 16px; background: var(--white);
}
.jq-field textarea { padding: 12px 14px; line-height: 1.5; min-height: 140px; resize: vertical; }
.jq-field__hint { font-size: 13px; color: var(--muted); }
.jq-field.is-invalid select, .jq-field.is-invalid input { border-color: #C2332B; box-shadow: 0 0 0 3px #FBE1DE; }
.jq-field.is-invalid label::after { content: " · à choisir d'abord"; color: #C2332B; }
.jq-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.jq-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.45; cursor: pointer; }
.jq-check input { width: 22px; height: 22px; flex-shrink: 0; accent-color: var(--ink); margin: 0; }
.jq-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.jq-choice { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 2px solid var(--ink); border-radius: 999px; font-size: 14px; font-weight: 700; cursor: pointer; background: var(--white); }
.jq-choice:has(input:checked) { background: var(--yellow); border-width: 3px; font-weight: 800; }
.jq-choice input { accent-color: var(--ink); }
fieldset.jq-fieldset { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
fieldset.jq-fieldset legend { padding: 0; margin-bottom: 8px; font-size: 15px; font-weight: 800; }

/* Messages */
.jq-flash { border-radius: 14px; padding: 14px 18px; font-weight: 700; border: 2px solid var(--ink); background: var(--yellow); display: flex; gap: 10px; align-items: flex-start; }
.jq-flash--error { background: #FBE3E1; border-color: #8A1C1C; color: #5E1010; }
.jq-empty { border: 2px dashed var(--sand-line); border-radius: 14px; padding: 18px; text-align: center; color: var(--muted); font-weight: 600; font-size: 14px; }

/* Tableau */
.jq-table { width: 100%; border-collapse: collapse; font-size: 15px; background: var(--white); }
.jq-table th { text-align: left; background: var(--night); color: var(--paper); padding: 12px 14px; font-weight: 800; }
.jq-table td { padding: 12px 14px; border-bottom: 1px solid var(--sand); vertical-align: top; }
.jq-table tr:last-child td { border-bottom: 0; }

/* Détails repliables (édition) */
details.jq-details summary { cursor: pointer; font-weight: 800; list-style: none; min-height: 44px; display: inline-flex; align-items: center; }
details.jq-details summary::-webkit-details-marker { display: none; }
details.jq-details summary::after { content: "  +"; }
details.jq-details[open] summary::after { content: "  –"; }
details.jq-details > div { padding-top: 12px; display: flex; flex-direction: column; gap: 12px; }

/* Kanban des entretiens */
.jq-kanban { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; min-width: 760px; }
.jq-kcol { background: var(--white); border-radius: 18px; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.jq-kcol--todo { background: var(--yellow-soft); border: 2px solid var(--ink); }
.jq-kcol--done { background: var(--night); color: var(--paper); }
.jq-kcard { background: var(--paper); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 6px; }
.jq-kcol--todo .jq-kcard { background: var(--white); }
.jq-kcol--done .jq-kcard { background: var(--night-2); }
.jq-kcard.is-selected { border: 3px solid var(--ink); box-shadow: 3px 3px 0 var(--ink); }
.jq-kcard__meta { font-size: 13px; font-weight: 600; color: var(--muted); }
.jq-kcol--done .jq-kcard__meta { color: var(--muted-on-night); }

/* Coupon carte cadeau */
.jq-ticket { min-height: 124px; background: var(--yellow); border: 3px solid var(--ink); border-radius: 16px; box-shadow: 5px 5px 0 var(--ink); display: flex; overflow: hidden; }
.jq-ticket__stub { width: 46px; flex-shrink: 0; border-right: 3px dashed var(--ink); display: flex; align-items: center; justify-content: center; }
.jq-ticket__stub span { transform: rotate(-90deg); white-space: nowrap; font-size: 11px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.jq-ticket__body { flex: 1; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.jq-ticket__amount { font-family: var(--display); font-size: 40px; line-height: .9; padding-top: 4px; }
.jq-ticket.is-locked { background: var(--sand); box-shadow: none; border-style: dashed; }

/* ---------- Page de connexion ---------- */
.jq-login { min-height: 100vh; display: flex; flex-direction: column; }
.jq-partners { background: var(--white); border-bottom: 2px solid var(--sand); }
.jq-partners__in { max-width: 1280px; margin: 0 auto; padding: 12px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 36px; }
.jq-partners__in img { height: 48px; width: auto; }
.jq-login__body { flex: 1; display: flex; flex-wrap: wrap; }
.jq-login__brand { flex: 1 1 520px; min-width: 0; background: var(--night); color: var(--paper); position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 40px; gap: 8px; text-align: center; }
.jq-login__brand img { width: 100%; max-width: 440px; position: relative; }
.jq-login__count { position: relative; font-family: var(--display); font-size: clamp(64px, 10vw, 96px); line-height: .9; color: var(--yellow); letter-spacing: 2px; margin-top: -10px; }
.jq-login__date { position: relative; font-size: 17px; font-weight: 600; color: #DADCE3; }
.jq-login__form { flex: 1 1 440px; min-width: 0; display: flex; align-items: center; justify-content: center; padding: 48px 32px; }
.jq-login__form form { width: 100%; max-width: 400px; display: flex; flex-direction: column; gap: 22px; }
.jq-note svg { flex-shrink: 0; }
.jq-note { display: flex; gap: 12px; align-items: flex-start; background: var(--white); border: 2px dashed var(--sand-line); border-radius: 12px; padding: 14px 16px; font-size: 14px; line-height: 1.45; color: var(--muted); }
.jq-footlinks { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; font-size: 14px; font-weight: 600; }

/* ---------- Enquêteur : écran du jour ---------- */
.jq-hero { background: var(--night); color: var(--paper); border-radius: 20px; padding: 20px 22px; position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 6px; }
.jq-hero .jq-halftone { right: -50px; top: -50px; width: 200px; height: 200px; }
.jq-hero > *:not(.jq-halftone) { position: relative; }
.jq-live { display: inline-flex; align-items: center; gap: 8px; background: var(--yellow); color: var(--ink); border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 800; align-self: flex-start; }
.jq-live::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--ink); }
.jq-dots { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 5px; }
.jq-dots span { height: 12px; border-radius: 4px; background: var(--sand); border: 2px solid var(--sand-line); }
.jq-dots span.on { background: var(--yellow); border-color: var(--ink); }

/* ---------- Questionnaire ---------- */
.jq-q-top { background: var(--night); color: var(--paper); border-radius: 20px; padding: 16px 20px; display: flex; flex-direction: column; gap: 12px; }
.jq-q { display: flex; flex-direction: column; gap: 14px; }
.jq-q__label { font-size: 24px; font-weight: 800; line-height: 1.25; padding: 0; }
.jq-q__label:focus { outline: none; box-shadow: none; }
.jq-answer { display: flex; align-items: center; gap: 14px; min-height: 60px; border: 2px solid var(--ink); border-radius: 14px; background: var(--white); padding: 0 16px; font-size: 17px; font-weight: 700; cursor: pointer; }
.jq-answer input { width: 22px; height: 22px; accent-color: var(--ink); flex-shrink: 0; }
.jq-answer:has(input:checked) { background: var(--yellow); border-width: 3px; padding: 0 15px; box-shadow: 4px 4px 0 var(--ink); font-weight: 800; }
.jq-answer--nr { font-weight: 600; color: var(--muted); }
.jq-q-nav { display: flex; gap: 10px; }
.jq-q-nav .jq-btn--back { flex: 0 0 110px; }
.jq-q-nav .jq-btn--next { flex: 1; }
.js .jq-q[hidden] { display: none; }
.jq-phase2 { background: var(--night); color: var(--paper); border-radius: 16px; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.jq-phase2 .jq-choice { background: transparent; color: var(--paper); border-color: var(--night-line); flex: 1; justify-content: center; }
.jq-phase2 .jq-choice:has(input:checked) { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }
.jq-phase2 label { color: #DADCE3; }
.jq-tag10 { background: var(--yellow); color: var(--ink); border-radius: 8px; padding: 6px 8px 2px; font-family: var(--display); font-size: 16px; transform: rotate(4deg); flex-shrink: 0; }

/* ---------- Questions (éditeur admin) ---------- */
.jq-qedit { border: 2px solid var(--ink); border-radius: 16px; padding: 16px; background: var(--white); display: flex; flex-direction: column; gap: 12px; }
.jq-qedit__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }

/* ---------- Pages de contenu (mentions légales) ---------- */
.jq-legal { max-width: 1280px; margin: 0 auto; padding: 40px 24px 64px; display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; }
.jq-legal__toc { flex: 1 1 240px; min-width: 0; background: var(--white); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 4px; }
.jq-legal__toc a { font-weight: 700; padding: 6px 0; font-size: 15px; }
.jq-legal__body { flex: 999 1 640px; min-width: 0; max-width: 780px; font-size: 16px; line-height: 1.6; }
.jq-legal__body h2 { font-family: var(--display); font-weight: 400; font-size: 30px; letter-spacing: 1px; text-transform: uppercase; margin: 36px 0 12px; }
.jq-legal__body h3 { font-size: 20px; font-weight: 800; margin: 26px 0 8px; }
.jq-legal__body p, .jq-legal__body ul { margin: 0 0 12px; }
.jq-legal__body table { width: 100%; border-collapse: collapse; background: var(--white); margin: 8px 0 16px; font-size: 15px; }
.jq-legal__body th { background: var(--night); color: var(--paper); text-align: left; padding: 12px 14px; }
.jq-legal__body td { padding: 12px 14px; border-bottom: 1px solid var(--sand); }
.jq-legal-brief { background: var(--night); color: var(--paper); border-radius: 20px; padding: 24px 26px; margin: 16px 0 8px; }
.jq-legal-brief h2 { margin-top: 0 !important; display: inline-block; color: var(--ink); font-size: 24px !important; padding: .38em .55em .12em; transform: rotate(-2deg);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 30' preserveAspectRatio='none'%3E%3Cpath d='M1 3 L12 1 L25 2.5 L40 0.8 L55 2 L70 0.5 L85 2.2 L99 1 L97.5 9 L100 16 L98 24 L99.5 29 L85 27.5 L70 29.5 L55 28 L40 29.6 L25 28.2 L12 29.4 L0.5 28 L2 20 L0 12 Z' fill='%23FECD0E'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.jq-legal-note { background: var(--yellow-soft); border: 2px dashed var(--ink); border-radius: 14px; padding: 14px 18px; }
.jq-legal-rights { background: var(--white); border: 2px solid var(--ink); border-radius: 20px; padding: 6px 24px 14px; box-shadow: 6px 6px 0 var(--yellow); margin-top: 24px; }
.jq-legal-updated { font-size: 14px; font-weight: 600; color: var(--muted); }
.jq-content { max-width: 780px; margin: 0 auto; padding: 40px 24px 64px; }

/* ---------- Pied de page ---------- */
.jq-footer { border-top: 2px solid var(--sand); background: var(--white); }
.jq-footer__in { max-width: 1280px; margin: 0 auto; padding: 18px 24px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px; font-size: 13px; color: var(--muted); }
.jq-footer__partners { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.jq-footer__partners img { height: 34px; width: auto; }


/* ---------- Jour J : en direct ---------- */
:root { --good: #1F7A4A; --good-soft: #DDF3E6; --warn-soft: #FFF2B8; --bad: #C2332B; --bad-soft: #FBE1DE; --idle: #8A8F99; }
.jq-livehero { flex-direction: row; flex-wrap: wrap; gap: 24px 40px; align-items: flex-end; position: relative; overflow: hidden; padding: 26px 28px; }
.jq-livehero > *:not(.jq-halftone) { position: relative; }
.jq-livehero__main { flex: 1 1 420px; display: flex; flex-direction: column; gap: 10px; }
.jq-livehero__stats { flex: 1 1 360px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.jq-live[data-live-refresh]::before { animation: jq-pulse 1.6s infinite; }
@keyframes jq-pulse { 50% { opacity: .25; } }
.jq-hours { display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); gap: 8px; align-items: end; height: 170px; }
.jq-hours__col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 6px; }
.jq-hours__bar { width: 100%; max-width: 54px; min-height: 3px; background: var(--ink); border-radius: 8px 8px 2px 2px; }
.jq-hours__col.is-now .jq-hours__bar { background: var(--yellow); border: 2px solid var(--ink); }
.jq-hours__n { font-size: 13px; font-weight: 800; }
.jq-hours__h { font-size: 13px; font-weight: 600; color: var(--muted); }
.jq-state { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 800; padding: 4px 10px; border-radius: 999px; white-space: nowrap; }
.jq-state::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.jq-state--good { background: var(--good-soft); color: var(--good); }
.jq-state--warn { background: var(--warn-soft); color: #6B5200; }
.jq-state--bad { background: var(--bad-soft); color: var(--bad); }
.jq-state--idle { background: var(--sand); color: var(--muted); }
.jq-alert { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; background: var(--white); border-radius: 16px; padding: 14px 16px; border-left: 6px solid var(--idle); }
.jq-alert--bad { border-left-color: var(--bad); }
.jq-alert--warn { border-left-color: var(--yellow); }
.jq-alert__txt { flex: 1 1 260px; }
.jq-podium { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--sand); }
.jq-podium:last-child { border-bottom: 0; }
.jq-podium__rank { width: 34px; height: 34px; border-radius: 50%; background: var(--yellow); border: 2px solid var(--ink); display: inline-flex; align-items: center; justify-content: center; font-family: var(--display); font-size: 16px; padding-top: 3px; flex-shrink: 0; }
.jq-centregrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; align-items: start; }
.jq-centrecard, .jq-spotcard { background: var(--white); border-radius: 18px; padding: 16px 18px; border-top: 6px solid var(--idle); display: flex; flex-direction: column; gap: 10px; }
.jq-centrecard > summary { list-style: none; cursor: pointer; display: flex; flex-direction: column; gap: 10px; }
.jq-centrecard > summary::-webkit-details-marker { display: none; }
.jq-centrecard--good { border-top-color: var(--good); }
.jq-centrecard--warn { border-top-color: var(--yellow); }
.jq-centrecard--bad { border-top-color: var(--bad); }
.jq-dotsrow { display: flex; flex-wrap: wrap; gap: 5px; }
.jq-dot { width: 14px; height: 14px; border-radius: 4px; background: var(--idle); }
.jq-dot--good { background: var(--good); }
.jq-dot--warn { background: var(--yellow); border: 2px solid #6B5200; }
.jq-dot--bad { background: var(--bad); }

/* Résultats */
.jq-resgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 16px; align-items: start; }
.jq-resbar .jq-bar { height: 14px; }
.jq-resbar.is-top .jq-bar > span { background: var(--yellow); border: 2px solid var(--ink); }

/* Lien cliquable sur les créneaux à pourvoir */
.jq-open--link { text-decoration: none; border: 2px solid transparent; }
.jq-open--link:hover { border-color: var(--ink); color: var(--ink); }

/* ---------- Messagerie ---------- */
.jq-msg { display: grid; grid-template-columns: 340px minmax(0, 1fr); background: var(--white); border: 2px solid var(--ink); border-radius: 20px; overflow: hidden; height: calc(100vh - 230px); min-height: 520px; }
.jq-msg__list { border-right: 2px solid var(--sand); display: flex; flex-direction: column; min-height: 0; }
.jq-msg__list > div { overflow-y: auto; flex: 1; }
.jq-msg__new { display: flex; gap: 8px; padding: 12px; border-bottom: 2px solid var(--sand); }
.jq-msg__new select { flex: 1; min-width: 0; min-height: 44px; border: 2px solid var(--ink); border-radius: 10px; padding: 0 8px; background: var(--white); font-size: 14px; }
.jq-msg__item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; text-decoration: none; border-bottom: 1px solid var(--sand); }
.jq-msg__item:hover { background: var(--paper); }
.jq-msg__item.is-active { background: var(--yellow-soft); box-shadow: inset 4px 0 0 var(--ink); }
.jq-msg__meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.jq-msg__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.jq-msg__meta small { color: var(--muted); font-size: 12px; flex-shrink: 0; }
.jq-msg__preview { font-size: 13px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jq-msg__item.is-unread .jq-msg__preview { color: var(--ink); font-weight: 700; }
.jq-msg__thread { display: flex; flex-direction: column; min-height: 0; background: var(--paper); background-image: radial-gradient(#E6E1D5 1.2px, transparent 1.5px); background-size: 18px 18px; }
.jq-msg__head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; background: var(--white); border-bottom: 2px solid var(--sand); }
.jq-msg__back { display: none; width: 40px; height: 40px; border-radius: 10px; align-items: center; justify-content: center; text-decoration: none; font-size: 22px; font-weight: 800; background: var(--paper); }
.jq-msg__body { flex: 1; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 8px; }
.jq-msg__day { align-self: center; font-size: 12px; font-weight: 800; color: var(--muted); background: var(--white); border-radius: 999px; padding: 4px 12px; margin: 8px 0; }
.jq-msg__hint { align-self: center; color: var(--muted); font-weight: 600; font-size: 14px; margin-top: 30px; text-align: center; }
.jq-bubble { max-width: min(560px, 78%); align-self: flex-start; background: var(--white); border-radius: 16px 16px 16px 4px; padding: 10px 14px 6px; box-shadow: 0 1px 0 rgba(0,0,0,.06); }
.jq-bubble.is-mine { align-self: flex-end; background: var(--yellow); border-radius: 16px 16px 4px 16px; }
.jq-bubble__who { font-size: 12px; font-weight: 800; color: var(--muted); margin-bottom: 2px; }
.jq-bubble__txt { font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; }
.jq-bubble__time { font-size: 11px; color: var(--muted); text-align: right; margin-top: 2px; }
.jq-bubble.is-mine .jq-bubble__time { color: #5A4A00; }
.jq-msg__composer { display: flex; gap: 10px; padding: 12px; background: var(--white); border-top: 2px solid var(--sand); align-items: flex-end; }
.jq-msg__composer textarea { flex: 1; min-height: 48px; max-height: 160px; border: 2px solid var(--ink); border-radius: 12px; padding: 12px 14px; font-size: 16px; resize: none; line-height: 1.4; }
.jq-msg__empty { margin: auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--muted); }
@media (max-width: 860px) {
	.jq-msg { grid-template-columns: 1fr; height: calc(100vh - 220px); }
	.jq-msg.has-thread .jq-msg__list { display: none; }
	.jq-msg:not(.has-thread) .jq-msg__thread { display: none; }
	.jq-msg__back { display: inline-flex; }
}
.jq-has-tabbar .jq-msg { height: calc(100vh - 250px); }

/* ---------- Inscription publique ---------- */
.jq-reg { width: 100%; max-width: 520px; display: flex; flex-direction: column; gap: 22px; }
.jq-reg__brand { justify-content: flex-start; padding-top: 40px; gap: 24px; }
.jq-reg__points { position: relative; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; max-width: 420px; text-align: left; }
.jq-reg__points li { display: flex; gap: 12px; align-items: flex-start; font-size: 16px; line-height: 1.4; color: #DADCE3; }
.jq-reg__points svg { flex-shrink: 0; margin-top: 1px; }
.jq-reg__points b { color: var(--paper); }
.jq-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.jq-dispoday { display: flex; flex-direction: column; gap: 8px; background: var(--white); border-radius: 14px; padding: 12px 14px; }
.jq-reglink { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--night); color: var(--paper); border-radius: 14px; padding: 14px 16px; text-decoration: none; font-size: 15px; line-height: 1.35; }
.jq-reglink:hover { color: var(--paper); background: #262B3A; }
.jq-reglink__go { color: var(--yellow); font-weight: 800; white-space: nowrap; }

/* ---------- Mobile ---------- */
@media (max-width: 720px) {
	.jq-main { padding: 20px 16px 40px; gap: 18px; }
	.jq-topbar__in { padding: 6px 12px; gap: 8px; flex-wrap: wrap; min-height: 60px; }
	.jq-topbar__logo img { width: 64px; height: 64px; margin: -10px -6px -10px -6px; }
	.jq-usermenu__who { display: none; }
	.jq-usermenu summary { padding: 4px; }
	.jq-usermenu__chev { display: none; }
	.jq-app:not(.jq-has-tabbar) .jq-nav { order: 3; flex-basis: 100%; margin: 0 -12px; padding: 0 12px 6px; }
	.jq-topbar__title { font-size: 17px; }
	.jq-bignum { font-size: 48px; }
	.jq-q__label { font-size: 21px; }
	.jq-legal { padding: 24px 16px 48px; gap: 24px; }
	.jq-login__brand { padding: 28px 24px 32px; }
	.jq-login__brand img { max-width: 260px; }
	.jq-partners__in { gap: 8px 20px; }
	.jq-login__form { padding: 32px 20px; }
	.jq-partners__in img { height: 36px; }
	.jq-usermenu__panel { width: min(290px, calc(100vw - 24px)); }
}

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
@media print { .jq-topbar, .jq-tabbar, .jq-footer { display: none; } }