/* ============================================================
   Carte restaurant (modèle de boucle 57) — nouvelle charte
   Même structure que la carte d'origine, seul l'habillage change.
   Repères : ec3510e carte · be560a0 photo · efef82d cœur · 7d72b64 ouvert/fermé
   f681dbb corps · b546e86 nom · 609918b tags · c98d242 infos · 0a7ee1b note horaires
   816f46d « Site internet » · 78e8913/58f6da8 téléphone/livraison · 75e2458 « Voir la fiche »
   636b4e0 note Google · 1cb8c6f « Coup de cœur »
   ============================================================ */

.elementor-57 .boucle-resto {
    position: relative;
    height: 100%;
    display: flex !important;
    flex-direction: column;
    background: var(--om-surface, #fff) !important;
    border-radius: 22px !important;
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(84, 106, 121, .12);
    transition: transform .2s ease, box-shadow .2s ease;
}
.elementor-57 .boucle-resto:hover { transform: translateY(-3px); box-shadow: 0 18px 40px rgba(84, 106, 121, .18); }

/* Photo */
.elementor-57 .elementor-element-be560a0 { --border-radius: 0 !important; border-radius: 0 !important; }
.elementor-57 .elementor-element-1996fca img { height: 220px !important; border-radius: 0 !important; }

/* Cœur : rond corail, cœur blanc (plein quand c'est un favori) */
.elementor-57 .oumanger-coeur {
    width: 40px !important; height: 40px !important; border-radius: 50% !important;
    background: var(--Rouge, #D25E48) !important; box-shadow: 0 6px 14px rgba(31, 35, 40, .2) !important;
}
.elementor-57 .oumanger-coeur svg { width: 20px !important; height: 20px !important; fill: transparent !important; stroke: #fff !important; }
.elementor-57 .oumanger-coeur[aria-pressed="true"] svg { fill: #fff !important; }

/* Ouvert / fermé : pastille blanche en haut à droite */
.elementor-57 .elementor-element-7d72b64 {
    top: 12px !important; right: 12px !important; inset-block-start: 12px !important; inset-inline-end: 12px !important;
    padding: 6px 12px !important; border-radius: 10px !important; background: #fff !important;
    box-shadow: 0 4px 12px rgba(31, 35, 40, .12);
}
.elementor-57 .elementor-element-7d72b64 .elementor-icon-list-text {
    font-family: var(--dm-sans, "DM Sans"), system-ui, sans-serif !important; font-size: .875rem !important; font-weight: 600 !important; color: #1F2328 !important;
}
.elementor-57 .elementor-element-7d72b64 .elementor-icon-list-icon svg { width: 9px !important; height: 9px !important; }

/* « Coup de cœur » */
.elementor-57 .elementor-element-1cb8c6f { background: #1F2328 !important; box-shadow: 0 4px 12px rgba(31, 35, 40, .25); border-radius: 10px !important; padding: 6px 12px !important; top: 12px !important; left: 12px !important; }
.elementor-57 .elementor-element-1cb8c6f, .elementor-57 .elementor-element-1cb8c6f * { color: #fff !important; transition: background-color .2s ease; }
.elementor-57 .elementor-element-1cb8c6f:hover, .elementor-57 .elementor-element-1cb8c6f:focus-visible { background: var(--Rouge, #D25E48) !important; }
.elementor-57 .elementor-element-1cb8c6f svg, .elementor-57 .elementor-element-1cb8c6f svg * { fill: #fff !important; }
.elementor-57 .elementor-element-1cb8c6f p { font-family: var(--dm-sans, "DM Sans"), system-ui, sans-serif !important; font-size: .875rem !important; font-weight: 600 !important; }

/* Corps */
.elementor-57 .container-resto { flex: 1 1 auto; padding: 20px !important; gap: 14px !important; background: transparent !important; }
.elementor-57 .titre-resto { font-weight: 900 !important; letter-spacing: .01em; line-height: 1.1 !important; padding-right: 64px; }
.elementor-57 .tags-restaurant a {
    display: inline-flex; align-items: center; height: 24px; padding: 0 10px !important; border-radius: 999px !important;
    background: var(--corail-fonce, #C2513C) !important; color: #fff !important;
    font: 700 .6875rem/1 var(--dm-sans, "DM Sans"), system-ui, sans-serif !important; letter-spacing: .06em; text-transform: uppercase;
}

/* Infos (prix, adresse, horaires) */
.elementor-57 .elementor-element-c98d242 .elementor-icon-list-item { align-items: flex-start !important; }
.elementor-57 .elementor-element-c98d242 .elementor-icon-list-text,
.elementor-57 .elementor-element-c98d242 .elementor-icon-list-text * {
    font-family: var(--dm-sans, "DM Sans"), system-ui, sans-serif !important; font-size: .9375rem !important; font-weight: 400 !important;
    line-height: 1.45 !important; color: var(--texte-doux, #3A4650) !important;
}
.elementor-57 .elementor-element-c98d242 .elementor-icon-list-icon { margin-top: 3px; }
.elementor-57 .elementor-element-c98d242 .elementor-icon-list-icon svg { width: 14px !important; height: 14px !important; fill: var(--encre, #1F2328) !important; }
.elementor-57 [data-id="0a7ee1b"], .elementor-57 [data-id="0a7ee1b"] a {
    font-family: var(--dm-sans, "DM Sans"), system-ui, sans-serif !important; font-size: .75rem !important; color: var(--ardoise, #546A79) !important;
}

/* Note Google : en marron, comme la carte d'origine */
.elementor-57 .elementor-element-636b4e0 { background: var(--creme, #F2EEE6) !important; border-radius: 14px !important; }
.elementor-57 [data-id="2115e30"] { color: var(--Marron, #8A6A4F) !important; font-weight: 800 !important; }
.elementor-57 [data-id="010adc6"] { color: var(--Marron, #8A6A4F) !important; }

/* Boutons : disposition d'origine (icônes à gauche, boutons pleins), formes de la charte */
.elementor-57 .btn-bleu {
    display: inline-flex !important; align-items: center; justify-content: center;
    height: 46px; padding: 0 20px !important; box-sizing: border-box; border-radius: 14px !important;
    font: 800 1rem/1 var(--Bogart, "bogart"), Georgia, serif !important; white-space: nowrap;
    background: var(--Bleu, #108A8A) !important; color: #fff !important; border: 2px solid var(--Bleu, #108A8A) !important;
    transition: background .2s ease, border-color .2s ease;
}
.elementor-57 .btn-bleu:hover { background: var(--teal-fonce, #0B6E6E) !important; border-color: var(--teal-fonce, #0B6E6E) !important; color: #fff !important; }
.elementor-57 .icon-btn {
    width: 46px !important; height: 46px !important; flex: none; padding: 12px !important; box-sizing: border-box;
    border-radius: 50% !important; background: var(--om-surface, #fff) !important; border: 1.5px solid var(--Bleu, #108A8A) !important; color: var(--Bleu, #108A8A) !important;
}
.elementor-57 .icon-btn svg path { fill: currentColor !important; }
.elementor-57 .icon-btn:hover { background: var(--Bleu, #108A8A) !important; color: #fff !important; }

/* Tags : retour à la ligne plutôt que défilement */
.elementor-57 .elementor-element-609918b { flex-wrap: wrap !important; overflow: visible !important; width: auto !important; max-width: 100% !important; gap: 6px !important; -webkit-mask-image: none !important; mask-image: none !important; }
.elementor-57 .elementor-element-609918b span a { margin-right: 0 !important; }
/* Plusieurs cuisines dans un même paragraphe : chaque lien devient un élément de la rangée (même espacement) */
.elementor-57 .elementor-element-609918b .tags-restaurant { display: contents !important; }

/* Tant que l'état ouvert/fermé n'est pas calculé : pas de pastille vide */
.elementor-57 .elementor-element-7d72b64:not(:has(.oumanger-visible)) { background: transparent !important; box-shadow: none !important; padding: 0 !important; }
/* Tags : ne passent pas sous la note */
.elementor-57 .elementor-element-609918b { padding-right: 64px !important; box-sizing: border-box; }

/* Photo : ne dépend plus du fichier CSS du modèle 57 (absent sur certaines pages, ex. accueil) */
.elementor-57 .elementor-element-be560a0 { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; padding: 0 !important; }
.elementor-57 .elementor-element-be560a0 > .e-con-inner { max-width: none !important; width: 100% !important; padding: 0 !important; }
.elementor-57 .elementor-element-1996fca { width: 100% !important; max-width: 100% !important; }
.elementor-57 .elementor-element-1996fca img { display: block; width: 100% !important; max-width: 100% !important; object-fit: cover !important; object-position: center center; }

/* Rangée de boutons : sur une carte étroite (écrans 1280 px, colonnes d'article), « Voir la fiche » passe à la ligne
   au lieu de chevaucher les autres boutons */
.elementor-57 .elementor-element-38f4599 { flex-wrap: wrap !important; gap: 10px 8px !important; }
.elementor-57 .elementor-element-e0b981d { flex: 0 0 auto !important; width: auto !important; max-width: 100%; gap: 6px !important; }
.elementor-57 .elementor-element-6d5d264 { flex: 1 0 auto !important; width: auto !important; justify-content: flex-end !important; }

/* « Site internet » (816f46d) : même style que les boutons Appeler / Livraison (bordure bleue, fond blanc,
   texte bleu, plein au survol) pour se distinguer de « Voir la fiche ».
   Le modèle lui donne width: 60% sur mobile : sa largeur dépendait du nombre d'icônes voisines et le texte,
   sans retour à la ligne, débordait sur les cartes étroites. Largeur au contenu, jamais plus étroit que le texte. */
.elementor-57 .btn-bleu[data-id="816f46d"] {
    width: auto !important; max-width: none !important; min-width: max-content; flex: 0 0 auto;
    padding: 0 18px !important;
    background: var(--om-surface, #fff) !important; color: var(--Bleu, #108A8A) !important;
    border: 1.5px solid var(--Bleu, #108A8A) !important;
}
.elementor-57 .btn-bleu[data-id="816f46d"]:hover,
.elementor-57 .btn-bleu[data-id="816f46d"]:focus-visible {
    background: var(--Bleu, #108A8A) !important; border-color: var(--Bleu, #108A8A) !important; color: #fff !important;
}
/* Mobile : la rangée du haut prend toute la largeur (alignée sur « Voir la fiche » en dessous),
   « Site internet » s'étire et les icônes restent au bord droit, sous le pouce */
@media (max-width: 767px) {
    .elementor-57 .elementor-element-e0b981d { flex: 1 1 100% !important; width: 100% !important; justify-content: flex-end !important; }
    .elementor-57 .btn-bleu[data-id="816f46d"] { flex: 1 1 auto !important; }
}
