/* ===== CD54 BILLARD - DESIGN SYSTEM "EDITORIAL CLEAN" ===== */
/* Version: 1.2.0 - Amélioration contraste boutons hover */

/* ============================================================
   1. TYPOGRAPHIES - Google Fonts (Outfit + Inter)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap');

/* Variables CSS pour réutilisation */
:root {
  /* Typographies */
  --cd54-font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
  --cd54-font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Couleurs (conservées de la charte graphique) */
  --cd54-primary: #DD183B;
  --cd54-primary-dark: #8a0d24;
  --cd54-text-dark: #1F2937;
  --cd54-text-secondary: #6B7280;
  --cd54-bg-light: #FFFFFF;
  --cd54-border-light: #E5E7EB;
  --cd54-accent-blue: #2563EB;

  /* Border radius */
  --cd54-radius-sm: 8px;
  --cd54-radius-md: 12px;
  --cd54-radius-lg: 16px;
  --cd54-radius-xl: 24px;

  /* Ombres */
  --cd54-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --cd54-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.1);
  --cd54-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);
  --cd54-shadow-hover: 0 12px 40px rgba(0, 0, 0, 0.15);

  /* Espacements */
  --cd54-section-padding: 64px;
  --cd54-section-padding-mobile: 40px;
  --cd54-gap-lg: 24px;
  --cd54-gap-md: 20px;
  --cd54-gap-sm: 12px;

  /* Transitions */
  --cd54-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --cd54-transition-fast: all 0.2s ease;
}

/* ============================================================
   2. TYPOGRAPHIES APPLIQUÉES
   ============================================================ */

/* Titres - Outfit */
h1, h2, h3, h4, h5, h6,
.entry-title,
.ast-archive-title,
.page-title,
.wp-block-heading,
.wp-block-post-title,
.site-title {
  font-family: var(--cd54-font-heading) !important;
  font-weight: 700;
  line-height: 1.2;
  color: var(--cd54-text-dark);
}

h1, .entry-title { font-size: 2.75rem !important; font-weight: 800 !important; }
h2 { font-size: 2rem !important; font-weight: 700 !important; }
h3 { font-size: 1.5rem !important; font-weight: 600 !important; }
h4 { font-size: 1.25rem !important; font-weight: 600 !important; }

/* Corps de texte - Inter */
body,
p,
li,
td,
th,
span,
.entry-content,
.ast-comment-content,
.widget,
input,
textarea,
select,
button {
  font-family: var(--cd54-font-body) !important;
  line-height: 1.6;
}

/* Navigation - Outfit */
.main-header-menu,
.main-header-menu a,
.ast-header-sections-navigation a,
nav a {
  font-family: var(--cd54-font-heading) !important;
  font-weight: 600;
  letter-spacing: 0.3px;
}

/* ============================================================
   3. BORDER-RADIUS MODERNES (12-16px)
   ============================================================ */

/* Cartes et blocs génériques */
.wp-block-group,
.wp-block-cover,
.wp-block-image,
.wp-block-post,
.ast-article-post,
article.post,
.cd54-card,
.partenaires-card,
.publications-card,
.publication-card {
  border-radius: var(--cd54-radius-lg) !important;
  overflow: hidden;
}

/* Images - EXCLURE Leaflet, emojis ET Google Maps */
.wp-block-post-featured-image img,
.wp-block-image img,
.attachment-post-thumbnail,
article img:not(.emoji):not(.wp-smiley):not(.leaflet-tile):not(.leaflet-marker-icon):not(.gm-style img),
.entry-content img:not(.emoji):not(.wp-smiley):not(.leaflet-tile):not(.leaflet-marker-icon):not([src*="leaflet"]):not([src*="google"]):not([src*="gstatic"]):not(.gm-style img) {
  border-radius: var(--cd54-radius-md) !important;
}

/* Google Maps - Reset tuiles uniquement (pas les boutons) */
.gm-style img:not(.gm-control-active img),
.cd54-map-container .gm-style img {
  border-radius: 0 !important;
}

/* ============================================================
   3b. EMOJIS WORDPRESS - Taille fixe obligatoire
   ============================================================ */

/* Emojis WordPress Twemoji - contrainte de taille stricte */
img.emoji,
img.wp-smiley,
.emoji,
.wp-smiley {
  width: 1em !important;
  height: 1em !important;
  max-width: 1em !important;
  max-height: 1em !important;
  min-width: 1em !important;
  min-height: 1em !important;
  vertical-align: -0.1em !important;
  display: inline !important;
  margin: 0 0.07em !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ============================================================
   3c. LEAFLET - Voir homepage.css pour tous les styles Leaflet
   ============================================================ */
/* SUPPRIMÉ v1.1.9 : Les règles Leaflet globales causaient des conflits.
   Toutes les règles Leaflet sont maintenant UNIQUEMENT dans homepage.css
   comme c'était le cas dans le backup v1.0.120 qui fonctionnait. */

/* Boutons - Style par défaut CD54 (fond rouge, texte blanc) - EXCLURE Google Maps */
.wp-block-button__link,
.ast-button,
button:not(.gm-control-active):not(.gm-svpc):not([class*="gm-"]),
input[type="submit"],
input[type="button"],
.button:not(.gm-control-active),
a.button {
  background: var(--cd54-primary, #DD183B) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--cd54-radius-sm) !important;
  padding: 12px 24px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: var(--cd54-transition) !important;
}

/* Boutons outline (style alternatif) */
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--cd54-primary, #DD183B) !important;
  border: 2px solid var(--cd54-primary, #DD183B) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--cd54-primary, #DD183B) !important;
  color: #fff !important;
}

/* Formulaires */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
textarea,
select {
  border-radius: var(--cd54-radius-sm) !important;
  border: 1px solid var(--cd54-border-light) !important;
  transition: var(--cd54-transition-fast) !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--cd54-primary) !important;
  box-shadow: 0 0 0 3px rgba(221, 24, 59, 0.1) !important;
  outline: none !important;
}

/* ============================================================
   4. OMBRES RENFORCÉES
   ============================================================ */

/* Cartes avec ombre par défaut */
.wp-block-post,
article.post,
.ast-article-post,
.cd54-card,
.partenaires-card,
.publications-card,
.publication-card {
  box-shadow: var(--cd54-shadow-md) !important;
  transition: var(--cd54-transition) !important;
}

/* Cartes articles spécifiques */
.wp-block-post-template .wp-block-post {
  background: var(--cd54-bg-light) !important;
  box-shadow: var(--cd54-shadow-md) !important;
  border-radius: var(--cd54-radius-lg) !important;
  overflow: hidden;
}

/* Widgets et sidebars */
.widget,
aside .widget {
  box-shadow: var(--cd54-shadow-sm) !important;
  border-radius: var(--cd54-radius-md) !important;
  padding: var(--cd54-gap-md);
  background: var(--cd54-bg-light);
}

/* ============================================================
   5. EFFETS HOVER AVEC ÉLÉVATION
   ============================================================ */

/* Cartes - Hover élévation */
.wp-block-post:hover,
article.post:hover,
.ast-article-post:hover,
.cd54-card:hover,
.partenaires-card > .wp-block-group:hover,
.publications-card:hover,
.publication-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--cd54-shadow-hover) !important;
}

/* Boutons - Hover - EXCLURE Google Maps */
.wp-block-button__link:hover,
.ast-button:hover,
button:not(.gm-control-active):not(.gm-svpc):not([class*="gm-"]):hover,
input[type="submit"]:hover,
.button:not(.gm-control-active):hover,
a.button:hover {
  background: var(--cd54-primary-dark, #b81432) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(221, 24, 59, 0.3) !important;
}

/* Liens - Hover */
a {
  transition: var(--cd54-transition-fast) !important;
}

.entry-content a:hover:not(.tribe-events-gmap),
.wp-block-post-title a:hover {
  color: var(--cd54-primary) !important;
}

/* Images - Hover zoom léger */
.wp-block-post-featured-image {
  overflow: hidden !important;
  border-radius: var(--cd54-radius-md) !important;
}

.wp-block-post-featured-image img {
  transition: var(--cd54-transition) !important;
}

.wp-block-post:hover .wp-block-post-featured-image img,
article:hover .wp-block-post-featured-image img {
  transform: scale(1.05) !important;
}

/* ============================================================
   6. ESPACEMENTS GÉNÉREUX (48-64px)
   ============================================================ */

/* Sections principales */
.entry-content > *,
.wp-block-group,
.wp-block-columns,
.wp-block-cover {
  margin-bottom: var(--cd54-gap-lg) !important;
}

/* Sections avec padding généreux */
.cd54-section,
.wp-site-blocks > .wp-block-group,
.entry-content > .wp-block-group.alignfull,
.entry-content > .wp-block-group.alignwide {
  padding-top: var(--cd54-section-padding) !important;
  padding-bottom: var(--cd54-section-padding) !important;
}

/* Conteneur principal */
.ast-container,
.site-content .ast-container {
  padding-left: var(--cd54-gap-md) !important;
  padding-right: var(--cd54-gap-md) !important;
}

/* Gap entre articles */
.wp-block-post-template {
  gap: var(--cd54-gap-lg) !important;
}

/* Cartes articles - padding interne */
.wp-block-post .wp-block-post-title,
.wp-block-post .wp-block-post-date,
.wp-block-post .wp-block-post-excerpt {
  padding-left: var(--cd54-gap-md) !important;
  padding-right: var(--cd54-gap-md) !important;
}

.wp-block-post .wp-block-post-title {
  padding-top: var(--cd54-gap-sm) !important;
  margin-bottom: var(--cd54-gap-sm) !important;
}

.wp-block-post .wp-block-post-excerpt {
  padding-bottom: var(--cd54-gap-md) !important;
}

/* ============================================================
   7. RESPONSIVE
   ============================================================ */

@media (max-width: 782px) {
  :root {
    --cd54-section-padding: 40px;
    --cd54-gap-lg: 20px;
    --cd54-gap-md: 14px;
  }

  h1, .entry-title { font-size: 2rem !important; }
  h2 { font-size: 1.5rem !important; }
  h3 { font-size: 1.25rem !important; }

  /* Réduire les effets hover sur mobile (touch) */
  .wp-block-post:hover,
  .cd54-card:hover {
    transform: none !important;
  }
}

@media (max-width: 544px) {
  :root {
    --cd54-section-padding: 32px;
    --cd54-gap-lg: 16px;
    --cd54-gap-md: 10px;
  }

  h1, .entry-title { font-size: 1.75rem !important; }
  h2 { font-size: 1.35rem !important; }
}

/* ============================================================
   8. ANIMATIONS D'ENTRÉE (optionnel - subtil)
   ============================================================ */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.wp-block-post,
.cd54-card,
article.post {
  animation: fadeInUp 0.5s ease forwards;
}

/* Délai progressif pour les cartes */
.wp-block-post:nth-child(1) { animation-delay: 0.1s; }
.wp-block-post:nth-child(2) { animation-delay: 0.2s; }
.wp-block-post:nth-child(3) { animation-delay: 0.3s; }
.wp-block-post:nth-child(4) { animation-delay: 0.4s; }
.wp-block-post:nth-child(5) { animation-delay: 0.5s; }
.wp-block-post:nth-child(6) { animation-delay: 0.6s; }

/* ============================================================
   10. FICHES CLUBS - Masquer les métadonnées
   ============================================================ */

/* Masquer auteur/date sur les fiches club - multiples variantes de classes body */
body.single-club .entry-meta,
body.single-club .ast-single-post-meta,
body[class*="single-club"] .entry-meta,
body[class*="single-club"] .ast-single-post-meta,
body.post-type-archive-club .entry-meta,
body.post-type-archive-club .ast-single-post-meta,
/* Sélecteurs génériques pour CPT Pods */
body[class*="single-club"] .ast-post-meta-wrapper,
body[class*="single-club"] .ast-single-post-meta-wrapper,
body[class*="single-club"] .post-meta,
body[class*="single-club"] .posted-by,
body[class*="single-club"] .posted-on,
body[class*="single-club"] .ast-author-meta,
body[class*="single-club"] .ast-date-meta,
body[class*="single-club"] header.entry-header .entry-meta,
body[class*="single-club"] .entry-header .entry-meta,
body[class*="single-club"] article .entry-meta,
/* Sélecteur ultra-spécifique pour le lien auteur */
body[class*="single-club"] .entry-header a[href*="author"],
body[class*="single-club"] .entry-meta a[href*="author"],
body[class*="single-club"] header a[href*="author"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ============================================================
   11. WPFORMS - Formulaires de contact
   ============================================================ */

/* Container du formulaire */
.wpforms-container {
  max-width: 100%;
}

.wpforms-form {
  font-family: var(--cd54-font-body) !important;
}

/* Labels */
.wpforms-form .wpforms-field-label {
  font-family: var(--cd54-font-heading) !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  color: var(--cd54-text-dark) !important;
  margin-bottom: 8px !important;
}

/* Labels requis (astérisque) */
.wpforms-form .wpforms-required-label {
  color: var(--cd54-primary) !important;
  font-weight: 600 !important;
}

/* Champs de saisie */
.wpforms-form input[type="text"],
.wpforms-form input[type="email"],
.wpforms-form input[type="tel"],
.wpforms-form input[type="url"],
.wpforms-form input[type="number"],
.wpforms-form textarea,
.wpforms-form select {
  width: 100% !important;
  padding: 14px 16px !important;
  font-size: 1rem !important;
  font-family: var(--cd54-font-body) !important;
  border: 2px solid var(--cd54-border-light) !important;
  border-radius: var(--cd54-radius-sm) !important;
  background: #ffffff !important;
  color: var(--cd54-text-dark) !important;
  transition: var(--cd54-transition-fast) !important;
  box-shadow: none !important;
}

/* Focus sur les champs */
.wpforms-form input[type="text"]:focus,
.wpforms-form input[type="email"]:focus,
.wpforms-form input[type="tel"]:focus,
.wpforms-form input[type="url"]:focus,
.wpforms-form input[type="number"]:focus,
.wpforms-form textarea:focus,
.wpforms-form select:focus {
  border-color: var(--cd54-primary) !important;
  box-shadow: 0 0 0 4px rgba(221, 24, 59, 0.1) !important;
  outline: none !important;
}

/* Textarea */
.wpforms-form textarea {
  min-height: 150px !important;
  resize: vertical !important;
}

/* Select dropdown */
.wpforms-form select {
  cursor: pointer !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236B7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  padding-right: 40px !important;
}

/* Placeholder */
.wpforms-form input::placeholder,
.wpforms-form textarea::placeholder {
  color: #9CA3AF !important;
  opacity: 1 !important;
}

/* Espacement entre les champs */
.wpforms-form .wpforms-field {
  margin-bottom: 20px !important;
}

/* Bouton submit */
.wpforms-form button[type="submit"],
.wpforms-form .wpforms-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: auto !important;
  min-width: 200px !important;
  padding: 14px 32px !important;
  font-family: var(--cd54-font-heading) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  background: var(--cd54-primary) !important;
  border: none !important;
  border-radius: var(--cd54-radius-sm) !important;
  cursor: pointer !important;
  transition: var(--cd54-transition) !important;
  text-transform: none !important;
  letter-spacing: 0.3px !important;
}

.wpforms-form button[type="submit"]:hover,
.wpforms-form .wpforms-submit:hover {
  background: var(--cd54-primary-dark) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(221, 24, 59, 0.3) !important;
}

/* Message de succès */
.wpforms-confirmation-container-full {
  background: #dcfce7 !important;
  border: 2px solid #22c55e !important;
  border-radius: var(--cd54-radius-md) !important;
  padding: 24px !important;
  color: #166534 !important;
  font-family: var(--cd54-font-body) !important;
}

/* Messages d'erreur */
.wpforms-form .wpforms-error {
  border-color: var(--cd54-primary) !important;
}

.wpforms-form label.wpforms-error {
  color: var(--cd54-primary) !important;
  font-size: 0.875rem !important;
  margin-top: 6px !important;
  font-weight: 500 !important;
}

/* Description des champs */
.wpforms-form .wpforms-field-description {
  color: var(--cd54-text-secondary) !important;
  font-size: 0.85rem !important;
  margin-top: 6px !important;
}

/* Checkbox et radio */
.wpforms-form .wpforms-field-checkbox ul,
.wpforms-form .wpforms-field-radio ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.wpforms-form .wpforms-field-checkbox li,
.wpforms-form .wpforms-field-radio li {
  margin-bottom: 10px !important;
}

.wpforms-form .wpforms-field-checkbox input,
.wpforms-form .wpforms-field-radio input {
  width: 20px !important;
  height: 20px !important;
  margin-right: 10px !important;
  accent-color: var(--cd54-primary) !important;
}

/* RGPD / Consentement */
.wpforms-form .wpforms-field-gdpr-checkbox label {
  font-size: 0.9rem !important;
  color: var(--cd54-text-secondary) !important;
}

/* Responsive mobile */
@media (max-width: 782px) {
  .wpforms-form input[type="text"],
  .wpforms-form input[type="email"],
  .wpforms-form input[type="tel"],
  .wpforms-form textarea,
  .wpforms-form select {
    padding: 12px 14px !important;
    font-size: 16px !important; /* Évite le zoom iOS */
  }

  .wpforms-form button[type="submit"],
  .wpforms-form .wpforms-submit {
    width: 100% !important;
    padding: 16px 24px !important;
  }

  .wpforms-form .wpforms-field-label {
    font-size: 0.9rem !important;
  }
}


/* ============================================================
   FIX: Réduction zone date cartes événements
   ============================================================ */
.cd54-event-date p,
.cd54-event-date .day,
.cd54-event-date .month,
.wp-block-group.cd54-event-date p {
  margin: 0 !important;
  padding: 0 !important;
}
.cd54-event-date .day,
.cd54-event-date p.day {
  margin-bottom: 4px !important;
  font-size: 2rem !important;
}
.cd54-event-date,
.wp-block-group.cd54-event-date {
  padding: 12px 16px !important;
}