/* ===== Boutons (minimal, propre) ===== */
.btn {
	display: inline-block;
	min-width: auto;                   /* taille cohérente */
	max-width: 100%;                    /* ne jamais dépasser le conteneur */
	padding: 0.8rem 1.5rem;
	border: none;
	border-radius: var(--radius, 6px);
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: var(--tracking-normal, 0); /* Optimisé pour Manrope */
	text-align: center;
	text-decoration: none;              /* pas de souligné sur les liens-boutons */
	cursor: pointer;
	background: var(--brand, #004777);  /* bouton principal = brand */
	color: #fff;
	transition: var(--transition, .2s ease);
	/* Réduit les gestes interprétés comme zoom double‑tap sur mobile */
	touch-action: manipulation;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
  }
  
  /* Utilitaires de taille/largeur */
  .btn-lg { padding: 1rem 1.5rem; font-size: 1.05rem; }
  @media (max-width: 768px) {
    .btn-full-mobile { display: block; width: 100%; box-sizing: border-box; }
  }

  .btn:disabled {
	/* Désactivation neutre et cohérente */
	background: #eef2f7;
	color: #94a3b8;
	border-color: #e5e7eb;
	opacity: 0.8;
	cursor: not-allowed;
  }

  /* Classe utilitaire explicite si besoin de forcer l'état gris sans attr disabled */
  .btn-disabled,
  .btn.btn-disabled,
  .btn.btn-disabled:hover {
    background: #eef2f7 !important;
    color: #94a3b8 !important;
    border-color: #e5e7eb !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
  }
  
  /* Variantes simples */
  .btn--accent { background: var(--accent, #00AFB5); color: #fff; }
  .btn--danger { background: var(--danger, #A30000); color: #fff; }
  .btn--success { background: var(--success, #16a34a); color: #fff; }
  .btn--success:hover { filter: brightness(0.95); }
  .btn--primary { background: var(--primary, #3b82f6); color: #fff; }
  .btn--primary:hover { filter: brightness(0.95); }
  .btn--info { background: var(--info, #3b82f6); color: #fff; }
  .btn--warning { background: var(--warning, #f97316); color: #fff; }
  .btn--warning:hover { filter: brightness(0.95); }
  /* Spinner inline pour bouton en chargement */
  .btn .btn-spinner { display: inline-block; width: 18px; height: 18px; border: 2px solid rgba(255,255,255,0.45); border-top-color: #fff; border-radius: 50%; animation: spin .8s linear infinite; vertical-align: -3px; margin-right: 6px; }
  /* Quand le bouton est grisé (disabled / btn-disabled), rendre le spinner lisible */
  .btn:disabled .btn-spinner,
  .btn.btn-disabled .btn-spinner {
    border-color: rgba(148,163,184,0.45);
    border-top-color: #94a3b8;
  }
  @keyframes spin { to { transform: rotate(360deg); } }
  /* Surcharges: s'assurer que les variantes respectent l'état disabled visuellement */
  .btn.btn--accent:disabled,
  .btn.btn--primary:disabled,
  .btn.btn--info:disabled,
  .btn.btn--success:disabled,
  .btn.btn--warning:disabled {
    background: #eef2f7 !important;
    color: #94a3b8 !important;
    border-color: #e5e7eb !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
  }
  /* Assurer l'état visuel gris quand une variante est désactivée */
  .btn.btn--danger:disabled {
    background: #eef2f7 !important;
    color: #94a3b8 !important;
    border-color: #e5e7eb !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
  }
  .btn--secondary {
    background: transparent;
    color: var(--text, #04151F);
    border: 1px solid var(--line, #e5e7eb);
  }
  .btn--secondary:hover {
    background: rgba(0,0,0,0.03);
  }

  /* Tailles supplémentaires (petites) */
  .btn-sm { padding: 0.55rem 1rem; font-size: 0.8rem; }
  .btn-xs { padding: 0.45rem 0.75rem; font-size: 0.5rem; }
  
  /* Mobile : pleine largeur (confort) */
  @media (max-width: 768px) {
	.btn { display: inline-block; width: auto; box-sizing: border-box; }
  }
  

  /* Boutons icône : forcer centrage parfait */
.btn.btn--icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;              /* pas de padding parasite */
  width: 36px;             /* largeur fixe pour le carré */
  height: 36px;            /* hauteur fixe pour le carré */
  border-radius: 6px;      /* optionnel : arrondi */
  /* ne pas forcer font-size à 0 : certains boutons icône utilisent des caractères +/- */
}

/* Icônes Lucide dans les boutons: taille cohérente */
.btn .lucide-icon {
  width: 18px;    /* même largeur pour toutes */
  height: 18px;   /* même hauteur pour toutes */
  flex-shrink: 0; /* empêcher de se déformer */
}

/* Boutons icône seuls: l'icône occupe tout, sans marge ni inline spacing */
.btn.btn--icon .lucide-icon {
  display: block;
  margin: 0;
}

/* Espace entre l'icône et le texte pour les boutons NON icône-seule */
.btn:not(.btn--icon) .lucide-icon {
  margin-right: 6px;
  vertical-align: -2px;
}

/* Styles spécifiques pour les icônes des boutons de station */
.station-button-icon {
  width: 16px !important;
  height: 16px !important;
  margin-right: 8px !important;
  margin-left: 0 !important;
  vertical-align: -2px !important;
  flex-shrink: 0;
}

/* Placeholder pour les icônes en cours de chargement */
.station-button-icon-placeholder {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 8px;
  opacity: 0; /* Invisible pendant le chargement */
}

/* Icône visio (2e icône optionnelle sur les boutons de station) */
.station-visio-icon {
  opacity: 0.95;
}