/*
Theme Name:     Twenty Twenty-Five Child
Description:    Child theme for the Twenty Twenty-Five theme
Template:       twentytwentyfive
Version:        1.0.0
Tags:           block-template
Text Domain:    twentytwentyfive-child
*/

/* =========================================================
   SOMMAIRE

   01. Base technique
   02. Sections
   03. Rangées et grilles
   04. Cartes génériques
   05. Textes de cartes
   06. Badges manuels
   07. Header / Footer
   08. Card principale
   09. Hero archive
   10. Pagination
   11. Formulaire de commentaire
   12. Liste des commentaires
   13. Responsive
   ========================================================= */

/* =========================================================
   01. BASE TECHNIQUE
   ========================================================= */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
}

img,
svg,
video,
iframe {
  max-width: 100%;
}

/* =========================================================
   02. SECTIONS
   Classes utilisables sur les groupes FSE principaux.
   ========================================================= */

.ludo-section {
  padding-block: var(--wp--preset--spacing--3xl);
}

.ludo-section--soft {
  background: var(--wp--preset--color--base-3);
  border-block: 1px solid var(--wp--preset--color--accent-5);
}

.ludo-section--compact {
  padding-block: var(--wp--preset--spacing--xxl);
}

.ludo-section--dark {
  background: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--white);
}

.ludo-section--dark :where(h1, h2, h3, h4, p, a) {
  color: inherit;
}

/* =========================================================
   03. RANGÉES ET GRILLES
   ========================================================= */

.ludo-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wp--preset--spacing--md);
}

.ludo-stack {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--md);
}

.ludo-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--wp--preset--spacing--lg);
}

/* =========================================================
   04. CARTES GÉNÉRIQUES
   ========================================================= */

.ludo-card {
  background: var(--wp--preset--color--base-2);
  border: 1px solid var(--wp--preset--color--accent-5);
  border-radius: var(--wp--custom--radius--lg);
  box-shadow: var(--wp--preset--shadow--sm);
  overflow: hidden;
  transition:
    transform var(--wp--custom--transition--fast),
    border-color var(--wp--custom--transition--fast),
    box-shadow var(--wp--custom--transition--fast);
}

.ludo-card:hover {
  transform: translateY(-2px);
  border-color: var(--wp--preset--color--accent-1);
  box-shadow: var(--wp--preset--shadow--md);
}

.ludo-card--soft {
  background: var(--wp--preset--color--base-3);
}

.ludo-card--featured {
  border-radius: var(--wp--custom--radius--lg);
  box-shadow: var(--wp--preset--shadow--md);
}

.ludo-card--compact {
  border-radius: var(--wp--custom--radius--md);
}

.ludo-card .wp-block-post-featured-image,
.ludo-card .wp-block-image {
  margin: 0;
}

.ludo-card .wp-block-post-featured-image img,
.ludo-card .wp-block-image img {
  display: block;
  width: 100%;
  object-fit: cover;
}

.ludo-card--featured .wp-block-post-featured-image img {
  min-height: 420px;
}

.ludo-card--compact .wp-block-post-featured-image img {
  min-height: 180px;
}

/* =========================================================
   05. TEXTES DE CARTES
   Classes optionnelles pour les blocs Meta Field Block.
   ========================================================= */

.ludo-card-title {
  margin: 0;
  color: var(--wp--preset--color--contrast);
  font-family: var(--wp--preset--font-family--heading);
  font-weight: var(--wp--custom--font-weight--semibold);
  line-height: var(--wp--custom--line-height--heading);
}

.ludo-card-title a {
  color: inherit;
  text-decoration: none;
}

.ludo-card-title a:hover {
  color: var(--wp--preset--color--accent-1);
}

.ludo-card-excerpt {
  margin: 0;
  color: var(--wp--preset--color--contrast-2);
  line-height: var(--wp--custom--line-height--body);
}

.ludo-card-meta {
  margin: 0;
  color: var(--wp--preset--color--contrast-3);
  font-size: var(--wp--preset--font-size--meta);
  font-weight: var(--wp--custom--font-weight--medium);
  line-height: var(--wp--custom--line-height--compact);
}

/* =========================================================
   06. BADGES MANUELS
   Les badges automatiques des taxonomies sont gérés dans
   theme.json via core/post-terms.
   ========================================================= */

.ludo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 24px;
  padding: 4px 10px;
  border-radius: var(--wp--custom--radius--full);
  background: var(--wp--preset--color--accent-4);
  color: var(--wp--preset--color--accent-3);
  font-size: var(--wp--preset--font-size--meta);
  font-weight: var(--wp--custom--font-weight--semibold);
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none;
}

/* =========================================================
   07. HEADER / FOOTER
   ========================================================= */

.ludo-header {
  min-height: var(--wp--custom--header--height);
  border-bottom: 1px solid var(--wp--preset--color--accent-5);
}

.ludo-footer {
  border-top: 1px solid var(--wp--preset--color--accent-5);
  background: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--white);
}

.ludo-footer :where(a, p, h2, h3, h4) {
  color: inherit;
}

/* =========================================================
   08. CARD PRINCIPALE
   Classe à ajouter sur le groupe de chaque carte :
   card_principale

   Objectif :
   - cartes visuellement régulières
   - aucune carte coupée
   - image stable
   - badges alignés
   - titre/résumé limités
   - date/auteur en bas quand possible
   ========================================================= */

.card_principale {
  display: flex !important;
  flex-direction: column !important;

  width: 100% !important;
  min-height: 526px !important;

  padding: 18px !important;
  margin: 0 !important;

  overflow: visible !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

/* Image */

.card_principale .wp-block-post-featured-image {
  width: 100% !important;
  height: 190px !important;
  min-height: 190px !important;
  max-height: 190px !important;

  margin: 0 0 12px 0 !important;
  padding: 0 !important;

  flex: 0 0 190px !important;
  overflow: hidden !important;
}

.card_principale .wp-block-post-featured-image a,
.card_principale .wp-block-post-featured-image img {
  display: block !important;

  width: 100% !important;
  height: 190px !important;
  min-height: 190px !important;
  max-height: 190px !important;
}

.card_principale .wp-block-post-featured-image img {
  object-fit: cover !important;
  border-radius: 12px !important;
}

/* Badge de format */

.card_principale .wp-block-post-terms {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;

  gap: 8px !important;

  width: 100% !important;
  min-height: 26px !important;

  margin: 0 0 14px 0 !important;
  padding: 0 !important;

  line-height: 1 !important;
  text-align: left !important;
}

/* Cache le séparateur automatique WordPress : "," */
.card_principale .wp-block-post-terms__separator {
  display: none !important;
}

/* Badge individuel */

.card_principale .wp-block-post-terms a {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;

  width: fit-content !important;
  min-width: 66px !important;

  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;

  margin: 0 !important;
  padding: 0 14px !important;

  flex: 0 0 auto !important;

  border: 2px solid var(--wp--preset--color--white) !important;
  border-radius: var(--wp--custom--radius--full) !important;

  background: var(--wp--preset--color--accent-3) !important;
  color: var(--wp--preset--color--white) !important;

  font-family: var(--wp--preset--font-family--body) !important;
  font-size: var(--wp--preset--font-size--meta) !important;
  font-weight: var(--wp--custom--font-weight--semibold) !important;
  line-height: 1 !important;

  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;

  box-sizing: border-box !important;
}

.card_principale .wp-block-post-terms a:hover {
  background: var(--wp--preset--color--accent-2) !important;
  border-color: var(--wp--preset--color--white) !important;
  color: var(--wp--preset--color--white) !important;
}

/* Titre */

.card_principale .wp-block-mfb-meta-field-block.has-h-4-font-size {
  width: 100% !important;

  margin: 0 0 12px 0 !important;
  padding: 0 !important;

  text-align: left !important;
}

.card_principale .wp-block-mfb-meta-field-block.has-h-4-font-size .value {
  display: -webkit-box !important;

  max-height: 90px !important;

  overflow: hidden !important;

  color: var(--wp--preset--color--contrast) !important;

  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-align: left !important;

  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
}

/* Résumé */

.card_principale
  .wp-block-mfb-meta-field-block:not(.has-h-4-font-size):not(
    .has-meta-font-size
  ) {
  width: 100% !important;

  margin: 0 0 14px 0 !important;
  padding: 0 !important;

  text-align: left !important;
}

.card_principale
  .wp-block-mfb-meta-field-block:not(.has-h-4-font-size):not(
    .has-meta-font-size
  )
  .value {
  display: -webkit-box !important;

  max-height: 112px !important;

  overflow: hidden !important;

  color: var(--wp--preset--color--contrast) !important;

  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  text-align: left !important;

  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
}

/* Métadonnées : date / auteur */

.card_principale > .wp-block-group:last-child {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 4px !important;

  width: 100% !important;

  margin-top: auto !important;
  padding: 0 !important;

  text-align: left !important;
}

.card_principale .wp-block-post-date,
.card_principale .wp-block-post-date time,
.card_principale .has-meta-font-size,
.card_principale .has-meta-font-size .value {
  color: var(--wp--preset--color--contrast) !important;

  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}

/* =========================================================
   09. HERO ARCHIVE
   Classes :
   - hero_archive sur le groupe parent
   - titre_hero_archive sur le titre
   ========================================================= */

.hero_archive {
  position: relative;
  overflow: hidden;
  min-height: 400px;
  padding: 0 !important;
}

.hero_archive .wp-block-image {
  margin: 0;
  width: 100%;
  height: 400px;
}

.hero_archive .wp-block-image img {
  display: block;
  width: 100% !important;
  height: 400px !important;
  object-fit: cover;
}

.hero_archive::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(31, 28, 28, 0.35);
  z-index: 1;
}

.titre_hero_archive {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  margin: 0 !important;
  color: var(--wp--preset--color--white) !important;
  text-align: center;
  transform: translate(-50%, -50%);
}

/* =========================================================
   10. PAGINATION
   Classe à ajouter sur le bloc pagination : pagination
   ========================================================= */

.wp-block-query-pagination.pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: var(--wp--preset--spacing--sm) !important;
  width: 100% !important;
  margin-top: var(--wp--preset--spacing--xl) !important;
  margin-bottom: var(--wp--preset--spacing--xl) !important;
  color: var(--wp--preset--color--contrast) !important;
  font-family: var(--wp--preset--font-family--body) !important;
  font-size: var(--wp--preset--font-size--body) !important;
}

.wp-block-query-pagination.pagination .wp-block-query-pagination-numbers {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: var(--wp--preset--spacing--sm) !important;
  margin: 0 !important;
}

.wp-block-query-pagination.pagination a,
.wp-block-query-pagination.pagination .page-numbers {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--wp--preset--color--accent-5) !important;
  border-radius: var(--wp--custom--radius--md) !important;
  background: var(--wp--preset--color--base-2) !important;
  color: var(--wp--preset--color--contrast) !important;
  font-size: var(--wp--preset--font-size--body) !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition:
    background-color var(--wp--custom--transition--fast),
    border-color var(--wp--custom--transition--fast),
    color var(--wp--custom--transition--fast),
    transform var(--wp--custom--transition--fast) !important;
}

.wp-block-query-pagination.pagination .wp-block-query-pagination-previous,
.wp-block-query-pagination.pagination .wp-block-query-pagination-next {
  min-width: auto !important;
  padding-inline: 18px !important;
}

.wp-block-query-pagination.pagination a:hover,
.wp-block-query-pagination.pagination .page-numbers:hover {
  border-color: var(--wp--preset--color--accent-1) !important;
  background: var(--wp--preset--color--accent-4) !important;
  color: var(--wp--preset--color--accent-3) !important;
  transform: translateY(-1px) !important;
}

.wp-block-query-pagination.pagination .page-numbers.current {
  border-color: var(--wp--preset--color--accent-1) !important;
  background: var(--wp--preset--color--accent-1) !important;
  color: var(--wp--preset--color--white) !important;
  font-weight: 700 !important;
  cursor: default !important;
}

.wp-block-query-pagination.pagination .wp-block-query-pagination-previous-arrow,
.wp-block-query-pagination.pagination .wp-block-query-pagination-next-arrow {
  font-size: 18px !important;
  line-height: 1 !important;
}

.wp-block-query-pagination.pagination a:focus-visible,
.wp-block-query-pagination.pagination .page-numbers:focus-visible {
  outline: 2px solid var(--wp--preset--color--accent-1) !important;
  outline-offset: 3px !important;
}

/* =========================================================
   11. FORMULAIRE DE COMMENTAIRE
   Cible :
   - .comment-respond
   - .wp-block-post-comments-form
   ========================================================= */

.wp-block-post-comments-form,
.comment-respond {
  width: 100%;
  margin-top: var(--wp--preset--spacing--xl) !important;
  margin-bottom: var(--wp--preset--spacing--3xl) !important;
  padding: var(--wp--preset--spacing--lg) !important;
  border: 1px solid var(--wp--preset--color--accent-5) !important;
  border-radius: var(--wp--custom--radius--lg) !important;
  background: var(--wp--preset--color--base-2) !important;
  color: var(--wp--preset--color--contrast) !important;
  box-shadow: var(--wp--preset--shadow--sm) !important;
}

.comment-respond .comment-reply-title {
  margin: 0 0 var(--wp--preset--spacing--md) 0 !important;
  color: var(--wp--preset--color--contrast) !important;
  font-family: var(--wp--preset--font-family--heading) !important;
  font-size: var(--wp--preset--font-size--h3) !important;
  font-weight: 700 !important;
  line-height: var(--wp--custom--line-height--heading) !important;
}

.comment-respond .logged-in-as,
.comment-respond .comment-notes {
  margin: 0 0 var(--wp--preset--spacing--md) 0 !important;
  color: var(--wp--preset--color--contrast-2) !important;
  font-size: var(--wp--preset--font-size--small) !important;
  line-height: var(--wp--custom--line-height--body) !important;
}

.comment-respond a {
  color: var(--wp--preset--color--accent-1) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.comment-respond a:hover {
  color: var(--wp--preset--color--accent-2) !important;
  text-decoration: underline !important;
}

.comment-form p {
  margin: 0 0 var(--wp--preset--spacing--md) 0 !important;
}

.comment-form label {
  display: block !important;
  margin-bottom: var(--wp--preset--spacing--sm) !important;
  color: var(--wp--preset--color--contrast) !important;
  font-size: var(--wp--preset--font-size--small) !important;
  font-weight: 700 !important;
  line-height: var(--wp--custom--line-height--compact) !important;
}

.comment-form .required,
.comment-form .required-field-message {
  color: var(--wp--preset--color--accent-1) !important;
  font-weight: 700 !important;
}

.comment-form textarea,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"] {
  width: 100% !important;
  min-height: 46px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--wp--preset--color--accent-5) !important;
  border-radius: var(--wp--custom--radius--md) !important;
  background: var(--wp--preset--color--white) !important;
  color: var(--wp--preset--color--contrast) !important;
  font-family: var(--wp--preset--font-family--body) !important;
  font-size: var(--wp--preset--font-size--body) !important;
  line-height: var(--wp--custom--line-height--body) !important;
}

.comment-form textarea {
  min-height: 150px !important;
  resize: vertical !important;
}

.comment-form textarea:focus,
.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form input[type="url"]:focus {
  border-color: var(--wp--preset--color--accent-1) !important;
  outline: 2px solid var(--wp--preset--color--accent-5) !important;
  outline-offset: 2px !important;
}

.comment-form .form-submit {
  margin-top: var(--wp--preset--spacing--md) !important;
  margin-bottom: 0 !important;
}

.comment-form input[type="submit"],
.comment-form .wp-block-button__link,
.comment-form .wp-element-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 11px 20px !important;
  border: 1px solid var(--wp--preset--color--accent-1) !important;
  border-radius: var(--wp--custom--radius--md) !important;
  background: var(--wp--preset--color--accent-1) !important;
  color: var(--wp--preset--color--white) !important;
  font-family: var(--wp--preset--font-family--body) !important;
  font-size: var(--wp--preset--font-size--button) !important;
  font-weight: 700 !important;
  line-height: var(--wp--custom--line-height--compact) !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

.comment-form input[type="submit"]:hover,
.comment-form .wp-block-button__link:hover,
.comment-form .wp-element-button:hover {
  border-color: var(--wp--preset--color--accent-2) !important;
  background: var(--wp--preset--color--accent-2) !important;
}

/* =========================================================
   12. LISTE DES COMMENTAIRES
   Classe sur le bloc Comments : commentaire
   ========================================================= */

.commentaire {
  margin-top: var(--wp--preset--spacing--xl) !important;
  margin-bottom: var(--wp--preset--spacing--xl) !important;
}

.commentaire .wp-block-comments-title,
.commentaire .titre_pagination_commentaire {
  margin: 0 0 var(--wp--preset--spacing--lg) 0 !important;
  color: var(--wp--preset--color--contrast) !important;
  font-family: var(--wp--preset--font-family--heading) !important;
  font-size: var(--wp--preset--font-size--h3) !important;
  font-weight: 700 !important;
  line-height: var(--wp--custom--line-height--heading) !important;
}

.commentaire .wp-block-comment-template,
.commentaire .wp-block-comment-template ol {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.commentaire .wp-block-comment-template > li {
  margin-bottom: var(--wp--preset--spacing--md) !important;
}

.commentaire li.comment {
  padding: var(--wp--preset--spacing--md) !important;
  border: 1px solid var(--wp--preset--color--accent-5) !important;
  border-radius: var(--wp--custom--radius--md) !important;
  background: var(--wp--preset--color--base-2) !important;
  color: var(--wp--preset--color--contrast) !important;
  box-shadow: none !important;
}

.commentaire li.comment > .wp-block-columns {
  gap: var(--wp--preset--spacing--sm) !important;
  margin-bottom: 0 !important;
}

.commentaire li.comment > .wp-block-columns > .wp-block-column:first-child {
  flex-basis: 36px !important;
  max-width: 36px !important;
}

.commentaire .wp-block-avatar img {
  width: 36px !important;
  height: 36px !important;
  border-radius: 999px !important;
}

.commentaire .wp-block-comment-author-name {
  margin: 0 0 2px 0 !important;
  color: var(--wp--preset--color--contrast) !important;
  font-size: var(--wp--preset--font-size--body) !important;
  font-weight: 700 !important;
  line-height: var(--wp--custom--line-height--compact) !important;
}

.commentaire .wp-block-comment-author-name a {
  color: var(--wp--preset--color--contrast) !important;
  text-decoration: none !important;
}

.commentaire .wp-block-comment-author-name a:hover {
  color: var(--wp--preset--color--accent-1) !important;
  text-decoration: underline !important;
}

.commentaire .wp-block-comment-author-name + .wp-block-group {
  gap: var(--wp--preset--spacing--sm) !important;
  margin: 0 0 var(--wp--preset--spacing--sm) 0 !important;
}

.commentaire .wp-block-comment-date,
.commentaire .wp-block-comment-edit-link {
  color: var(--wp--preset--color--contrast-3) !important;
  font-size: var(--wp--preset--font-size--meta) !important;
  font-weight: 500 !important;
  line-height: var(--wp--custom--line-height--compact) !important;
}

.commentaire .wp-block-comment-date a,
.commentaire .wp-block-comment-edit-link a {
  color: var(--wp--preset--color--contrast-3) !important;
  text-decoration: none !important;
}

.commentaire .wp-block-comment-date a:hover,
.commentaire .wp-block-comment-edit-link a:hover {
  color: var(--wp--preset--color--accent-1) !important;
  text-decoration: underline !important;
}

.commentaire .wp-block-comment-content {
  margin: 0 0 var(--wp--preset--spacing--sm) 0 !important;
  color: var(--wp--preset--color--contrast) !important;
  font-size: var(--wp--preset--font-size--body) !important;
  line-height: var(--wp--custom--line-height--body) !important;
}

.commentaire .wp-block-comment-content p {
  margin: 0 !important;
}

.commentaire .wp-block-comment-reply-link {
  margin-top: var(--wp--preset--spacing--xs) !important;
  font-size: var(--wp--preset--font-size--meta) !important;
  font-weight: 700 !important;
  line-height: var(--wp--custom--line-height--compact) !important;
}

.commentaire .wp-block-comment-reply-link a {
  color: var(--wp--preset--color--accent-1) !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}

.commentaire .wp-block-comment-reply-link a:hover {
  color: var(--wp--preset--color--accent-2) !important;
  text-decoration: underline !important;
}

.commentaire li.comment > ol {
  margin-top: var(--wp--preset--spacing--sm) !important;
  margin-left: 48px !important;
  padding-left: var(--wp--preset--spacing--md) !important;
  border-left: 2px solid var(--wp--preset--color--accent-5) !important;
}

.commentaire li.comment > ol > li.comment {
  margin-top: var(--wp--preset--spacing--sm) !important;
  margin-bottom: 0 !important;
  padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--md) !important;
  border-radius: var(--wp--custom--radius--sm) !important;
  background: var(--wp--preset--color--base-3) !important;
}

.commentaire li.comment > ol .wp-block-avatar img {
  width: 32px !important;
  height: 32px !important;
}

.commentaire li.comment > ol .wp-block-comment-author-name {
  font-size: var(--wp--preset--font-size--small) !important;
}

.commentaire li.comment > ol .wp-block-comment-content {
  font-size: var(--wp--preset--font-size--small) !important;
  line-height: 1.5 !important;
}

/* =========================================================
   13. RESPONSIVE
   Tous les ajustements mobiles sont regroupés ici.
   ========================================================= */

@media (max-width: 782px) {
  .ludo-section {
    padding-block: var(--wp--preset--spacing--xxl);
  }

  .ludo-title-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .ludo-grid-3 {
    grid-template-columns: 1fr;
  }

  .ludo-card,
  .ludo-card--featured,
  .ludo-card--compact {
    border-radius: var(--wp--custom--radius--md);
  }

  .ludo-card--featured .wp-block-post-featured-image img,
  .ludo-card--compact .wp-block-post-featured-image img {
    min-height: 220px;
  }

  .card_principale {
    min-height: auto !important;
  }

  .card_principale .wp-block-post-featured-image,
  .card_principale .wp-block-post-featured-image a,
  .card_principale .wp-block-post-featured-image img {
    height: 190px !important;
    min-height: 190px !important;
    max-height: 190px !important;
  }

  .hero_archive {
    min-height: 280px;
  }

  .hero_archive .wp-block-image,
  .hero_archive .wp-block-image img {
    height: 280px !important;
  }

  .wp-block-query-pagination.pagination .wp-block-query-pagination-previous,
  .wp-block-query-pagination.pagination .wp-block-query-pagination-next {
    width: 100% !important;
  }

  .wp-block-query-pagination.pagination .wp-block-query-pagination-numbers {
    order: -1 !important;
    width: 100% !important;
  }

  .wp-block-query-pagination.pagination a,
  .wp-block-query-pagination.pagination .page-numbers {
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 9px 12px !important;
    font-size: var(--wp--preset--font-size--small) !important;
  }

  .wp-block-post-comments-form,
  .comment-respond {
    padding: var(--wp--preset--spacing--md) !important;
    border-radius: var(--wp--custom--radius--md) !important;
  }

  .comment-respond .comment-reply-title,
  .commentaire .wp-block-comments-title,
  .commentaire .titre_pagination_commentaire {
    font-size: var(--wp--preset--font-size--h4) !important;
  }

  .comment-form input[type="submit"],
  .comment-form .wp-block-button__link,
  .comment-form .wp-element-button {
    width: 100% !important;
  }

  .commentaire li.comment {
    padding: var(--wp--preset--spacing--sm) !important;
  }

  .commentaire li.comment > .wp-block-columns {
    flex-wrap: nowrap !important;
  }

  .commentaire li.comment > ol {
    margin-left: 18px !important;
    padding-left: var(--wp--preset--spacing--sm) !important;
  }

  .commentaire li.comment > ol > li.comment {
    padding: var(--wp--preset--spacing--sm) !important;
  }
}

/* =========================================================
   Contenus liés simples
   Shortcode : [contenus_lies_simple]

   Rendu visé :
   - card horizontale
   - image carrée à gauche
   - titre Sora SemiBold 22px / line-height 29px
   - fond clair + bordure teal
   ========================================================= */

.contenus-lies-simple {
  width: 100% !important;
  max-width: var(--wp--style--global--content-size) !important;

  margin-top: var(--wp--preset--spacing--3xl) !important;
  margin-right: auto !important;
  margin-bottom: var(--wp--preset--spacing--3xl) !important;
  margin-left: auto !important;

  padding: 0 !important;
  box-sizing: border-box !important;
}

.contenus-lies-simple__grid {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;

  gap: 16px !important;

  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
}

/* CARD */
.contenu-lie-simple-card {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;

  width: 100% !important;
  max-width: 500px !important;
  min-height: 120px !important;

  padding: 16px !important;
  margin: 0 !important;

  background: var(--wp--preset--color--base-3) !important;
  border: 3px solid var(--wp--preset--color--accent-5) !important;
  border-radius: 24px !important;

  color: var(--wp--preset--color--contrast) !important;
  text-decoration: none !important;

  overflow: hidden !important;
  box-sizing: border-box !important;

  transition:
    background-color var(--wp--custom--transition--fast),
    border-color var(--wp--custom--transition--fast) !important;
}

.contenu-lie-simple-card:hover {
  background: var(--wp--preset--color--accent-4) !important;
  border-color: var(--wp--preset--color--accent-1) !important;
}

/* IMAGE */
.contenu-lie-simple-card__image-link,
.contenu-lie-simple-card__image {
  display: block !important;

  flex: 0 0 80px !important;

  width: 80px !important;
  min-width: 80px !important;
  max-width: 80px !important;

  height: 80px !important;
  min-height: 80px !important;
  max-height: 80px !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;

  background: var(--wp--preset--color--base) !important;
  border-radius: 4px !important;

  box-sizing: border-box !important;
}

.contenu-lie-simple-card__image img,
.contenu-lie-simple-card img {
  display: block !important;

  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  object-fit: cover !important;
  border-radius: 4px !important;
}

/* TITRE */
.contenu-lie-simple-card__title {
  flex: 1 1 auto !important;
  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  color: var(--wp--preset--color--contrast) !important;

  font-family: var(--wp--preset--font-family--heading) !important;
  font-size: 22px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 29px !important;

  text-align: left !important;
  text-decoration: none !important;

  overflow: visible !important;

  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;

  box-sizing: border-box !important;
}

.contenu-lie-simple-card__title a {
  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  color: var(--wp--preset--color--contrast) !important;
  text-decoration: none !important;

  font-family: var(--wp--preset--font-family--heading) !important;
  font-size: 22px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 29px !important;

  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

.contenu-lie-simple-card__title a:hover {
  color: var(--wp--preset--color--accent-3) !important;
}

/* MOBILE */
@media (max-width: 782px) {
  .contenu-lie-simple-card {
    max-width: 100% !important;
    min-height: 112px !important;
    border-radius: 20px !important;
  }

  .contenu-lie-simple-card__image-link,
  .contenu-lie-simple-card__image {
    flex-basis: 72px !important;

    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;

    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
  }

  .contenu-lie-simple-card__title,
  .contenu-lie-simple-card__title a {
    font-size: 20px !important;
    line-height: 26px !important;
  }
}

/* =========================================================
   Vidéo optionnelle — Single actualité
   Shortcode : [video_actualite]
   Champ ACF : lien_video_youtube

   Objectif :
   - lecteur large et lisible
   - largeur alignée sur le contenu
   - ratio vidéo 16/9
   - style cohérent Ludovox
   ========================================================= */

.video_actualite_wrapper {
  width: 100%;
  max-width: var(--wp--style--global--content-size);

  margin-top: var(--wp--preset--spacing--xl);
  margin-right: auto;
  margin-bottom: var(--wp--preset--spacing--xl);
  margin-left: auto;

  padding: var(--wp--preset--spacing--md);

  border: 1px solid var(--wp--preset--color--accent-5);
  border-radius: var(--wp--custom--radius--lg);

  background: var(--wp--preset--color--base-2);
  box-shadow: var(--wp--preset--shadow--sm);

  box-sizing: border-box;
}

/* Force le conteneur oEmbed WordPress à prendre toute la largeur */
.video_actualite_wrapper .wp-video,
.video_actualite_wrapper .wp-embed,
.video_actualite_wrapper .wp-block-embed,
.video_actualite_wrapper .wp-block-embed__wrapper,
.video_actualite_wrapper .embed-youtube,
.video_actualite_wrapper .wp-oembed {
  width: 100% !important;
  max-width: 100% !important;
}

/* Lecteur YouTube */
.video_actualite_wrapper iframe {
  display: block !important;

  width: 100% !important;
  max-width: 100% !important;

  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  min-height: 360px;

  border: 0 !important;
  border-radius: var(--wp--custom--radius--md);

  background: var(--wp--preset--color--contrast);
}

/* Sécurité pour les embeds WordPress */
.video_actualite_wrapper iframe[src*="youtube"],
.video_actualite_wrapper iframe[src*="youtu.be"],
.video_actualite_wrapper iframe[src*="youtube-nocookie"] {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
}

/* Responsive */
@media (max-width: 782px) {
  .video_actualite_wrapper {
    padding: var(--wp--preset--spacing--sm);

    margin-top: var(--wp--preset--spacing--lg);
    margin-bottom: var(--wp--preset--spacing--lg);

    border-radius: var(--wp--custom--radius--md);
  }

  .video_actualite_wrapper iframe {
    min-height: 220px;
  }
}

/* =========================================================
   Card information jeu / test
   Classe : card_info_jeu

   Utilisation :
   - Articles Jeux & Tests
   - Fiche jeu
   - Tests de jeu
   - Informations ACF affichées avec Meta Field Block
   ========================================================= */

.card_info_jeu {
  width: 100%;
  max-width: var(--wp--style--global--content-size);

  margin-top: var(--wp--preset--spacing--xl);
  margin-right: auto;
  margin-bottom: var(--wp--preset--spacing--xl);
  margin-left: auto;

  padding: var(--wp--preset--spacing--lg);

  border: 2px solid var(--wp--preset--color--accent-5);
  border-radius: var(--wp--custom--radius--lg);

  background: var(--wp--preset--color--base-3);
  color: var(--wp--preset--color--contrast);

  box-shadow: var(--wp--preset--shadow--sm);

  box-sizing: border-box;
}

/* Supprime les marges parasites dans la card */
.card_info_jeu > * {
  margin-block-start: 0;
}

/* =========================================================
   01. Type de contenu = badge
   Premier champ MFB dans la card

   Correction :
   Le style badge est appliqué uniquement au conteneur .value.
   Le .value-item reste neutre pour éviter le double badge.
   ========================================================= */

.card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(1) {
  display: inline-flex;
  width: fit-content;
  margin-bottom: var(--wp--preset--spacing--sm);
}

/* Badge principal */
.card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(1) .value {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: fit-content;
  min-width: 66px;
  min-height: 26px;

  padding: 0 14px;

  border: 2px solid var(--wp--preset--color--white);
  border-radius: var(--wp--custom--radius--full);

  background: var(--wp--preset--color--accent-3);
  color: var(--wp--preset--color--white);

  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--meta);
  font-weight: var(--wp--custom--font-weight--semibold);
  line-height: 1;

  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}

/* Élément interne neutre : évite le double badge */
.card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(1) .value-item {
  display: inline;
  padding: 0;
  margin: 0;

  border: 0;
  border-radius: 0;

  background: transparent;
  color: inherit;

  font: inherit;
  line-height: inherit;
  text-transform: inherit;
}

/* =========================================================
   02. Nom du jeu = titre principal
   Deuxième champ MFB dans la card
   ========================================================= */

.card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(2) {
  margin-bottom: var(--wp--preset--spacing--lg);
}

.card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(2) .value {
  color: var(--wp--preset--color--contrast);

  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--h2);
  font-weight: var(--wp--custom--font-weight--bold);
  line-height: var(--wp--custom--line-height--heading);
}

/* =========================================================
   03. Informations du jeu
   Champs avec préfixe + valeur
   ========================================================= */

.card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(n + 3) {
  display: grid;
  grid-template-columns: minmax(150px, 220px) 1fr;
  column-gap: var(--wp--preset--spacing--md);
  row-gap: var(--wp--preset--spacing--xs);

  margin-bottom: var(--wp--preset--spacing--sm);
  padding-bottom: var(--wp--preset--spacing--sm);

  border-bottom: 1px solid var(--wp--preset--color--accent-5);

  color: var(--wp--preset--color--contrast);
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--body);
  line-height: var(--wp--custom--line-height--body);
}

/* Libellé explicatif */
.card_info_jeu .prefix {
  color: var(--wp--preset--color--contrast-2);

  font-size: var(--wp--preset--font-size--small);
  font-weight: var(--wp--custom--font-weight--semibold);
  line-height: var(--wp--custom--line-height--compact);

  text-transform: none;
}

/* Valeur du champ */
.card_info_jeu .value {
  color: var(--wp--preset--color--contrast);

  font-size: var(--wp--preset--font-size--body);
  font-weight: var(--wp--custom--font-weight--semibold);
  line-height: var(--wp--custom--line-height--compact);
}

/* Dernière ligne d'information avant les points forts/faibles */
.card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(9) {
  margin-bottom: var(--wp--preset--spacing--lg);
}

/* =========================================================
   04. Titres "Points forts" / "Points faibles"
   ========================================================= */

.card_info_jeu .wp-block-heading {
  margin-top: var(--wp--preset--spacing--lg);
  margin-bottom: var(--wp--preset--spacing--sm);

  color: var(--wp--preset--color--contrast);

  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--h4);
  font-weight: var(--wp--custom--font-weight--semibold);
  line-height: var(--wp--custom--line-height--heading);
}

/* =========================================================
   05. Listes points forts / points faibles
   ========================================================= */

.card_info_jeu .ludovox-points-list {
  display: grid;
  gap: var(--wp--preset--spacing--sm);

  margin: 0 0 var(--wp--preset--spacing--md) 0;
  padding: 0;

  list-style: none;
}

.card_info_jeu .ludovox-points-list li {
  position: relative;

  padding: 10px 12px 10px 36px;

  border: 1px solid var(--wp--preset--color--accent-5);
  border-radius: var(--wp--custom--radius--md);

  background: var(--wp--preset--color--base-2);
  color: var(--wp--preset--color--contrast);

  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--body);
  line-height: var(--wp--custom--line-height--body);
}

/* Icône visuelle points forts */
.card_info_jeu .ludovox-points-forts li::before {
  content: "+";

  position: absolute;
  top: 10px;
  left: 12px;

  color: var(--wp--preset--color--accent-1);

  font-weight: var(--wp--custom--font-weight--bold);
}

/* Icône visuelle points faibles */
.card_info_jeu .ludovox-points-faibles li::before {
  content: "–";

  position: absolute;
  top: 10px;
  left: 12px;

  color: var(--wp--preset--color--contrast-3);

  font-weight: var(--wp--custom--font-weight--bold);
}

/* =========================================================
   06. Responsive
   ========================================================= */

@media (max-width: 782px) {
  .card_info_jeu {
    padding: var(--wp--preset--spacing--md);
    border-radius: var(--wp--custom--radius--md);
  }

  .card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(2) .value {
    font-size: var(--wp--preset--font-size--h3);
  }

  .card_info_jeu > .wp-block-mfb-meta-field-block:nth-of-type(n + 3) {
    grid-template-columns: 1fr;
    row-gap: 2px;
  }

  .card_info_jeu .prefix {
    font-size: var(--wp--preset--font-size--meta);
  }
}

/* =========================================================
   Badges format de contenu
   Bloc : core/post-terms
   Taxonomie : format_contenu

   Objectif :
   - texte blanc
   - fond teal accent-1
   - bordure teal claire accent-5
   - texte centré
   - uppercase
   - taille meta
   ========================================================= */

.taxonomy-format_contenu.wp-block-post-terms {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;

  gap: 8px !important;

  width: fit-content !important;
  max-width: 100% !important;

  margin: 0 0 var(--wp--preset--spacing--sm) 0 !important;
  padding: 0 !important;

  line-height: 1 !important;
  text-align: left !important;
}

/* Cache la virgule automatique entre plusieurs termes */
.taxonomy-format_contenu.wp-block-post-terms .wp-block-post-terms__separator {
  display: none !important;
}

/* Badge */
.taxonomy-format_contenu.wp-block-post-terms a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: fit-content !important;
  min-width: 66px !important;
  min-height: 26px !important;

  margin: 0 !important;
  padding: 5px 12px !important;

  border: 1px solid var(--wp--preset--color--accent-5) !important;
  border-radius: var(--wp--custom--radius--full) !important;

  background: var(--wp--preset--color--accent-1) !important;
  color: var(--wp--preset--color--white) !important;

  font-family: var(--wp--preset--font-family--body) !important;
  font-size: var(--wp--preset--font-size--meta) !important;
  font-weight: var(--wp--custom--font-weight--semibold) !important;
  line-height: 1 !important;

  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;

  box-sizing: border-box !important;
}

/* Hover */
.taxonomy-format_contenu.wp-block-post-terms a:hover {
  background: var(--wp--preset--color--accent-2) !important;
  border-color: var(--wp--preset--color--accent-5) !important;
  color: var(--wp--preset--color--white) !important;
  text-decoration: none !important;
}

/* ---------------------------------------------------------
   Page À propos — Staff
--------------------------------------------------------- */

.ludovox-staff-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.ludovox-staff-card {
  background: var(--wp--preset--color--base-2);
  border: 1px solid var(--wp--preset--color--accent-5);
  border-radius: var(--wp--custom--radius--md);
  padding: 24px;
}

.ludovox-staff-card__image {
  width: 96px;
  height: 96px;
  margin-bottom: 16px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--wp--preset--color--accent-4);
}

.ludovox-staff-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ludovox-staff-card__name {
  margin: 0 0 4px;
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--h4);
  line-height: var(--wp--custom--line-height--heading);
  color: var(--wp--preset--color--contrast);
}

.ludovox-staff-card__role {
  margin: 0 0 12px;
  color: var(--wp--preset--color--accent-1);
  font-size: var(--wp--preset--font-size--small);
  font-weight: var(--wp--custom--font-weight--semibold);
}

.ludovox-staff-card__description {
  margin: 0 0 16px;
  color: var(--wp--preset--color--contrast-2);
  font-size: var(--wp--preset--font-size--small);
  line-height: var(--wp--custom--line-height--body);
}

.ludovox-staff-card__link {
  color: var(--wp--preset--color--accent-1);
  font-size: var(--wp--preset--font-size--small);
  font-weight: var(--wp--custom--font-weight--semibold);
  text-decoration: none;
}

.ludovox-staff-card__link:hover {
  color: var(--wp--preset--color--accent-2);
}

/* ---------------------------------------------------------
   Page À propos — Partenaires
--------------------------------------------------------- */

.ludovox-partenaires-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.ludovox-partenaire-card {
  background: var(--wp--preset--color--base-2);
  border: 1px solid var(--wp--preset--color--accent-5);
  border-radius: var(--wp--custom--radius--md);
  padding: 24px;
}

.ludovox-partenaire-card__logo {
  width: 100%;
  height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  padding: 16px;
  border-radius: var(--wp--custom--radius--sm);
  background: var(--wp--preset--color--white);
}

.ludovox-partenaire-card__logo img {
  max-width: 100%;
  max-height: 64px;
  object-fit: contain;
}

.ludovox-partenaire-card__name {
  margin: 0 0 4px;
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--h4);
  color: var(--wp--preset--color--contrast);
}

.ludovox-partenaire-card__type {
  margin: 0 0 12px;
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--wp--preset--color--accent-4);
  color: var(--wp--preset--color--accent-3);
  font-size: var(--wp--preset--font-size--meta);
  font-weight: var(--wp--custom--font-weight--semibold);
  text-transform: uppercase;
}

.ludovox-partenaire-card__description {
  margin: 0 0 16px;
  color: var(--wp--preset--color--contrast-2);
  font-size: var(--wp--preset--font-size--small);
  line-height: var(--wp--custom--line-height--body);
}

.ludovox-partenaire-card__link {
  color: var(--wp--preset--color--accent-1);
  font-size: var(--wp--preset--font-size--small);
  font-weight: var(--wp--custom--font-weight--semibold);
  text-decoration: none;
}

.ludovox-partenaire-card__link:hover {
  color: var(--wp--preset--color--accent-2);
}

/* ---------------------------------------------------------
   Responsive
--------------------------------------------------------- */

@media (max-width: 1024px) {
  .ludovox-staff-grid,
  .ludovox-partenaires-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .ludovox-staff-grid,
  .ludovox-partenaires-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   WPForms — Ludovox — Formulaire contact À propos
   Formulaire : #wpforms-522
   Objectif : largeur complète + alignement propre
========================================================= */

/* ---------------------------------------------------------
   1. Conteneur global
--------------------------------------------------------- */

.wp-block-group:has(#wpforms-522) {
  width: 100%;
  max-width: 100%;
}

#wpforms-522.wpforms-container,
div.wpforms-container-full#wpforms-522 {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 40px !important;
  background: var(--wp--preset--color--base-2, #fafafa) !important;
  border: 1px solid var(--wp--preset--color--accent-5, #b8e5e5) !important;
  border-radius: 20px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

/* Reset box-sizing interne */
#wpforms-522,
#wpforms-522 * {
  box-sizing: border-box;
}

/* Formulaire */
#wpforms-522 form.wpforms-form {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Supprime les paragraphes et br parasites injectés */
#wpforms-522 p,
#wpforms-522 form > p,
#wpforms-522 .wpforms-submit-container br {
  display: none !important;
}

/* Masque les champs anti-spam / honeypot */
#wpforms-522-field_4-container,
#wpforms-522-field_5-container {
  display: none !important;
}

/* ---------------------------------------------------------
   2. Conteneur des champs
--------------------------------------------------------- */

#wpforms-522 .wpforms-field-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Chaque champ prend toute la largeur */
#wpforms-522 .wpforms-field {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 28px 0 !important;
  padding: 0 !important;
  clear: both !important;
}

/* Dernier champ avant le bouton */
#wpforms-522 .wpforms-field:last-child {
  margin-bottom: 0 !important;
}

/* Neutralise les largeurs WPForms medium */
#wpforms-522 .wpforms-field-medium,
#wpforms-522 input.wpforms-field-medium,
#wpforms-522 textarea.wpforms-field-medium,
#wpforms-522 .wpforms-field-row.wpforms-field-medium,
div.wpforms-container-full#wpforms-522 .wpforms-form input.wpforms-field-medium,
div.wpforms-container-full#wpforms-522
  .wpforms-form
  textarea.wpforms-field-medium,
div.wpforms-container-full#wpforms-522
  .wpforms-form
  .wpforms-field-row.wpforms-field-medium {
  width: 100% !important;
  max-width: 100% !important;
}

/* ---------------------------------------------------------
   3. Champ Prénom et Nom
--------------------------------------------------------- */

#wpforms-522 fieldset {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Ligne Prénom + Nom */
#wpforms-522 .wpforms-field-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Colonnes Prénom / Nom */
#wpforms-522 .wpforms-field-row-block,
#wpforms-522 .wpforms-field-row-block.wpforms-one-half,
#wpforms-522 .wpforms-field-row-block.wpforms-first {
  flex: 1 1 0 !important;
  width: 50% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* Inputs dans Prénom / Nom */
#wpforms-522 .wpforms-field-row-block input {
  width: 100% !important;
  max-width: 100% !important;
}

/* ---------------------------------------------------------
   4. Labels
--------------------------------------------------------- */

#wpforms-522 .wpforms-field-label,
#wpforms-522 legend.wpforms-field-label {
  display: block !important;
  width: 100% !important;
  margin: 0 0 12px 0 !important;
  padding: 0 !important;
  color: var(--wp--preset--color--contrast, #1f1c1c) !important;
  font-family: var(
    --wp--preset--font-family--body,
    "Source Sans 3",
    sans-serif
  ) !important;
  font-size: var(--wp--preset--font-size--body-large, 20px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

/* Astérisque obligatoire */
#wpforms-522 .wpforms-required-label {
  color: var(--wp--preset--color--accent-1, #008080) !important;
  font-weight: 700 !important;
}

/* Sous-labels Prénom / Nom */
#wpforms-522 .wpforms-field-sublabel {
  display: block !important;
  margin: 8px 0 0 0 !important;
  padding: 0 !important;
  color: var(--wp--preset--color--contrast-3, #8c8c8c) !important;
  font-family: var(
    --wp--preset--font-family--body,
    "Source Sans 3",
    sans-serif
  ) !important;
  font-size: var(--wp--preset--font-size--small, 14px) !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

/* ---------------------------------------------------------
   5. Champs
--------------------------------------------------------- */

#wpforms-522 input[type="text"],
#wpforms-522 input[type="email"],
#wpforms-522 textarea,
div.wpforms-container-full#wpforms-522 .wpforms-form input[type="text"],
div.wpforms-container-full#wpforms-522 .wpforms-form input[type="email"],
div.wpforms-container-full#wpforms-522 .wpforms-form textarea {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 12px 16px !important;
  color: var(--wp--preset--color--contrast, #1f1c1c) !important;
  background: #ffffff !important;
  border: 1px solid var(--wp--preset--color--accent-5, #b8e5e5) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-family: var(
    --wp--preset--font-family--body,
    "Source Sans 3",
    sans-serif
  ) !important;
  font-size: var(--wp--preset--font-size--body, 17px) !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  appearance: none !important;
}

/* Textarea */
#wpforms-522 textarea,
div.wpforms-container-full#wpforms-522 .wpforms-form textarea {
  min-height: 220px !important;
  resize: vertical !important;
}

/* Focus */
#wpforms-522 input[type="text"]:focus,
#wpforms-522 input[type="email"]:focus,
#wpforms-522 textarea:focus {
  outline: none !important;
  border-color: var(--wp--preset--color--accent-1, #008080) !important;
  box-shadow: 0 0 0 3px rgba(0, 128, 128, 0.16) !important;
}

/* ---------------------------------------------------------
   6. Bouton principal
--------------------------------------------------------- */

#wpforms-522 .wpforms-submit-container,
div.wpforms-container-full#wpforms-522 .wpforms-submit-container {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  width: 100% !important;
  margin: 40px 0 0 0 !important;
  padding: 0 !important;
}

/* Bouton conforme au bouton principal Ludovox */
#wpforms-522 button[type="submit"],
#wpforms-522 .wpforms-submit,
div.wpforms-container-full#wpforms-522 .wpforms-form button[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 14px 32px !important;
  color: #ffffff !important;
  background: var(--wp--preset--color--accent-1, #008080) !important;
  border: 1px solid var(--wp--preset--color--accent-1, #008080) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-family: var(
    --wp--preset--font-family--body,
    "Source Sans 3",
    sans-serif
  ) !important;
  font-size: var(--wp--preset--font-size--button, 14px) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition:
    background-color 160ms ease,
    border-color 160ms ease,
    transform 160ms ease !important;
}

#wpforms-522 button[type="submit"]:hover,
#wpforms-522 .wpforms-submit:hover,
div.wpforms-container-full#wpforms-522
  .wpforms-form
  button[type="submit"]:hover {
  color: #ffffff !important;
  background: var(--wp--preset--color--accent-2, #006b6b) !important;
  border-color: var(--wp--preset--color--accent-2, #006b6b) !important;
  transform: translateY(-1px);
}

#wpforms-522 button[type="submit"]:focus-visible,
#wpforms-522 .wpforms-submit:focus-visible {
  outline: 3px solid rgba(0, 128, 128, 0.25) !important;
  outline-offset: 3px !important;
}

/* ---------------------------------------------------------
   7. Responsive
--------------------------------------------------------- */

@media (max-width: 768px) {
  #wpforms-522.wpforms-container,
  div.wpforms-container-full#wpforms-522 {
    padding: 24px !important;
    border-radius: 16px !important;
  }

  #wpforms-522 .wpforms-field-row {
    flex-direction: column !important;
    gap: 20px !important;
  }

  #wpforms-522 .wpforms-field-row-block,
  #wpforms-522 .wpforms-field-row-block.wpforms-one-half,
  #wpforms-522 .wpforms-field-row-block.wpforms-first {
    width: 100% !important;
  }

  #wpforms-522 .wpforms-field-label,
  #wpforms-522 legend.wpforms-field-label {
    font-size: 18px !important;
  }

  #wpforms-522 button[type="submit"],
  #wpforms-522 .wpforms-submit {
    width: 100% !important;
  }
}
