/**
 * @file
 * Styles pour les tabs Drupal - appliqué partout sur le site
 */

/* === TABS DRUPAL === */

/* Container des tabs */
.tabs {
  margin-bottom: 2rem !important;
  border-bottom: none !important;
}

/* Liste des tabs */
.tabs__tab {
  display: inline-block !important;
  margin: 0 0.25rem -2px 0 !important;
}

/* Liens des tabs */
.tabs a {
  display: inline-block !important;
  padding: 0.75rem 1.5rem !important;
  color: #6c757d !important;
  background-color: transparent !important;
  text-decoration: none !important;
  border-bottom: 3px solid transparent !important;
  transition: all 0.2s ease !important;
  font-weight: 500 !important;
  font-size: 0.95rem !important;
}

/* Tab hover */
.tabs a:hover {
  color: #0d75a3 !important;
  background-color: rgba(13, 117, 163, 0.05) !important;
}

/* Tab actif */
.tabs a.is-active {
  color: #0d75a3 !important;
  border-bottom-color: #0d75a3 !important;
  font-weight: 600 !important;
  background-color: transparent !important;
}

/* Tab focus (accessibilité) */
.tabs a:focus {
  outline: 2px solid #0d75a3 !important;
  outline-offset: 2px !important;
}

/* === RESPONSIVE === */

@media (max-width: 768px) {
  .tabs a {
    padding: 0.6rem 1rem !important;
    font-size: 0.9rem !important;
  }
}

@media (max-width: 480px) {
  .tabs a {
    padding: 0.5rem 0.75rem !important;
    font-size: 0.85rem !important;
  }
}

/* === ACCESSIBILITÉ === */

@media (prefers-reduced-motion: reduce) {
  .tabs a {
    transition: none !important;
  }
}