/* ============================================================================
CHARTE GRAPHIQUE GLH HYDRAULIQUE — reprise du site officiel (css/style.css)
Couleurs : Rouge & Blanc (charte du logo) + accents métal / noir
Police : Montserrat
----------------------------------------------------------------------------
▸ Fichier UNIQUE à modifier pour changer l'identité visuelle des 3 pages
(page client, dashboard TV, admin).
▸ LOGO : assets/logo.webp (+ logo.png en secours) — le vrai logo GLH,
copié depuis le site officiel. Pour le changer : remplacez ces fichiers.
▸ POLICE : "Montserrat" est chargée par une balise Google Fonts
dans le de chaque page. Pour en changer : remplacez le nom dans
ces ET dans les deux variables --glh-police-* ci-dessous.
========================================================================== */
:root {
/* --- Couleurs de marque (identiques au site officiel) ---------------- */
--glh-rouge: #D81F26; /* rouge GLH : boutons, accents */
--glh-rouge-fonce: #A8141A; /* rouge foncé : dégradés, survols */
--glh-rouge-clair: #ef3a41; /* rouge lisible sur fond noir */
--glh-noir: #16181c; /* noir GLH : fond sombre, textes */
--glh-gris-fonce: #2a2d33; /* cartes sur fond sombre */
--glh-gris: #6b7280; /* textes secondaires sur fond clair */
--glh-gris-clair: #f4f5f7; /* fonds de cartes sur fond clair */
--glh-gris-bord: #e3e5e9; /* bordures fines */
--glh-metal: #c9cdd2; /* gris métal (rappel du logo) */
--glh-metal-fonce: #8a8e94; /* textes secondaires sur fond sombre */
--glh-blanc: #ffffff;
/* --- Couleurs fonctionnelles ------------------------------------------ */
--glh-vert: #12B76A; /* confirmations, pastille "connecté" */
/* --- Polices (Montserrat, comme le site) ------------------------------ */
--glh-police-titres: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--glh-police-texte: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
/* Taille standard du logo dans les en-têtes (jamais plus large que l'écran) */
.glh-logo { width: min(170px, 55vw); height: auto; display: block; }
/* Cadre blanc arrondi derrière le logo quand il est posé sur fond sombre
(le lettrage "VENTE & RÉPARATION" du logo est noir) */
.cadre-logo {
background: var(--glh-blanc);
border-radius: 18px;
padding: 16px 26px;
display: inline-block;
box-shadow: 0 10px 30px rgba(20, 22, 28, .35);
}