/* =========================================================================
   Habillage MercatoLive — comparatif Brand Management (variante « campaign »).
   SUPPLÉMENTAIRE : injecté en pied de page APRÈS la CSS native de BM. Ne touche
   QUE couleurs / typographie / bouton d'action, jamais la mise en page (grille,
   flex, largeurs) → le responsive natif de BM est préservé.

   ⚠️ BM fait du GEO-CLOAKING (.campaign_with_geo_filters) : selon le pays du
   visiteur, il rend l'une OU l'autre variante de table, avec des classes
   différentes — simple underscore « _ » (variante A) OU double underscore « __ »
   (variante B), plus table compacte / pleine largeur. On habille TOUTES.
   ======================================================================== */

/* ---- Typographie générale (toutes variantes) ---- */
.campaign-shortcode-table,
.campaign-list-item,
.campaign-fullwidth-shortcode_item,
.betoffers-box-three{ font-family:'Libre Franklin',system-ui,-apple-system,sans-serif !important; }

/* ---- BOUTONS D'ACTION → ROUGE MercatoLive, IDENTIQUES partout ----
   BM rend le CTA tantôt en <a href="/visit/ID"> (offre avec lien), tantôt en
   <div data-url=""> (offre sans lien) : la CSS native de BM ne stylise que la
   forme <a>, d'où des « boutons fantômes ». On force TOUTES les formes (a ET div)
   à s'afficher comme un vrai bouton rouge, pour un design 100% homogène. */
.campaign-list-item_cta-btn,
.campaign-list-item__cta_button,
.campaign-compact-table__offer-cta-button,
.bm-cmprs-tbl_cta-btn,
.popup-offers-widget__cta-btn{
  display:block !important;
  background:#E4002B !important; color:#fff !important;
  font-family:'Archivo',sans-serif !important; font-weight:700 !important; font-size:15px !important;
  text-align:center !important; text-decoration:none !important;
  padding:12px 20px !important; border:none !important; border-radius:4px !important;
  letter-spacing:0 !important; cursor:pointer !important; line-height:1.2 !important;
  visibility:visible !important; opacity:1 !important;
  transition:filter .16s ease !important;
}
.campaign-list-item_cta-btn:hover,
.campaign-list-item__cta_button:hover,
.campaign-compact-table__offer-cta-button:hover,
.bm-cmprs-tbl_cta-btn:hover{ filter:brightness(1.08); color:#fff !important; }

/* ---- CARTES : retire le liseré OR (#ffcb3f, 4px), liseré discret uniforme ---- */
.campaign-list-item,
.campaign-list-item.brand_table_custom_cl,
.campaign-fullwidth-shortcode_item,
.betoffers-box-three{ border:1px solid rgba(11,16,32,.12) !important; border-radius:6px !important; }

/* ---- Note / score → vert MercatoLive ---- */
.campaign_list_item__score_text,
.campaign-list-item__score,
[class*="score_text"]{ color:#157F3B !important; font-family:'Archivo',sans-serif !important; font-weight:900 !important; }

/* ---- Bonus / intitulés → Archivo encre ---- */
.campaign-list-item_key-features > p,
.campaign-list-item__offer,
.campaign-list-item__deposit-section{ font-family:'Archivo',sans-serif !important; font-weight:800 !important; color:#0B1020 !important; }
.campaign-list-item__brand-name{ font-family:'Archivo',sans-serif !important; font-weight:800 !important; color:#0B1020 !important; }

/* ---- Pastilles / avantages → bleu MercatoLive ---- */
.campaign-list-item__features-list li,
.campaign-list-item__features-flex-list li{ color:#16309C !important; }
.campaign-list-item_key-features li::marker,
.campaign-list-item__features-list li::marker{ color:#16309C !important; }

/* ---- Label « à la une » / exclusif → bleu MercatoLive ---- */
.campaign-list-item__highlighted-label,
.campaign-list-item__exclusive_label{ background:#16309C !important; color:#fff !important; }

/* ---- « Voir plus » / liens secondaires → bleu ---- */
.campaign-list-item_open-more-btn,
.campaign-list-item_close-more-btn,
.campaign-list-item__show-more-btn,
.campaign-shortcode-table_filter-more-btn,
.campaign-list-item_more-btns a,
.campaign-list-item_more-btns button{ color:#16309C !important; }

/* ---- Code promo → mono discret ---- */
.campaign-list-item_coupon,
.campaign-list-item__coupon,
.campaign-list-item__coupon-cta-text{ font-family:'Space Mono',monospace !important; color:#8A90A2 !important; }

/* ---- Masque UNIQUEMENT les pouces de vote (jamais un conteneur de liste :
   la liste d'offres porte aussi .campaign__voting_list — NE PAS la cacher) ---- */
.campaign-list-item .like-action,
.campaign-list-item .dislike-action,
.campaign-list-item .campaign__voting_section__btn{ display:none !important; }

/* ---- Liens de la toplist : couleur cohérente ---- */
.campaign-list-item a:not([class*="cta"]){ color:#16309C !important; }

/* =========================================================================
   Disposition verticale de la fiche (demande MercatoLive) :
   logo grand & centré → étoiles/note → avantages (pros) → bouton.
   On réordonne les enfants via flexbox + order (aucune donnée touchée).
   ======================================================================== */
/* ⚠️ BM force `.bm-tiny .campaign-list-item{display:grid!important}` (spécificité
   0,2,0). On passe donc par `.ml-commercial-toplist .bm-tiny` (0,3,0) pour gagner. */
.ml-commercial-toplist .bm-tiny .campaign-list-item,
.ml-commercial-toplist .campaign-list-item{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  text-align:center !important;
  gap:12px !important;
  padding:24px 20px !important;
  grid-template-columns:none !important;
  grid-template-areas:none !important;
}
/* Neutralise tout positionnement absolu des enfants : les offres « top pick »
   (5 premières) ont un CTA/ruban en position:absolute qui chevauche le logo une
   fois la fiche passée en flex. On les remet dans le flux normal. */
.ml-commercial-toplist .campaign-list-item > *{ position:static !important; float:none !important; }
.ml-commercial-toplist .toppike-out,
.ml-commercial-toplist .top-pick,
.ml-commercial-toplist .cell_bottom{ order:6 !important; width:100% !important; }
/* 1) logo GRAND et centré (width explicite : max-width n'agrandit pas un logo de 130px) */
.ml-commercial-toplist .campaign-list-item_logo{ order:1 !important; display:flex !important; justify-content:center !important; width:100% !important; }
.ml-commercial-toplist .campaign-list-item_logo img{ width:210px !important; max-width:80% !important; height:auto !important; }
/* 2) étoiles + note sous le logo */
.ml-commercial-toplist .campaign-list-item_scores{ order:2 !important; display:flex !important; flex-direction:column !important; align-items:center !important; gap:4px !important; }
/* 3) avantages (pros/cons) au-dessus du bouton */
.ml-commercial-toplist .campaign-list-item_key-features:not(.mobile){ order:3 !important; width:100% !important; max-width:560px !important; text-align:left !important; }
.ml-commercial-toplist .campaign-list-item_key-features:not(.mobile) > p{ text-align:center !important; }
/* 4) bouton d'action */
.ml-commercial-toplist .campaign-list-item_cta-btn{ order:4 !important; width:100% !important; max-width:300px !important; }
.ml-commercial-toplist .campaign-list-item_more-btns{ order:5 !important; }
/* Retirés : code bonus, date, doublon mobile du bonus, votes */
.ml-commercial-toplist .campaign-list-item .country_code_left,
.ml-commercial-toplist .campaign-list-item .empty-coupon-code,
.ml-commercial-toplist .campaign-list-item_coupon,
.ml-commercial-toplist .campaign-list-item_key-features.mobile,
.ml-commercial-toplist .campaign__voting_section,
.ml-commercial-toplist .campaign__updated_date_wrapper{ display:none !important; }