/* Contrôles tactiles : barre de boutons en bas de l'écran, seulement sur écran tactile.
   --controls-height (0 sans écran tactile) : la scène s'arrête au-dessus de la barre (scene.css)
   et les panneaux fixés en bas remontent d'autant (fiche RH, gratte-papier, disjoncteur). */
:root {
    --controls-height: 0px;
}

.touch-controls {
    display: none;
}

@media (hover: none) and (pointer: coarse) {
    :root {
        --controls-height: calc(76px + env(safe-area-inset-bottom));
    }

    /* Pas de zoom au double appui quand on tape vite */
    html {
        touch-action: manipulation;
    }

    .touch-controls {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 60;    /* Au-dessus du HUD (50), sous les écrans superposés (1000) */
        display: flex;
        gap: 8px;
        height: var(--controls-height);
        box-sizing: border-box;
        padding: 8px max(8px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
        background: rgba(20, 20, 40, 0.92);
        border-top: 2px solid #ff6b35;
    }

    .touch-controls button {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-width: 0;
        padding: 0;
        font-size: 28px;
        font-weight: bold;
        color: #fff;
        background: rgba(255, 255, 255, 0.1);
        border: 2px solid rgba(255, 107, 53, 0.6);
        border-radius: 10px;
        user-select: none;
        -webkit-user-select: none;
        -webkit-touch-callout: none;
        -webkit-tap-highlight-color: transparent;
    }

    .touch-controls button:active {
        background: #ff6b35;
        transform: translateY(2px);
    }

    .touch-controls .touch-pause {
        flex: 0 0 52px;
        font-size: 18px;
    }

    /* Espace : le plus gros bouton, c'est celui qu'on martèle */
    .touch-controls .touch-work {
        flex: 2.2;
        background: rgba(255, 59, 59, 0.35);
    }

    .touch-work strong {
        font-size: 18px;
        letter-spacing: 1px;
    }

    .touch-work small {
        font-size: 12px;
        font-weight: normal;
        opacity: 0.8;
    }

    /* ↑ ↓ : seulement pendant une coupure de courant (combinaison du disjoncteur) */
    .touch-controls .touch-code {
        display: none;
        border-color: #ffd84a;
    }

    body.power-out .touch-controls .touch-code {
        display: flex;
    }
}
