/**
 * Styles spécifiques à la page d'accueil Praxely.
 * Extrait de home.html pour respecter la CSP (pas de styles inline).
 */
.min-height-170 {
  min-height: 170px;
}
.min-height-140 {
  min-height: 140px;
}
.min-height-220 {
  min-height: 220px;
}
.stat-number {
  font-size: 1.75rem;
  font-weight: 700;
}

/* Hero : tonalité alignée avec la barre de navigation (vert Praxely), boutons bien visibles */
.hero-section {
  background: linear-gradient(135deg, #006400 0%, #008000 50%, #228b22 100%);
  color: #fff;
  border-radius: var(--border-radius, 0.5rem);
  box-shadow: 0 4px 14px rgba(0, 100, 0, 0.2);
}
.hero-section h1 {
  color: #fff;
  font-weight: 700;
}
.hero-section .lead,
.hero-section p {
  color: rgba(255, 255, 255, 0.95);
}
.hero-section .btn {
  font-weight: 600;
  border-width: 2px;
  padding: 0.5rem 1rem;
}
.hero-section .btn-light {
  background-color: #fff;
  border-color: #fff;
  color: #006400;
}
.hero-section .btn-light:hover {
  background-color: #f0fff0;
  border-color: #fff;
  color: #006400;
}

/* Trois boutons « Moniteur » : survol bien visible (priorité sur autres feuilles) */
.hero-section a.hero-monitor-btn.btn-light {
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease;
}
.hero-section a.hero-monitor-btn.btn-light:hover,
.hero-section a.hero-monitor-btn.btn-light:focus-visible {
  background-color: #f0fff0 !important;
  border-color: #ffffff !important;
  color: #006400 !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}
.hero-section .btn-outline-light {
  border-color: rgba(255, 255, 255, 0.9);
  color: #fff;
  background-color: transparent;
}
.hero-section .btn-outline-light:hover {
  background-color: rgba(255, 255, 255, 0.2);
  border-color: #fff;
  color: #fff;
}

/* Encart Espace membre : contenu structuré, moins vide */
.home-member-card {
  border-radius: var(--border-radius, 0.5rem);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.06);
}
.home-member-card .card-header {
  background: linear-gradient(135deg, #006400 0%, #008000 100%);
  color: #fff;
  font-weight: 600;
  border-radius: 0.5rem 0.5rem 0 0;
  padding: 1rem 1.25rem;
}
.home-member-card .card-body {
  padding: 1.25rem;
}
.home-member-card-compact .card-header {
  padding: 0.5rem 1rem;
}
.home-member-card-compact .card-body {
  padding: 0.75rem 1rem;
}

/* Pastilles dans en-têtes verts : fond teinté (plus de blanc pur) — charte bleue / verte */
.home-member-card .card-header .badge.home-account-plan-badge {
  color: #0a3d62 !important;
  background: linear-gradient(180deg, #d6ecfb 0%, #c2e2f8 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.55);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(0, 40, 80, 0.12);
}
.home-public-discover .card-header .badge.home-public-label-badge {
  color: #0f5132 !important;
  background: linear-gradient(180deg, #e8f5ea 0%, #d8eede 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.5);
  font-weight: 700;
  box-shadow: 0 1px 2px rgba(15, 81, 50, 0.12);
}

/* Tuiles cliquables Produit & mission, FAQ, Actualités, Aperçu (pas l’en-tête de la carte) */
.home-public-discover .home-discover-link {
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease,
    background-color 0.2s ease;
}
.home-public-discover .home-discover-link:hover,
.home-public-discover .home-discover-link:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(0, 90, 0, 0.14);
  border-color: rgba(25, 135, 84, 0.55) !important;
  background-color: #f8fffb !important;
}

.home-member-email {
  font-size: 0.95rem;
  color: #495057;
  word-break: break-all;
}
.home-member-quick-links {
  list-style: none;
  padding-left: 0;
  margin: 1rem 0;
  font-size: 0.9rem;
}
.home-member-quick-links li {
  margin-bottom: 0.5rem;
}
.home-member-quick-links a {
  color: var(--pharmacy-green, #008000);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.home-member-quick-links a:hover {
  text-decoration: underline;
}
.home-member-quick-links .fa {
  width: 1rem;
  opacity: 0.85;
}

/* Boutons encart Compte : pleine largeur, remplis, hover */
.home-member-card-compact .card-body .btn {
  width: 100%;
  font-weight: 500;
}
.home-member-card-compact .card-body .btn-primary:hover {
  background-color: #0056b3;
  border-color: #0056b3;
  filter: brightness(1.05);
}

/* Abonnement : tonalité bleue / bleu ciel uniquement (pas le dégradé bleu→orange global de .btn-secondary) */
.home-member-card-compact .card-body .btn-home-subscription {
  background: linear-gradient(135deg, #2b8fd9 0%, #5cb3f0 100%);
  border: none;
  color: #fff !important;
  font-weight: 600;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;
}
.home-member-card-compact .card-body .btn-home-subscription:hover,
.home-member-card-compact .card-body .btn-home-subscription:focus-visible {
  background: linear-gradient(135deg, #2176b8 0%, #4aa3e0 100%) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(43, 143, 217, 0.45);
  filter: brightness(1.02);
}

/* Déconnexion : survol explicite (le thème global ne définit pas .btn-danger:hover) */
.home-member-card-compact .card-body .home-logout-btn.btn-danger {
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;
}
.home-member-card-compact .card-body .home-logout-btn.btn-danger:hover,
.home-member-card-compact .card-body .home-logout-btn.btn-danger:focus-visible {
  background: linear-gradient(135deg, #c82333 0%, #a71d2a 100%) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(200, 35, 51, 0.45);
  filter: brightness(1.06);
}

/* Conteneurs des graphiques : taille stable pour un rendu lisible */
.home-chart-doughnut {
  min-height: 280px;
  position: relative;
}
.home-chart-doughnut canvas {
  max-height: 260px;
  width: auto !important;
}
.home-chart-bars {
  min-height: 300px;
  position: relative;
}
.home-chart-bars canvas {
  max-height: 280px;
}

@media (max-width: 767.98px) {
  .home-chart-doughnut {
    min-height: 220px;
  }

  .home-chart-doughnut canvas {
    max-height: 200px;
  }

  .home-chart-bars {
    min-height: 240px;
  }

  .home-chart-bars canvas {
    max-height: 220px;
  }
}
