/*
Theme Name: Oh My Food
Description: Child theme for twentytwentyone. You can now safely customize it and not risk losing your customizations.
Author: Eric - Oh My Food
Author URI: https://oh-my-food.fr
Template: twentytwentyone
Version: 1.0
*/
:root{
  --c-bg: #FFF8F1;
  --c-surface: #EAD5D0;
  --c-title: #111827;
  --c-text: #111827;
  --c-muted: #4B5563;
  --c-brand: #7A1E2D;
  --c-tag: #6B7D2B;

  --radius: 12px;
  --shadow: 0 10px 25px rgba(17,24,39,.10);
  --container: 1120px;

  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --global--font-size-base: 16px;	
}
body{
  background: var(--c-bg);
  color: var(--c-text);
  margin: 0;
}
/*adaptation du header*/
.site-header{
  background: #ffffff;
  backdrop-filter: blur(6px);
}
.site-main{
	background: #FFF8F1;
}
.main-nav ul{ list-style:none; display:flex; gap: 1rem; margin:0; padding:0; }
.main-nav a{
  padding:.45rem .85rem;
  border-radius: 15px;
  color: var(--c-title);
/*text-decoration:none;*/
}
.main-nav .current-menu-item > a{
  background: var(--c-brand);
  color:#fff;
}
/* Newsletter */

.newsletter-box {
    display: block; /* Cache newsletter box */
}
.newsletter-title{
	text-align:center;
}
/*gestion des Fonts*/
:root{
  --font-title: "Cormorant Garamond", serif;
  --font-body: "Source Sans 3", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
body{ font-family: var(--font-body); }
h1,h2,h3{ font-family: var(--font-title); color: var(--c-title); }
/*Composant UI*/
.container{ width: min(100% - 2rem, var(--container)); margin-inline:auto;}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.7rem 1.1rem; border-radius: 15px;
  border:1px solid transparent; cursor:pointer;
  font-weight:600; text-decoration:none;
  font-family: var(--font-body);
  margin-top: 1.1rem;
}
.btn--primary{ background: var(--c-brand); color:#fff; box-shadow: var(--shadow); }
.btn--ghost{ background:#fff; color: var(--c-title); border-color: rgba(17,24,39,.15); }

.card{
  background:#fff; border-radius: var(--radius);
  box-shadow: var(--shadow); overflow:hidden;
}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline: 2px solid var(--c-brand);
  outline-offset: 2px;
}
/*carte restaurant ronde*/
.card--restaurant .card__thumb{
  width: 200px;
  height: 200px;
  border-radius: 50%;/*rend le cadre circulaire*/
  object-fit: cover;
  display: block;
  margin: 0 auto var(--space-2);
  /* cadre plus fin + “ring” */
  border: 4px solid rgba(17,24,39,.08);
  background: #fff;
  box-shadow: 0 10px 25px rgba(17,24,39,.12);	
}
.card__thumb .wp-post-image{
  width: 200px;
  height: 200px;
  border-radius: 50%;/*rend le cadre circulaire*/
  object-fit: cover;
  display: block;
  margin: 0 auto var(--space-2);
  /* cadre plus fin + “ring” */
  border: 4px solid rgba(17,24,39,.08);
  background: #fff;
  box-shadow: 0 10px 25px rgba(17,24,39,.12);	
}
.card__thumb{
	margin-top: 1.1rem;
}

/*carte de valeur*/
.card--value{ padding: var(--space-3); text-align:center; }
/*Gestion responsive*/
.grid-4{
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(4, minmax(220px, 1fr));
  justify-content: center;
}
.grid--3{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }

@media (max-width: 1024px){
  .grid-4{ grid-template-columns: repeat(2, 1fr); }
  .menu-cards{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px){
  .grid-4, .grid--3, .menu-cards{ grid-template-columns: 1fr; }
}
/*pop-up concours*/
.popup-overlay{
  position:fixed; inset:0; background: rgba(17,24,39,.55);
}
.popup{
  position:fixed; inset:auto; top:50%; left:50%;
  transform: translate(-50%,-50%);
  width: min(520px, calc(100% - 2rem));
  background: var(--c-bg);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: var(--space-4);
}
.popup h2{ font-family: var(--font-title); margin-top:0; }
/*personnalisation du header*/
.omf-container{
  width: min(100% - 2rem, 1120px);
  margin-inline: auto;
}

.omf-header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 1rem;
  padding: 1.25rem 0;
}

/* Logo */
.omf-brand{
  display:flex;
  align-items:center;
  text-decoration:none;
}
.omf-brand img{
  display:block;
  max-height: 200px;
  width:auto;
  height:auto;
}
/* Menu */
.omf-nav__list{
  list-style:none;
  display:flex;
  align-items:center;
  gap: 1rem;
  margin:0;
  padding:0;
}
.omf-nav__list a{
  text-decoration:none;
  padding: .45rem .85rem;
  padding:.7rem 1.1rem; border-radius: 15px;
  color: #111827;
  font-weight: 600;
  text-decoration: none;
  font-family: var(--font-body);	
}

/* onglet actif (WordPress ajoute current-menu-item) */
.omf-nav__list .current-menu-item > a{
  background:#7A1E2D;
  color:#fff;
}
/*style specifique page accueil*/
/* ===== HERO (Accueil) : 2 colonnes desktop, 1 colonne mobile ===== */

.hero{
  padding: var(--space-5) 0;
  background:linear-gradient(to bottom, #FFF8F0 0%, #FFFDF5 100%);
}

/* Le parent des 2 colonnes */
.hero__grid{
  display: grid;
  grid-template-columns: 1.05fr 1.2fr; /* texte / image */
  align-items: center;
  gap: var(--space-4);
  border-radius: var(--radius);
  padding: var(--space-5);
}

/* Colonne texte */
.hero__content{
  max-width: 520px; /* confort de lecture */
}

/* Colonne image */
.hero__media{
  justify-self: end;
  width: 100%;
}

/* image */
.hero__image{
  width: 100%;
  max-width: 560px;
  height: auto;
  border-radius: 14px;
  box-shadow: var(--shadow);
  display: block;
  object-fit: cover;
}
.hero__lead{
	text-align:left;
}
/* ===== Responsive ===== */

/* Tablette : 2 colonnes mais plus serré */
@media (max-width: 1024px){
  .hero__grid{
    grid-template-columns: 1fr 1fr;
    padding: var(--space-4);
  }
  .hero__image{
    max-width: 100%;
  }
}

/* Mobile : 1 colonne */
@media (max-width: 640px){
  .hero{
    padding: var(--space-4) 0;
  }
  .hero__grid{
    grid-template-columns: 1fr;
    padding: var(--space-4);
  }
  .hero__media{
    justify-self: start;
  }
}

/*surcharge typo*/
h1{ font-size:40px; line-height:1.15; margin: 0 0 .5rem; }
h2{ font-size:28px; line-height:1.2;  margin: 0 0 .5rem; }
h3{ font-size:22px; line-height:1.25; margin: 0 0 .4rem; }
p{ line-height:1.6; }

/*========================Section==================*/
.section{
	margin-top: 5.0rem;
	margin-bottom:6.0rem;
}
.section__head, .grid, .grid-4, .cta-band{
	text-align:center;
}
.card--restaurant, .card--value{
	margin-top:2.1rem;
	padding-top: 2.1rem;
}
.card--restaurant .btn{
	margin-bottom:1.1rem;
	width:80%;
}
/*========================Section--surface==================*/
.section--surface{
	background: #ffffff;
	padding-top: 6.0rem;
	padding-bottom:6.0rem;
	margin-bottom:0.0rem;
}
.section__head header{
	margin-top:6.0rem;	
}
/*card__icon*/
.card__icon{
	width: 60px;
  	height: 60px;
  	border-radius: 50%;
  	display: grid;
  	place-items: center;

 	margin: 0 auto var(--space-2);

  	box-sizing: border-box; 
  	border: 4px solid rgba(17,24,39,.08);
  	background: #7a1e2d;
  	box-shadow: 0 10px 25px rgba(17,24,39,.12);

  	padding: 5px; /*taille de l'icone*/
	/* Taille de l'emoji */
    font-size: 30px;     /* <-- augmentez ici (ex: 34px, 38px...) */
    line-height: 1;      /* évite les décalages verticaux */
}
/* L’icône image (emoji svg) à l’intérieur */
.card__icon img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
/*===============Restaurant===================*/
/*menu-card*/
.menu-card img{
  width: 200px;
  height: 200px;
  border-radius: 50%;/*rend le cadre circulaire*/
  object-fit: cover;
  display: block;
  margin: 0 auto var(--space-2);
  /* cadre plus fin + “ring” */
  border: 4px solid rgba(17,24,39,.08);
  background: #fff;
  box-shadow: 0 10px 25px rgba(17,24,39,.12);
}
.menu-block__head{
	text-align:center;
	margin-top:2rem;
	margin-bottom: 2rem;
}

.cta-band{
	background:linear-gradient(to right, #7A1E2D 0%, #111111 100%);
	color:#FFFFFF;
	padding-top:6.0rem;
	padding-bottom:6.rem;
	margin-bottom: 6.0rem;
}
.cta-band .btn{
	color:#7A1E2D;
	/*margin-top:6.0rem;*/
	padding-bottom:6.rem;
	margin-bottom: 6.0rem;
}
/*surcharge footer*/
.powered-by a{
	margin-right:5px;
}
/*page à propos*/
.page-head__inner{
	text-align:center;
}
.section {
	margin-top:3.0rem;
	width: 80%;
    margin-left: auto;
    margin-right: auto;
}
.container .about-card div{
	margin: 20px 20px 20px 20px;
	padding: 20px 20px 20px 20px; 
}
/*formulaire de reservation*/
/* 1) Le conteneur peut rester centré pour le TITRE, etc. */
.reservation__card{
  text-align: center;
  background: none;
  border-radius: 0;   /* "none" n'existe pas */
  box-shadow: none;
  overflow: visible;  /* "none" n'existe pas */
}

/* 2) On centre le BLOC formulaire (pas chaque champ séparément) */
.reservation__form .wpcf7{
  max-width: 420px;   /* largeur maquette (ajustez si besoin) */
  width: 100%;
  margin: 0 auto;     /* centre le bloc */
}

/*  3) À l’intérieur du formulaire : tout à gauche */
.reservation__form .wpcf7 form{
  text-align: left !important; /* neutralise le text-align:center du parent */
}

/* CF7 : le wrap des contrôles doit être bloc pour que width:100% fonctionne proprement */
.reservation__form .wpcf7 .wpcf7-form-control-wrap{
  display: block;
}
.reservation__form .wpcf7 .wpcf7-form-control-wrap{
  display: block;
}

/* Labels */
.reservation__form .wpcf7 form p label{
  display: block;
  width: 100%;
  text-align: left !important;
  margin-bottom: .35rem;
  font-weight: 600;
}

/* Champs */
.reservation__form .wpcf7 input[type="text"],
.reservation__form .wpcf7 input[type="email"],
.reservation__form .wpcf7 input[type="date"],
.reservation__form .wpcf7 input[type="time"],
.reservation__form .wpcf7 input[type="number"],
.reservation__form .wpcf7 textarea,
.reservation__form .wpcf7 select{
  width: 100%;
  max-width: 100%;   /* puisque le bloc .wpcf7 est déjà limité à 420px */
  box-sizing: border-box;
  border-color:#FFF8F1;
  border-radius:15px;
}
.reservation__form .wpcf7-submit input[type="submit"]{
	text-align: center !important; 
	background-color:#781e2f
}
.reservation__form .wpcf7-form-control .wpcf7-submit input{
	text-align: center !important; 
	border-right-width: 150px;
  	border-right-style: solid;
  	border-left-width: 150px;	
}
.reservation__form .wpcf7 form p:has(input.wpcf7-submit){
  	text-align: center;
	border-right-width: 150px;
	
  }
.reservation__form .wpcf7 .wpcf7-spinner{
	/*inutile et géne pour le centrage du bouton de validation*/
	display:none;	
}
.reservation__form .wpcf7 form input[type="submit"]:not(:hover):not(:active):not(.has-background){
  	text-align: center;
	border:none;
  	background-color: #781e2f !important;
	border-radius: 15px;
	margin-bottom: 10px;
	width:100%
}
.reservation__form .wpcf7 form input[type="submit"]:hover{
  	text-align: center;
  	border:none;
	color:#FFFFFF;
	background-color: #781e2f !important;
	border-radius: 15px;
	margin-bottom: 10px;
	width:100%
}
.plus {
	text-align:center;
}
.reservation__form.card{
  margin-bottom: -94px;
  margin-left: -15px;
  margin-right: -15px;
  margin-top: 0px;
}
.menu-card__title{
	height: 4rem;
	margin-bottom: 0.6rem;
	margin-left:0.5rem;
	margin-right:0.5rem;
}
.menu-card__price{
	margin: 0.5rem 0 0;
  	width: 100%;
  	text-align: center;
}
.menu-card__price .price{
  	display: inline-block;
  	padding: 2px 8px;
  	border-radius: 999px;
  	font-weight: 600;
 	line-height: 1.2;
	color:#4c3031;
	background-color:#e7d7d5;
}
.menu-card__text{
	text-align:center;
	margin-left:0.5rem;
	margin-right:0.5rem;
	padding: 0px 10px 0px 10px;
}
/*==================Testimonial=========================*/
/* SECTION (fond page) */
.testimonial-band{
  padding: 48px 16px;
}

/* Le bloc (bandeau) */
.testimonial-band__inner{
  max-width: 980px;
  margin: 0 auto;
  padding: 28px 32px;

  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(17, 24, 39, .18);

  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 26px;
  align-items: center;

  /* Dégradé bordeaux -> bleu nuit */
  background: linear-gradient(90deg, #7a1e2d 0%, #1a2236 100%);
  color: rgba(255,255,255,.92);
}

/* Avatar */

/* Si c’est un <img>, gardez la même classe et ajoutez : */
img.testimonial-band__avatar{
  width: 78px;
  height: 78px;
  border-radius: 50%;
  border: 3px solid rgba(255,255,255,.55);
  box-shadow: 0 10px 25px rgba(0,0,0,.22);
  object-fit: cover;
  display: block;
}
/* Contenu */
.testimonial-band__title{
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .2px;
  color: rgba(255,255,255,.95);
}

/* Citation */
.testimonial-band__quote{
  margin: 0 0 10px;
  font-size: 18px;
  line-height: 1.55;
  color: rgba(255,255,255,.92);
}

/* Meta (auteur) */
.testimonial-band__meta{
  margin: 0;
  font-size: 13px;
  color: rgba(255,255,255,.75);
}

/* Responsive */
@media (max-width: 680px){
  .testimonial-band__inner{
    grid-template-columns: 1fr;
    text-align: left;
    padding: 22px 18px;
  }
  .testimonial-band__avatar{
    margin: 0 0 6px;
  }
  .testimonial-band__quote{
    font-size: 16px;
  }
}
/* =========================
   POPUP CONCOURS (OMF) - Responsive + scroll interne
   ========================= */

.omf-popup{
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;
}

.omf-popup.is-open{
  display: block;
}

/* Overlay */
.omf-popup__overlay{
  position: absolute;
  inset: 0;
  background: rgba(17,24,39,.55);
  border: 0;
  padding: 0;
}

/* Le dialog devient une "boîte" qui ne dépasse jamais l'écran */
.omf-popup__dialog{
  position: relative;

  /* largeur */
  width: min(980px, calc(100% - 2rem));

  /* centrage */
  margin: 5vh auto;

  /* hauteur max -> clé pour le responsive */
  max-height: 90vh;

  /* si le contenu est trop haut, on scroll DANS la popup */
  overflow: auto;

  background: #fff;
  border-radius: 16px;
  box-shadow: 0 18px 60px rgba(0,0,0,.25);
}

/* Pour iOS/Android : scroll fluide dans la popup */
.omf-popup__dialog{
  -webkit-overflow-scrolling: touch;
}
/*  texte du formulaire */
.omf-popup__form h2,
.omf-popup__form p{
	align-items:center;
	text-align: center;
}
.omf-popup__form input{
	border:none;
}
.omf-popup__form input[type="submit"]{
	text-align: center !important; 
	background-color:#781e2f
}
.omf-popup__form form input[type="submit"]:not(:hover):not(:active):not(.has-background){
  	text-align: center;
	border:none;
  	background-color: #781e2f !important;
	border-radius: 15px;
	margin-bottom: 10px;
	width:100%
}
.omf-popup__form form input[type="submit"]:hover{
  	text-align: center;
  	border:none;
	color:#FFFFFF;
	background-color: #781e2f !important;
	border-radius: 15px;
	margin-bottom: 10px;
	width:100%
}
/* Bouton fermer toujours visible */
.omf-popup__close{
  position: sticky; /* reste visible en haut quand on scroll le contenu */
  top: 0;
  margin-left: auto;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border: 0;
  background:#fff !important;
  cursor: pointer;
  font-size: 30px;
}
/* Au survol (optionnel) */
.omf-popup__close:hover{
  background: #fff !important;
  border-color: rgba(17,24,39,.25);
}
/* Focus clavier (accessibilité) */
.omf-popup__close:focus-visible{
  outline: 2px solid #7A1E2D;
  outline-offset: 3px;
}

/* Layout interne */
.omf-popup__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

/* Zone roue */
.omf-popup__wheel{
  background: #FFF8F1;
  padding: 24px;
  display: grid;
  place-items: center;
  min-height: 240px;
}

.omf-popup__wheel img{
  max-width: 100%;
  height: auto;
  display: block;
}

/* Zone contenu */
.omf-popup__content{
  padding: 24px;
}

/* Mobile : 1 colonne */
@media (max-width: 820px){
  .omf-popup__dialog{
    margin: 2vh auto;
    max-height: 94vh;
  }

  .omf-popup__grid{
    grid-template-columns: 1fr;
  }

  .omf-popup__wheel{
    padding: 16px;
  }

  .omf-popup__content{
    padding: 16px;
  }
}
/* Empêche le scroll de la page quand la popup est ouverte */
.omf-no-scroll{
  overflow: hidden !important;
}
/* Zone scrollable */
.omf-popup__dialog{
  max-height: 90vh;
  overflow: auto;

  /* réserve de l'espace pour la scrollbar + respiration */
  padding-right: 18px; /* 16–24px selon rendu */
  box-sizing: border-box;
}

/* Bouton fermer */
.omf-popup__close{
  position: sticky;
  top: 0;

  /* on le pousse vers la gauche pour éviter la scrollbar */
  margin-left: auto;
  margin-right: 18px; /* même valeur que padding-right */

  z-index: 2; /* au-dessus du contenu */
}

/*form jeux concours*/
.jeux-concours .wpcf7-submit input[type="submit"]{
	text-align: center !important; 
	background-color:#781e2f;
}
.jeux-concours .wpcf7-form-control .wpcf7-submit input{
	text-align: center !important; 
	border-right-width: 150px;
  	border-right-style: solid;
  	border-left-width: 150px;	
}
/* =========================================================
   OMF — CARROUSEL RESTAURANTS
   Objectifs :
   - Ne pas modifier #tables (id) ni .grid.grid-4 (classes)
   - Activer le carrousel uniquement si > N cartes visibles
   - Garantir : 4 cartes visibles desktop, 2 tablette, 1 mobile
   - Empêcher les “demi-cartes” (scroll par pas exact)
   - Flèches : chevron seul (sans fond), zone cliquable confortable
   ========================================================= */

/* Conteneur carrousel : référence de positionnement */
.omf-carousel{
  position: relative;
  /* On centre le viewport (qui aura une max-width calculée en JS) */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Viewport : c’est LUI qui coupe l’excédent (pas la page) */
.omf-carousel__viewport{
  position: relative;
  overflow: hidden;
  width: 100%;
  /* Le JS posera une max-width calculée (4 cartes + gaps) */
  margin-inline: auto;
}

/* -------------------------
   Boutons (chevron seul)
   ------------------------- */
.omf-carousel__btn{
  /* Important : on ne met PAS display:none ici,
     c’est .is-enabled qui gère l’affichage */
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;

  /* Zone cliquable confortable */
  width: 56px;
  height: 56px;
  border: 0;
  padding: 0;

  /* Chevron seul */
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  border-radius: 0 !important;

  /* On masque ‹ › du HTML (on garde l’accessibilité) */
  color: transparent;
  font-size: 0;
  line-height: 0;

  display: grid;
  place-items: center;

  cursor: pointer;
  user-select: none;
}

/* Chevron bordeaux (par défaut: flèche droite) */
.omf-carousel__btn::before{
  content: "";
  width: 18px;
  height: 18px;
  border-right: 5px solid #781e2f;
  border-bottom: 5px solid #781e2f;
  transform: rotate(-45deg);
}

/* Flèche gauche */
.omf-carousel__btn--prev::before{
  transform: rotate(135deg);
}

/* Positionnement :
   On colle les flèches au viewport, pas aux bords du container.
   Le JS injecte --omf-viewport-w (px). On calcule une valeur utilisable. */
.omf-carousel{
  --omf-viewport-w: 100%;
  --omf-vw: min(100%, var(--omf-viewport-w));
}
.omf-carousel__btn--prev{
  left: calc(50% - (var(--omf-vw) / 2) - 36px);
}
.omf-carousel__btn--next{
  left: calc(50% + (var(--omf-vw) / 2) + 36px - 56px);
}

/* Focus visible (clavier) */
.omf-carousel__btn:focus-visible{
  outline: 3px solid rgba(122,31,43,.35);
  outline-offset: 4px;
}

/* Feedback hover : seulement sur le chevron */
.omf-carousel__btn:hover::before{
  filter: brightness(.92);
}

/* -------------------------
   Activation / désactivation
   ------------------------- */
/* Par défaut : pas de carrousel, donc boutons cachés */
.omf-carousel__btn{ display: none; }

/* Le JS ajoute .is-enabled uniquement si nécessaire */
.omf-carousel.is-enabled .omf-carousel__btn{ display: grid; }

/* -------------------------
   Mode carrousel activé
   (#tables devient une piste scrollable horizontale)
   ------------------------- */
.omf-carousel.is-enabled #tables.grid.grid-4{
  /* On bascule de grid à flex uniquement en mode carrousel */
  display: flex;
  flex-wrap: nowrap;

  /* Le scroll se fait sur la piste */
  overflow-x: auto;
  overflow-y: hidden;

  /* Snap propre (aide, mais le JS assure surtout le pas exact) */
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;

  /* On conserve votre gap existant : gap fonctionne aussi en flex */
  /* NOTE : on ne redéfinit PAS gap ici */

  /* Évite les surprises de centrage */
  justify-content: flex-start !important;

  /* Masque scrollbar (optionnel) */
  scrollbar-width: none;
}
.omf-carousel.is-enabled #tables.grid.grid-4::-webkit-scrollbar{
  height: 0;
}

/* Chaque carte “snap” au bord gauche */
.omf-carousel.is-enabled #tables.grid.grid-4 > .card--restaurant{
  scroll-snap-align: start;
  flex: 0 0 auto; /* le JS fixera la largeur exacte de chaque carte */
}

/* -------------------------
   Ajustements responsive
   (si vous voulez réduire la zone cliquable sur petit écran)
   ------------------------- */
@media (max-width: 844px){
  .omf-carousel__btn{
    width: 48px;
    height: 48px;
  }
  .omf-carousel__btn::before{
    width: 16px;
    height: 16px;
    border-right-width: 4px;
    border-bottom-width: 4px;
  }
}

/* Exemple “entre deux largeurs” (600 à 844px) */
@media (min-width: 600px) and (max-width: 844px){
  .omf-carousel__btn{
    /* exemple : +padding si vous repassez sur un fond,
       sinon inutile avec chevron seul */
    /* padding: 6px; */
  }
}
/* =========================================================
   FOOTER OMF — logo + liens sur 1 ligne, newsletter centrée dessous
   ========================================================= */

.site-footer .site-info{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 2.2rem 1rem;
  background: #fff;
}

.site-footer .site-name{
  flex: 0 0 auto;
}

.site-footer .powered-by{
  flex: 0 0 auto;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.site-footer .powered-by a{
  text-decoration: underline;
}

/* Newsletter sous logo + liens */
.site-footer .newsletter-box{
  flex: 0 0 100%;
  order: 10;
  text-align: center;
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(17,24,39,.10);
}

.site-footer .newsletter-title{
  margin: 0 0 .35rem;
  font-family: var(--font-title);
  font-size: 22px;
}

.site-footer .newsletter-text{
  margin: 0 0 1rem;
  color: var(--c-muted);
  font-size: 14px;
}

/* ==========
   Newsletter CF7 “comme la popup”
   (champ centré + bouton bordeaux pleine largeur)
   ========== */

.site-footer .omf-newsletter{
  max-width: 520px;
  margin: 0 auto;
}

.site-footer .omf-newsletter form{
  margin: 0;
  text-align: center;
}

.site-footer .omf-newsletter input[type="email"],
.site-footer .omf-newsletter input[type="text"]{
  width: 100%;
  max-width: 420px;
  border: 1px solid rgba(17,24,39,.25);
  border-radius: 15px;
  padding: 12px 14px;
  background: #fff;
  box-sizing: border-box;
}

.site-footer .omf-newsletter input[type="submit"]{
  width: 100%;
  max-width: 520px;
  margin-top: .8rem;
  border: none;
  border-radius: 15px;
  padding: 14px 16px;
  background: var(--c-brand);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

.site-footer .omf-newsletter input[type="submit"]:hover{
  filter: brightness(1.05);
}

.site-footer .omf-newsletter .wpcf7-spinner{
  display: none;
}

/* Responsive : tout centré */
@media (max-width: 820px){
  .site-footer .site-info{
    justify-content: center;
    text-align: center;
  }

  .site-footer .site-name,
  .site-footer .powered-by{
    flex: 0 0 100%;
    justify-content: center;
  }

  .site-footer .powered-by{
    flex-wrap: wrap;
  }
}
