.branding-livedisplay-container {
  display: flex;
  flex-direction: column;
}
.branding-livedisplay-container .publish-footer {
  height: 60px;
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 12px;
  padding: 16px 12px;
  background-color: #fff;
  border-top: var(--custom-border);
}
.branding-livedisplay-container .setting-content {
  height: calc(100% - 60px);
  overflow: auto;
}
.branding-livedisplay-container .setting-content .custom-iframe-height {
  height: calc(100vh - 60px - 60px - 100px - 70px - 7rem);
  min-height: 500px;
}
.livedisplay-settings-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px;
  border-right: var(--custom-border);
  overflow-y: auto;
}
.livedisplay-settings-container .screen-sortable-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.livedisplay-settings-container .screen-sortable-container .sortable-item {
  align-items: center;
  background-color: #fff;
  margin-right: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.livedisplay-settings-container
  .screen-sortable-container
  .sortable-item
  .drag-icon {
  cursor: move;
}
.livedisplay-settings-container
  .screen-sortable-container
  .sortable-item
  .name {
  color: #18203a;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.livedisplay-settings-container
  .screen-sortable-container
  .sortable-item
  .edit {
  color: #105efb;
  text-align: right;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  cursor: pointer;
}
.livedisplay-settings-container .ticker-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 344px;
}
.livedisplay-settings-container .heading-section,
.livedisplay-settings-container .theme-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.livedisplay-settings-container .theme-section {
  max-width: 312px;
}
.livedisplay-settings-container .theme-section .theme-buttons {
  display: flex;
  width: 100%;
}
.livedisplay-settings-container .theme-section .theme-buttons > button {
  display: flex;
  padding: 10px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex: 1 0 0;
  align-self: stretch;

  border: var(--custom-border);
  background: var(--gray-50, #f9fafb);
}
.livedisplay-settings-container
  .theme-section
  .theme-buttons
  > button.selected {
  background: var(--white, #fff);
}
.livedisplay-settings-container
  .theme-section
  .theme-buttons
  > button:first-child {
  border-radius: 6px 0px 0px 6px;
}
.livedisplay-settings-container
  .theme-section
  .theme-buttons
  > button:last-child {
  border-radius: 0px 6px 6px 0px;
}
.livedisplay-settings-container
  .theme-section
  .theme-buttons
  > button:first-child.selected {
  border-top: var(--custom-border);
  border-bottom: var(--custom-border);
  border-left: var(--custom-border);
  border-right: 0px;
}
.livedisplay-settings-container
  .theme-section
  .theme-buttons
  > button:last-child.selected {
  border-top: var(--custom-border);
  border-bottom: var(--custom-border);
  border-right: var(--custom-border);
}

.form-control-range {
  box-shadow: none;
  font-size: var(--font-size14);
  display: block;
  width: 100%;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
}

/* ---------------------- Settings modal classes starts --------------------- */
.livedisplay-settings-modal-container {
  display: flex !important;
  align-items: center;
  justify-content: center;
  z-index: 1054;
}
.livedisplay-settings-modal-container .modal-body {
  padding: 16px 32px;
}
/* ----------------------- Settings modal classes ends ---------------------- */

/* ------------------ Custom texts for this section starts ------------------ */
.heading-title {
  color: var(--primary-text-color);
  font-family: var(--font-family);
  font-size: var(--font-size16);
  font-style: var(--font-style-normal);
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-16);
}
.heading-subtitle {
  color: var(--secondary-text-color2);
  font-family: var(--font-family);
  font-size: var(--font-size14);
  font-style: var(--font-style-normal);
  font-weight: var(--font-weight-500);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-14);

  align-self: stretch;
}
/* ------------------- Custom texts for this section ends ------------------- */