/* =========================
   HRED PREVIEW THEME (drop-in)
   Works with your current Hyper + Bootstrap markup
   ========================= */

:root{
  --hred-bg: #070A10;
  --hred-text: #E9EEF7;
  --hred-muted: rgba(233,238,247,.68);

  /* Change theme color fast here */
  --hred-accent: #CE2026;     /* rouge HRED */
  --hred-accent2: #A01A1F;

  --hred-panel: rgba(255,255,255,.035);
  --hred-panel2: rgba(255,255,255,.055);
  --hred-border: rgba(255,255,255,.10);

  --hred-radius: 22px;
  --hred-shadow: 0 18px 55px rgba(0,0,0,.55);
}

/* Background + base */
body.theme-glass{
  background:
    radial-gradient(1200px 600px at 15% 10%, color-mix(in srgb, var(--hred-accent) 22%, transparent), transparent 60%),
    radial-gradient(900px 500px at 80% 30%, rgba(30,90,255,.12), transparent 55%),
    var(--hred-bg) !important;
  color: var(--hred-text);
}

body.theme-glass p,
body.theme-glass li,
body.theme-glass .text-muted,
body.theme-glass .form-text{
  color: var(--hred-muted) !important;
}

body.theme-glass a{
  /*color: rgba(255,255,255,.90);*/
  text-decoration-color: rgba(255,255,255,.22);
}
body.theme-glass a:hover{ color:#fff; }

/* =========================
   NAVBAR / TOPBAR (Hyper)
   ========================= */

/* Topbar */
body.theme-glass .navbar-custom{
  background: rgba(10, 14, 22, .72) !important;
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,.10);
}
body.theme-glass .navbar-custom .topbar{
  background: transparent !important;
}
body.theme-glass .navbar-custom .nav-link,
body.theme-glass .navbar-custom .btn{
  color: rgba(255,255,255,.92) !important;
}

/* Horizontal menu */
body.theme-glass .topnav{
  background: rgba(10, 14, 22, .55) !important;
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
body.theme-glass .topnav .navbar{
  background: transparent !important;
}
body.theme-glass .topnav .navbar-nav .nav-link{
  color: rgba(255,255,255,.85) !important;
  font-weight: 600;
}
body.theme-glass .topnav .navbar-nav .nav-link:hover{
  color: #fff !important;
}

/* =========================
   Page container / Title
   ========================= */

body.theme-glass .content-page{
  background: transparent !important;
}

body.theme-glass .container-fluid.px-4{
  max-width: 1400px;
}

/* Your H1 currently has bg-gradient */
body.theme-glass h1.bg-gradient{
  background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02)) !important;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  box-shadow: var(--hred-shadow);
  backdrop-filter: blur(12px);
  padding: 14px 18px !important;
  font-weight: 900;
  letter-spacing: .2px;
}

/* Section titles */
body.theme-glass h2{
  font-weight: 900;
  letter-spacing: .2px;
}
body.theme-glass h2.text-center{
  margin-top: 10px;
}

/* Make “bg-light sections” not white */
body.theme-glass .bg-light{
  background: transparent !important;
}

/* =========================
   “box” panels (your sections use .container.box)
   ========================= */

body.theme-glass .container.box{
  background: linear-gradient(180deg, var(--hred-panel2), var(--hred-panel)) !important;
  border: 1px solid var(--hred-border);
  border-radius: var(--hred-radius);
  box-shadow: var(--hred-shadow);
  backdrop-filter: blur(12px);
  padding: 22px 18px;
}

/* Space between sections a bit nicer */
body.theme-glass section.py-5{
  padding-top: 70px !important;
  padding-bottom: 70px !important;
}

/* =========================
   Buttons / “brand model year engine” tiles
   ========================= */

body.theme-glass .btn{
  border-radius: 999px;
  font-weight: 700;
}

/* default outline tiles (models/years/engines/brands) */
body.theme-glass .btn.btn-outline-secondary.car_logo,
body.theme-glass .btn.btn-outline-secondary{
  /*background: rgba(255,255,255,.035) !important;*/
  border: 1px solid rgba(255,255,255,.14) !important;
  /*color: rgba(255,255,255,.92) !important;*/
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
body.theme-glass .btn.btn-outline-secondary.car_logo:hover,
body.theme-glass .btn.btn-outline-secondary:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.06) !important;
  border-color: color-mix(in srgb, var(--hred-accent) 55%, rgba(255,255,255,.14)) !important;
}

/* selected state (your code uses btn-info) */
body.theme-glass .btn.btn-info{
  background: linear-gradient(135deg, var(--hred-accent), var(--hred-accent2)) !important;
  border: 1px solid rgba(0,0,0,.25) !important;
  color: #fff !important;
  box-shadow: 0 14px 40px rgba(206,32,38,.25);
}
body.theme-glass .btn.btn-info a{ color:#fff !important; }

/* IMPORTANT: you had this issue with links invisible.
   Force text inside those button tiles */
body.theme-glass .car_logo a,
body.theme-glass .btn-outline-secondary a,
body.theme-glass .btn-info a{
  /*color: rgba(255,255,255,.92) !important;*/
  text-decoration: none !important;
  display: block;
}

/* brand logos */
body.theme-glass .car_logo img{
  filter: drop-shadow(0 10px 22px rgba(0,0,0,.45));
}

/* “MARQUES” wrapper */
body.theme-glass #brands{
  margin-top: 18px;
}
body.theme-glass #brands h2{
  margin-top: 26px;
}

/* =========================
   Cards everywhere (Bootstrap card)
   ========================= */

body.theme-glass .card{
  background: linear-gradient(180deg, var(--hred-panel2), var(--hred-panel)) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: var(--hred-radius) !important;
  box-shadow: var(--hred-shadow);
  backdrop-filter: blur(12px);
  color: var(--hred-text);
}

body.theme-glass .card .card-title{
  color: rgba(255,255,255,.95);
  font-weight: 800;
}

/* Card headers (your pricing uses bg-*-lighten + bg-gradient) */
body.theme-glass .card-header{
  background: rgba(255,255,255,.04) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(255,255,255,.95) !important;
  border-top-left-radius: var(--hred-radius) !important;
  border-top-right-radius: var(--hred-radius) !important;
}

/* Pricing “watermark widget-flat” => make it pop like preview */
body.theme-glass .watermark.card.widget-flat{
  position: relative;
  overflow: hidden;
}
body.theme-glass .watermark.card.widget-flat::before{
  content:"";
  position:absolute;
  inset:-120px -120px auto auto;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle at center,
    color-mix(in srgb, var(--hred-accent) 25%, transparent),
    transparent 60%);
  transform: rotate(18deg);
  pointer-events:none;
}
body.theme-glass .watermark.card.widget-flat::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(120deg, rgba(255,255,255,.05), transparent 40%, rgba(255,255,255,.03));
  pointer-events:none;
}

/* Borders color from your existing border-* */
body.theme-glass .border-danger{ border-color: color-mix(in srgb, var(--hred-accent) 70%, rgba(255,255,255,.10)) !important; }
body.theme-glass .border-primary{ border-color: rgba(0, 212, 255, .25) !important; }
body.theme-glass .border-success{ border-color: rgba(40, 167, 69, .28) !important; }

/* Header highlight “bg-danger-lighten bg-success-lighten bg-primary-lighten” -> use our accent */
body.theme-glass .bg-danger-lighten{
  background: color-mix(in srgb, var(--hred-accent) 18%, rgba(255,255,255,.04)) !important;
}
body.theme-glass .bg-success-lighten{
  background: rgba(40,167,69,.10) !important;
}
body.theme-glass .bg-primary-lighten{
  background: rgba(0,212,255,.10) !important;
}

/* =========================
   Price button (.flaming) and booking CTA
   ========================= */

body.theme-glass .btn.btn-primary{
  background: linear-gradient(135deg, var(--hred-accent), var(--hred-accent2)) !important;
  border-color: rgba(0,0,0,.25) !important;
  box-shadow: 0 12px 30px rgba(206,32,38,.25);
}
body.theme-glass .btn.btn-primary:hover{
  filter: brightness(1.06);
  transform: translateY(-1px);
}

/* Price pill button */
body.theme-glass .btn.flaming,
body.theme-glass .btn.rounded-pill.btn-secondary.flaming{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #fff !important;
  position: relative;
  overflow: hidden;
}
body.theme-glass .btn.flaming::before{
  content:"";
  position:absolute; top:0; left:-120%;
  width:120%; height:100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
  animation: hred_shimmer 2.8s infinite;
}
@keyframes hred_shimmer{
  0%{ left:-120%; }
  100%{ left:120%; }
}

/* Alerts */
body.theme-glass .alert{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  /*background: rgba(255,255,255,.04);*/
  /*color: rgba(255,255,255,.92);*/
}

/* Offcanvas (E85 calc) */
body.theme-glass .offcanvas{
  background: rgba(10, 14, 22, .88) !important;
  color: var(--hred-text) !important;
  backdrop-filter: blur(14px);
}
body.theme-glass .offcanvas .form-control{
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;
}
body.theme-glass .offcanvas .btn-outline-secondary{
  background: rgba(255,255,255,.03) !important;
}

/* Reviews carousel container (keeps it clean) */
body.theme-glass #testimonials .container.box{
  padding-bottom: 10px;
}

/* Small responsive tweaks */
@media (max-width: 768px){
  body.theme-glass section.py-5{
    padding-top: 55px !important;
    padding-bottom: 55px !important;
  }
  body.theme-glass h1.bg-gradient{
    padding: 12px 14px !important;
  }
}


/* =========================
   MODAL BOOK — Glass Premium
   ========================= */

/* Backdrop un peu plus sombre */
body.theme-glass .modal-backdrop.show{
  opacity: .75;
}

/* Cadre modal */
body.theme-glass #modalBook .modal-content{
  background: rgba(12,16,24,.72);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 20px;
  box-shadow: 0 30px 80px rgba(0,0,0,.55);
  color: rgba(255,255,255,.92);
}

/* Header */
body.theme-glass #modalBook .modal-header{
  border-bottom: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(135deg, rgba(0,212,255,.18), rgba(255,255,255,.03));
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

body.theme-glass #modalBook .modal-title{
  font-weight: 800;
  letter-spacing: .2px;
  font-size: 1.35rem;
}

/* Bouton close visible sur fond sombre */
body.theme-glass #modalBook .btn-close{
  filter: invert(1);
  opacity: .85;
}
body.theme-glass #modalBook .btn-close:hover{
  opacity: 1;
}

/* Body padding + séparateurs plus doux */
body.theme-glass #modalBook .modal-body{
  padding: 1.25rem 1.25rem 1.4rem;
}
body.theme-glass #modalBook hr{
  border-color: rgba(255,255,255,.12);
  opacity: 1;
}

/* Input groups: look glass */
body.theme-glass #modalBook .input-group-text{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.86);
  border-right: 0;
  border-top-left-radius: 14px;
  border-bottom-left-radius: 14px;
}

body.theme-glass #modalBook .form-control,
body.theme-glass #modalBook .form-select,
body.theme-glass #modalBook textarea{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);
  border-top-right-radius: 14px;
  border-bottom-right-radius: 14px;
}

body.theme-glass #modalBook textarea{
  border-radius: 14px;
}

/* Placeholder lisible */
body.theme-glass #modalBook .form-control::placeholder,
body.theme-glass #modalBook textarea::placeholder{
  color: rgba(255,255,255,.55);
}

/* Focus glow (couleur “accent” style preview) */
body.theme-glass #modalBook .form-control:focus,
body.theme-glass #modalBook .form-select:focus,
body.theme-glass #modalBook textarea:focus{
  border-color: rgba(0,212,255,.55);
  box-shadow: 0 0 0 .22rem rgba(0,212,255,.18);
  background: rgba(255,255,255,.075);
  color: rgba(255,255,255,.95);
}

/* Helpers (text-warning etc) un peu plus soft */
body.theme-glass #modalBook .text-warning{ color: rgba(255, 193, 7, .95) !important; }
body.theme-glass #modalBook .text-success{ color: rgba(40,167,69,.95) !important; }
body.theme-glass #modalBook .text-info{ color: rgba(13,202,240,.95) !important; }
body.theme-glass #modalBook .text-dark{ color: rgba(255,255,255,.82) !important; }

/* Alert “voiture de courtoisie” plus stylée */
body.theme-glass #modalBook .alert{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,212,255,.06);
  color: rgba(255,255,255,.9);
}

/* Bloc interventions: style chips */
body.theme-glass #modalBook #igperf .input-group-text,
body.theme-glass #modalBook #igflex .input-group-text,
body.theme-glass #modalBook #igdsg .input-group-text,
body.theme-glass #modalBook #igadblue .input-group-text,
body.theme-glass #modalBook #igsav .input-group-text{
  width: 100%;
  justify-content: flex-start;
  gap: .6rem;
  padding: .75rem .9rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
}

/* Checkboxes plus clean */
body.theme-glass #modalBook .form-check-input{
  width: 1.15rem;
  height: 1.15rem;
  border: 1px solid rgba(255,255,255,.22);
  background-color: rgba(255,255,255,.08);
}
body.theme-glass #modalBook .form-check-input:checked{
  background-color: rgba(0,212,255,.95);
  border-color: rgba(0,212,255,.95);
}

/* Total prix plus visible */
body.theme-glass #modalBook #bookprice{
  display: inline-block;
  margin-top: .5rem;
  padding: .45rem .75rem;
  border-radius: 999px;
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.9) !important;
}

/* CTA bouton */
body.theme-glass #modalBook button.btn.btn-primary{
  border-radius: 999px;
  padding: .95rem 1.2rem;
  font-weight: 800;
  letter-spacing: .2px;
  background: linear-gradient(135deg, rgba(0,212,255,.95), rgba(0,153,204,.95));
  border: 1px solid rgba(0,212,255,.45);
  box-shadow: 0 14px 35px rgba(0,212,255,.22);
}
body.theme-glass #modalBook button.btn.btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 20px 50px rgba(0,212,255,.28);
}
body.theme-glass #modalBook button.btn.btn-primary:active{
  transform: translateY(0);
}

/* Mobile: modal plus respirante */
@media (max-width: 768px){
  body.theme-glass #modalBook .modal-dialog{
    margin: .75rem;
  }
  body.theme-glass #modalBook .modal-body{
    padding: 1rem;
  }
  body.theme-glass #modalBook .modal-title{
    font-size: 1.1rem;
  }
}

/* Fix select (safe) */
body.theme-glass select.form-select{
  background-color: rgba(10, 14, 22, 0.55) !important;
  color: rgba(255,255,255,.92) !important;
}

/* =========================
   DROPDOWNS (Bootstrap) : fond + hover lisible
   ========================= */

/* Le menu */
body.theme-glass .dropdown-menu{
  background: rgba(18,18,22,.92) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 14px;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  overflow: hidden;
  box-shadow: 0 18px 60px rgba(0,0,0,.45);
}

/* Items (liens) */
body.theme-glass .dropdown-item{
  color: rgba(255,255,255,.88) !important;
  background: transparent !important;
}

/* Hover / focus */
body.theme-glass .dropdown-item:hover,
body.theme-glass .dropdown-item:focus{
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
}

/* Item actif */
body.theme-glass .dropdown-item.active,
body.theme-glass .dropdown-item:active{
  background: rgba(255,255,255,.14) !important;
  color: #fff !important;
}

/* Divider */
body.theme-glass .dropdown-divider{
  border-top-color: rgba(255,255,255,.10);
}


/* =========================
   FAQ page (Glass readability)
   ========================= */

body.theme-glass .moduletable h2{
  font-weight: 800;
  letter-spacing: .2px;
  margin: 0 0 14px;
  color: rgba(255,255,255,.95);
}

body.theme-glass .moduletable{
  color: rgba(255,255,255,.88);
}

/* Colonnes: effet card + respiration */
body.theme-glass .moduletable > .col-md-6{
  padding: 18px !important;
}

body.theme-glass .moduletable > .col-md-6 > h2{
  margin-bottom: 18px;
}

body.theme-glass .moduletable > .col-md-6{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  box-shadow: 0 18px 55px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
}

/* Accordions */
body.theme-glass .accordion{
  --bs-accordion-bg: transparent;
  --bs-accordion-border-color: rgba(255,255,255,.12);
  --bs-accordion-btn-color: rgba(255,255,255,.92);
  --bs-accordion-color: rgba(255,255,255,.86);
}

body.theme-glass .accordion-item{
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 12px;
}

body.theme-glass .accordion-button{
  background: rgba(255,255,255,.06) !important;
  color: rgba(255,255,255,.92) !important;
  font-weight: 700;
  line-height: 1.25;
  padding: 14px 16px;
  box-shadow: none !important;
}

/* IMPORTANT: ton H3 dans le button => on neutralise pour éviter le “gros titre” illisible */
body.theme-glass .accordion-button h3{
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: inherit !important;
}

/* Open state */
body.theme-glass .accordion-button:not(.collapsed){
  background: rgba(0,212,255,.14) !important;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

/* Body */
body.theme-glass .accordion-body{
  background: rgba(0,0,0,.12);
  padding: 14px 16px;
  color: rgba(255,255,255,.86);
}

body.theme-glass .accordion-body p{
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
}

/* Ta classe bg-success-lighten / bg-danger-lighten : on la rend compatible dark */
body.theme-glass .accordion-button.bg-success-lighten,
body.theme-glass .accordion-button.bg-danger-lighten{
  background: rgba(255,255,255,.06) !important;
  color: rgba(255,255,255,.92) !important;
}

/* Petites améliorations UX */
body.theme-glass .accordion-button:focus{
  outline: none;
  box-shadow: 0 0 0 .2rem rgba(0,212,255,.18) !important;
}

body.theme-glass .accordion-button::after{
  filter: invert(1);
  opacity: .9;
}

/* Mobile: une colonne + marges */
@media (max-width: 991px){
  body.theme-glass .moduletable{
    gap: 14px;
  }
  body.theme-glass .moduletable > .col-md-6{
    width: 100%;
    margin-bottom: 14px;
  }
}


/* =========================
   FAQ : accents rouge (perf) / vert (E85)
   ========================= */

/* Colonnes : on colore le header H2 + un liseré vertical */
body.theme-glass #slider-e85{
  --faq-accent: 40, 167, 69;   /* vert */
}
body.theme-glass #slider-perf{
  --faq-accent: 220, 53, 69;   /* rouge */
}

body.theme-glass #slider-e85,
body.theme-glass #slider-perf{
  position: relative;
}

/* On “teinte” le titre de colonne en fonction de l’accordéon présent */
body.theme-glass #slider-e85::before,
body.theme-glass #slider-perf::before{
  content:"";
  position:absolute;
  left:-10px;
  top:0;
  bottom:0;
  width:4px;
  border-radius: 10px;
  background: rgba(var(--faq-accent), .85);
  box-shadow: 0 0 18px rgba(var(--faq-accent), .25);
}

/* Halo léger sur les items */
body.theme-glass #slider-e85 .accordion-item,
body.theme-glass #slider-perf .accordion-item{
  border-color: rgba(var(--faq-accent), .22) !important;
}

/* Bouton fermé : liseré subtil + texte */
body.theme-glass #slider-e85 .accordion-button,
body.theme-glass #slider-perf .accordion-button{
  background: rgba(255,255,255,.05) !important;
  color: rgba(255,255,255,.92) !important;
  border-left: 3px solid rgba(var(--faq-accent), .55);
}

/* Bouton ouvert : vraie “signature” couleur */
body.theme-glass #slider-e85 .accordion-button:not(.collapsed),
body.theme-glass #slider-perf .accordion-button:not(.collapsed){
  background: linear-gradient(
    90deg,
    rgba(var(--faq-accent), .22) 0%,
    rgba(var(--faq-accent), .08) 55%,
    rgba(255,255,255,.04) 100%
  ) !important;
  border-left-color: rgba(var(--faq-accent), .95) !important;
  box-shadow: 0 10px 30px rgba(var(--faq-accent), .12) !important;
}

/* Corps : petit trait coloré à gauche pour rappeler la section */
body.theme-glass #slider-e85 .accordion-body,
body.theme-glass #slider-perf .accordion-body{
  border-left: 3px solid rgba(var(--faq-accent), .25);
}

/* Optionnel : si tu veux garder tes bg-*-lighten visibles mais clean */
body.theme-glass .accordion-button.bg-success-lighten{
  border-left-color: rgba(40,167,69,.95) !important;
}
body.theme-glass .accordion-button.bg-danger-lighten{
  border-left-color: rgba(220,53,69,.95) !important;
}


/* =========================
   ACTUALITÉS : grille propre + images qui ne débordent pas
   ========================= */

body.theme-glass .card.d-block.text-center{
  overflow: hidden;                 /* empêche tout débordement */
  border-radius: 18px;
}

/* Image : cadre fixe + crop propre */
body.theme-glass .card-img-top{
  width: 100%;
  height: 180px;                    /* ajuste: 160/180/220 selon ton goût */
  object-fit: cover;                /* crop propre */
  object-position: center;
  display: block;
}

/* Card body: layout plus stable */
body.theme-glass .card.d-block.text-center .card-body{
  display: flex;
  flex-direction: column;
  gap: .5rem;
  min-height: 260px;                /* uniformise les hauteurs */
}

/* Titre: éviter les énormes h2 */
body.theme-glass .card.d-block.text-center .card-body h2.card-title{
  font-size: 1.05rem;
  line-height: 1.25;
  margin: 0;
}

/* Le lien du titre */
body.theme-glass .card.d-block.text-center .card-body h2.card-title a{
  color: rgba(255,255,255,.92);
  text-decoration: none;
}
body.theme-glass .card.d-block.text-center .card-body h2.card-title a:hover{
  text-decoration: underline;
}

/* Intro: limite à 3 lignes pour que la grille reste propre */
body.theme-glass .card.d-block.text-center .card-body .article-intro,
body.theme-glass .card.d-block.text-center .card-body p + *:not(.btn){
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  opacity: .92;
}

/* Bouton "Lire la suite" toujours en bas */
body.theme-glass .card.d-block.text-center .card-body .btn.btn-primary{
  margin-top: auto;
  border-radius: 999px;
}

/* Boutons admin plus compacts */
body.theme-glass .card.d-block.text-center .btn.btm-sm{
  padding: .25rem .5rem;
  font-size: .85rem;
  border-radius: 999px;
  margin: .15rem .15rem;
}

/* Grille: un peu d’air */
body.theme-glass .container-fluid .row > [class*="col-"]{
  margin-bottom: 1rem;
}



/* === DESKTOP dropdown (sous le champ) === */
body.theme-glass .app-search { position: relative; overflow: visible !important; }
body.theme-glass #search-dropdown.dropdown-menu{
  position: absolute;
  top: calc(100% + 6px);
  left: 0; right: 0;
  z-index: 9999;
  max-height: 60vh;
  /*overflow: auto;*/
  width: fit-content;
  background: rgba(18,18,22,.92);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* item desktop */
body.theme-glass #search-dropdown .dropdown-item{
  color: rgba(255,255,255,.88) !important;
}
body.theme-glass #search-dropdown .dropdown-item:hover{
  background: rgba(255,255,255,.10);
  color: #fff !important;
}

/* === MOBILE results list (dans le dropdown bootstrap existant) === */
body.theme-glass #search-dropdown-sm.list-group{
  max-height: 55vh;
  overflow: auto;
  margin-top: .25rem;
  border-top: 1px solid rgba(255,255,255,.10);
}

/* item mobile */
body.theme-glass #search-dropdown-sm .list-group-item{
  background: transparent;
  color: rgba(255,255,255,.88) !important;
  border: 0;
}
body.theme-glass #search-dropdown-sm .list-group-item:hover{
  background: rgba(255,255,255,.10);
  color: #fff !important;
}



/* =========================
   SweetAlert2 (theme-glass)
   ========================= */
body.theme-glass .swal2-container{
  z-index: 99999; /* au-dessus des modals/bootstrap */
}

body.theme-glass .swal2-popup{
  background: rgba(18,18,22,.92) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.55) !important;
  backdrop-filter: blur(16px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(140%) !important;
  color: rgba(255,255,255,.92) !important;
}

body.theme-glass .swal2-title{
  color: rgba(255,255,255,.95) !important;
}

body.theme-glass .swal2-html-container{
  color: rgba(255,255,255,.82) !important;
}

body.theme-glass .swal2-actions .swal2-confirm{
  background: var(--bs-primary, #3b82f6) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.35) !important;
}

body.theme-glass .swal2-actions .swal2-cancel{
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.9) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}

body.theme-glass .swal2-icon.swal2-success .swal2-success-ring{
  border-color: rgba(34,197,94,.35) !important;
}