/* ═══════════════════════════════════════════════════════════════════
   rentmejp — THÈME « GRIS MÉTAL » (univers classique)
   Fond acier brossé foncé sur toute la page ; l'or ressort.
   Principe : on redéfinit les variables de couleur des pages (--black =
   texte, --white = surfaces, --gray-p = fonds de section…) ; l'en-tête
   (barre de langues noire + nav blanche) garde les couleurs d'origine.
   Les fonds clairs écrits « en dur » sont corrigés page par page
   (bloc <style id="metal-fix"> en fin de <head>).
   ═══════════════════════════════════════════════════════════════════ */
:root {
  --metal-1: #565b62;
  --metal-2: #3f434a;
  --metal-3: #2b2e33;
  --metal-surface: #3b3e44;      /* cartes / encarts posés sur le métal */
  --metal-surface-2: #32353a;
  --metal-line: rgba(255,255,255,.14);
  --metal-text: #f2f0ea;
  --metal-text-2: #cdd0d5;
  --metal-text-3: #a3a8b0;
  --metal-gold: #e6b83c;          /* or plus lumineux sur fond foncé */

  --black: var(--metal-text);
  --ink: var(--metal-text);
  --text: var(--metal-text);
  --white: var(--metal-surface);
  --paper: transparent;
  --cream: transparent;
  --cream-deep: var(--metal-surface-2);
  --gray-p: transparent;
  --gray-d: var(--metal-text-2);
  --gray: var(--metal-text-2);
  --gray-m: var(--metal-text-3);
  --gray-l: #8d929a;
  --border: var(--metal-line);
  --line: var(--metal-line);
  --gold: var(--metal-gold);
  --gold-bg: rgba(230,184,60,.13);
  --red-bg: rgba(255,90,106,.12);
  --green: #6cc472;
  --green-bg: rgba(108,196,114,.14);
  color-scheme: dark;
}
html { background: var(--metal-3); }
body {
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.022) 0 1px, rgba(0,0,0,0) 1px 3px),
    radial-gradient(120% 60% at 50% 0%, rgba(255,255,255,.08), rgba(255,255,255,0) 60%),
    linear-gradient(175deg, var(--metal-1) 0%, var(--metal-2) 38%, var(--metal-3) 100%) !important;
  background-attachment: scroll !important;
  color: var(--metal-text);
}
/* Accents rouges : un peu éclaircis pour rester lisibles sur le gris */
em { color: inherit; }

/* ── En-tête : barre de langues noire + nav graphite (textes clairs, or) ── */
.lang-bar { background: #111 !important; }
.master-nav, .cars-subnav { background: rgba(28,30,34,.96) !important; border-bottom-color: var(--metal-line) !important; }
.mobile-menu { background: #2b2e33 !important; }

/* ── Formulaires : champs lisibles sur fond foncé ── */
input, select, textarea { color-scheme: dark; }

/* ── Pied de page : reste noir ── */
footer { background: #16171a !important; }

/* Logo officiel (celui de l'accueil, PNG transparent) : même taille partout */
img[src="/logo-rentmejp.png"] { height: 34px !important; width: auto !important; max-width: none; border-radius: 0 !important; display: block; }
@media (max-width: 430px) {
  img[src="/logo-rentmejp.png"] { height: 30px !important; }
  /* le logo contient déjà « rentmejp » : on masque le texte à côté sur téléphone pour ne pas déborder */
  .nav-logo-text, .logo-txt { display: none !important; }
}

/* Boutons dorés : texte graphite (lisible) */
.mship-banner-badge, .bn-icon { color: #1d1f23 !important; }
.nav-cta { background: var(--metal-gold) !important; color: #1d1f23 !important; border-color: var(--metal-gold) !important; }
.nav-cta:hover { background: #f2c94c !important; }
.nav-cta span { color: inherit !important; }
/* Rouge de marque un peu éclairci sur fond foncé */
:root { --red: #f04a5f; }
.nav-logo-text em { color: #ff5468; }
.topbar em, .reviews-hero em { color: #ff5468; }
/* Liens rouges dans le texte courant → plus clairs */
p a, li a, td a { color: #ff7a8a; }
/* Menu burger visible sur la nav graphite */
.mn-burger span { background: #f2f0ea !important; }
/* Fiche voiture : tableau d'assurance sans débordement horizontal sur téléphone */
#insurance-panel div { min-width: 0; }
#insurance-panel span { overflow-wrap: anywhere; }
/* Barre de liens du menu : même fond que la nav (pas de rectangle plus clair) */
.master-nav .nav-links, #navLinks { background: transparent !important; }
