/* --- Bandeau App Android --- */
.android-app-banner {
  background: linear-gradient(90deg, #ffb300 0%, #ff9800 100%);
  color: #222;
  border-radius: 0 0 1.2rem 1.2rem;
  box-shadow: 0 2px 12px rgba(255,152,0,0.08);
  margin-bottom: 1.5rem;
  font-size: 1.13rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.7em;
}
.android-app-banner img {
  height: 28px;
  margin-right: 8px;
}
.android-app-banner .btn-warning {
  background: #fffbe7;
  color: #ff9800;
  border: none;
  font-weight: 700;
  box-shadow: 0 1px 4px rgba(0,0,0,0.07);
}
.android-app-banner .btn-warning:hover {
  background: #ff9800;
  color: #fffbe7;
}
@media (max-width: 600px) {
  .android-app-banner {
    font-size: 1rem;
    padding: 0.7em 0.3em;
    flex-direction: column;
    gap: 0.4em;
  }
  .android-app-banner img {
    margin-right: 0;
    margin-bottom: 4px;
  }
}
/* --- Styles de base et mise en page --- */
body, html {
  font-family: "Segoe UI", Roboto, "Open Sans", Arial, sans-serif;
  background: rgb(246, 248, 250);
  color: rgb(35, 39, 43);
  font-size: 1.05rem;
  letter-spacing: 0.01em;
}

h2, h3 {
  font-family: inherit;
  font-weight: 700;
  color: rgb(26, 34, 51);
  letter-spacing: 0.01em;
}

h2 { font-size: 2rem; margin-bottom: 1.2rem; }
h3 { font-size: 1.25rem; margin-bottom: 0.8rem; }

/* --- Barre de navigation (Navbar) --- */
.navbar, .navbar.bg-primary {
  border-bottom: 1.5px solid rgb(13, 110, 253);
  box-shadow: rgba(13, 110, 253, 0.04) 0px 2px 8px;
  background: rgb(26, 34, 51) !important;
  color: rgb(255, 255, 255) !important;
}

.navbar .navbar-brand, .navbar .nav-link {
  font-weight: 500;
  letter-spacing: 0.03em;
  color: rgb(255, 255, 255) !important;
}

.navbar-brand { letter-spacing: 1px; }

/* --- Menus déroulants (Dropdowns) --- */
.dropdown-menu, .dropdown-menu.show {
  border-radius: 0.7rem;
  box-shadow: rgba(30, 34, 90, 0.1) 0px 4px 18px;
  border: 1px solid rgb(227, 227, 227);
  background: rgb(255, 255, 255) !important;
}

.dropdown-item {
  font-weight: 500;
  transition: background 0.15s, color 0.15s;
}

.dropdown-item:active, .dropdown-item:focus, .dropdown-item:hover {
  background: rgb(13, 110, 253) !important;
  color: rgb(255, 255, 255) !important;
}

/* --- Cartes (Cards) --- */
.card {
  border-radius: 1rem;
  box-shadow: rgba(30, 34, 90, 0.08) 0px 4px 18px, rgba(13, 110, 253, 0.04) 0px 1.5px 4px;
  border: none;
  background: rgb(255, 255, 255);
  transition: box-shadow 0.2s;
}

.card:hover {
  box-shadow: rgba(30, 34, 90, 0.13) 0px 8px 32px, rgba(13, 110, 253, 0.08) 0px 2px 8px;
}

.card-title { font-size: 1.18rem; font-weight: 600; color: rgb(26, 34, 51); }
.card-text { color: rgb(68, 68, 68); font-size: 1.01rem; }
.card-footer {
  background: rgb(246, 248, 250);
  border-top: none;
  border-radius: 0px 0px 1rem 1rem;
}

.card-img-top {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}

/* --- Boutons --- */
.btn, .btn-primary, .btn-outline-warning {
  border-radius: 2rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  transition: all 0.18s;
  box-shadow: rgba(13, 110, 253, 0.04) 0px 1.5px 4px;
}

.btn-primary { background: rgb(13, 110, 253); border-color: rgb(13, 110, 253); }
.btn-primary:hover { background: rgb(8, 66, 152); border-color: rgb(8, 66, 152); }

/* --- Mode Sombre (Thème Dark) --- */
body.theme-dark { background: rgb(24, 26, 27); color: rgb(241, 243, 244); }
body.theme-dark .navbar, body.theme-dark .navbar.bg-primary {
  background: rgb(35, 39, 43) !important;
}
body.theme-dark .dropdown-menu {
  background: rgb(35, 39, 43) !important;
  border: 1px solid rgb(51, 51, 51) !important;
}
body.theme-dark .dropdown-item { color: rgb(255, 224, 130) !important; }
body.theme-dark .card {
  background: rgb(35, 39, 43);
  color: rgb(241, 243, 244);
}
body.theme-dark .card-title {
  color: #fffbe7;
  text-shadow: 0 1px 2px rgba(0,0,0,0.18);
}
body.theme-dark .card-text {
  color: #ffe9b0;
  text-shadow: 0 1px 2px rgba(0,0,0,0.15);
}
body.theme-dark .card-footer {
  background: rgb(30, 32, 34);
  color: #ffe9b0;
}
body.theme-dark .btn-primary {
  background: #ffb300;
  border-color: #ffb300;
  color: #222 !important;
}
body.theme-dark .btn-primary:hover {
  background: #ff9800;
  border-color: #ff9800;
  color: #fffbe7 !important;
}

/* --- Mode Clair (Thème Light) --- */
body.theme-light { background: rgb(248, 249, 250); color: rgb(34, 34, 34); }
body.theme-light .navbar { background: rgb(13, 110, 253) !important; }

/* CORRECTION POUR LES DROPDOWNS EN MODE CLAIR */
body.theme-light .navbar .dropdown-menu .dropdown-item {
  color: rgb(33, 37, 41) !important; /* Texte sombre sur fond blanc */
}
body.theme-light .navbar .dropdown-menu .dropdown-item:hover,
body.theme-light .navbar .dropdown-menu .dropdown-item:focus {
  color: rgb(255, 255, 255) !important;
  background-color: rgb(13, 110, 253) !important;
}

/* --- Pied de page (Footer) --- */
footer {
  border-top: 2px solid rgb(13, 110, 253);
  background: rgb(26, 34, 51) !important;
  color: rgb(255, 255, 255) !important;
  font-size: 0.95rem;
}