/* ============================================================
   RV JOB MARKET — STYLES ENVIRONNEMENT DE TEST
   Thème : Rouge / Noir / Blanc
============================================================ */

:root {
  --rv-rouge:       #C8102E;
  --rv-rouge-doux:  rgba(200,16,46,0.15);
  --rv-noir:        #0A0A0A;
  --rv-noir-carte:  #141414;
  --rv-blanc:       #F5F5F5;
  --rv-blanc-doux:  rgba(245,245,245,0.55);
  --rv-bordure:     rgba(200,16,46,0.35);
}

/* ============================================================
   1. BANDEAU D'AVERTISSEMENT PERMANENT
============================================================ */
.bandeau-test {
  position: sticky;
  top: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  background-color: var(--rv-rouge);
  color: #fff;
  padding: 0.5rem 1.5rem;
  font-size: 0.875rem;
  font-weight: 700;
  flex-wrap: wrap;
  text-align: center;
}

.bandeau-test__icone {
  font-size: 1rem;
  flex-shrink: 0;
}

.bandeau-test__texte {
  flex: 1;
  min-width: 200px;
}

.bandeau-test__retour {
  color: #fff;
  text-decoration: underline;
  font-size: 0.8rem;
  white-space: nowrap;
  opacity: 0.85;
  transition: opacity 0.15s ease;
  flex-shrink: 0;
}
.bandeau-test__retour:hover {
  opacity: 1;
  color: #fff;
}

/* ============================================================
   2. HEADER — VARIANTE TEST
============================================================ */
.header--test {
  border-bottom: 3px solid var(--rv-rouge);
  position: sticky;
  top: 40px;
  z-index: 150;
  background-color: var(--rv-noir) !important;
}

.logo__badge-test {
  font-size: 0.65rem;
  font-weight: 700;
  background-color: var(--rv-rouge);
  color: #fff;
  padding: 2px 8px;
  border-radius: 4px;
  letter-spacing: 1px;
  margin-left: 6px;
  vertical-align: middle;
}

/* ============================================================
   3. FILIGRANE
============================================================ */
.env-test .hero {
  position: relative;
}
.env-test .hero::after {
  content: 'TEST';
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translateY(-50%) rotate(-15deg);
  font-family: var(--police-titre);
  font-size: 6rem;
  font-weight: 700;
  color: rgba(200,16,46,0.08);
  pointer-events: none;
  user-select: none;
  letter-spacing: 8px;
}

/* ============================================================
   4. FOOTER — VARIANTE TEST
============================================================ */
.env-test .footer {
  border-top: 3px solid var(--rv-rouge);
  background-color: var(--rv-noir) !important;
  color: var(--rv-blanc-doux) !important;
}

/* ============================================================
   5. SURCHARGES GLOBALES THÈME NOIR/ROUGE/BLANC
============================================================ */
.env-test body {
  background-color: var(--rv-noir);
  color: var(--rv-blanc);
}

.env-test .header {
  background-color: var(--rv-noir);
  border-bottom: 1px solid var(--rv-bordure);
}

.env-test .header__logo,
.env-test .logo__cdr {
  color: var(--rv-rouge) !important;
}

.env-test .logo__jobmarket {
  color: var(--rv-blanc) !important;
}

.env-test .footer__brand .logo__cdr {
  color: var(--rv-rouge) !important;
}

.env-test .footer__brand .logo__jobmarket,
.env-test .footer__copyright,
.env-test .footer__slogan {
  color: var(--rv-blanc-doux) !important;
}