/* =========================================================
   LOGO
   ========================================================= */

/* Logo en haut à gauche */
#AppBar a[href="/"] img[src="/logo.png"] {
  width: 150px !important;
  height: 150px !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  margin-left: 60px !important;
}

/* Le logo est sombre : ajouter un fond clair uniquement
   lorsque le site est affiché en thème sombre */
.v-theme--dark #AppBar a[href="/"] img[src="/logo.png"] {
  background-color: #f7f6f0;
  border-radius: 50%;
  padding: 4px;
  box-sizing: border-box;
}


/* =========================================================
   HEADER / ACCUEIL
   ========================================================= */

/* Masquer l'ancien header SVG intégré */
img[src*="headerimage.svg"] {
  display: none !important;
}

/* Fond de la zone d'accueil adapté automatiquement
   au thème clair ou sombre */
body section:first-of-type {
  background-image: none !important;
  background-color: rgb(var(--v-theme-surface)) !important;
}


/* =========================================================
   COULEURS GÉNÉRALES
   ========================================================= */

/* Titres */
h1 {
  color: rgb(var(--v-theme-primary)) !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px;
}

/* Coins légèrement arrondis */
a,
button,
.btn {
  border-radius: 8px !important;
}

/* Liens : utilisation de la couleur définie dans le thème
   clair ou sombre de Gancio */
a {
  color: rgb(var(--v-theme-primary)) !important;
}

a:hover {
  color: rgb(var(--v-theme-warning)) !important;
}


/* =========================================================
   PAGES PERSONNALISÉES
   ========================================================= */

.v-card-title.text-h4 + .v-card-text {
  font-size: 1.05rem;
  line-height: 1.65;
  padding: 16px 28px 32px !important;
}

/* Supprimer les paragraphes vides générés par l'éditeur */
.v-card-title.text-h4 + .v-card-text p:empty {
  display: none;
}

/* Espacement entre les paragraphes */
.v-card-title.text-h4 + .v-card-text p {
  margin: 0 0 1.15rem !important;
}

/* Intertitres */
.v-card-title.text-h4 + .v-card-text h2 {
  margin-top: 2rem !important;
  margin-bottom: 0.8rem !important;
  color: rgb(var(--v-theme-primary)) !important;
  font-size: 1.55rem;
}

/* Titre de la page */
.v-card-title.text-h4 {
  padding: 24px 28px 8px !important;
  color: rgb(var(--v-theme-primary)) !important;
}


/* =========================================================
   PAGE À PROPOS NATIVE DE GANCIO
   ========================================================= */

body:has(#AppBar a[href="/about"].v-btn--active) main .v-container {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 32px 28px 48px !important;
}

/* Confort de lecture */
body:has(#AppBar a[href="/about"].v-btn--active) main .v-container > span {
  display: block;
  font-size: 1.05rem;
  line-height: 1.65;
}

/* Supprimer les paragraphes vides générés par l'éditeur */
body:has(#AppBar a[href="/about"].v-btn--active) main .v-container > span > p:empty {
  display: none;
}

/* Espacement des paragraphes */
body:has(#AppBar a[href="/about"].v-btn--active) main .v-container > span > p {
  margin: 0 0 1.15rem !important;
}

/* Intertitres */
body:has(#AppBar a[href="/about"].v-btn--active) main .v-container > span > h2 {
  margin: 2rem 0 0.8rem !important;
  color: rgb(var(--v-theme-primary)) !important;
  font-size: 1.55rem;
}
/* =========================================================
   ADAPTATION MOBILE
   ========================================================= */

@media (max-width: 600px) {

  #AppBar a[href="/"] img[src="/logo.png"] {
    width: 60px !important;
    height: 60px !important;
    margin-left: 5px !important;
  }

  #title {
    display: block;
    font-size: clamp(1.15rem, 5.6vw, 1.4rem) !important;
    line-height: 1.2 !important;
    padding-left: 8px;
    padding-right: 8px;
    white-space: nowrap;
  }
}
/* =========================================================
   TITRE DES ÉVÉNEMENTS SUR L'IMAGE
   ========================================================= */

#home .event-card > a {
  position: relative;
  display: block;
}

#home .event-card > a .img.thumb {
  position: relative;
}

#home .event-card > a .event-title {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;

  margin: 0 !important;
  padding: 32px 12px 10px !important;

  color: #fff !important;
  font-weight: 700 !important;
  line-height: 1.2;

  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.82) 0%,
    rgba(0, 0, 0, 0.55) 55%,
    rgba(0, 0, 0, 0) 100%
  );

  z-index: 2;
}
/* =========================================================
   IMAGES TROP PETITES : PAS D'AGRANDISSEMENT
   ========================================================= */

#home .event-card .img.thumb.small-source {
  position: relative;
  overflow: hidden;
  background: #111;
}

/* Fond réalisé avec la même image, volontairement floutée */
#home .event-card .img.thumb.small-source::before {
  content: "";
  position: absolute;
  inset: -25px;
  background-image: var(--small-image-bg);
  background-size: cover;
  background-position: center;
  filter: blur(20px) brightness(.45);
  transform: scale(1.1);
  z-index: 0;
}

/* L'image réelle reste nette et n'est jamais agrandie */
#home .event-card .img.thumb.small-source img {
  position: relative !important;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  object-fit: scale-down !important;
  object-position: center !important;
}
/* =========================================================
   IMAGE SUR LA FICHE D'UN ÉVÉNEMENT
   ========================================================= */

/* Ne pas afficher les images portrait en taille démesurée */
.h-event:not(.event-card) img[itemprop="image"],
.h-event:not(.event-card) img.u-photo {
  display: block !important;

  width: auto !important;
  height: auto !important;

  max-width: 420px !important;
  max-height: 620px !important;

  object-fit: contain !important;

  margin-left: auto !important;
  margin-right: auto !important;
}
/** no custom.css file **/