/* ===== CD54 BILLARD - STYLES PAGES (hors homepage) ===== */
/* Version: 1.0.2 - Support Gutenberg Query Loop + Astra archives */

/* ============================================================
   CARTES D'ARTICLES - Page Actualités (Gutenberg Query Loop)
   ============================================================ */

/* Grille Gutenberg - hauteur uniforme */
.cd54-news-grid,
.cd54-news-archive .wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: var(--cd54-gap-md, 24px) !important;
  align-items: stretch !important;
}

/* Chaque élément de la grille prend toute la hauteur */
.cd54-news-grid > li,
.cd54-news-archive .wp-block-post-template > li {
  display: flex !important;
  height: 100% !important;
}

/* Carte article Gutenberg - structure flex pour remplir l'espace */
.cd54-news-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
  background: var(--cd54-bg-light, #fff) !important;
  border-radius: var(--cd54-radius-lg, 16px) !important;
  overflow: hidden !important;
  box-shadow: var(--cd54-shadow-sm, 0 2px 8px rgba(0, 0, 0, 0.06)) !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}

.cd54-news-card:hover {
  box-shadow: var(--cd54-shadow-md, 0 4px 16px rgba(0, 0, 0, 0.1)) !important;
  transform: translateY(-4px) !important;
}

/* Image mise en avant - hauteur fixe */
.cd54-news-card .wp-block-post-featured-image {
  height: 200px !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
}

.cd54-news-card .wp-block-post-featured-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Contenu de la carte - remplit tout l'espace restant */
.cd54-news-card > .wp-block-group:last-child {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Extrait - pousse le "Lire la suite" en bas */
.cd54-news-card .wp-block-post-excerpt {
  flex: 1 !important;
}

/* Lien "Lire la suite" - toujours en bas */
.cd54-news-card .wp-block-post-excerpt__more-link {
  color: var(--cd54-primary, #DD183B) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-top: auto !important;
}

.cd54-news-card .wp-block-post-excerpt__more-link:hover {
  text-decoration: underline !important;
}

/* Titre article */
.cd54-news-card .wp-block-post-title a {
  color: var(--cd54-text-dark, #1a1a2e) !important;
  text-decoration: none !important;
}

.cd54-news-card .wp-block-post-title a:hover {
  color: var(--cd54-primary, #DD183B) !important;
}

/* Responsive Gutenberg */
@media (max-width: 992px) {
  .cd54-news-grid,
  .cd54-news-archive .wp-block-post-template {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 782px) {
  .cd54-news-grid,
  .cd54-news-archive .wp-block-post-template {
    grid-template-columns: 1fr !important;
  }

  .cd54-news-card .wp-block-post-featured-image {
    height: 180px !important;
  }
}

/* ============================================================
   CARTES D'ARTICLES - Archives Astra (fallback)
   Note: Les styles de base (shadow, hover) sont dans design-system.css
   ============================================================ */

/* Grille des articles - hauteur uniforme */
.ast-row,
.ast-archive-post {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: var(--cd54-gap-md, 24px) !important;
  align-items: stretch !important;
}

/* Colonne contenant l'article */
.ast-col-md-4,
.ast-archive-post > article {
  display: flex !important;
  height: 100% !important;
}

/* Container image avec hauteur fixe */
.ast-article-post .post-thumb,
.ast-article-post .post-thumb-img-content,
article .post-thumb,
article .post-thumb-img-content {
  height: 220px !important;
  overflow: hidden !important;
}

/* Image qui remplit tout le container */
.ast-article-post .post-thumb img,
.ast-article-post .post-thumb-img-content img,
article .post-thumb img,
article .post-thumb-img-content img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* Carte article - structure flex (complète design-system.css) */
.ast-article-post,
.ast-separate-container .ast-article-post {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
  background: var(--cd54-bg-light, #fff) !important;
  border-radius: var(--cd54-radius-lg, 16px) !important;
  overflow: hidden !important;
}

/* Contenu de la carte - remplit tout l'espace */
.ast-article-post .entry-content,
.ast-article-post .post-content,
.ast-article-post .blog-entry-summary {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: var(--cd54-gap-sm, 20px) !important;
  background: var(--cd54-bg-light, #fff) !important;
}

/* Titre article */
.ast-article-post .entry-title,
.ast-article-post .entry-title a {
  font-family: var(--cd54-font-heading, 'Outfit', sans-serif) !important;
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: var(--cd54-text-dark, #1a1a2e) !important;
  line-height: 1.3 !important;
  margin-bottom: var(--cd54-gap-sm, 12px) !important;
}

.ast-article-post .entry-title a:hover {
  color: var(--cd54-primary, #DD183B) !important;
}

/* Date */
.ast-article-post .posted-on,
.ast-article-post .entry-meta {
  font-size: 0.875rem !important;
  color: var(--cd54-text-secondary, #6B7280) !important;
  margin-bottom: 8px !important;
}

/* Extrait */
.ast-article-post .entry-content p,
.ast-article-post .ast-excerpt-container {
  color: var(--cd54-text-dark, #374151) !important;
  font-size: 0.95rem !important;
  line-height: 1.6 !important;
  flex-grow: 1 !important;
}

/* Lien "Lire la suite" */
.ast-article-post .read-more,
.ast-article-post .ast-read-more-container a {
  color: var(--cd54-primary, #DD183B) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-top: auto !important;
  padding-top: var(--cd54-gap-sm, 12px) !important;
}

.ast-article-post .read-more:hover,
.ast-article-post .ast-read-more-container a:hover {
  text-decoration: underline !important;
}

/* Grille responsive */
@media (max-width: 992px) {
  .ast-row,
  .ast-archive-post {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media (max-width: 782px) {
  .ast-row,
  .ast-archive-post {
    grid-template-columns: 1fr !important;
  }

  .ast-article-post .post-thumb,
  .ast-article-post .post-thumb-img-content,
  article .post-thumb,
  article .post-thumb-img-content {
    height: 180px !important;
  }
}

/* ============================================================
   PAGE 404 - Template standalone (404.php)
   Les styles 404 sont maintenant intégrés directement dans le template
   ============================================================ */