/*
 * CSF Formation Manager V8.7.4.6.8 — Domain Hub Premium
 * Nouvelle présentation du widget csf_mega_menu_domaines_configurable.
 * La couche reste strictement limitée au hub des domaines et conserve
 * les variables / contrôles Elementor déjà disponibles.
 */
.csf-domain-mega.csf-mega-domaines-configurable{
  --csf-domain-editorial-columns:3;
  --csf-domain-editorial-card-bg:#fff;
  --csf-domain-editorial-border:rgba(20,55,91,.11);
  --csf-domain-editorial-shadow:0 12px 34px rgba(20,55,91,.07);
  --csf-domain-editorial-shadow-hover:0 18px 42px rgba(20,55,91,.12);
}

/* -------------------------------------------------------------------------
 * Éditorial premium — nouveau mode par défaut
 * ---------------------------------------------------------------------- */
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial{
  background:#fff;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__head{
  max-width:920px;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__title{
  letter-spacing:-.035em;
  line-height:1.08;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__subtitle{
  max-width:760px;
  line-height:1.65;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__grid{
  grid-template-columns:repeat(var(--csf-domain-editorial-columns,3),minmax(0,1fr)) !important;
  gap:22px !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__card.csf-card{
  position:relative;
  min-height:258px;
  padding:24px !important;
  gap:18px !important;
  border:1px solid var(--csf-domain-card-border-color,var(--csf-domain-editorial-border)) !important;
  border-radius:20px !important;
  background:var(--csf-domain-card-bg,var(--csf-domain-editorial-card-bg)) !important;
  box-shadow:
    inset 0 4px 0 var(--csf-domain-card-accent,var(--csf-domain-accent,#008491)),
    var(--csf-domain-editorial-shadow) !important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background-color .22s ease;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__card.csf-card:hover,
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__card.csf-card:focus-within{
  transform:translateY(-4px);
  border-color:var(--csf-domain-card-accent,var(--csf-domain-accent,#008491)) !important;
  background:#fff !important;
  box-shadow:
    inset 0 4px 0 var(--csf-domain-card-accent,var(--csf-domain-accent,#008491)),
    var(--csf-domain-editorial-shadow-hover) !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__top{
  min-height:54px;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__icon.csf-icon{
  width:52px;
  height:52px;
  border-radius:15px;
  box-shadow:0 8px 20px rgba(20,55,91,.08);
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__count.csf-badge{
  min-height:30px;
  padding:6px 10px !important;
  border:1px solid var(--csf-domain-badge-border-color,var(--csf-domain-card-accent,#008491)) !important;
  background:#fff !important;
  color:var(--csf-domain-badge-color,var(--csf-domain-card-accent,#008491)) !important;
  box-shadow:none !important;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__body{
  gap:10px !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__name.csf-title{
  max-width:20ch;
  font-size:clamp(19px,1.55vw,24px);
  line-height:1.18;
  letter-spacing:-.02em;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__desc.csf-text{
  max-width:34ch;
  font-size:14px;
  line-height:1.6;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial a.csf-domain-mega__button.csf-button,
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial a.csf-domain-mega__button.csf-button:visited,
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial span.csf-domain-mega__button.csf-button{
  min-height:auto;
  margin-top:auto;
  padding:8px 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--csf-domain-button-color,var(--csf-domain-card-accent,#008491)) !important;
  box-shadow:none !important;
  justify-content:flex-start !important;
  font-size:14px;
  font-weight:700;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial a.csf-domain-mega__button.csf-button:hover,
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial a.csf-domain-mega__button.csf-button:focus{
  background:transparent !important;
  color:var(--csf-domain-button-hover-color,#17375e) !important;
  transform:none !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__button em{
  display:inline-flex;
  transition:transform .18s ease;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__card:hover .csf-domain-mega__button em,
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__card:focus-within .csf-domain-mega__button em{
  transform:translateX(4px);
}

/* Le lien plein cadre reste derrière les contenus interactifs. */
.csf-domain-mega.csf-mega-domaines-configurable .csf-domain-mega__card-link{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
}
.csf-domain-mega.csf-mega-domaines-configurable .csf-domain-mega__top,
.csf-domain-mega.csf-mega-domaines-configurable .csf-domain-mega__body{
  position:relative;
  z-index:2;
  pointer-events:none;
}
.csf-domain-mega.csf-mega-domaines-configurable .csf-domain-mega__button{
  position:relative;
  z-index:3;
  pointer-events:auto;
}

/* -------------------------------------------------------------------------
 * Cartes colorées — rendu historique conservé comme option Elementor
 * ---------------------------------------------------------------------- */
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--color_cards .csf-domain-mega__grid{
  grid-template-columns:repeat(var(--csf-domain-columns,4),minmax(0,1fr)) !important;
}

/* -------------------------------------------------------------------------
 * Liste compacte — autre présentation disponible sans changer de widget
 * ---------------------------------------------------------------------- */
.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__grid{
  grid-template-columns:1fr !important;
  gap:10px !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__card.csf-card{
  min-height:0;
  padding:16px 18px !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 6px 20px rgba(20,55,91,.05) !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__top{
  justify-content:flex-start !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__icon.csf-icon{
  width:42px;
  height:42px;
  border-radius:12px;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__body{
  gap:5px !important;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__name.csf-title{
  font-size:18px;
  line-height:1.25;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__desc.csf-text{
  font-size:13px;
}

.csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--compact .csf-domain-mega__button{
  margin-top:4px;
}

/* -------------------------------------------------------------------------
 * Responsive
 * ---------------------------------------------------------------------- */
@media (max-width:1024px){
  .csf-domain-mega.csf-mega-domaines-configurable{
    --csf-domain-editorial-columns:2;
  }
  .csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__grid{
    gap:18px !important;
  }
}

@media (max-width:767px){
  .csf-domain-mega.csf-mega-domaines-configurable{
    --csf-domain-editorial-columns:1;
  }
  .csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial .csf-domain-mega__card.csf-card{
    min-height:0;
    padding:20px !important;
  }
  .csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial a.csf-domain-mega__button.csf-button,
  .csf-domain-mega.csf-mega-domaines-configurable.csf-domain-mega--editorial span.csf-domain-mega__button.csf-button{
    width:max-content !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .csf-domain-mega.csf-mega-domaines-configurable .csf-domain-mega__card,
  .csf-domain-mega.csf-mega-domaines-configurable .csf-domain-mega__button em{
    transition:none !important;
  }
}
