/* ETHNOS R605 — Événements : géométrie sobre + fond communautaire continu.
   Périmètre : Events + continuité de fond Culture/Solidarité/Entraide + section événements fiche membre. */

:root{--r605-community-slate:#0a202b;--r605-community-line:rgba(101,191,202,.16)}

/* -------------------------------------------------------------------------- */
/* 1. Fond bleu ardoise réellement continu dans le conteneur scrollable.      */
/* Le bandeau supérieur conserve sa nuance spécifique existante.              */
/* -------------------------------------------------------------------------- */
html.ethnosConnectedUnified body .memberWorkspace.hasBodyView[data-body-view="events"],
html.ethnosConnectedUnified body .memberWorkspace.hasBodyView[data-body-view="culture"],
html.ethnosConnectedUnified body .memberWorkspace.hasBodyView[data-body-view="solidarity"],
html.ethnosConnectedUnified body .memberWorkspace.hasBodyView[data-body-view="help"]{
  background:var(--r605-community-slate) !important;
  background-image:none !important;
}
html body .bodyView-events.r561EventsHub,
html body .bodyView-familyDiscovery--culture.r556FamilyHub,
html body .bodyView-familyDiscovery--solidarity.r556FamilyHub,
html body .bodyView-help.r562HelpHub{
  min-height:100% !important;
  background:var(--r605-community-slate) !important;
  background-image:none !important;
}
html body .bodyView-events.r561EventsHub > .bodyViewContent.r561EventsContent,
html body .bodyView-familyDiscovery--culture.r556FamilyHub > .bodyViewContent,
html body .bodyView-familyDiscovery--solidarity.r556FamilyHub > .bodyViewContent,
html body .bodyView-help.r562HelpHub > .bodyViewContent.r562HelpContent{
  background:var(--r605-community-slate) !important;
  background-image:none !important;
}

/* -------------------------------------------------------------------------- */
/* 2. Zone de contrôle Événements : pas de « carré dans carré ».              */
/* -------------------------------------------------------------------------- */
html body .bodyView-events.r561EventsHub > .bodyViewContent.r561EventsContent{
  gap:clamp(16px,1.4vw,24px) !important;
}
html body .bodyView-events.r561EventsHub .r605EventsControls{
  display:grid !important;
  grid-template-columns:minmax(360px,.9fr) minmax(520px,1.1fr) !important;
  align-items:end !important;
  gap:clamp(24px,3vw,64px) !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body .bodyView-events.r561EventsHub .r605EventsDiscovery{
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}
html body .bodyView-events.r561EventsHub .r605EventsTitleLine{
  display:flex !important;
  align-items:center !important;
  gap:clamp(14px,1.3vw,24px) !important;
  min-width:0 !important;
}
html body .bodyView-events.r561EventsHub .r605EventsTitleLine > strong{
  flex:0 1 auto !important;
  min-width:0 !important;
  color:#f4eee4 !important;
  font-family:var(--font-title,"Fraunces",Georgia,serif) !important;
  font-size:clamp(24px,1.75vw,34px) !important;
  font-weight:400 !important;
  line-height:1.05 !important;
  white-space:nowrap !important;
}
html body .bodyView-events.r561EventsHub .r605EventsTitleLine > button{
  flex:0 0 auto !important;
  min-height:38px !important;
  padding:0 15px !important;
  white-space:nowrap !important;
}
html body .bodyView-events.r561EventsHub .r605EventsDiscovery > p{
  max-width:610px !important;
  margin:7px 0 0 !important;
  color:#849ba3 !important;
  font-size:clamp(10px,.72vw,13px) !important;
  line-height:1.45 !important;
}
html body .bodyView-events.r561EventsHub .r605EventsDiscovery .r561EventsCount{
  margin-top:6px !important;
}

/* Les champs gardent leur composant interne, mais le grand panneau de filtres disparaît. */
html body .bodyView-events.r561EventsHub .r605EventsFilters{
  justify-self:end !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(190px,260px)) !important;
  gap:10px 12px !important;
  width:auto !important;
  max-width:540px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body .bodyView-events.r561EventsHub .r605EventsFilters label{
  min-width:0 !important;
}
html body .bodyView-events.r561EventsHub .r605EventsFilters label > span{
  font-size:7px !important;
}
html body .bodyView-events.r561EventsHub .r605EventsFilters input,
html body .bodyView-events.r561EventsHub .r605EventsFilters select{
  min-height:38px !important;
  font-size:9px !important;
}
html body .bodyView-events.r561EventsHub .r605EventsFilters .isSearch{
  grid-column:auto !important;
}

/* -------------------------------------------------------------------------- */
/* 3. Cartes Événements plus courtes, répétables et communautaires.           */
/* -------------------------------------------------------------------------- */
html body .bodyView-events.r561EventsHub .r605EventTimeline{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),520px)) !important;
  justify-content:start !important;
  align-items:stretch !important;
  gap:12px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 0 18px !important;
}
html body .bodyView-events.r561EventsHub .r605EventTimeline .bodyEventRow{
  width:100% !important;
  max-width:520px !important;
  min-width:0 !important;
  grid-template-columns:58px 30px minmax(0,1fr) 94px !important;
  gap:10px !important;
  padding:12px !important;
}
html body .bodyView-events.r561EventsHub .r605EventTimeline .bodyEventCopy > span{
  font-size:7.5px !important;
  line-height:1.15 !important;
}
html body .bodyView-events.r561EventsHub .r605EventTimeline .bodyEventCopy h3{
  margin:3px 0 5px !important;
  font-size:16px !important;
  line-height:1.08 !important;
}
html body .bodyView-events.r561EventsHub .r605EventCreatorLine{
  display:flex !important;
  align-items:center !important;
  min-width:0 !important;
  margin:0 0 2px !important;
}
html body .bodyView-events.r561EventsHub .r605EventCreator{
  display:inline-flex !important;
  align-items:center !important;
  max-width:100% !important;
  color:#dce8e8 !important;
  font:800 11.5px/1.2 Inter,"Segoe UI",Arial,sans-serif !important;
  text-decoration:none !important;
}
html body .bodyView-events.r561EventsHub .r605EventCreator:hover,
html body .bodyView-events.r561EventsHub .r605EventCreator:focus-visible{
  color:#53d7d4 !important;
  text-decoration:underline !important;
}
html body .bodyView-events.r561EventsHub .r605EventCreator .ethnosMemberIdentityR594{
  gap:5px !important;
  max-width:100% !important;
}
html body .bodyView-events.r561EventsHub .r605EventCreator .ethnosMemberShieldR594{
  width:19px !important;
  height:19px !important;
}
html body .bodyView-events.r561EventsHub .r605EventCreator .ethnosMemberOfficialR594{
  width:17px !important;
  height:17px !important;
}
html body .bodyView-events.r561EventsHub .r605EventLocation{
  margin:0 !important;
  color:#78939d !important;
  font-size:8.5px !important;
  line-height:1.25 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
html body .bodyView-events.r561EventsHub .r605EventTimeline .bodyEventCopy small{
  display:block !important;
  margin-top:3px !important;
  font-size:8px !important;
}

/* -------------------------------------------------------------------------- */
/* 4. Fiche membre : événements publics à venir.                              */
/* -------------------------------------------------------------------------- */
html body .memberDirectoryIdentityEventsSection{
  text-align:center !important;
}
html body .memberDirectoryIdentityEvents{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  max-width:860px !important;
  margin:0 auto !important;
  text-align:left !important;
}
html body .memberDirectoryIdentityEventsGroup{
  display:grid !important;
  align-content:start !important;
  gap:7px !important;
  min-width:0 !important;
}
html body .memberDirectoryIdentityEventsGroup > strong{
  color:#718794 !important;
  font:800 10px/1.25 Inter,"Segoe UI",Arial,sans-serif !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
}
html body .memberDirectoryIdentityEventCard{
  display:grid !important;
  grid-template-columns:46px minmax(0,1fr) !important;
  gap:10px !important;
  min-width:0 !important;
  padding:10px 11px !important;
  border:1px solid rgba(7,26,57,.13) !important;
  border-radius:12px !important;
  background:#fffdf9 !important;
}
html body .memberDirectoryIdentityEventDate{
  display:grid !important;
  place-content:center !important;
  min-height:46px !important;
  padding-right:9px !important;
  border-right:1px solid rgba(7,26,57,.12) !important;
  text-align:center !important;
}
html body .memberDirectoryIdentityEventDate b{
  color:#f26b2b !important;
  font:900 8px/1.15 Inter,"Segoe UI",Arial,sans-serif !important;
  text-transform:uppercase !important;
}
html body .memberDirectoryIdentityEventDate span{
  margin-top:2px !important;
  color:#071a39 !important;
  font:900 15px/1 Inter,"Segoe UI",Arial,sans-serif !important;
}
html body .memberDirectoryIdentityEventCopy{
  min-width:0 !important;
}
html body .memberDirectoryIdentityEventCopy strong{
  display:block !important;
  color:#071a39 !important;
  font:850 12px/1.2 Inter,"Segoe UI",Arial,sans-serif !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
html body .memberDirectoryIdentityEventCopy span{
  display:block !important;
  margin-top:4px !important;
  color:#718794 !important;
  font:650 9px/1.3 Inter,"Segoe UI",Arial,sans-serif !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
html body .memberDirectoryIdentityEventsEmpty{
  grid-column:1/-1 !important;
  margin:0 !important;
  padding:12px !important;
  border:1px dashed rgba(7,26,57,.14) !important;
  border-radius:11px !important;
  color:#7a8f9b !important;
  font:650 10px/1.4 Inter,"Segoe UI",Arial,sans-serif !important;
  text-align:center !important;
}

@media (max-width:1707px){
  html body .bodyView-events.r561EventsHub .r605EventsControls{
    grid-template-columns:minmax(320px,.9fr) minmax(460px,1.1fr) !important;
    gap:24px !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventsFilters{
    grid-template-columns:repeat(2,minmax(175px,230px)) !important;
    max-width:472px !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventTimeline{
    grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),500px)) !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventTimeline .bodyEventRow{max-width:500px !important}
}
@media (max-width:1180px){
  html body .bodyView-events.r561EventsHub .r605EventsControls{
    grid-template-columns:1fr !important;
    align-items:start !important;
    gap:14px !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventsFilters{
    justify-self:start !important;
  }
}
@media (max-width:760px){
  html body .bodyView-events.r561EventsHub .r605EventsTitleLine{
    align-items:flex-start !important;
    flex-direction:column !important;
    gap:10px !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventsTitleLine > strong{white-space:normal !important}
  html body .bodyView-events.r561EventsHub .r605EventsFilters{
    grid-template-columns:1fr !important;
    width:100% !important;
    max-width:none !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventTimeline{
    grid-template-columns:1fr !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventTimeline .bodyEventRow{
    max-width:none !important;
    grid-template-columns:52px 28px minmax(0,1fr) !important;
  }
  html body .bodyView-events.r561EventsHub .r605EventTimeline .bodyEventRow > button{
    grid-column:1/-1 !important;
  }
  html body .memberDirectoryIdentityEvents{grid-template-columns:1fr !important}
}
