.header {
  height: var(--zd_size50) ;
  z-index: 2;
  border-bottom: 1px solid var(--zdt_setupdetail_header_border);
}
.back {
  width: var(--zd_size60) ;
}
.backIcon {
  height: var(--zd_size30) ;
  width: var(--zd_size30) ;
  font-size: var(--zd_font_size12) ;
  display: inline-block;
  color: var(--zdt_setupdetail_backicon);
  margin-inline-start: var(--zd_size19) ;
  line-height: 2.5;
  text-align: center;
  border-radius: 50%;
  cursor: pointer;
}

.backIcon:hover {
  background-color: var(--zdt_setupdetail_hover_backicon_bg);
}
.title {
  font-size: var(--zd_font_size16) ;
  line-height: 1;
  padding-inline-end: var(--zd_size12) ;
  font-weight: var(--zd-fw-semibold);
  color: var(--zdt_setupdetail_backicon);
  composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
}

.rightPanel {
  composes: justifyFend from '~@zohodesk/components/es/common/common.module.css';
}
.helpInfoCont {
  position: absolute;
  z-index: 10;
  padding-block: var(--zd_size12) 0 ;
  padding-inline: 0 var(--zd_size15) ;
}
[dir=ltr] .helpInfoCont {
  right: 0 ;
}
[dir=rtl] .helpInfoCont {
  left: 0 ;
}
.helpInfo {
  line-height: 2.3636;
  height: var(--zd_size28) ;
  width: var(--zd_size28) ;
  color: var(--zdt_setupdetail_helpinfo_text);
  font-size: var(--zd_font_size11) ;
  display: inline-block;
  border: 1px solid var(--zdt_setupdetail_helpinfo);
  border-radius: 2px;
  text-align: center;
  cursor: pointer;
}
.mr15 {
  margin-inline-end: var(--zd_size15) ;
}

.content {
  z-index: 1;
}
.padding {
  padding-block: var(--zd_size10) ;
  padding-inline: var(--zd_size60) var(--zd_size25) ;
}
.popup {
  z-index: 3;
  position: absolute;
  top: 0 ;
  bottom: 0 ;
  width: var(--zd_size330) ;
  transition: transform var(--zd_transition3);
  border: 1px solid var(--zdt_setupdetail_popup_border);
  background-color: var(--zdt_setupdetail_popup_bg);
}
[dir=ltr] .popup {
  right: 0 ;
  transform: translateX(100%);
}
[dir=rtl] .popup {
  left: 0 ;
  transform: translateX(-100%);
}
.popup.open {
  transform: translateX(0);
}
.close {
  composes: disableFocus from '~@zohodesk/components/es/common/common.module.css';
}

.infoHeader {
  padding-block: var(--zd_size10) var(--zd_size11) ;
  padding-inline:var(--zd_size20) ;
  color: var(--zdt_setupdetail_infoheader_text);
  border-bottom: 1px solid var(--zdt_setupdetail_popup_border);
  background-color: var(--zdt_setupdetail_infoheader_bg);
}

.infoIcon {
  height: var(--zd_size26) ;
  width: var(--zd_size26) ;
  font-size: var(--zd_font_size12) ;
  line-height: 2;
  text-align: center;
  border: 1px solid var(--zdt_setupdetail_infoicon_border);
  border-radius: 2px;
}

.infoText {
  margin-inline: var(--zd_size8) ;
  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
  font-size: var(--zd_font_size13) ;
}

.infoClose {
  font-size: var(--zd_font_size28) ;
  color: var(--zdt_setupdetail_infoclose);
  cursor: pointer;
}

.infoFooter {
  padding-block: var(--zd_size10) ;
  padding-inline:var(--zd_size20) ;
}