#div_aide_lateral{
    position:fixed;
    display:none;
    top:0;
    right:0;
    z-index:1049;
    height:100%;
    width: min(480px, 95vw);
    background: var(--bkg-color, #fff);
    overflow: hidden;
    transition: transform 0.3s ease-in-out;
}
/* État initial / fermeture — slide hors écran à droite (collapse, pas fade) */
#div_aide_lateral.aide-offscreen,
.eb-dashboard-v2 #div_aide_lateral.aide-offscreen,
body.eb-has-topbar-v2 #div_aide_lateral.aide-offscreen{
    transform: translateX(100%) !important;
}
/* Prévenir le débordement du contenu (#9781 — sidebar croppée) */
#div_aide_lateral *,
#div_aide_lateral img,
#div_aide_lateral table {
    max-width: 100%;
    box-sizing: border-box;
}
#div_aide_lateral .div-scroll {
    word-wrap: break-word;
    overflow-wrap: break-word;
}
/* V2 topbar: start below the topbar */
body.eb-has-topbar-v2 #div_aide_lateral {
    top: 56px;
    height: calc(100% - 56px);
}

#div_aide_lateral .collapse-menu2 {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--bkg-color1);
    height: 44px;
    line-height: 44px;
    text-align: center;
    color: var(--txt-color10);
    cursor: pointer;
    border-top: 1px solid var(--bor-color17, #E2E8F0);
}

#div_aide_lateral nav, #div_aide_lateral .collapse-menu2{
    width: 100%;
}
#div_aide_lateral .collapse-menu2 a{
    color:black;
    font-weight: 600;
    font-size: small;
}
#div_aide_lateral .collapse-menu2 a:hover{
    text-decoration: unset;
    color: var(--txt-color11);
}
#div_aide_lateral h6:first-child{
    text-align: left;
    margin-left:3%;
}

#div_aide_lateral nav .div-scroll{
    padding-top: 12px;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    max-height: calc(100% - 44px) !important;
    height: auto !important;
}

/* Tabs full width, no gaps */
#div_aide_lateral .table-responsive.table-nav {
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 1px solid var(--bor-color17, #E2E8F0) !important;
}
#div_aide_lateral .nav-tabs.sub-tabs {
    margin: 0;
    padding: 0;
    border: none;
}
#div_aide_lateral .nav-tabs .nav-item {
    flex: 1;
    text-align: center;
}
#div_aide_lateral .nav-tabs .nav-link {
    border: none;
    border-radius: 0;
    padding: 12px 8px;
    width: 100%;
}
#div_aide_lateral nav.navbar-lateral {
    padding: 0;
    margin: 0;
    width: 100%;
}

.navtop-hover-keep {
    border-radius: 5px;
    text-decoration: none;
    color: var(--txt-color11);
    font-size: 15px;
}

#div_aide_lateral img, #div_aide_lateral iframe{
    max-width: 100%;
    height:auto;
}

/* bouton aide */
#a_get_aide.size_animation:not(.navtop-hover-keep) {
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;

  -moz-animation: shakeme 3s infinite;
  -o-animation: shakeme 3s infinite;
  -webkit-animation: shakeme 3s infinite;
  animation: shakeme 3s infinite;
}
#a_get_aide.size_animation:hover {
  text-decoration: none;
}
@keyframes shakeme {
  0% {
    -webkit-transform: scale(1);
  }
  10% {
    -webkit-transform: scale(0.6);
  }
  20% {
    -webkit-transform: scale(0.7);
    color: var(--txt-color11);
  }
  30% {
    -webkit-transform: scale(0.4);
  }
  40% {
    -webkit-transform: scale(1);
    color: var(--txt-color11);
  }
}


/* Les styles du didacticiel (.tuto_*, #steps, @keyframes clickhere) ont été
   retirés — le didacticiel sort du module aide et sera recréé dans le produit
   de base (cf. upgrade v7.1). Ci-dessous, seuls restent les styles utilisés
   par le panneau latéral d'aide et les stats qui ne sont pas liés au tuto. */

/* Scroll du panneau latéral d'aide — conservé (utilisé par getAide()). */
#div_aide_lateral .div-scroll {
  overflow-y: auto !important;
  max-height: calc(100% - 44px) !important;
}
#div_aide_lateral nav.navbar-lateral:has(> .div-scroll) {
  overflow: visible !important;
}

/* ── Expert produit promotion (Assistance tab) #9781 ── */
.eb-expert-promo {
  text-align: left;
}
.eb-expert-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(59,130,246,0.1);
  color: #3B82F6;
  font-size: 22px;
}
/* Hero avec avatar gradient */
.eb-expert-hero {
  padding: 18px 12px 12px;
  background: linear-gradient(135deg, rgba(59,130,246,0.08) 0%, rgba(99,102,241,0.05) 100%);
  border-radius: 12px;
  margin-bottom: 16px;
}
.eb-expert-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, #3B82F6 0%, #6366F1 100%);
  color: #fff;
  font-size: 36px;
  box-shadow: 0 6px 20px rgba(59,130,246,0.3);
}
.eb-expert-tagline {
  color: #64748B;
  font-size: 13px;
  line-height: 1.4;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}
/* Liste de features avec icônes colorées */
.eb-expert-features {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.eb-expert-feature {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: #fff;
  border: 1px solid var(--bor-color17, #E2E8F0);
  border-radius: 10px;
  padding: 12px 14px;
  transition: all 0.2s ease;
}
.eb-expert-feature:hover {
  border-color: #3B82F6;
  box-shadow: 0 2px 8px rgba(59,130,246,0.1);
  transform: translateY(-1px);
}
.eb-expert-feature-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: rgba(59,130,246,0.1);
  color: #3B82F6;
  font-size: 16px;
  flex-shrink: 0;
}
.eb-expert-feature-title {
  font-weight: 600;
  font-size: 13px;
  color: #1E293B;
  margin-bottom: 2px;
}
.eb-expert-feature-desc {
  font-size: 12px;
  color: #64748B;
  line-height: 1.3;
}
/* ── Chatbot aide : chips de questions suggérées (#9750 bis) ── */
.eb-aide-chat-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.eb-aide-chat-suggestions .small {
  width: 100%;
}
.eb-aide-chip {
  border: 1px solid var(--bor-color17, #E2E8F0);
  background: #fff;
  color: #334155;
  border-radius: 14px;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.eb-aide-chip:hover {
  border-color: #3B82F6;
  background: rgba(59,130,246,0.06);
  color: #3B82F6;
}
.eb-aide-chat-suggestions.d-none { display: none !important; }

/* ── Mobile (<768px) : largeur plein écran, padding compact ── */
@media (max-width: 767px) {
  #div_aide_lateral {
    width: 100vw !important;
    max-width: 100vw !important;
  }
  #div_aide_lateral nav, #div_aide_lateral .collapse-menu2 {
    width: 100% !important;
  }
  #div_aide_lateral .div-scroll {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  #div_aide_lateral .eb-aide-chat-form input {
    font-size: 16px; /* évite le zoom iOS au focus */
  }
}

#content_assistance .btn_rdv {
  border-radius: 8px;
  padding: 10px 24px;
  font-weight: 600;
  background: linear-gradient(135deg, #3B82F6 0%, #6366F1 100%);
  border: none;
  box-shadow: 0 4px 12px rgba(59,130,246,0.25);
  transition: all 0.2s ease;
}
#content_assistance .btn_rdv:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(59,130,246,0.35);
}
#assistance_rdv {
  background: var(--bkg-color1, #f8fafc);
  border-radius: 10px;
  border: 1px dashed var(--bor-color17, #E2E8F0);
}

/* Card "Rendez-vous en visio" (paramétrage module aide) :
   - hauteur naturelle (pas de stretch avec d'éventuelles cards voisines)
   - dropdown selectpicker plus large pour ne pas tronquer "Responsable (Prénom Nom)" */
.aide-module-wrapper .row { align-items: flex-start; }
.aide-module-wrapper .card-body { padding-bottom: 16px; }
.aide-module-wrapper .bootstrap-select { min-width: 280px; }
.aide-module-wrapper .bootstrap-select > .dropdown-toggle { width: 100%; }