/* ==================== components/quote.css - v5 ==================== */
/* Footer avec citation - Compact et élégant */

/* ==================== CONTAINER DU FOOTER ==================== */

#footer-container {
  margin-top: var(--section-gap);
  margin-bottom: var(--section-gap);
}

/* ==================== QUOTE BLOCK ==================== */

.account-block.quote-block {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-block);
  padding: var(--spacing-xs);
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--transition-fast);
}

.account-block.quote-block:hover {
  box-shadow: var(--shadow-sm);
}

/* ==================== QUOTE BOX ==================== */

.account-box.quote-box {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  padding: var(--spacing-sm) var(--spacing-lg);  /* ✅ v5 : sm au lieu de md = Plus compact */
  min-height: auto;
  display: block;
  text-align: center;
}

/* ==================== CONTENU ==================== */

.quote-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);  /* ✅ v5 : xs au lieu de sm = Plus serré */
  max-width: 800px;
  margin: 0 auto;
  padding: 0;
}

/* ==================== TEXTE CITATION ==================== */

.quote-text {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-base);
  color: var(--color-text);
  text-align: center;
  margin: 0;
  font-style: italic;
}

/* ==================== AUTEUR ==================== */

.quote-author {
  font-size: var(--font-size-base);
  font-style: italic;
  color: var(--color-text-secondary);
  text-align: right;
  margin: 0;
  padding-right: 20px;
  font-weight: var(--font-weight-medium);
  opacity: 0.8;
}

/* ==================== RESPONSIVE ==================== */

@media (max-width: 768px) {
  .account-box.quote-box {
    padding: var(--spacing-xs) var(--spacing-md);  /* ✅ Encore plus compact en tablette */
  }
  
  .quote-text {
    font-size: var(--font-size-base);
  }
  
  .quote-author {
    font-size: var(--font-size-sm);
    padding-right: 15px;
  }
}

@media (max-width: 480px) {
  .account-box.quote-box {
    padding: var(--spacing-xs);  /* ✅ Très compact en mobile */
  }
  
  .quote-content {
    gap: 4px;  /* ✅ Gap minimal en mobile */
  }
  
  .quote-text {
    font-size: var(--font-size-base);
    line-height: var(--line-height-normal);
  }
  
  .quote-author {
    font-size: var(--font-size-xs);
    padding-right: 10px;
  }
}

/* ==================== MODE SOMBRE ==================== */

:root[data-theme="dark"] .quote-text {
  color: var(--color-text);
}

:root[data-theme="dark"] .quote-author {
  color: var(--color-text-secondary);
  opacity: 0.7;
}

/* ==================== PRINT ==================== */

@media print {
  #footer-container {
    page-break-inside: avoid;
  }
}

/* ==================== NOTES ==================== */

/*
VERSION 5 - HAUTEUR RÉDUITE :
✅ Citation en italique
✅ Auteur à droite et grisé
✅ Padding réduit : var(--spacing-sm) au lieu de md (12px au lieu de 16px)
✅ Gap réduit : var(--spacing-xs) au lieu de sm (8px au lieu de 12px)
✅ Résultat : Box plus compacte !
*/