/* ============================================================
   GP-LINKS — Feuille de style principale
   Charte : bleu confiance/tech (#0B3D91), jaune chaleureux Afrique (#F5A623),
   fond clair (#F7F9FC), texte Open Sans, titres Poppins.
   ============================================================ */

:root {
  --gp-blue: #0B3D91;
  --gp-blue-dark: #082C6B;
  --gp-blue-light: #E8EEFB;
  --gp-yellow: #F5A623;
  --gp-yellow-dark: #D68C0F;
  --gp-bg: #F7F9FC;
  --gp-gray-900: #14213D;
  --gp-gray-600: #5A6478;
  --gp-gray-200: #E4E8F0;
  --gp-white: #FFFFFF;
  --gp-success: #1E9E63;
  --gp-danger: #D64545;
  --radius: 12px;
}

body {
  font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  background-color: var(--gp-bg);
  color: var(--gp-gray-900);
}

h1, h2, h3, h4, .display-font {
  font-family: 'Poppins', 'Open Sans', sans-serif;
  font-weight: 600;
  color: var(--gp-gray-900);
}

a { color: var(--gp-blue); text-decoration: none; }
a:hover { color: var(--gp-blue-dark); }

/* ---- Navbar ---- */
.gp-navbar {
  background: var(--gp-white);
  box-shadow: 0 2px 10px rgba(11,61,145,0.06);
}
.gp-navbar .navbar-brand {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
}
.gp-navbar .navbar-brand .brand-gp { color: var(--gp-blue); }
.gp-navbar .navbar-brand .brand-links { color: var(--gp-gray-600); }
.gp-navbar .nav-link { color: var(--gp-gray-900); font-weight: 500; }
.gp-navbar .nav-link:hover { color: var(--gp-blue); }

.btn-gp-primary {
  background-color: var(--gp-blue);
  border-color: var(--gp-blue);
  color: #fff;
  font-weight: 600;
  border-radius: 8px;
}
.btn-gp-primary:hover { background-color: var(--gp-blue-dark); border-color: var(--gp-blue-dark); color:#fff; }

.btn-gp-outline {
  background: transparent;
  border: 2px solid var(--gp-blue);
  color: var(--gp-blue);
  font-weight: 600;
  border-radius: 8px;
}
.btn-gp-outline:hover { background-color: var(--gp-blue); color: #fff; }

.btn-gp-yellow {
  background-color: var(--gp-yellow);
  border-color: var(--gp-yellow);
  color: var(--gp-gray-900);
  font-weight: 700;
  border-radius: 8px;
}
.btn-gp-yellow:hover { background-color: var(--gp-yellow-dark); border-color: var(--gp-yellow-dark); }

/* ---- Hero ---- */
.gp-hero {
  background: linear-gradient(135deg, var(--gp-blue-light) 0%, #FFFFFF 60%);
  padding: 80px 0;
}
.gp-hero h1 { font-size: 2.6rem; line-height: 1.2; }
.gp-hero .lead { color: var(--gp-gray-600); font-size: 1.15rem; }

/* ---- Cards / sections ---- */
.gp-card {
  background: var(--gp-white);
  border-radius: var(--radius);
  box-shadow: 0 4px 18px rgba(20,33,61,0.06);
  border: 1px solid var(--gp-gray-200);
}

.gp-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--gp-blue);
  color: #fff;
  font-weight: 700;
  font-family: 'Poppins', sans-serif;
}

.gp-badge-statut {
  display: inline-block;
  padding: .35em .75em;
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 600;
}
.statut-enregistre { background:#EEF1FA; color: var(--gp-blue); }
.statut-pris_en_charge { background:#FFF3E0; color:#B5730B; }
.statut-en_transit { background:#E8F1FF; color:#1856B8; }
.statut-arrive_pays { background:#EAF7F0; color: var(--gp-success); }
.statut-arrive_point_relais { background:#FDEFE3; color:#C0602B; }
.statut-en_livraison { background:#FFF8E1; color: var(--gp-yellow-dark); }
.statut-livre { background:#E3F7EA; color: var(--gp-success); }
.statut-incident { background:#FBEAEA; color: var(--gp-danger); }

/* ---- Tracking timeline ---- */
.gp-timeline { list-style:none; padding-left:0; margin:0; }
.gp-timeline li {
  position: relative;
  padding: 0 0 28px 36px;
  border-left: 2px solid var(--gp-gray-200);
}
.gp-timeline li:last-child { border-left-color: transparent; padding-bottom:0; }
.gp-timeline li::before {
  content:'';
  position:absolute; left:-9px; top:2px;
  width:16px; height:16px; border-radius:50%;
  background: var(--gp-gray-200);
  border: 3px solid #fff;
}
.gp-timeline li.active::before { background: var(--gp-blue); }
.gp-timeline li.done::before { background: var(--gp-success); }

/* ---- Footer ---- */
.gp-footer {
  background: var(--gp-blue-dark);
  color: #DCE4F5;
  padding: 56px 0 24px;
}
.gp-footer h5 { color: #fff; font-family:'Poppins',sans-serif; }
.gp-footer a { color: #C9D6F0; }
.gp-footer a:hover { color: var(--gp-yellow); }
.gp-footer hr { border-color: rgba(255,255,255,.15); }

/* ---- Forms ---- */
.form-label { font-weight: 600; color: var(--gp-gray-900); }
.form-control:focus, .form-select:focus {
  border-color: var(--gp-blue);
  box-shadow: 0 0 0 .2rem rgba(11,61,145,.15);
}

.gp-step-indicator {
  display:flex; justify-content:space-between; margin-bottom: 2rem;
}
.gp-step-indicator .step {
  flex:1; text-align:center; font-size:.85rem; color: var(--gp-gray-600);
  border-top: 3px solid var(--gp-gray-200);
  padding-top: 10px;
}
.gp-step-indicator .step.active { color: var(--gp-blue); border-top-color: var(--gp-blue); font-weight:700; }
.gp-step-indicator .step.done { border-top-color: var(--gp-success); }

/* ---- Utilities ---- */
.text-gp-blue { color: var(--gp-blue); }
.text-gp-yellow { color: var(--gp-yellow-dark); }
.bg-gp-light { background: var(--gp-blue-light); }
.section-py { padding: 64px 0; }