/*
  event-button.css
  Styles des boutons d'événements, desktop et responsive.
  Centralisation, optimisation, documentation complète.
*/

@media (max-width: 900px) {
  .page-home .grille-events, .page-home .grille-events .event-case {
    width: 100% !important;
    max-width: 100vw !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    box-sizing: border-box;
  }
  .page-home .grille-events .event-case {
    padding: 8px 4px !important;
    margin: 0 auto !important;
  }
}
/**
 * STYLES PARTAGÉS POUR LES BOUTONS
 * Ce fichier définit les styles communs pour les boutons dans l'administration.
 */

/* Style de base pour les boutons d'actions dans la grille */
.btn-event-link,
.fiche-event-info-btn {
  display: inline-block;
  background: var(--btn-fiche-background);
  color: var(--btn-fiche-color);
  padding: 8px 20px;
  border-radius: var(--btn-fiche-border-radius);
  text-decoration: none;
  font-weight: bold;
  transition: var(--btn-fiche-transition);
  margin-top: 10px;
  border: var(--btn-fiche-border);
  font-family: inherit;
  font-size: 1rem;
  cursor: pointer;
  white-space: nowrap;
  text-align: center;
  box-shadow: var(--btn-fiche-box-shadow);
}

.btn-event-link:hover,
.fiche-event-info-btn:hover {
  background: var(--btn-fiche-hover-background);
  color: var(--btn-fiche-hover-color);
  box-shadow: var(--btn-fiche-hover-box-shadow);
  transform: var(--btn-fiche-hover-transform);
}

/* Style pour les boutons d'action (téléverser, etc.) */
.btn-action {
  width: var(--btn-fiche-width);
  margin: var(--btn-fiche-margin);
  padding: var(--btn-fiche-padding);
  background: var(--btn-fiche-background);
  border: var(--btn-fiche-border);
  border-radius: var(--btn-fiche-border-radius);
  color: var(--btn-fiche-color);
  font-size: var(--btn-fiche-font-size);
  font-weight: var(--btn-fiche-font-weight);
  box-shadow: var(--btn-fiche-box-shadow);
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  transition: var(--btn-fiche-transition);
  display: inline-block;
}

.btn-action:hover {
  background: var(--btn-fiche-hover-background);
  color: var(--btn-fiche-hover-color);
  box-shadow: var(--btn-fiche-hover-box-shadow);
  transform: var(--btn-fiche-hover-transform);
}

/* Style pour le bouton de sauvegarde */
#btn-save {
  width: var(--btn-fiche-width);
  margin: var(--btn-fiche-margin);
  padding: 12px 24px; /* Padding légèrement différent pour ce bouton */
  background: var(--btn-fiche-background);
  border: var(--btn-fiche-border);
  border-radius: var(--btn-fiche-border-radius);
  color: var(--btn-fiche-color);
  font-size: var(--btn-fiche-font-size);
  font-weight: var(--btn-fiche-font-weight);
  box-shadow: var(--btn-fiche-box-shadow);
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  transition: var(--btn-fiche-transition);
  display: inline-block;
}

#btn-save:hover {
  background: var(--btn-fiche-hover-background);
  color: var(--btn-fiche-hover-color);
  box-shadow: var(--btn-fiche-hover-box-shadow);
  transform: var(--btn-fiche-hover-transform);
}

/* Nouvelle classe générique pour les boutons de fiche */
.btn-fiche {
  width: var(--btn-fiche-width);
  margin: var(--btn-fiche-margin);
  padding: var(--btn-fiche-padding);
  background: var(--btn-fiche-background);
  border: var(--btn-fiche-border);
  border-radius: var(--btn-fiche-border-radius);
  color: var(--btn-fiche-color);
  font-size: var(--btn-fiche-font-size);
  font-weight: var(--btn-fiche-font-weight);
  box-shadow: var(--btn-fiche-box-shadow);
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  transition: var(--btn-fiche-transition);
  display: inline-block;
}

.btn-fiche:hover {
  background: var(--btn-fiche-hover-background);
  color: var(--btn-fiche-hover-color);
  box-shadow: var(--btn-fiche-hover-box-shadow);
  transform: var(--btn-fiche-hover-transform);
}