.helpdesk__wrap { display:flex; gap:20px; align-items:flex-start; }

/* LEFT */
.helpdesk__sidebar{
  flex:0 0 340px;
  max-width:340px;
  position:sticky;
  height:calc(100vh - 110px);
  overflow:auto;
  border:1px solid #eee;
  border-radius:12px;
  background:#fff;
}
.helpdesk__sidebarHead {
    padding: 14px 14px 8px;
    border-bottom: 1px solid #eee;
    background: #6e3995;
    color: white;
    font-weight: bold;
}
.helpdesk__title{ margin:0; font-size:16px; }

.hd-list{ list-style:none; padding:8px; margin:0; }
.hd-item{ margin:0; }

.hd-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 10px;
    border-radius: 10px;
    text-decoration: none;
    color: #6e3995;
    font-size: 16px;
    font-weight: bold;
}
.hd-item.is-active > .hd-link{ background:#f4f6ff; }

.hd-arrow{ flex:0 0 auto; }
.hd-arrow--triangle{
  width:0; height:0;
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
  border-left:11px solid var(--hd-arrow-color, #e53935);
}
.hd-arrow--chevron::before{
  content:"›";
  font-size:22px;
  line-height:1;
  color: var(--hd-arrow-color, #e53935);
  display:inline-block;
  transform: translateY(-1px);
}
.hd-arrow--none{ display:none; }

/* RIGHT */
.helpdesk__content{
  flex:1;
  min-width:0;
  border:1px solid #eee;
  border-radius:12px;
  background:#fff;
  padding:18px 18px;
}
.hd-contentTitle {
    margin-top: 0;
    font-size: 20px;
    font-weight: bold;
    color: #003bad;
}
.hd-contentBody {
    font-size: 18px;
    text-align: justify;
}
.hd-contentBody img {
    margin: 0 auto;
    display: block;
}
/* Mobile accordion panel */
.hd-panel{ padding:10px 10px 14px; }
.hd-mTitle{ font-weight:700; margin:8px 0 10px; }

/* Footer */
.helpdesk__footer{
  position:fixed;
  left:16px;
  bottom:12px;
  z-index:9999;
  font-size:13px;
  background:rgba(255,255,255,.85);
  border:1px solid #eee;
  padding:4px 10px;
  border-radius:10px;
}
.helpdesk {
    padding: 5px;
}
/* Mobile */
@media (max-width:768px){
  .helpdesk__wrap{ display:block; }
  .helpdesk__sidebar{
    position:static;
    height:auto;
    max-width:none;
    overflow:visible;
  }
  .helpdesk__content{ display:none; }
  .hd-link{ border:1px solid #f0f0f0; }
  .hd-panel{
    border-left:2px solid #f4f6ff;
    margin:6px 0 10px;
    background:#fff;
  }
  .helpdesk__footer{
    left:10px;
    bottom:10px;
    font-size:12px;
  }
  .helpdesk {
    padding: 0px;
}
}