/* ============================================================================
   Red Rooster — personnalisations (Red Rooster UNIQUEMENT via .resto-redrooster).
   1) FIX CROP des titres (Oi est très large → débordait des panneaux).
   2) GRAFFITIS posés SUR les titres F1/F2 (soulignements brush + accents),
      les 5 éléments, répétition autorisée. Tout en pointer-events:none.
   ============================================================================ */

/* --- 1) FIX CROP : Oi trop large pour les panneaux about/menu → réduire + line-height serré
   pour que "Une passion, le burger" tienne sans être coupé. --- */
.resto-redrooster .pdi-about-text-panel .text-xs[data-config-text$=".title"],
.resto-redrooster .pdi-about-text-panel .text-xs[data-config-text$="secondaryTitle"],
.resto-redrooster .pdi-menu-desktop-title {
  font-size: clamp(26px, 2.3vw, 40px) !important;
  line-height: 1.0 !important;
  overflow-wrap: break-word;
}

/* --- 2) GRAFFITIS SUR LES TITRES F1 : soulignement brush sous chaque titre --- */
.resto-redrooster [data-config-text="sections.about.title"],
.resto-redrooster [data-config-text="sections.about.secondaryTitle"],
.resto-redrooster .pdi-menu-desktop-title,
.resto-redrooster [data-config-text="sections.menuDetails.kicker"],
.resto-redrooster .pdi-reservation-title,
.resto-redrooster .pdi-resa-title,
.resto-redrooster .pdi-order-hero h1 {
  position: relative;
}
.resto-redrooster [data-config-text="sections.about.title"]::after,
.resto-redrooster [data-config-text="sections.about.secondaryTitle"]::after,
.resto-redrooster .pdi-menu-desktop-title::after,
.resto-redrooster .pdi-reservation-title::after,
.resto-redrooster .pdi-resa-title::after,
.resto-redrooster .pdi-order-hero h1::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.24em;
  width: min(100%, 340px);
  height: 0.3em;
  min-height: 12px;
  max-height: 24px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 100% 100%;
  pointer-events: none;
  z-index: 2;
}
/* rouge sous : about.title, menuDetails.title, notreMaison.title */
.resto-redrooster [data-config-text="sections.about.title"]::after,
.resto-redrooster .pdi-menu-desktop-title::after,
.resto-redrooster .pdi-resa-title::after {
  background-image: url('../images/redrooster-brush-red-swoosh.png');
}
/* orange sous : about.secondaryTitle, reservation.title, order h1 */
.resto-redrooster [data-config-text="sections.about.secondaryTitle"]::after,
.resto-redrooster .pdi-reservation-title::after,
.resto-redrooster .pdi-order-hero h1::after {
  background-image: url('../images/redrooster-brush-orange-swoosh.png');
}

/* --- 3) ÉTOILE FILANTE : à droite du kicker "Menu maison" (F1) --- */
.resto-redrooster [data-config-text="sections.menuDetails.kicker"]::before {
  content: "";
  position: absolute;
  right: -130px; top: 50%;
  transform: translateY(-50%) scaleX(-1);
  width: 150px; height: 46px;
  background: url('../images/redrooster-brush-star-trail.png') right center / contain no-repeat;
  pointer-events: none;
}

/* --- 4) COUPS DE PINCEAU : à côté du kicker Réservation (F2) --- */
.resto-redrooster [data-config-text="sections.reservation.kicker"] { position: relative; }
.resto-redrooster [data-config-text="sections.reservation.kicker"]::after {
  content: "";
  position: absolute;
  right: -66px; top: -34px;
  width: 58px; height: 66px;
  background: url('../images/redrooster-brush-accents.png') center / contain no-repeat;
  pointer-events: none;
}

/* --- 5) "!!!" : sur les labels du footer (F2), répété (exemple demandé) --- */
.resto-redrooster .pdi-footer-label { position: relative; }
.resto-redrooster .pdi-footer-label::after {
  content: "";
  position: absolute;
  right: -30px; top: 50%;
  transform: translateY(-55%);
  width: 20px; height: 28px;
  background: url('../images/redrooster-brush-exclaim.png') center / contain no-repeat;
  pointer-events: none;
  opacity: .9;
}
