/* === Styles personnalisés LAVA RUN === */

/* Ajustement des cartes d’articles (images dans les cards de la home/catégories) */
.card-img-top {
  object-fit: cover;
  height: 180px; /* hauteur fixe pour garder une grille harmonieuse */
}

/* Liens du footer */
footer a {
  text-decoration: none;
}

/* Logo dans la navbar — hauteur fixe pour éviter que l'image originale (6119×3366px)
   ne gonfle la navbar via height:auto */
.navbar-brand img {
  height: 36px;
  width: auto;
}

/* === Carrousel PC i3 (et réutilisable ailleurs) === */
/* Hauteur max des images = 240px, ratio respecté */
.carousel-item .lr-fit {
  height: 480;              /* cadre fixe */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;           /* évite les débordements */
}

.carousel-item .lr-fit img {
  max-height: 480;          /* pas plus de 240px de haut */
  width: auto;                /* largeur ajustée au ratio */
  max-width: 100%;            /* ne déborde pas du conteneur */
  object-fit: contain;        /* pas de déformation, toute l’image visible */
  display: block;
}

/* Améliore un peu l’affichage du formulaire */
.modal .form-label { font-weight: 600; }

/* Cartes d’articles (accueil) */
.lr-thumb-240 {
  max-height: 240px;
  width: 100%;
  object-fit: contain;   /* respecte le ratio */
  object-position: center;
  display: block;
}
.lr-card-equal .card {
  height: 100%;
}

/* === Sidebar articles récents (marge droite, hors container) === */

/*
 * La sidebar est rendue EN DEHORS du .container (via {% block sidebar %} dans base.html.twig).
 * Elle se positionne dans la marge droite grâce à position:fixed.
 *
 * Bootstrap xxl container (≥1400px) = 1320px max → bord droit à 50vw + 660px.
 * À 1920px : bord droit container = 960+660 = 1620px → marge droite = 300px → sidebar 260px ✓
 */
.lr-sidebar-outer {
  display: none; /* masquée par défaut (mobile, tablette, petits PC) */
}

@media (min-width: 1620px) {
  .lr-sidebar-outer {
    display: block;
    position: fixed;
    top: 90px;                          /* navbar Flatly logo 36px + padding 2×1rem = ~78px + écart */
    left: calc(50% + 660px + 1rem);     /* bord droit du container xxl + écart */
    width: calc(50vw - 660px - 2rem);   /* marge restante moins l'écart */
    max-width: 280px;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
    z-index: 90;
    scrollbar-width: thin;
    scrollbar-color: #dee2e6 transparent;
  }
}

.lr-sidebar-thumb {
  width: 100%;
  height: 100px;
  object-fit: cover;
  border-radius: 4px 4px 0 0;
}

.lr-sidebar .card {
  transition: box-shadow .15s ease;
}

.lr-sidebar .card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,.12) !important;
}

/* === Rendu Markdown (changelog) === */
.lr-markdown h1, .lr-markdown h2, .lr-markdown h3,
.lr-markdown h4, .lr-markdown h5, .lr-markdown h6 {
  margin-top: 1rem;
  margin-bottom: 0.4rem;
  font-weight: 600;
}
.lr-markdown h1 { font-size: 1.4rem; }
.lr-markdown h2 { font-size: 1.2rem; }
.lr-markdown h3 { font-size: 1rem; }
.lr-markdown ul, .lr-markdown ol { padding-left: 1.4rem; margin-bottom: 0.75rem; }
.lr-markdown li { margin-bottom: 0.2rem; }
.lr-markdown code {
  background: #e8e8e8;
  padding: 0.1em 0.35em;
  border-radius: 3px;
  font-size: 0.875em;
}
.lr-markdown pre {
  background: #2c3e50;
  color: #ecf0f1;
  padding: 0.75rem 1rem;
  border-radius: 4px;
  overflow-x: auto;
}
.lr-markdown pre code { background: none; color: inherit; padding: 0; }
.lr-markdown hr { border-color: #dee2e6; margin: 1rem 0; }
.lr-markdown blockquote {
  border-left: 3px solid #18bc9c;
  padding-left: 0.75rem;
  color: #6c757d;
  margin: 0.5rem 0;
}

/* === Menu multi-niveaux (dropdown-submenu Bootstrap 5) === */
.dropdown-submenu {
  position: relative;
}

.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -0.25rem;
  margin-left: 0.125rem;
  border-radius: 0.375rem;
  display: none;
}

.dropdown-submenu:hover > .dropdown-menu {
  display: block;
}

/* Flèche vers la droite sur les items avec sous-menu */
.dropdown-submenu > .dropdown-toggle::after {
  display: inline-block;
  margin-left: auto;
  float: right;
  margin-top: 0.4em;
  border-top: 0.3em solid transparent;
  border-right: 0;
  border-bottom: 0.3em solid transparent;
  border-left: 0.3em solid;
}

/* Mobile : sous-menu sous l'item parent plutôt qu'à droite */
@media (max-width: 991.98px) {
  .dropdown-submenu > .dropdown-menu {
    position: static;
    left: auto;
    top: auto;
    margin-left: 1rem;
    margin-top: 0;
    box-shadow: none;
    border-left: 2px solid #dee2e6;
    border-radius: 0;
  }

  .dropdown-submenu:hover > .dropdown-menu {
    display: block;
  }

  .dropdown-submenu > .dropdown-toggle::after {
    float: none;
    margin-left: 0.5em;
  }
}