:root{
  --raypo-black:#0f1113;
  --raypo-dark:#1a1d20;
  --raypo-gray:#5f6b73;
  --raypo-light:#f4f6f8;
  --raypo-accent:#1b5e20; /* touche agro */
  --raypo-silver:#c9cfd6;
}

/* base */
body{
  background: var(--raypo-light) !important;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* navbar */
.navbar{
  background: linear-gradient(180deg, var(--raypo-black), var(--raypo-dark)) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
}
.navbar .navbar-brand{
  font-weight: 800;
  letter-spacing: .3px;
}
.navbar .nav-link{
  color: rgba(255,255,255,.88) !important;
}
.navbar .nav-link:hover{
  color: #fff !important;
}
.raypo-brand{
  display:flex; align-items:center; gap:10px;
}
.raypo-brand img{ height:44px; width:auto; border-radius:6px; background:#fff; padding:4px; }

/* override bootstrap primary -> raypo */
.bg-primary{ background-color: var(--raypo-black) !important; }
.text-primary{ color: var(--raypo-black) !important; }

.btn-primary{
  background-color: var(--raypo-black) !important;
  border-color: var(--raypo-black) !important;
}
.btn-primary:hover{
  background-color: #23272b !important;
  border-color: #23272b !important;
}
.btn-outline-primary{
  color: var(--raypo-black) !important;
  border-color: var(--raypo-black) !important;
}
.btn-outline-primary:hover{
  background-color: var(--raypo-black) !important;
  border-color: var(--raypo-black) !important;
  color:#fff !important;
}

/* badge */
.badge-raypo{
  background: var(--raypo-silver) !important;
  color: #111 !important;
}
.badge-accent{
  background: var(--raypo-accent) !important;
  color: #fff !important;
}

/* cards / panels */
.card, .table, .form-control, .form-select{
  border-radius: 12px !important;
}
.table thead th{
  background: #111 !important;
  color:#fff !important;
}
.table tbody tr:hover{
  background: rgba(0,0,0,.03);
}

/* hero / section bars */
.raypo-hero{
  background: linear-gradient(90deg, var(--raypo-black), #3a3f44);
  color:#fff;
  border-radius: 12px;
}
.raypo-section-bar{
  background: linear-gradient(90deg, var(--raypo-accent), #2e7d32);
  color:#fff;
  border-radius: 12px;
}

/* footer */
.raypo-footer{
  background: var(--raypo-black);
  color:#fff;
}
.raypo-footer a{ color: var(--raypo-silver); text-decoration:none; }
.raypo-footer a:hover{ color:#fff; text-decoration:underline; }

/* little utilities */
.raypo-muted{ color: var(--raypo-gray); }