/* En-tête COMMUN des pages du Game Master (pages système du CPT klugle_engine) : titre compact à gauche, pastille de
   version, bulle d'aide ⓘ qui porte l'explication de la page, puis les commandes de la page sur la même ligne — patron
   des pages Planning et Bons cadeaux. Feuille AUTONOME (chaque page a sa propre charte, aucun ordre de chargement
   garanti) : jetons --tcc-* lus avec repli en dur. Préfixe .kg- (jamais .ad-/.adv-, bloqueurs de publicité).
   Chargée sur toute page du CPT klugle_engine (shortcodes.php, klugle_enqueue_page_head). */
/* Date: 2026-10-16 ; Version: 1.2.0 ; GSt / Claude ; Ascenseurs aux couleurs de la charte sur TOUTES les pages GM (retour du 16/10, constaté au Live) : même rendu que le Planning, volets et fenêtres flottants compris. */
/* Date: 2026-10-15 ; Version: 1.1.0 ; GSt / Claude ; Plein écran des pages GM (gm-fullscreen.js) : bouton flottant .kg-fs-btn et bandeau de reprise .kg-fs-banner. */
/* Date: 2026-10-03 ; Version: 1.0.0 ; GSt / Claude ; NOUVEAU FICHIER — demande GSt du 03/10 : titres des pages Battle, Options, Adventure Config, TCC, Highscores, Photos Équipes et Backup alignés sur Planning / Bons cadeaux, explications déplacées dans une bulle ⓘ. */

.kg-page-head {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px;
    margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--tcc-bord, rgba(0, 149, 19, 0.35));
    font-family: sans-serif; text-align: left;
}
.kg-page-head.kg-page-head-flat { border-bottom: none; padding-bottom: 0; }

/* Le h2 de chaque charte est centré, grand, parfois coloré : tout est neutralisé ici, pour ce titre seulement. */
.kg-page-head h2.kg-page-title,
h2.kg-page-title {
    display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto;
    margin: 0 !important; padding: 0 !important; border: none !important;
    font-family: 'Cinzel', serif !important; font-size: 1.15rem !important; line-height: 1.2 !important;
    font-weight: 700; letter-spacing: normal !important; text-transform: none !important;
    color: var(--tcc-fluo, #C6FF00) !important; text-align: left !important; white-space: nowrap;
    background: none !important; text-shadow: none !important;
}
h2.kg-page-title i { font-size: 0.95em; }
/* Titre de SECTION (deuxième bloc d'une page) : même famille, un cran plus petit. */
h2.kg-page-title.kg-section-title { font-size: 1rem !important; }

.kg-page-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; }
.kg-page-tools.kg-right { justify-content: flex-end; }
.kg-page-tools .klugle-input, .kg-page-tools select, .kg-page-tools input[type="text"], .kg-page-tools input[type="search"] { width: auto; min-width: 170px; margin: 0; }

/* Bulle d'aide : survol (souris), focus (clavier) ou toucher (le tap donne le focus) — aucun JavaScript. */
.kg-page-help {
    position: relative; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    width: 20px; height: 20px; border-radius: 50%; cursor: help; outline: none;
    border: 1px solid var(--tcc-vert-clair, #DFFF9E); color: var(--tcc-vert-clair, #DFFF9E);
    font: italic 700 13px/1 Georgia, 'Times New Roman', serif; letter-spacing: 0; text-transform: none;
    vertical-align: middle; user-select: none;
}
.kg-page-help:hover, .kg-page-help:focus { background: var(--tcc-vert-klugle, #009513); color: #0D0F0E; border-color: var(--tcc-fluo, #C6FF00); }
.kg-page-help-bubble {
    display: none; position: absolute; top: calc(100% + 8px); left: -8px; z-index: 100000;
    width: min(480px, 82vw); box-sizing: border-box; padding: 11px 13px;
    background: #0D0F0E; border: 1px solid var(--tcc-vert-klugle, #009513); border-radius: 8px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.65);
    color: var(--tcc-texte, #F4F6F2); font: 400 0.82rem/1.5 sans-serif; text-align: left; white-space: normal; cursor: auto;
}
.kg-page-help-bubble::before {
    content: ''; position: absolute; top: -6px; left: 13px; width: 10px; height: 10px; transform: rotate(45deg);
    background: #0D0F0E; border-left: 1px solid var(--tcc-vert-klugle, #009513); border-top: 1px solid var(--tcc-vert-klugle, #009513);
}
.kg-page-help-bubble strong { color: var(--tcc-vert-clair, #DFFF9E); }
.kg-page-help-bubble p { margin: 0 0 6px; }
.kg-page-help-bubble p:last-child { margin-bottom: 0; }
.kg-page-help:hover .kg-page-help-bubble, .kg-page-help:focus .kg-page-help-bubble, .kg-page-help:focus-within .kg-page-help-bubble { display: block; }

@media (max-width: 720px) {
    .kg-page-head { justify-content: center; }
    h2.kg-page-title { white-space: normal; }
    .kg-page-tools { justify-content: center; }
    .kg-page-help-bubble { position: fixed; top: 70px; left: 50%; transform: translateX(-50%); }
    .kg-page-help-bubble::before { display: none; }
}

/* Galerie des équipes : le bloc de tête ne porte plus que la ligne du titre. */
.klugle-panel.kg-photos-head { padding-top: 12px !important; padding-bottom: 12px !important; min-height: 0 !important; }

/* ── Plein écran (gm-fullscreen.js) ─────────────────────────────────────────────────────────────── */
/* Bouton flottant, bas droite : le haut des pages est occupé par leurs propres commandes. */
.kg-fs-btn {
    position: fixed; right: 14px; bottom: 14px; z-index: 99990;
    width: 38px; height: 38px; padding: 0; border-radius: 50%; cursor: pointer;
    background: var(--tcc-voile, rgba(10, 25, 15, 0.88)); color: var(--tcc-vert-clair, #8fe38f);
    border: 1px solid var(--tcc-bord-fort, rgba(0, 149, 19, 0.6)); font-size: 1.15rem; line-height: 36px; text-align: center;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.45); opacity: 0.72;
}
.kg-fs-btn:hover, .kg-fs-btn:focus-visible { opacity: 1; background: var(--tcc-vert-klugle, #009513); color: var(--tcc-encre, #06140a); }
.kg-fs-btn.is-on { border-color: var(--tcc-fluo, #c6ff00); color: var(--tcc-fluo, #c6ff00); }
/* Bandeau de reprise : discret, en haut au centre, jamais bloquant. */
.kg-fs-banner {
    position: fixed; top: 10px; left: 50%; transform: translateX(-50%); z-index: 99991;
    display: flex; align-items: center; gap: 10px; max-width: calc(100vw - 24px);
    padding: 7px 8px 7px 14px; border-radius: 20px;
    background: var(--tcc-voile, rgba(10, 25, 15, 0.94)); color: var(--tcc-texte, #e8f5e8);
    border: 1px solid var(--tcc-fluo, #c6ff00); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
    font-family: sans-serif; font-size: 0.85rem;
}
.kg-fs-banner-x {
    width: 24px; height: 24px; padding: 0; border-radius: 50%; cursor: pointer;
    background: transparent; color: inherit; border: 1px solid var(--tcc-bord-fort, rgba(0, 149, 19, 0.6)); line-height: 22px;
}

/* v1.2.0 — ASCENSEURS DE LA CHARTE sur toute page du canvas GM (body.klugle-gm-canvas-page) : la page, ses
   tableaux, ses volets et fenêtres flottants (posés sur <body> ou dans l'élément plein écran). Même rendu que
   planning.css : standard d'abord, ::-webkit-scrollbar pour le détail. */
body.klugle-gm-canvas-page, body.klugle-gm-canvas-page * {
    scrollbar-width: thin;
    scrollbar-color: var(--tcc-vert-klugle, #009513) var(--tcc-encre-profond, #070908);
}
body.klugle-gm-canvas-page ::-webkit-scrollbar, body.klugle-gm-canvas-page::-webkit-scrollbar { width: 10px; height: 10px; }
body.klugle-gm-canvas-page ::-webkit-scrollbar-track { background: var(--tcc-encre-profond, #070908); border-radius: 5px; }
body.klugle-gm-canvas-page ::-webkit-scrollbar-thumb {
    background: var(--tcc-vert-klugle, #009513); border-radius: 5px; border: 2px solid var(--tcc-encre-profond, #070908);
}
body.klugle-gm-canvas-page ::-webkit-scrollbar-thumb:hover { background: var(--tcc-fluo, #C6FF00); }
body.klugle-gm-canvas-page ::-webkit-scrollbar-corner { background: var(--tcc-encre-profond, #070908); }